/* Design B v2 — cinematic scroll story (layer over b.css) */
body.cine{background:var(--void);color:var(--chalk)}
.cine .hd__bar{background:rgba(17,18,19,.55)}
.scene{position:relative}
.stage{position:sticky;top:0;height:100svh;overflow:hidden}
.t-c{text-align:center}
.cap-xl{font:600 clamp(40px,6.6vw,128px)/.98 var(--f);letter-spacing:-.045em;margin:0;text-wrap:balance}
.cap-l{font:600 clamp(30px,4.2vw,76px)/1.04 var(--f);letter-spacing:-.04em;margin:0;text-wrap:balance}
html:lang(zh-CN) .cap-xl,html:lang(zh-CN) .cap-l{letter-spacing:0;line-height:1.2}
.dim{color:rgba(243,240,231,.42)}
.kick{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--lichen)}

/* ---------- Scene 1 · powers of ten ---------- */
.p10{height:760vh}
.p10 .layer{position:absolute;inset:0;will-change:clip-path,transform}
.p10 .layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform}
.p10 .layer::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(17,18,19,.6),rgba(17,18,19,.25) 40%,rgba(17,18,19,.4))}
.p10 .layer.space{background:radial-gradient(circle at 50% 50%,#1b1e1f 0,#111213 60%)}
.p10 .layer.space::after{display:none}
.p10 canvas{position:absolute;inset:0;width:100%;height:100%}
.stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 30%,rgba(243,240,231,.6),transparent),radial-gradient(1px 1px at 70% 20%,rgba(243,240,231,.5),transparent),radial-gradient(1.5px 1.5px at 85% 70%,rgba(243,240,231,.5),transparent),radial-gradient(1px 1px at 35% 80%,rgba(243,240,231,.4),transparent),radial-gradient(1px 1px at 55% 55%,rgba(243,240,231,.35),transparent),radial-gradient(1px 1px at 10% 65%,rgba(243,240,231,.45),transparent);background-size:420px 420px;opacity:.7}
.p10__copy{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:5;padding:0 var(--gr) 0 var(--gl)}
.p10__copy>div{position:absolute;max-width:min(1100px,92vw);text-align:center;opacity:0;display:grid;gap:22px;justify-items:center}
.p10__copy>div:first-child{opacity:1}
.p10__copy .cap-l,.p10__copy .cap-xl{text-shadow:0 2px 30px rgba(0,0,0,.35)}
.p10__copy .lead{color:rgba(243,240,231,.82);text-align:center;margin-inline:auto}
.p10__hud{position:absolute;left:var(--gl);right:var(--gr);bottom:calc(30px + env(safe-area-inset-bottom,0px));z-index:6;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:20px;pointer-events:none}
.p10__scale{display:grid;gap:10px}
.p10__scale .bar{width:min(220px,40vw);height:8px;border:1.5px solid var(--chalk);border-top:0;position:relative}
.p10__scale b{font:700 clamp(24px,2.4vw,40px)/1 var(--f);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.p10__where{justify-self:end;text-align:right;display:grid;gap:6px}
.p10__where b{font:600 15px var(--f)}
.p10__ticks{display:flex;gap:6px}
.p10__ticks i{width:28px;height:3px;border-radius:9px;background:rgba(243,240,231,.25);transition:background .4s}
.p10__ticks i.on{background:var(--lichen)}
.p10__cta{pointer-events:auto}
.scroll-hint{display:inline-flex;align-items:center;gap:10px;color:rgba(243,240,231,.6)}
.scroll-hint i{width:22px;height:34px;border:1.5px solid currentColor;border-radius:99px;position:relative}
.scroll-hint i::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:9px;background:var(--lichen);animation:wheel 1.6s infinite}
@keyframes wheel{to{transform:translateY(10px);opacity:0}}
@media(max-width:700px){.p10__hud{grid-template-columns:1fr 1fr}.p10__ticks{display:none}}

