:root{
  --ink:#1d1d1f;--mute:#6e6e73;--line:#d2d2d7;--pale:#f5f5f7;
  --gold:#e8c26e;--gold2:#c8963e;--blue:#2997ff;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro SC","PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:44px;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:#000;color:#f5f5f7;-webkit-font-smoothing:antialiased;line-height:1.4;overflow-x:clip}
a{color:inherit;text-decoration:none}
canvas{display:block}
ul,ol{list-style:none}
.gold{background:linear-gradient(100deg,#f8e2a8 0%,#e8c26e 45%,#b9853a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* 导航 */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:44px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 max(22px,calc(50vw - 490px));
  background:rgba(22,22,23,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);font-size:12px;border-bottom:1px solid rgba(255,255,255,.06)}
.brand{font-size:15px;font-weight:600;letter-spacing:-.01em}
.links{display:flex;gap:30px;color:#d6d6d9}
.links a{transition:color .2s}.links a:hover{color:#fff}
.pill{background:#0071e3;color:#fff;border-radius:980px;padding:4px 12px;font-weight:500}
.pill:hover{background:#0077ed}

/* 主叙事 */
.story{height:1000vh;position:relative;background:#000}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#000}
#gl{position:absolute;inset:0;width:100%;height:100%}
.glow{position:absolute;left:50%;top:60%;width:120vmax;height:120vmax;transform:translate(-50%,-50%);opacity:.2;pointer-events:none;
  background:radial-gradient(closest-side,rgba(200,150,62,.32),rgba(200,150,62,.06) 45%,transparent 70%)}
.hero{position:absolute;left:0;right:0;top:13vh;text-align:center;padding:0 20px;pointer-events:none;will-change:opacity,transform}
.hero h1{font-size:clamp(46px,8.4vw,112px);font-weight:600;line-height:1.05;letter-spacing:-.025em}
.hero p{margin-top:18px;font-size:clamp(17px,1.9vw,24px);color:#a1a1a6;font-weight:500}
.beat{position:absolute;left:max(6vw,calc(50vw - 560px));top:50%;width:min(40vw,460px);opacity:0;pointer-events:none;will-change:opacity,transform}
.beat:before{content:"";position:absolute;inset:-70px -90px;z-index:-1;background:radial-gradient(closest-side,rgba(0,0,0,.72),rgba(0,0,0,.42) 60%,transparent)}
.beat em{display:block;font-style:normal;font-size:clamp(14px,1.2vw,17px);font-weight:600;color:var(--gold);margin-bottom:12px}
.beat h2{font-size:clamp(34px,4.6vw,64px);font-weight:600;line-height:1.08;letter-spacing:-.02em}
.beat p{margin-top:16px;font-size:clamp(16px,1.45vw,20px);color:#a1a1a6;line-height:1.5;font-weight:500}
.tags{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.tag{position:absolute;left:0;top:0;font-size:12px;font-weight:600;white-space:nowrap;padding:4px 10px;border-radius:980px;opacity:0;
  background:rgba(40,40,44,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#f5f5f7;will-change:transform,opacity}
.tag.hot{background:rgba(232,194,110,.95);color:#1d1d1f}
.tag.bad{background:rgba(120,120,128,.55)}
.progress{position:absolute;left:50%;bottom:26px;width:120px;height:2px;margin-left:-60px;background:rgba(255,255,255,.14);border-radius:2px;overflow:hidden}
.progress i{display:block;height:100%;background:#fff;transform-origin:left;transform:scaleX(0)}
.note{position:absolute;right:22px;bottom:18px;font-size:11px;color:#6e6e73}
.scrollhint{position:absolute;left:50%;bottom:48px;width:22px;height:34px;margin-left:-11px;border:1.5px solid rgba(255,255,255,.35);border-radius:12px}
.scrollhint i{position:absolute;left:50%;top:6px;width:2px;height:7px;margin-left:-1px;border-radius:2px;background:#fff;animation:hint 1.8s ease-in-out infinite}
@keyframes hint{0%{transform:translateY(0);opacity:1}70%{transform:translateY(11px);opacity:0}100%{opacity:0}}
.no-gl #gl{display:none}

/* 通用分节 */
section:not(.story):not(.funnel){padding:clamp(90px,13vw,170px) max(22px,calc(50vw - 490px))}
.light{background:#fff;color:var(--ink)}
.pale{background:var(--pale);color:var(--ink)}
.dark{background:#000;color:#f5f5f7}
.center{text-align:center}
.xl{font-size:clamp(42px,6.6vw,88px);font-weight:600;line-height:1.07;letter-spacing:-.025em}
.lg{font-size:clamp(30px,4vw,52px);font-weight:600;line-height:1.1;letter-spacing:-.02em}
.lead{margin-top:18px;font-size:clamp(19px,2vw,26px);font-weight:500;color:#86868b;letter-spacing:-.01em}
.light .lead,.pale .lead{color:var(--mute)}
.foot{margin-top:18px;font-size:12px;color:#86868b}
.foot.c{text-align:center;margin-top:44px}
.head{margin-bottom:clamp(44px,6vw,72px)}
.head.tight{margin-top:clamp(80px,10vw,130px);margin-bottom:40px;text-align:center}
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

/* 概率 */
.odds{width:min(100%,860px);aspect-ratio:50/20;margin:clamp(40px,6vw,70px) auto 0}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:clamp(50px,7vw,90px)}
.trio b{display:block;font-size:clamp(26px,3.2vw,42px);font-weight:600;letter-spacing:-.02em}
.trio span{display:block;margin-top:6px;color:var(--mute);font-size:clamp(14px,1.3vw,17px)}

/* 漏斗 */
.funnel{height:500vh;position:relative;background:#000}
.fstage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
#zoom{position:absolute;inset:0;width:100%;height:100%}
.fstage:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.42) 42%,transparent 62%,rgba(0,0,0,.72))}
.fcopy{position:absolute;z-index:2;left:0;right:0;top:12vh;text-align:center;padding:0 20px;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.fh{font-size:clamp(22px,2.6vw,34px);font-weight:600;letter-spacing:-.01em}
.fnum{margin-top:4px;font-size:clamp(68px,13vw,180px);font-weight:600;letter-spacing:-.035em;line-height:1.05;font-variant-numeric:tabular-nums}
.fnum small{font-size:.26em;font-weight:500;margin-left:.2em;letter-spacing:0;color:#fff}
.fl{font-size:clamp(16px,1.6vw,21px);color:#fff;font-weight:500}
.flevels{position:absolute;z-index:2;bottom:30px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.flevels i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.28);transition:background .3s}
.flevels i.on{background:var(--gold)}
.funnel .note{z-index:2}

/* 数据 */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:#0b0b0d;color:#f5f5f7;border-radius:26px;overflow:hidden;display:flex;flex-direction:column;min-height:390px}
.card.w2{grid-column:span 2}
.card.w3{grid-column:1/-1}
.card canvas{width:100%;flex:1;min-height:250px}
.card>div{padding:0 26px 24px}
.card h3{font-size:21px;font-weight:600;letter-spacing:-.01em}
.card p{margin-top:3px;font-size:14px;color:#a1a1a6}
.four{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.four>div{background:#fff;border-radius:22px;padding:26px 22px}
.four b{display:block;font-size:38px;font-weight:600;line-height:1;margin-bottom:22px;background:linear-gradient(120deg,#d6a24c,#94632a);-webkit-background-clip:text;background-clip:text;color:transparent}
.four h3{font-size:18px;font-weight:600}
.four p{margin-top:4px;font-size:13px;color:var(--mute)}

/* 计划 */
.road{position:relative;max-width:760px;margin:0 auto;padding-left:44px}
.road:before,.road:after{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;border-radius:2px;background:#2a2a2d}
.road:after{background:linear-gradient(180deg,#f8e2a8,#c8963e);transform-origin:top;transform:scaleY(var(--p,0))}
.road li{position:relative;padding-bottom:50px}
.road li:last-child{padding-bottom:0}
.road li:before{content:"";position:absolute;z-index:1;left:-42px;top:7px;width:14px;height:14px;transform:rotate(45deg);background:#000;border:2px solid var(--gold);border-radius:3px}
.road time{font-size:13px;color:var(--gold);font-weight:600}
.road h3{margin-top:2px;font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.02em;line-height:1.15}
.road p{margin-top:5px;font-size:17px;color:#a1a1a6}
.gate{display:inline-block;margin-top:12px;padding:5px 13px;font-size:13px;font-weight:500;border-radius:980px;background:#1c1c1e;color:#f5f5f7}
.gate:before{content:"闸门  ";white-space:pre;color:var(--gold)}
.team{max-width:760px;margin:clamp(70px,9vw,110px) auto 0;text-align:center}
.team h3{font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.02em}
.team ul{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:22px}
.team li{padding:8px 15px;border-radius:980px;border:1px solid #3a3a3c;font-size:14px}
.team p{margin-top:20px;color:#a1a1a6;font-size:17px}

/* 风险 */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(258px,1fr);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -22px;padding:4px 22px 16px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail article{scroll-snap-align:center;background:var(--pale);border-radius:24px;padding:20px 20px 24px}
.rail canvas{width:100%;height:170px;margin-bottom:16px}
.rail h3{font-size:20px;font-weight:600}
.rail p{margin-top:5px;font-size:14px;color:var(--mute);line-height:1.5}

/* 案例 */
.cases{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.case{display:block;background:#fff;border-radius:24px;padding:28px 28px 30px;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.case:hover{transform:scale(1.015);box-shadow:0 14px 40px rgba(0,0,0,.08)}
.case span{font-size:12px;font-weight:600;color:#8a5f22}
.case h3{margin-top:7px;font-size:clamp(22px,2.4vw,30px);font-weight:600;letter-spacing:-.015em}
.case p{margin-top:6px;font-size:15px;color:var(--mute)}

/* 起步 */
.steps{max-width:560px;margin:clamp(44px,6vw,70px) auto 0;text-align:left}
.steps li{display:flex;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid #2a2a2d;font-size:clamp(17px,1.7vw,21px);font-weight:500}
.steps b{flex:none;width:32px;height:32px;line-height:32px;text-align:center;border-radius:50%;background:var(--gold);color:#1d1d1f;font-size:15px}
.end{margin-top:44px;font-size:clamp(22px,2.6vw,32px);font-weight:600;color:var(--gold)}

footer{background:var(--pale);color:#6e6e73;font-size:12px;line-height:1.6;padding:26px max(22px,calc(50vw - 490px)) 34px}
footer p+p{margin-top:8px}

@media (max-width:820px){
  .links{display:none}
  .beat{left:22px;right:22px;width:auto;top:auto;bottom:62px}
  .beat:before{inset:-46px -22px -62px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.82) 30%)}
  .beat h2{font-size:34px}
  .beat p{font-size:15px;margin-top:10px}
  .beat em{margin-bottom:6px}
  .note{right:16px;bottom:14px}
  .progress{left:22px;margin-left:0;bottom:20px;width:90px}
  .hero{top:calc(44px + 8vh)}
  .bento{grid-template-columns:1fr;gap:14px}
  .card.w2,.card.w3{grid-column:auto}
  .card{min-height:340px;border-radius:22px}
  .four{grid-template-columns:repeat(2,1fr);gap:12px}
  .four>div{padding:20px 18px}
  .cases{grid-template-columns:1fr;gap:14px}
  .trio{grid-template-columns:1fr;gap:26px}
  .rail{grid-auto-columns:76%}
  .road{padding-left:36px}
  .road li:before{left:-34px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{transition:none;opacity:1;transform:none}
  .scrollhint i{animation:none}
}