:root { --ink:#202434; --muted:#63697a; --indigo:#3949a0; --indigo-dark:#293675; --mint:#2b786e; --mist:#f3f5fa; --line:#dfe3ec; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,Helvetica,sans-serif; line-height:1.75; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; height:auto; }
.container,.header-inner,.hero-inner { width:min(1140px,calc(100% - 40px)); margin-inline:auto; }
.site-header { position:sticky; top:0; z-index:30; background:rgba(255,255,255,.95); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.header-inner { height:70px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
.brand { display:inline-flex; align-items:center; gap:10px; font-weight:800; font-size:19px; justify-self:start; }
.brand img { border-radius:5px; }
.nav { display:flex; gap:30px; font-weight:650; font-size:14px; }
.nav a { color:#555c6f; padding:23px 0 20px; border-bottom:3px solid transparent; }
.nav a.active { color:var(--indigo); border-bottom-color:var(--indigo); }
.head-download,.primary { color:#fff; background:var(--indigo); font-weight:750; border-radius:4px; padding:10px 19px; justify-self:end; }
.menu-toggle { display:none; border:0; background:none; font-size:25px; }
.hero { background:linear-gradient(180deg,#fff 0,#fff 84%,var(--mist) 84%); }
.hero-inner { min-height:620px; display:grid; grid-template-columns:1fr .86fr; gap:80px; align-items:center; padding:45px 0 70px; }
.overline,.section-title>span,.cta span,.guide-grid article>section>span,.support-card>span { display:block; color:var(--mint); font-weight:850; font-size:12px; letter-spacing:0; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:10px 0 20px; font-size:clamp(45px,5.3vw,68px); line-height:1.08; letter-spacing:0; }
.hero-copy>p { max-width:570px; color:var(--muted); font-size:17px; }
.actions { display:flex; align-items:center; gap:24px; margin:28px 0 32px; }
.plain,.arrow-link { color:var(--indigo); font-weight:750; }
.hero-copy dl { display:flex; margin:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.hero-copy dl div { flex:1; padding:13px 10px 13px 0; }
.hero-copy dt { font-size:12px; color:var(--muted); }
.hero-copy dd { margin:0; font-weight:750; }
.hero-media { min-height:490px; display:grid; grid-template-columns:58px 1fr; align-items:center; justify-items:center; }
.hero-media img { width:270px; max-width:400px; max-height:465px; object-fit:contain; border-radius:20px; box-shadow:0 22px 54px rgba(36,43,83,.18); }
.index-rail { height:380px; display:flex; flex-direction:column; align-items:center; gap:12px; color:var(--indigo); font-size:12px; font-weight:800; writing-mode:vertical-rl; }
.index-rail i { flex:1; width:1px; background:#c8cede; }
.advantages,.reading-guide,.questions { padding:86px 0; }
.section-title { display:flex; align-items:baseline; gap:16px; margin-bottom:32px; }
.section-title h2 { margin:0; font-size:34px; }
.adv-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); }
.adv-grid article { padding:32px; border-right:1px solid var(--line); }
.adv-grid article:last-child { border-right:0; }
.adv-grid article>span { color:var(--indigo); font-weight:800; }
.adv-grid h3 { margin:24px 0 8px; font-size:22px; }
.adv-grid p { color:var(--muted); margin:0; }
.preview { padding:86px 0; color:#fff; background:var(--indigo-dark); }
.section-title.inverse>span,.section-title.inverse h2 { color:#fff; }
.preview-ribbon { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; align-items:end; }
.preview-ribbon figure { margin:0; padding-top:18px; border-top:1px solid rgba(255,255,255,.35); }
.preview-ribbon em { display:block; margin-bottom:15px; color:#bfc7ff; font-style:normal; font-size:12px; font-weight:750; }
.preview-ribbon img { margin:auto; width:auto; max-width:100%; max-height:350px; border-radius:12px; background:#fff; }
.preview-ribbon figcaption { text-align:center; margin-top:15px; color:#d8dcf0; font-size:13px; }
.split { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; align-items:start; }
.lead { color:var(--muted); font-size:17px; }
.split ol { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }
.split li { display:flex; gap:22px; padding:20px 0; border-bottom:1px solid var(--line); }
.split li>span { width:34px; height:34px; display:grid; place-items:center; color:#fff; background:var(--mint); border-radius:50%; font-size:13px; font-weight:800; }
.split li h3 { margin-bottom:3px; }
.split li p { color:var(--muted); margin:0; }
.questions { background:var(--mist); }
.question-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.question-grid a { background:#fff; padding:24px; border:1px solid var(--line); border-radius:5px; }
.question-grid b,.question-grid span { display:block; }
.question-grid span { color:var(--indigo); margin-top:18px; font-size:13px; }
.cta { padding:48px 0; background:var(--mint); color:#fff; }
.cta .container { display:flex; align-items:center; justify-content:space-between; gap:25px; }
.cta span { color:#cde5e1; }
.cta h2 { margin:3px 0 0; font-size:29px; }
.cta .primary { background:#fff; color:var(--indigo-dark); }
footer { padding:42px 0; color:#9ea5b8; background:#171b27; text-align:center; }
.footer-line { display:flex; align-items:center; justify-content:center; gap:28px; color:#fff; }
footer p { max-width:770px; margin:20px auto 8px; font-size:13px; text-align:center; }
footer small { color:#737b90; }
.inner-main { background:#fff; }
.inner-hero { padding:76px 0 58px; background:var(--mist); border-bottom:1px solid var(--line); }
.inner-hero h1 { font-size:clamp(38px,5vw,57px); margin:8px 0 15px; }
.inner-hero p { max-width:730px; color:var(--muted); font-size:17px; }
.guide-grid { display:grid; grid-template-columns:220px 1fr; gap:80px; padding-top:70px; padding-bottom:90px; }
.guide-grid aside { position:sticky; top:100px; align-self:start; display:grid; border-top:3px solid var(--indigo); }
.guide-grid aside strong,.guide-grid aside a { padding:12px 8px; border-bottom:1px solid var(--line); }
.guide-grid aside a { color:var(--muted); font-size:13px; }
.guide-grid article { max-width:770px; }
.guide-grid article>section { padding-bottom:42px; margin-bottom:42px; border-bottom:1px solid var(--line); scroll-margin-top:100px; }
.guide-grid h2 { margin:7px 0 15px; font-size:30px; }
.guide-grid p { color:#50576a; }
.guide-grid article a { color:var(--indigo); text-decoration:underline; }
.support-layout { padding-top:55px; padding-bottom:90px; }
.support-tabs { display:flex; gap:9px; margin-bottom:28px; flex-wrap:wrap; }
.support-tabs button { border:1px solid var(--line); background:#fff; color:var(--muted); padding:8px 15px; border-radius:4px; cursor:pointer; }
.support-tabs button.active { color:#fff; background:var(--indigo); border-color:var(--indigo); }
.faq-list { max-width:900px; }
.faq-list details { border-top:1px solid var(--line); }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list details[hidden] { display:none; }
.faq-list summary { cursor:pointer; padding:18px 10px; font-weight:750; list-style:none; }
.faq-list summary span { display:inline-block; color:var(--indigo); width:42px; }
.faq-list details p { padding:0 10px 20px 52px; color:var(--muted); margin:0; }
.support-card { max-width:900px; margin-top:45px; padding:30px; background:var(--mist); border-left:4px solid var(--mint); }
.support-card h2 { margin:6px 0; }
.support-card p { color:var(--muted); }
.support-card a { color:var(--indigo); font-weight:750; }
@media(max-width:850px){.header-inner{grid-template-columns:1fr auto}.head-download{display:none}.menu-toggle{display:block}.nav{display:none;position:absolute;top:70px;left:20px;right:20px;padding:16px;background:#fff;border:1px solid var(--line);box-shadow:0 15px 30px rgba(20,25,50,.12);flex-direction:column}.nav.open{display:flex}.nav a{padding:8px;border:0}.hero-inner{grid-template-columns:1fr;gap:25px;padding:40px 0 48px}.hero-media{min-height:360px;grid-template-columns:45px 1fr}.hero-media img{max-height:340px}.index-rail{height:280px}.adv-grid{grid-template-columns:1fr}.adv-grid article{border-right:0;border-bottom:1px solid var(--line)}.preview-ribbon{overflow-x:auto;grid-template-columns:repeat(3,220px)}.split{grid-template-columns:1fr;gap:40px}.question-grid{grid-template-columns:1fr}.guide-grid{grid-template-columns:1fr;gap:35px}.guide-grid aside{position:static;grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.container,.header-inner,.hero-inner{width:min(100% - 28px,1140px)}.header-inner{height:64px}.nav{top:64px;left:14px;right:14px}h1{font-size:39px}.hero-inner{padding-top:28px;padding-bottom:34px}.hero-copy>p{font-size:15px}.hero-copy dl{font-size:13px}.actions{margin:22px 0}.hero-media{min-height:260px}.hero-media img{max-height:255px;width:145px}.index-rail{height:220px}.advantages,.reading-guide,.questions,.preview{padding:60px 0}.section-title h2{font-size:29px}.adv-grid article{padding:24px}.preview-ribbon img{height:295px;object-fit:contain}.cta .container{align-items:flex-start;flex-direction:column}.inner-hero{padding:50px 0 43px}.inner-hero h1{font-size:37px}.guide-grid{padding-top:42px}.guide-grid aside{grid-template-columns:1fr 1fr}.footer-line{flex-wrap:wrap}}