/* ---------- Scene 2 · keynote, one line at a time ---------- */
.kn{height:620vh}
.kn .stage{display:grid;place-items:center}
.kn__l{position:absolute;left:var(--gl);right:var(--gr);top:50%;transform:translateY(-50%);display:grid;justify-items:center;gap:26px;text-align:center;z-index:4;pointer-events:none}
.kn__l .cap-xl{font-size:clamp(44px,7.4vw,150px);line-height:.98;max-width:13ch;margin-inline:auto}
html:lang(zh-CN) .kn__l .cap-xl{max-width:11em}
.kn__l .kw{display:inline-block;opacity:0;will-change:transform,opacity,filter}
.kn__l .acc{color:var(--lichen)}
.kn__caret{display:inline-block;width:.08em;height:.8em;margin-left:.08em;background:var(--lichen);vertical-align:-.05em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{background-color:transparent}}
.kn__yr{font-weight:inherit;font-variant-numeric:tabular-nums}
.kn__bg{position:absolute;inset:0;opacity:0;z-index:1}
.kn__bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2) contrast(1.1)}
.kn__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at center,rgba(17,18,19,.55),rgba(17,18,19,.9))}
.kn__vf{position:absolute;inset:12vh 10vw;z-index:3;opacity:0;pointer-events:none}
.kn__vf>i{position:absolute;width:48px;height:48px;border:2px solid var(--chalk)}
.kn__vf>i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.kn__vf>i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.kn__vf>i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.kn__vf>i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.kn__rec{position:absolute;left:62px;top:10px;font:600 12px var(--f);letter-spacing:.14em;color:#e5484d}
.kn__cross{position:absolute;left:50%;top:50%;width:36px;height:36px;margin:-18px 0 0 -18px;border:1px solid rgba(243,240,231,.5);border-radius:50%}
.kn__flash{position:absolute;inset:0;background:#fff;opacity:0;z-index:6;pointer-events:none}
.kn__vial{position:absolute;z-index:2;width:min(30vh,320px);aspect-ratio:1;border-radius:50%;overflow:hidden;opacity:0;left:50%;top:9vh;margin-left:max(-15vh,-160px);box-shadow:0 0 0 1px rgba(243,240,231,.3),0 30px 80px rgba(0,0,0,.5)}
.kn__vial img{width:100%;height:100%;object-fit:cover}
.kn__prog{position:absolute;left:50%;bottom:calc(30px + env(safe-area-inset-bottom,0px));width:min(240px,50vw);height:2px;transform:translateX(-50%);background:rgba(243,240,231,.18);z-index:5;border-radius:9px;overflow:hidden}
.kn__prog i{display:block;height:100%;background:var(--lichen);transform-origin:left;transform:scaleX(0)}
@media(max-width:800px){.kn__vf{inset:14vh 6vw}}

/* ---------- Scene 3 · number takeover ---------- */
.nt{height:520vh}
.nt .stage{display:grid;place-items:center}
.nt__bg{position:absolute;inset:0;background:var(--void)}
.nt__item{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:18px;text-align:center;opacity:0;padding:0 var(--gr) 0 var(--gl)}
.nt__bg+.nt__item{opacity:1}
.nt__n{font:700 clamp(120px,26vw,520px)/.8 var(--f);letter-spacing:-.075em;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;justify-content:center}
.nt__n small{font-size:.22em;letter-spacing:-.03em;margin-left:.15em}
.nt__item p{margin:0;max-width:34ch;font:500 clamp(17px,1.5vw,22px)/1.45 var(--f);opacity:.8}
.nt__src{position:absolute;left:0;right:0;bottom:calc(26px + env(safe-area-inset-bottom,0px));text-align:center;opacity:.55;z-index:3}
.nt__dots{position:absolute;right:var(--gr);top:50%;transform:translateY(-50%);display:grid;gap:10px;z-index:3}
.nt__dots i{width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;transition:background .3s}
.nt__dots i.on{background:currentColor}

/* ---------- Scene 4 · feature carousel ---------- */
.fc{background:var(--chalk);color:var(--ink);padding-block:clamp(110px,12vw,200px)}
.fc__head{display:grid;gap:22px;justify-items:center;text-align:center;margin-bottom:clamp(40px,5vw,80px)}
.fc__head .lead{text-align:center}
.fc__frame{position:relative;aspect-ratio:16/8.5;border-radius:clamp(24px,3vw,44px);overflow:hidden;background:var(--ink);max-height:78svh;width:100%}
@media(max-width:700px){.fc__frame{aspect-ratio:4/5}}
.fc__slide{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--e)}
.fc__slide.on{opacity:1}
.fc__slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 6s linear}
.fc__slide.on img{transform:scale(1)}
.fc__slide::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(17,18,19,.75),rgba(17,18,19,0) 55%)}
.fc__txt{position:absolute;left:clamp(20px,3vw,48px);right:clamp(20px,3vw,48px);bottom:clamp(20px,3vw,44px);z-index:2;color:var(--chalk);display:grid;gap:10px;max-width:620px}
.fc__txt h3{font:600 clamp(28px,3vw,52px)/1 var(--f);letter-spacing:-.04em;margin:0}
.fc__txt p{margin:0;color:rgba(243,240,231,.82);font-size:16.5px}
.fc__txt a{justify-self:start;margin-top:8px}
.fc__tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.fc__tabs button{position:relative;overflow:hidden;padding:12px 18px;border-radius:99px;background:rgba(35,37,39,.07);font:600 14px var(--f);color:var(--ink)}
.fc__tabs button i{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--lichen);transform-origin:left;transform:scaleX(0)}
.fc__tabs button.on{background:var(--ink);color:var(--chalk)}

