:root{
  --brand-50:#F0FDF4;--brand-100:#DCFCE7;--brand-200:#BBF7D0;--brand-300:#86EFAC;--brand-400:#4ADE80;--brand-500:#22C55E;--brand-600:#16A34A;--brand-700:#15803D;--brand-800:#166534;--brand-900:#14532D;
  --text-strong:#0F172A;--text-muted:#475569;--bg:#FFFFFF;--surface:#F8FAFC;--border:#E2E8F0;
  --success:#22C55E;--warning:#F59E0B;--danger:#EF4444;
  --brand-gradient:linear-gradient(135deg,#22C55E 0%,#16A34A 100%);
  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);--shadow-md:0 6px 16px rgba(0,0,0,.08);--shadow-lg:0 10px 30px rgba(0,0,0,.12);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-24:96px;
  --container:1200px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text-strong);font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Helvetica Neue,Arial,"Noto Color Emoji",sans-serif;}
html{scroll-behavior:smooth}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}

/* Navbar */
.site-nav{position:sticky;top:0;background:rgba(255,255,255,.8);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border);z-index:10}
.site-nav.scrolled{background:#fff;box-shadow:var(--shadow-sm)}
.site-nav .inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-weight:700;font-size:20px}
.site-nav nav{display:flex;gap:var(--space-4);align-items:center}
.site-nav nav a{padding:6px 8px;border-radius:8px}
.site-nav nav a.active{color:var(--brand-700);background:var(--brand-50)}
.btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 var(--space-5);border-radius:var(--radius-sm);border:1px solid var(--border);background:#fff;box-shadow:var(--shadow-sm);transition:all .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn.primary{background:var(--brand-500);border-color:transparent;color:#fff}
.btn.primary:hover{background:var(--brand-600)}
.btn.ghost{background:transparent;border-color:var(--border)}

/* Hero */
.hero{background:var(--brand-gradient);color:#fff;padding:var(--space-24) 0 var(--space-16);}
.hero .inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-6)}
.hero h1{font-size:48px;line-height:1.2;margin:0}
.hero p{font-size:18px;line-height:1.7;margin:0;color:rgba(255,255,255,.92)}
.hero-bullets{list-style:none;padding:0;margin:var(--space-4) 0 0;display:flex;gap:var(--space-4);flex-wrap:wrap;justify-content:center;color:#fff}
.hero-bullets li{background:rgba(255,255,255,.12);padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.2)}
.cta{display:flex;gap:var(--space-4);margin-top:var(--space-4)}

/* Features */
.features{background:var(--surface);padding:var(--space-16) 0}
.section-header{display:flex;flex-direction:column;gap:var(--space-2);text-align:center;margin-bottom:var(--space-10)}
.section-header h2{font-size:32px;margin:0}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-8);transition:all .2s ease}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.card .icon{font-size:28px}
.card h3{margin:var(--space-4) 0 var(--space-2);font-size:20px}
.card p{margin:0;color:var(--text-muted);line-height:1.7}

/* How it works */
.how{background:#fff;padding:var(--space-16) 0}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6);margin-bottom:var(--space-10)}
.step{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-8);box-shadow:var(--shadow-sm)}
.step .badge{width:32px;height:32px;border-radius:999px;background:var(--brand-100);color:var(--brand-700);display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.steps h3{margin:var(--space-4) 0 var(--space-2);font-size:20px}
.steps p{margin:0;color:var(--text-muted)}
.screens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
.screens img{width:100%;border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-sm)}

/* Wordtest */
.wordtest{background:var(--surface);padding:var(--space-16) 0}
.wt-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-8)}
.wt-left{grid-column:span 6}
.wt-right{grid-column:span 6;display:flex;flex-direction:column;gap:var(--space-6)}
.test-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-8)}
.test-card .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4)}
.test-card .badge{font-size:12px;color:var(--brand-700);background:var(--brand-100);border:1px solid var(--brand-200);padding:4px 8px;border-radius:999px}
.test-card .tag{font-size:12px;color:var(--text-muted)}
.test-card .question{font-size:20px;margin:0 0 var(--space-6)}
.choices{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.choice{width:100%;height:48px;border:1px solid var(--border);background:#fff;border-radius:12px;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .2s ease}
.choice:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.test-card .meta{margin-top:var(--space-4);color:var(--text-muted);font-size:14px}
.stats-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.stats-mini .item{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-6);text-align:center}
.stats-mini .num{font-weight:800;font-size:24px;color:var(--brand-700)}
.stats-mini .label{color:var(--text-muted)}

/* Trust band */
.trust-band{background:#fff;padding:var(--space-12) 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6);align-items:center}
.stat{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-6);border-radius:var(--radius-md);background:var(--surface)}
.stat .num{font-size:28px;font-weight:800;color:var(--brand-700)}
.stat .label{color:var(--text-muted)}
.trust-band .note{margin-top:var(--space-4);text-align:center;color:var(--text-muted);font-size:14px}

/* FAQ */
.faq{background:#fff;padding:var(--space-16) 0}
.faq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
.faq-list details{padding:var(--space-6);border:1px solid var(--border);border-radius:var(--radius-md);background:#fff;box-shadow:var(--shadow-sm)}
.faq-list summary{font-weight:600;cursor:pointer}
.faq-list p{margin:var(--space-4) 0 0;color:var(--text-muted);line-height:1.7}

/* Footer */
.site-footer{padding:var(--space-10) 0;border-top:1px solid var(--border);background:#fff;color:var(--text-muted)}
.site-footer .inner{display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:space-between;align-items:center}
.site-footer nav{display:flex;gap:var(--space-4)}
.site-footer a{color:var(--text-muted)}

/* Floating CTA (mobile only) */
.floating-cta{position:fixed;right:16px;bottom:16px;z-index:20;background:var(--brand-600);color:#fff;padding:10px 16px;border-radius:999px;box-shadow:var(--shadow-lg);display:none}
.floating-cta:hover{background:var(--brand-700)}

/* Back to top */
.back-to-top{position:fixed;right:16px;bottom:76px;z-index:19;background:#fff;color:var(--text-strong);border:1px solid var(--border);border-radius:999px;box-shadow:var(--shadow-sm);width:40px;height:40px;display:none;align-items:center;justify-content:center}
.back-to-top.show{display:flex}

/* (移除) PWA 提示样式占位已删除 */

/* Responsive */
@media (max-width:1024px){.hero h1{font-size:40px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:768px){.hero{padding:var(--space-16) 0 var(--space-12)}.hero h1{font-size:32px}.cta{flex-direction:column}.cards{grid-template-columns:1fr}.faq-list{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.screens{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.floating-cta{display:inline-flex}}
@media (max-width:1024px){.wt-left{grid-column:span 12}.wt-right{grid-column:span 12}}