/* =====================================================
   Scroll-driven (pinned) scenes
   .scene = tall wrapper · .stage = sticky viewport
   JS writes --p (0→1 scene progress) and a few extra vars
   ===================================================== */

.scene{position:relative;height:calc(var(--len,3)*100svh);--p:0}
.stage{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:flex;flex-direction:column;
  padding:calc(var(--nav-h) + 38px) var(--gutter) 26px;
}
.glow{
  position:absolute;z-index:0;inset:auto -35% -32% -35%;height:70%;pointer-events:none;
  background:radial-gradient(46% 52% at 50% 58%,rgba(54,108,255,.8),rgba(25,81,252,.34) 46%,transparent 72%);
  filter:blur(36px);opacity:calc(.45 + var(--p)*.55);
}

/* ---------------- 01 IDEA (ref 8) ---------------- */
.scene--idea .stage{background:var(--paper)}
.id__left{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(14px,3svh,30px);z-index:2}
.id__list{position:relative;padding-inline-start:.5em}
.id__list li{
  position:relative;font:300 clamp(2.7rem,min(13vw,8.4svh),5.6rem)/1.08 var(--f-display);color:#9296A9;
  transition:color .7s var(--ease),font-weight .7s var(--ease),transform .7s var(--ease);
}
.id__list li::before{
  content:"";position:absolute;inset-inline-start:-.36em;top:.3em;width:.13em;height:.13em;background:var(--ink);border-radius:1px;
  transform:scale(0);transition:transform .6s var(--ease);
}
.id__list li.is-on{color:#14196A;font-weight:400;transform:translateX(calc(var(--dir,1)*-4px))}
.id__list li.is-on::before{transform:scale(1)}

.id__right{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;margin-top:clamp(14px,2.6svh,26px)}
.id__card{
  position:relative;flex:1 1 auto;min-height:150px;max-height:38svh;border-radius:16px;overflow:hidden;container-type:size;
  background:
    radial-gradient(80% 110% at 0% 100%,rgba(150,190,245,.55),transparent 62%),
    linear-gradient(118deg,#0B1546 0%,#132A80 36%,#2049C6 68%,#5B8CEA 100%);
  box-shadow:0 50px 70px -46px rgba(12,18,48,.75);
}
.id__dot{position:absolute;inset-block-start:16px;inset-inline-start:16px;width:7px;height:7px;background:#fff;border-radius:1px;z-index:2}
.sparks{position:absolute;z-index:2;inset-block-start:16px;inset-inline-end:16px;width:min(62%,400px,calc(38svh - 18px));display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.spark{
  aspect-ratio:1;display:grid;place-items:center;border-radius:22%;color:#fff;
  background:rgba(5,10,48,.3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
}
.spark svg{width:54%;height:54%;scale:calc(.5 + var(--k,0)*.5);opacity:calc(.28 + var(--k,0)*.72);filter:drop-shadow(0 0 calc(var(--k,0)*9px) rgba(255,255,255,.7))}
.sparks{width:min(62cqw,calc(100cqh - 34px),420px)}
.id__num{position:absolute;z-index:2;inset-inline-start:20px;inset-block-end:12px;font:200 clamp(3.6rem,16vw,6.2rem)/1 var(--f-display);color:#fff;font-feature-settings:"tnum";height:1.05em;overflow:hidden}
.id__num i{display:block;font-style:normal;animation:numin .8s var(--ease)}
@keyframes numin{from{transform:translateY(70%);opacity:0}}
.id__descs{position:relative;min-height:5.6em;margin-top:18px}
.id__descs p{position:absolute;inset:0;font-size:.96rem;color:var(--ink-2);max-width:27em;opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.id__descs p.is-on{opacity:1;transform:none}

/* ---------------- 02 COLORS (swatch fan deck) ---------------- */
.scene--colors{background:#fff}
.scene--colors .stage{background:#fff;--d:min(66vw,300px,36svh)}
.cf__head{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.cc{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(18px,3.4svh,30px)}
.cc__disc{
  position:relative;width:var(--d);aspect-ratio:1;border-radius:50%;overflow:hidden;
  scale:calc(.72 + var(--in,1)*.28);opacity:var(--in,1);
  box-shadow:0 0 0 1px rgba(20,25,106,.06),0 50px 80px -46px rgba(20,25,106,.6);
}
.cc__base,.cc__wave{position:absolute;inset:0;border-radius:50%;background:#03195B}
.cc__wave{transform:scale(0)}
.cc__wave.go{animation:ccwave 1.1s var(--ease) forwards}
@keyframes ccwave{from{transform:scale(0)}to{transform:scale(1)}}
.cc__disc::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(110% 110% at 28% 22%,rgba(255,255,255,.2),rgba(255,255,255,0) 46%)}
.cc__chip{
  position:absolute;z-index:2;left:50%;top:50%;translate:-50% -50%;padding:8px 14px;border-radius:7px;direction:ltr;
  background:#fff;color:#14196A;font:500 12.5px/1 var(--f-text);letter-spacing:.02em;box-shadow:0 14px 30px -14px rgba(10,20,100,.5);
}
.cc__coins{display:flex}
.coin{
  width:34px;height:34px;flex:none;padding:0;border:0;border-radius:50%;cursor:pointer;background:var(--c);
  box-shadow:0 0 0 2px #fff,0 6px 12px -6px rgba(20,25,106,.5);
  transition:transform .6s var(--ease),box-shadow .6s var(--ease);-webkit-tap-highlight-color:transparent;
}
.coin+.coin{margin-inline-start:-7px}
.coin.is-on{transform:translateY(-8px);box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--c),0 12px 18px -8px rgba(20,25,106,.55)}
.coin:focus-visible{outline:2px solid var(--electric);outline-offset:4px}
.cf__info{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr;gap:10px 16px;align-items:center;border-top:1px solid var(--line);padding-top:18px}
.cf__dot{grid-row:span 2;width:48px;height:48px;border-radius:10px;background:var(--cur,#03195B);box-shadow:inset 0 0 0 1px rgba(20,25,106,.1);transition:background-color .6s var(--ease)}
.cf__txt{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;margin:0}
.cf__txt b{font:300 1.6rem/1.25 var(--f-display);color:#14196A}
.cf__txt span{font-size:.88rem;color:var(--ink-2)}
.cf__codes{display:flex;flex-wrap:wrap;gap:6px 26px;margin:0}
.cf__codes div{display:flex;gap:9px;align-items:baseline}
.cf__codes dt{font:500 10px/1 var(--f-text);letter-spacing:.14em;color:var(--mute)}
.cf__codes dd{margin:0;direction:ltr;font:400 .92rem/1 var(--f-text);font-variant-numeric:tabular-nums;color:#14196A}
.cf__hint{position:relative;z-index:2;margin-top:12px;font-size:.75rem;color:var(--mute)}

/* ---------------- 03 LOGO ---------------- */
.scene--logo .stage{background:var(--paper);align-items:stretch}
.lg__top{position:relative;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.lg__top .serif.gold{color:var(--gold)}
.lg__art{position:relative;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,2svh,22px)}
.lg__grid{
  position:absolute;inset:0;pointer-events:none;opacity:calc(1 - var(--p)*.55);
  background-image:linear-gradient(rgba(12,18,48,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(12,18,48,.07) 1px,transparent 1px);
  background-size:42px 42px;background-position:center;
  -webkit-mask:radial-gradient(62% 56% at 50% 50%,#000 20%,transparent 78%);mask:radial-gradient(62% 56% at 50% 50%,#000 20%,transparent 78%);
}
.lg__cross{position:absolute;width:15px;height:15px;pointer-events:none;opacity:.5}
.lg__cross::before,.lg__cross::after{content:"";position:absolute;background:var(--ink)}
.lg__cross::before{left:0;right:0;top:7px;height:1px}
.lg__cross::after{top:0;bottom:0;left:7px;width:1px}
.lg__cross--a{top:7%;right:2%}.lg__cross--b{top:7%;left:2%}.lg__cross--c{bottom:7%;right:2%}.lg__cross--d{bottom:7%;left:2%}
.lg__svg{position:relative;z-index:2;width:min(92%,560px,calc(46svh*1.31));height:auto;overflow:visible;filter:drop-shadow(0 28px 28px rgba(25,37,83,.14))}
.lg__ghost{filter:grayscale(1);opacity:.1}
.lg__shine{fill:url(#lg-glint);opacity:0;pointer-events:none}
.lg__name{position:relative;z-index:2;text-align:center;display:grid;gap:2px;opacity:var(--no,0);transform:translateY(calc((1 - var(--no,0))*18px))}
.lg__name strong{font:600 clamp(1.25rem,5.2vw,1.8rem)/1.4 var(--f-display);color:var(--navy)}
.lg__name span{font-size:.88rem;color:var(--ink-2)}
.lg__foot{position:relative;z-index:3;width:100%}
/* a brand-book strip: each column draws its hairline as that stage of the logo comes together */
.lg__steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:min(100%,780px);margin-inline:auto}
.lg__steps li{--f:0;display:grid;align-content:start;gap:6px;min-width:0}
.lg__bar{position:relative;display:block;height:1px;margin-bottom:8px;background:rgba(20,25,106,.14)}
.lg__bar::after{content:"";position:absolute;inset:-.5px 0;background:#14196A;transform:scaleX(var(--f));transform-origin:right center}
.lg__meta{display:flex;align-items:center;justify-content:space-between;gap:8px;height:26px}
.lg__meta b{font:300 .78rem/1 var(--f-display);font-feature-settings:"tnum";direction:ltr;color:var(--mute);transition:color .5s}
.lg__spec{height:24px;width:auto;overflow:visible}
.lg__spec--c{height:20px}
.lg__spec .n,.lg__spec .g{fill:#CDD1E6;transition:fill .7s var(--ease)}
.lg__spec--c .n,.lg__spec--c .g{stroke:var(--paper);stroke-width:2.5}
.lg__steps strong{font:400 .95rem/1.35 var(--f-display);color:#9DA2C4;transition:color .5s}
.lg__steps span{font-size:.74rem;line-height:1.55;color:var(--mute);opacity:.7;transition:opacity .5s,color .5s}
.lg__steps li.is-on strong,.lg__steps li.is-done strong{color:#14196A}
.lg__steps li.is-on b{color:#14196A}
.lg__steps li.is-on span{opacity:1;color:var(--ink-2)}
.lg__steps li:is(.is-on,.is-done) .n{fill:#192553}
.lg__steps li:is(.is-on,.is-done) .g{fill:#B38942}

/* ---------------- 05 MARKETING (expanding cards) ---------------- */
.scene--market{background:var(--paper)}
.scene--market .stage{background:var(--paper)}
.mk__bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(20,25,106,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(20,25,106,.06) 1px,transparent 1px);
  background-size:56px 56px;background-position:center top;
  -webkit-mask:radial-gradient(90% 70% at 50% 25%,#000 25%,transparent 85%);mask:radial-gradient(90% 70% at 50% 25%,#000 25%,transparent 85%);
}
.mk__head{position:relative;z-index:2;display:grid;gap:12px;justify-items:start}
.mk__head .accent{color:var(--electric)}
.mk__lead{max-width:28em;font-size:.94rem;color:var(--ink-2)}
.mk__cards{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px;margin-top:22px}
.mc{
  position:relative;flex:0 0 auto;min-height:0;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 0fr;column-gap:14px;
  padding:14px 18px;border-radius:18px;background:#fff;overflow:hidden;
  box-shadow:0 0 0 1px rgba(20,25,106,.07),0 22px 40px -36px rgba(20,25,106,.45);
  transition:flex-grow .9s var(--ease),grid-template-rows .9s var(--ease),row-gap .9s var(--ease);
}
.mc.is-on{flex:1 1 auto;grid-template-rows:auto 1fr;row-gap:14px}
.mc__num{grid-column:1;grid-row:1;align-self:center;direction:ltr;unicode-bidi:isolate;font:200 2.2rem/1 var(--f-display);color:#C3C6DD;font-feature-settings:"tnum";transition:color .6s}
.mc.is-on .mc__num{color:#14196A}
.mc__body{grid-column:2;grid-row:1;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:12px}
.mc__ico{grid-row:1;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#14196A;box-shadow:inset 0 0 0 1px rgba(20,25,106,.18)}
.mc__ico svg{width:18px;height:18px}
.mc h3{grid-row:1;font:400 1.2rem/1.35 var(--f-display);color:#14196A}
.mc p{grid-column:1/-1;max-height:0;opacity:0;overflow:hidden;font-size:.86rem;line-height:1.75;color:var(--ink-2);transition:max-height .9s var(--ease),opacity .6s,margin .9s var(--ease)}
.mc.is-on p{max-height:6em;opacity:1;margin-top:10px}
.mc__vis{grid-column:1/-1;grid-row:2;position:relative;min-height:0;overflow:hidden;border-radius:12px;background:linear-gradient(180deg,#F6F7FE,#ECEEFB)}
.mc__lines{position:absolute;inset:0;width:100%;height:100%}
.mc__lines path{fill:none;stroke:#1951FC;stroke-width:1;vector-effect:non-scaling-stroke}
.mc__lines g{transform:translateX(calc(var(--p,0)*-60px))}
.mv{position:absolute;inset:14px;display:grid;place-items:center;margin:0;color:#14196A;opacity:0;transform:translateY(10px);transition:opacity .7s var(--ease) .15s,transform .7s var(--ease) .15s}
.mc.is-on .mv{opacity:1;transform:none}
.mv small{position:absolute;inset-block-end:0;inset-inline-start:0;font-size:10.5px;color:var(--mute)}
.mv--rings span{position:absolute;left:50%;top:50%;height:var(--r);aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:1px solid rgba(25,81,252,.35);display:flex;justify-content:center;font-size:10.5px;line-height:1;padding-top:7px;color:#14196A;background:rgba(255,255,255,.35)}
.mv--rings span:first-child{background:#14196A;color:#fff;border:0;align-items:center;padding:0;font-size:11px}
.mv--quote{text-align:center}
.mv--quote q{quotes:"«" "»";font:600 clamp(1.25rem,5.2vw,1.7rem)/1.6 var(--f-serif);color:#14196A;max-width:14em}
.mv--calc{display:grid;align-content:center;place-items:stretch;gap:0;width:min(100%,280px);inset:14px auto 14px 50%;translate:-50% 0}
.mv--calc div{display:flex;justify-content:space-between;align-items:baseline;padding:9px 2px;border-bottom:1px solid rgba(20,25,106,.12)}
.mv--calc dt{font-size:.82rem;color:var(--ink-2)}
.mv--calc dd{margin:0;font:300 1.5rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.mv--calc .sum{border-bottom:0}
.mv--calc .sum dt{color:#14196A;font-weight:500}
.mv--calc .sum dd{font-weight:400;color:var(--electric);font-size:1.9rem}
.mv--calc small{inset-inline-start:auto;inset-inline-end:0}
.mv--chart{place-items:stretch;align-content:center}
.mv--chart svg{width:100%;height:70%;overflow:visible}
.mv--chart .ax{stroke:rgba(20,25,106,.2);stroke-width:1;vector-effect:non-scaling-stroke;fill:none}
.mv--chart .ln{stroke:#1951FC;stroke-width:2;vector-effect:non-scaling-stroke;fill:none;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.6s var(--ease) .2s}
.mc.is-on .mv--chart .ln{stroke-dashoffset:0}
.mv--chart circle{fill:#1951FC}
.mv__x{display:flex;justify-content:space-between;margin-top:8px;font-size:10.5px;color:var(--mute)}

/* ---------------- 06 ROADMAP (ref 10: dashed circles + glass pills) ---------------- */
.scene--road{background:#050B1F;color:#fff}
.scene--road .stage{background:linear-gradient(180deg,#050B1F 0%,#07173C 62%,#0A2A66 100%);padding-inline:0}
.glow--bottom{inset:auto -30% -40% -30%;height:60%;background:radial-gradient(46% 50% at 50% 55%,rgba(96,170,255,.85),rgba(40,100,230,.35) 48%,transparent 74%)}
.rd__head{position:relative;z-index:3;padding-inline:var(--gutter);display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.rd__title{
  font:300 clamp(2.1rem,9vw,3.8rem)/1.2 var(--f-display);
  background:linear-gradient(180deg,#fff 20%,rgba(255,255,255,.4));-webkit-background-clip:text;background-clip:text;color:transparent;
  padding-bottom:.18em;margin-bottom:-.18em;
}
.rd__sub{max-width:23em;color:rgba(255,255,255,.62);font-size:.95rem}
.rd__view{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;align-items:center}
.rd__track{
  --rd:min(86vw,360px);--gap:26px;
  display:flex;gap:var(--gap);width:max-content;padding-inline-start:calc((100vw - var(--rd))/2);
  transform:translateX(calc(var(--tx,0)*1px));will-change:transform;
}
.rd__ring{
  position:relative;flex:none;width:var(--rd);aspect-ratio:1;border-radius:50%;
  border:1px dashed rgba(255,255,255,.28);opacity:.38;transform:scale(.9);
  transition:opacity .9s var(--ease),transform .9s var(--ease),border-color .9s;
}
.rd__ring.is-on{opacity:1;transform:none;border-color:rgba(255,255,255,.55)}
.rd__tag{position:absolute;top:11%;left:50%;translate:-50% 0;font-size:.82rem;color:rgba(255,255,255,.72);white-space:nowrap}
.rd__pills li{
  position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;display:flex;align-items:center;gap:9px;
  padding:10px 17px;border-radius:999px;font-size:.82rem;white-space:nowrap;color:#fff;
  background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;transform:translateY(12px) scale(.94);transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.rd__pills li::before{content:"";width:7px;height:7px;border-radius:50%;background:#fff;flex:none}
.rd__ring.is-on .rd__pills li{opacity:1;transform:none}
.rd__ring.is-on .rd__pills li:nth-child(1){transition-delay:.15s}
.rd__ring.is-on .rd__pills li:nth-child(2){transition-delay:.3s}
.rd__ring.is-on .rd__pills li:nth-child(3){transition-delay:.45s}
.rd__ring.is-on .rd__pills li:nth-child(4){transition-delay:.6s}
.rd__foot{position:relative;z-index:3;padding-inline:var(--gutter);display:grid;gap:14px;justify-items:center;text-align:center}
.rd__titles{position:relative;height:2.1em;width:100%}
.rd__titles h3{position:absolute;inset:0;font:300 1.5rem/1.5 var(--f-display);opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rd__titles h3.is-on{opacity:1;transform:none}
.rd__prog{display:flex;align-items:center;gap:12px;font-size:.8rem;color:rgba(255,255,255,.6);font-feature-settings:"tnum"}
.rd__prog b{color:#fff;font-weight:500}
.rd__prog i{display:block;width:120px;height:2px;border-radius:2px;background:rgba(255,255,255,.18);overflow:hidden}
.rd__prog s{display:block;height:100%;background:#fff;transform-origin:100% 50%;transform:scaleX(var(--bar,0))}

/* ---------------- desktop ---------------- */
@media (min-width:900px){
  .stage{padding-inline:max(var(--gutter),calc((100vw - 1200px)/2));padding-top:calc(var(--nav-h) + 56px)}
  /* idea: two columns */
  .scene--idea .stage{flex-direction:row;align-items:center;gap:clamp(60px,9vw,130px)}
  .id__left{flex:1;gap:36px}
  .id__list li{font-size:clamp(4rem,6.4vw,6.4rem)}
  .id__right{flex:1.1;margin-top:0;flex:1.1 1 0}
  .id__card{flex:none;height:min(60svh,500px);max-height:none;border-radius:20px}
  .sparks{width:min(64cqw,calc(100cqh - 34px),430px);gap:8px}
  .id__descs{min-height:6em;margin-top:22px}
  /* colors */
  .scene--colors .stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);grid-template-rows:auto auto auto;column-gap:80px;align-content:center;--d:min(34vw,440px,56svh)}
  .cf__head{grid-column:1;grid-row:1;padding-bottom:34px}
  .cf__info{grid-column:1;grid-row:2}
  .cf__hint{grid-column:1;grid-row:3}
  .cc{grid-column:2;grid-row:1/span 3}
  .coin{width:40px;height:40px}
  .cf__txt b{font-size:2.2rem}
  /* logo */
  .lg__svg{width:min(80%,680px,calc(44svh*1.31))}
  .lg__art{gap:14px}
  .lg__steps{gap:28px}
  .lg__meta{height:32px}
  .lg__spec{height:30px}
  .lg__spec--c{height:24px}
  .lg__steps strong{font-size:1.1rem}
  .lg__steps span{font-size:.82rem}
  /* market */
  .mk__head{max-width:640px}
  .mk__cards{flex:none;flex-direction:row;height:min(54svh,470px);gap:12px;margin-top:40px}
  .mc,.mc.is-on{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:22px}
  .mc{flex:1 1 0;min-width:0}
  .mc.is-on{flex:2.7 1 0}
  .mc__num{font-size:3.6rem}
  .mc__vis{flex:0 0 0;opacity:0;transition:flex-grow .9s var(--ease),opacity .6s}
  .mc.is-on .mc__vis{flex:1 1 auto;opacity:1}
  .mc__body{grid-template-columns:1fr;row-gap:12px}
  .mc__ico{grid-row:auto}
  .mc h3{grid-row:auto;font-size:1.35rem}
  .mc p{grid-column:auto}
  .mc.is-on p{margin-top:0}
  /* road */
  .rd__track{--rd:min(34vw,430px);--gap:40px}
  .rd__pills li{font-size:.9rem;padding:11px 19px}
}
@media (max-height:720px) and (max-width:899px){
  .stage{padding-top:calc(var(--nav-h) + 24px)}
  .id__list li{font-size:clamp(2.1rem,min(10vw,7svh),3.4rem)}
  .id__card{min-height:120px;max-height:32svh}
  .sparks{width:min(50cqw,calc(100cqh - 30px),280px);gap:5px}
  .id__descs{min-height:4.8em;margin-top:10px}
  .id__descs p{font-size:.9rem}
  .mk__head .h-md{font-size:1.5rem}
  .mk__lead{display:none}
  .scene--colors .stage{--d:min(56vw,30svh)}
  .lg__top .h-md{font-size:1.35rem}
  .lg__steps span{display:none}
  .rd__title{font-size:1.7rem}
  .rd__sub{display:none}
}

/* ---------------- reduced motion: show every final state, no pinning ---------------- */
.static .scene{height:auto}
.static .stage{position:relative;height:auto;min-height:100svh}
.static .id__descs{min-height:0}
.static .id__descs p{position:relative;inset:auto;opacity:1;transform:none;margin-bottom:8px}
.static .mc{grid-template-rows:auto 180px;row-gap:14px}
.static .mc p{max-height:none;opacity:1;margin-top:10px}
.static .mv{opacity:1;transform:none}
.static .mc__vis{flex:none;height:180px;opacity:1}
.static .rd__track{flex-direction:column;align-items:center;width:auto;padding:0;transform:none}
.static .rd__ring{opacity:1;transform:none}
.static .rd__pills li{opacity:1;transform:none}