/* ---------- Scene 5 · map story ---------- */
.ms{height:360vh;background:var(--void)}
.ms .stage{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(16px,3vh,40px);padding:calc(80px + env(safe-area-inset-top,0px)) var(--gr) 30px var(--gl)}
.ms__map{position:relative;width:min(100%,1500px,calc((100svh - 330px) * 2.41))}
.ms__map svg{width:100%;height:auto;display:block;overflow:visible}
.ms .land{fill:none;stroke:rgba(243,240,231,.22);stroke-width:3.6;stroke-linecap:round}
.ms .arc{fill:none;stroke:var(--lichen);stroke-width:2.4}
.ms .arc2{fill:none;stroke:rgba(243,240,231,.6);stroke-width:1.4;stroke-dasharray:3 7}
.ms .city{fill:var(--lichen)}
.ms .ring{fill:none;stroke:var(--lichen);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ring 2.4s var(--e) infinite}
@keyframes ring{from{transform:scale(.4);opacity:1}to{transform:scale(3.4);opacity:0}}
.ms .mover{fill:var(--chalk)}
.xw__lbl{position:absolute;transform:translate(-50%,0);text-align:center;display:grid;gap:4px;white-space:nowrap;padding-top:22px}
.xw__lbl b{font:600 clamp(22px,2.6vw,44px)/1 var(--f);letter-spacing:-.04em}
.xw__lbl .mono{color:rgba(243,240,231,.5);font:600 11px var(--f);letter-spacing:.08em}
.xw__lbl .t{color:var(--lichen);font:600 15px var(--f);font-variant-numeric:tabular-nums}
.xw__flows{display:none}
.ms__copy{position:relative;width:100%;height:clamp(110px,15vh,190px);text-align:center;z-index:3}
.ms__copy>div{position:absolute;left:0;right:0;opacity:0;display:grid;gap:14px;justify-items:center}
.ms__copy>div:first-child{opacity:1}
@media(max-width:700px){.xw__lbl .mono{display:none}}

/* ---------- Scene 6 · sticky media + claims ---------- */
.sm{background:var(--chalk);color:var(--ink)}
.sm__g{display:grid;gap:40px}
@media(min-width:1000px){.sm__g{grid-template-columns:5fr 6fr;gap:clamp(40px,6vw,110px)}}
.sm__media{position:relative;border-radius:clamp(24px,3vw,40px);overflow:hidden;aspect-ratio:4/5;background:var(--ink)}
@media(min-width:1000px){.sm__media{position:sticky;top:12vh;height:76vh;aspect-ratio:auto}}
.sm__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity .9s var(--e),transform 1.4s var(--e)}
.sm__media img.on{opacity:1;transform:none}
.sm__list{display:grid}
.sm__i{min-height:76vh;display:grid;align-content:center;gap:20px;padding-block:6vh;opacity:.28;transition:opacity .6s}
.sm__i.on{opacity:1}
.sm__i .n{font:600 13px var(--f);letter-spacing:.12em;color:var(--lichen-d,#6f7a44)}
.sm__i h3{font:600 clamp(36px,4.4vw,80px)/1 var(--f);letter-spacing:-.045em;margin:0}
html:lang(zh-CN) .sm__i h3{letter-spacing:0;line-height:1.2}
.sm__i p{margin:0;font:400 clamp(17px,1.4vw,21px)/1.55 var(--f);color:var(--g70);max-width:46ch}
@media(max-width:999px){.sm__media{display:none}.sm__i{min-height:0;opacity:1;padding-block:30px;border-top:1.5px solid var(--ink)}}

/* ---------- Scene 7 · finale ---------- */
.fn{position:relative;min-height:110svh;display:grid;place-items:center;overflow:hidden;text-align:center}
.fn>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fn::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(17,18,19,.35),rgba(17,18,19,.85))}
.fn__in{position:relative;z-index:2;display:grid;gap:30px;justify-items:center;padding:0 var(--gr) 0 var(--gl)}
.fn__routes{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.cine .ft__cta{display:none}
.xw__map{position:relative}
