* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --primary:#1a5fa8; --primary-dark:#0d3f72;
  --accent:#e8a020; --accent-light:#fff3d6;
  --bg:#f4f7fb; --white:#fff; --dark:#1a2332;
  --gray:#6b7a90; --light:#dce6f4; --border:#e0e8f5;
  --radius:10px; --shadow:0 4px 20px rgba(26,95,168,.1);
  --font:"PingFang SC","Microsoft YaHei",sans-serif;
}
body { font-family:var(--font); color:var(--dark); background:var(--white); line-height:1.6; }
a { text-decoration:none; color:inherit; }
.container { max-width:1200px; margin:0 auto; padding:0 1.5rem; }

/* Header */
.site-header { background:var(--white); box-shadow:0 2px 10px rgba(0,0,0,.06); position:sticky; top:0; z-index:100; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding-top:.8rem; padding-bottom:.8rem; }
.logo { display:flex; align-items:center; gap:.75rem; }
.logo-icon { font-size:1.8rem; color:var(--primary); }
.logo-text { display:flex; flex-direction:column; }
.logo-name { font-size:1.2rem; font-weight:700; color:var(--primary); }
.logo-sub { font-size:.7rem; color:var(--gray); }
.main-nav { display:flex; align-items:center; gap:2rem; }
.main-nav a { font-size:.95rem; color:var(--gray); transition:color .2s; }
.main-nav a:hover, .main-nav a.active { color:var(--primary); font-weight:600; }
.btn-nav { background:var(--primary); color:var(--white) !important; padding:.45rem 1.2rem; border-radius:6px; font-weight:600; transition:background .2s; }
.btn-nav:hover { background:var(--primary-dark); }

/* Hero */
.hero { background:linear-gradient(135deg,#1a5fa8 0%,#0d3f72 100%); color:var(--white); padding:5rem 0; text-align:center; }
.hero-badge { display:inline-block; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); padding:.3rem 1rem; border-radius:50px; font-size:.8rem; margin-bottom:1.5rem; letter-spacing:.05em; }
.hero-title { font-size:2.8rem; font-weight:800; margin-bottom:1.2rem; line-height:1.2; }
.hero-desc { font-size:1.05rem; opacity:.85; margin-bottom:2.5rem; line-height:1.8; }
.hero-actions { display:flex; gap:1rem; justify-content:center; margin-bottom:3rem; }
.btn { display:inline-block; padding:.75rem 2rem; border-radius:8px; font-size:1rem; font-weight:600; transition:all .25s; cursor:pointer; }
.btn-primary { background:var(--accent); color:var(--dark); }
.btn-primary:hover { background:#d4901c; transform:translateY(-2px); box-shadow:0 6px 20px rgba(232,160,32,.35); }
.btn-outline { background:transparent; color:var(--white); border:2px solid rgba(255,255,255,.6); }
.btn-outline:hover { border-color:var(--white); background:rgba(255,255,255,.1); }
.hero-stats { display:flex; justify-content:center; gap:3.5rem; padding-top:2.5rem; border-top:1px solid rgba(255,255,255,.2); }
.stat { display:flex; flex-direction:column; align-items:center; gap:.2rem; }
.stat-num { font-size:2rem; font-weight:800; color:var(--accent); }
.stat-label { font-size:.8rem; opacity:.7; }

/* Sections */
.section { padding:4rem 0; }
.section-gray { background:var(--bg); }
.section-header { text-align:center; margin-bottom:3rem; }
.section-tag { display:inline-block; background:var(--accent-light); color:var(--accent); font-size:.8rem; font-weight:700; padding:.25rem .8rem; border-radius:50px; margin-bottom:.8rem; letter-spacing:.05em; }
.section-title { font-size:1.9rem; font-weight:800; color:var(--dark); margin-bottom:.6rem; }
.section-desc { font-size:1rem; color:var(--gray); max-width:560px; margin:0 auto; }

/* Service Grid */
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.service-card { background:var(--white); border:1px solid var(--border); border-radius:var(--radius); padding:1.8rem; transition:all .3s; }
.service-card:hover { box-shadow:var(--shadow); transform:translateY(-3px); border-color:var(--primary); }
.service-icon { font-size:2.2rem; margin-bottom:1rem; }
.service-card h3 { font-size:1.1rem; font-weight:700; margin-bottom:.6rem; color:var(--dark); }
.service-card p { font-size:.9rem; color:var(--gray); line-height:1.7; }

/* Partner Grid */
.partner-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.partner-item { background:var(--white); border:1px solid var(--border); border-radius:8px; padding:1.2rem 1.5rem; text-align:center; font-size:.95rem; font-weight:600; color:var(--gray); transition:all .2s; }
.partner-item:hover { border-color:var(--primary); color:var(--primary); box-shadow:var(--shadow); }

/* Join Preview Steps */
.join-preview { display:flex; align-items:center; justify-content:center; gap:1rem; flex-wrap:wrap; }
.join-step { background:var(--white); border:2px solid var(--border); border-radius:var(--radius); padding:1.5rem 1.8rem; flex:1; min-width:200px; max-width:240px; text-align:center; transition:all .25s; }
.join-step:hover { border-color:var(--primary); box-shadow:var(--shadow); }
.step-num { font-size:2rem; font-weight:900; color:var(--primary); opacity:.25; margin-bottom:.5rem; }
.step-content h4 { font-size:1rem; font-weight:700; margin-bottom:.3rem; }
.step-content p { font-size:.82rem; color:var(--gray); }
.step-arrow { font-size:1.5rem; color:var(--accent); font-weight:700; }

/* Footer */
.site-footer { background:var(--dark); color:rgba(255,255,255,.75); padding:3.5rem 0 0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1.5fr; gap:3rem; margin-bottom:2.5rem; }
.footer-logo { font-size:1.3rem; font-weight:700; color:var(--white); margin-bottom:.8rem; }
.footer-desc { font-size:.85rem; line-height:1.7; opacity:.7; }
.footer-col h4 { color:var(--white); font-size:.95rem; font-weight:700; margin-bottom:1rem; }
.footer-links { list-style:none; display:flex; flex-direction:column; gap:.5rem; }
.footer-links a { font-size:.85rem; opacity:.7; transition:opacity .2s; }
.footer-links a:hover { opacity:1; color:var(--accent); }
.footer-contact { list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.footer-contact li { font-size:.82rem; opacity:.7; line-height:1.5; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding:1.2rem 0; display:flex; justify-content:space-between; font-size:.8rem; opacity:.5; }

@media(max-width:768px){
  .service-grid,.partner-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .hero-title{font-size:1.8rem;}
  .hero-stats{gap:1.5rem;flex-wrap:wrap;}
  .main-nav{gap:1rem;}
  .main-nav a:not(.btn-nav){display:none;}
}