/* Direction D options for the two figure bands (src/opts_d.py). One KPI band and one valuation section show at a time,
   picked by the kpi-N / growth-N classes the inline script puts on <html>. Figures light, fill or focus; they never count. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.kv,.gv{display:none}
.kpi-1 .kv1,.kpi-2 .kv2,.kpi-3 .kv3,.kpi-4 .kv4,.growth-1 .gv1,.growth-2 .gv2,.growth-3 .gv3,.growth-4 .gv4{display:block}

/* ---------------------------------------------------------------- KPI bands */
.kv-sec{position:relative;background:#05060a}
.kpi-2 .kv-sec{background:#f4f1ec;border-bottom:1px solid #e3ddd3}
.kpi-3 .kv-sec{background:#00667f}
.kv-track{display:flex;width:max-content;animation:kvmarq 72s linear infinite}
@keyframes kvmarq{to{transform:translateX(-50%)}}
.kv-set{list-style:none;margin:0;padding:0;display:flex;align-items:center;flex:none}
.kv-sec:hover .kv-track,.kv-sec:focus-within .kv-track,.kv-sec.is-paused .kv-track{animation-play-state:paused}
.kv-btn{position:absolute;right:14px;top:50%;margin-top:-22px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(5,6,10,.7);color:#fff;display:grid;place-items:center;cursor:pointer;z-index:4;backdrop-filter:blur(6px)}
.kv-btn svg{width:14px;height:14px}
.kv-sec{--cap:#05060a}.kpi-2 .kv-sec{--cap:#f4f1ec}.kpi-3 .kv-sec{--cap:#00667f}
.kv-sec::after{content:"";position:absolute;right:0;top:1px;bottom:1px;width:84px;z-index:3;pointer-events:none;background:linear-gradient(90deg,transparent,var(--cap) 45%)}
.kv-btn .i-play,.is-paused .kv-btn .i-pause{display:none}.is-paused .kv-btn .i-play{display:block}
.kpi-2 .kv-btn{background:#fff;color:#193d5b;border-color:#ddd5c9}
.kpi-3 .kv-btn{background:rgba(25,61,91,.8)}

/* 1 · tower ribbon: the Nasdaq tower's LED board */
.led{position:relative;overflow:hidden;padding:24px 0;background:radial-gradient(50% 160% at 50% 50%,rgba(212,224,95,.07),transparent 70%),#05060a;
  border-top:1px solid rgba(212,224,95,.18);border-bottom:1px solid rgba(212,224,95,.18)}
.led::before,.led::after{content:"";position:absolute;top:0;bottom:0;width:12%;z-index:2;pointer-events:none}
.led::before{left:0;background:linear-gradient(90deg,#05060a,transparent)}.led::after{right:0;background:linear-gradient(270deg,#05060a,transparent)}
.kv1 li{position:relative;display:flex;align-items:center;gap:14px;padding:0 46px}
.kv1 li::after{content:"";position:absolute;right:-3px;top:50%;width:5px;height:5px;margin-top:-2.5px;background:#d4e05f;transform:rotate(45deg);opacity:.5}
.kv1 b{font:400 38px/1 var(--fh);letter-spacing:.01em;white-space:nowrap;font-variant-numeric:tabular-nums;
  color:color-mix(in srgb,#e4ef7a calc(var(--sp,0) * 100%),#eef1e9);
  text-shadow:0 0 calc(4px + var(--sp,0) * 20px) rgba(212,224,95,calc(.18 + var(--sp,0) * .6))}
.kv1 small{font:600 12px/1 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:#d4e05f;margin-right:-6px}
.kv1 li > span{font:500 12px/1.3 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:#aab6c6;max-width:150px}
.led-mesh{display:none}
.kv1 b{-webkit-mask-image:radial-gradient(circle,#000 1.2px,rgba(0,0,0,.28) 1.7px);mask-image:radial-gradient(circle,#000 1.2px,rgba(0,0,0,.28) 1.7px);-webkit-mask-size:4px 4px;mask-size:4px 4px}
.led-sweep{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.05) 48%,rgba(212,224,95,.09) 50%,transparent 60%);transform:translateX(-100%);animation:ledsweep 7s cubic-bezier(.5,0,.5,1) infinite}
@keyframes ledsweep{to{transform:translateX(100%)}}
@media (max-width:760px){.led{padding:18px 0}.kv1 li{padding:0 30px;gap:10px}.kv1 b{font-size:30px}.kv1 li > span{font-size:12px;max-width:118px;letter-spacing:.08em}}

/* 2 · index rail: an annual-report row; the lime bar steps through the figures */
.ix{position:relative;list-style:none;margin:0;padding:24px 60px 22px 0;display:grid;grid-template-columns:repeat(10,minmax(0,1fr))}
.ix li{position:relative;display:flex;flex-direction:column;gap:6px;padding:2px 18px 16px;border-left:1px solid #ddd5c9;transition:opacity .45s}
.ix li:first-child{border-left:0;padding-left:0}
.ix b{font:400 clamp(20px,1.7vw,28px)/1 var(--fh);color:#193d5b;white-space:nowrap;transition:color .45s;font-variant-numeric:tabular-nums}
.ix small{font:600 12px/1 var(--fb);letter-spacing:.1em;text-transform:uppercase;color:#00667f;margin-bottom:-2px}
.ix li > span{font-size:13px;line-height:1.35;color:#5b6472}
.ix-bar{position:absolute;left:18px;right:18px;bottom:0;height:2px;background:#e6dfd4;overflow:hidden}
.ix li:first-child .ix-bar{left:0}
.ix-bar::after{content:"";position:absolute;inset:0;background:#00667f;transform:scaleX(0);transform-origin:left}
.ix li.on .ix-bar::after{transform:scaleX(1);transition:transform var(--ixd,2.8s) linear}
.ix li.on b{color:#00667f}
.ix.is-live li:not(.on){opacity:.66}
@media (max-width:1100px){
  .ix{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-right:0}
  .ix::-webkit-scrollbar{display:none}
  .ix li{flex:0 0 30%;scroll-snap-align:start}
}
@media (max-width:1100px){.ix{padding-right:84px;scroll-padding-left:0}}
@media (max-width:760px){.ix li{flex-basis:56%;padding-bottom:12px;gap:4px}.ix{padding-top:16px;padding-bottom:14px}.ix b{font-size:26px}}

/* 3 · ring chips: RAD's rings as icons in glass chips */
.kv-view{overflow:hidden;padding:20px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.kv3 .kv-set{gap:18px;padding-right:18px}
.chip{display:flex;align-items:center;gap:14px;padding:9px 24px 9px 9px;border-radius:999px;
  background:linear-gradient(140deg,rgba(25,61,91,.95),rgba(18,13,31,.8));
  border:1px solid rgba(112,205,220,calc(.2 + var(--sp,0) * .55));
  box-shadow:0 12px 28px -16px rgba(0,0,0,.6),0 0 calc(var(--sp,0) * 34px) rgba(112,205,220,calc(var(--sp,0) * .5));
  transform:translateY(calc(var(--sp,0) * -3px)) scale(calc(1 + var(--sp,0) * .04))}
.chip-ring{position:relative;width:56px;height:56px;flex:none}
.chip-ring svg{width:100%;height:100%;overflow:visible;display:block}
.cr-base{fill:rgba(0,0,0,.28);stroke:rgba(112,205,220,.28);stroke-width:1.5}
.cr-arc{fill:none;stroke:#70cddc;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:.24 .76;transform-box:fill-box;transform-origin:center;animation:crspin 5.5s linear infinite}
.chip:nth-child(2n) .cr-arc{animation-duration:7s;animation-delay:-2s}
.chip:nth-child(3n) .cr-arc{animation-delay:-4s}
@keyframes crspin{to{transform:rotate(1turn)}}
.cr-ico{fill:none;stroke:color-mix(in srgb,#d4e05f calc(var(--sp,0) * 100%),#ffffff);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.mo .kv3 .cr-ico{stroke-dashoffset:1;transition:stroke-dashoffset 1.4s cubic-bezier(.6,0,.2,1)}
.mo .kv3.in .cr-ico{stroke-dashoffset:0}
.kv3 .chip .chip-t{display:flex;flex-direction:column;align-items:flex-start}
.kv3 .chip-t small{display:block}
.chip-t b{font:400 26px/1 var(--fh);color:#fff;white-space:nowrap}
.chip-t small{font:600 12px/1 var(--fb);letter-spacing:.1em;text-transform:uppercase;color:#cfe9ee;margin-bottom:3px}
.chip-t > span{font-size:12.5px;line-height:1.3;color:#cfe3ea;margin-top:4px;white-space:nowrap}
@media (max-width:760px){.kv-view{padding:16px 0}.chip{padding:7px 18px 7px 7px;gap:10px}.chip-ring{width:46px;height:46px}.chip-t b{font-size:22px}}

@media (prefers-reduced-motion:reduce){
  .kv-track{animation:none}.led,.kv-view{overflow-x:auto}.kv-track .kv-set + .kv-set,.kv-set li:nth-child(n+9){display:none}
  .led-sweep,.kv-btn{display:none}.cr-arc{animation:none;stroke-dasharray:none}
}

/* ---------------------------------------------------------------- valuation sections: pinned, scrubbed by the scroll */
.gv-sec{background:#05060a;color:#fff;--hdr:63px}
@media (max-width:1023px){.gv-sec{--hdr:55px}}
.gv{position:relative;height:260vh}
.gv-stage{position:sticky;top:var(--hdr);height:calc(100vh - var(--hdr));height:calc(100svh - var(--hdr));display:flex;align-items:center;overflow:hidden}
.gv .dh{font-size:clamp(28px,3.2vw,44px);color:#fff;max-width:none;margin:0}
.g-anchor{display:grid;gap:4px;margin:0}
.g-anchor span{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#e9ecf1}
.g-anchor b{font-weight:400;font-size:16px;color:#b9c2cf}
.g-axis{display:flex;justify-content:space-between;margin-top:10px;font-size:12px;color:#748093;font-variant-numeric:tabular-nums}
.g-axis span{transition:color .35s}.g-axis span.lit{color:#d4e05f}
.gv-legend{font-size:12px;line-height:1.45;color:#8a95a6;max-width:880px;margin:16px 0 0}
.gx-grid line{stroke:rgba(255,255,255,.07);stroke-width:1;vector-effect:non-scaling-stroke}
.gx-line{stroke-dasharray:1;stroke-dashoffset:0}
.gx-head{position:absolute;z-index:3;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;opacity:0;
  box-shadow:0 0 0 4px rgba(212,224,95,.35),0 0 24px 6px rgba(212,224,95,.55);pointer-events:none}

/* 1 · LED board */
.gv1 .gv-stage{background:radial-gradient(70% 60% at 50% 70%,rgba(212,224,95,.05),transparent 70%),#040509}
.g1-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;margin-bottom:22px}
.g1-board{position:relative;height:min(46vh,420px);border-radius:14px;background:#020306;border:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 60px rgba(0,0,0,.8),0 40px 90px -50px rgba(212,224,95,.3);overflow:hidden}
.g1-cv{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.g1-glare{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 28%),linear-gradient(90deg,rgba(255,255,255,.025),transparent 20%,transparent 80%,rgba(255,255,255,.025))}
.g1-v{position:absolute;font:600 13px var(--fb);color:#e9ecf1;opacity:0;transition:opacity .4s;white-space:nowrap}
.g1-v2{color:#d4e05f}.g1-v.on{opacity:1}
@media (max-width:760px){.g1-board{height:32vh;min-height:220px}.g1-top{margin-bottom:16px}}

/* 2 · numeral scrub */
.gv2 .gv-stage{background:radial-gradient(70% 80% at 70% 45%,rgba(25,61,91,.75),transparent 70%),#07080f}
.g2-stack{display:grid;position:relative;margin-top:14px}
.g2-num,.g2-plot{grid-area:1/1}
.g2-num{position:relative;font:400 clamp(70px,15vw,230px)/.95 var(--fh);letter-spacing:-.035em;white-space:nowrap;align-self:center;justify-self:start}
.g2-num i{font-style:normal;font-size:.4em;vertical-align:1em;margin-left:.04em}
.g2-out{color:transparent;-webkit-text-stroke:1.2px rgba(212,224,95,.32)}
.g2-fill{position:absolute;inset:0;color:#d4e05f;clip-path:inset(-10% calc(100% - var(--fx,0px)) -10% 0);text-shadow:0 0 50px rgba(212,224,95,.22)}
.g2-plot{position:relative;min-height:160px}
.g2-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;max-width:none}
.g2-meta{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-top:18px;flex-wrap:wrap}
.g2-meta{flex-direction:column-reverse;align-items:stretch;gap:18px;margin-top:10px}
.g2-meta .g-axis{max-width:none;margin:0}
@media (max-width:760px){.g2-meta .g-axis{max-width:none}}

/* 3 · milestone camera */
.gv3{height:320vh}
.gv3 .gv-stage{background:linear-gradient(160deg,#0c0b18 0%,#132640 60%,#193d5b 100%)}
.g3-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap}
.g3-fig{position:absolute;left:22px;top:18px;z-index:4;display:flex;align-items:flex-end;gap:14px;opacity:0;transition:opacity .6s ease;pointer-events:none}
.g3-fig.on{opacity:1}
.g3-fig > b{font:400 clamp(36px,4.2vw,64px)/1 var(--fh);color:#d4e05f;letter-spacing:-.02em}
@media (max-width:760px){.g3-fig{left:14px;top:12px;flex-direction:column;align-items:flex-start;gap:6px}.g3-fig .g-anchor span{font-size:12px}.g3-fig .g-anchor b{font-size:13px}}
.g3-fig > b i{font-style:normal;font-size:.5em;vertical-align:.6em}
.g3-body{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:28px;margin-top:22px;align-items:stretch}
.g3-cards{position:relative;list-style:none;margin:0;padding:0;min-height:170px}
.g3-ms{position:absolute;inset:0 0 auto 0;opacity:0;transition:opacity .45s ease}
.g3-ms.on{opacity:1}
.g3-ms b{display:block;font:400 46px/1 var(--fh);color:#d4e05f}
.g3-ms p{font-size:17px;line-height:1.45;color:#e6eaf0;margin:12px 0 0}
.g3-view{position:relative;height:min(44vh,380px);border-radius:16px;overflow:hidden;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.08)}
.g3-cam{position:absolute;inset:0;transform-origin:0 0;will-change:transform;--cs:1}
.g3-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;max-width:none}
.g3-pin{position:absolute;z-index:2;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;border:2px solid #d4e05f;background:#0b1626;opacity:.35;
  transform:scale(calc(1 / var(--cs)));transition:opacity .3s,background .3s,box-shadow .3s}
.g3-pin.on{opacity:1;background:#d4e05f;box-shadow:0 0 0 6px rgba(212,224,95,.18)}
.g3-cam .gx-head{transform:scale(calc(1 / var(--cs)))}
.g3-yr{position:absolute;right:18px;bottom:6px;font:400 clamp(48px,7vw,96px)/1 var(--fh);color:rgba(255,255,255,.07);pointer-events:none;font-variant-numeric:tabular-nums}
.g3-axis{margin-left:calc(min(320px,100%) + 28px)}
@media (max-width:900px){.g3-body{grid-template-columns:1fr;gap:14px}.g3-cards{min-height:118px}.g3-ms b{font-size:32px}.g3-ms p{font-size:15px;margin-top:6px}
  .g3-view{height:30vh;min-height:200px}.g3-axis{margin-left:0}}

@media (prefers-reduced-motion:reduce){
  .gv,.gv3{height:auto}.gv-stage{position:static;height:auto;padding:72px 0}
}
@media (max-width:760px){.gv-legend{font-size:12px;margin-top:12px}}

/* ---------------------------------------------------------------- 4 · LED ticker: a fixed dot board, figures stepped across it */
.kpi-4 .kv-sec{background:#030406;--cap:#030406}
.tick{position:relative;height:80px;background:linear-gradient(180deg,#07090d,#020305);border-top:1px solid rgba(112,205,220,.16);border-bottom:1px solid rgba(112,205,220,.16);
  box-shadow:inset 0 10px 24px -14px rgba(0,0,0,.9),inset 0 -10px 24px -14px rgba(0,0,0,.9)}
.tick-disc{margin:0;padding:8px var(--dg) 9px;font-size:12px;line-height:1.4;color:#8f9cb0;text-align:center;background:#030406}
.tick-disc b{color:#c9d2de;font-weight:600}
.kpi-4 .kv-sec::after{bottom:auto;height:80px}
.kpi-4 .kv-btn{top:40px}
@media (max-width:760px){.kpi-4 .kv-sec::after{height:64px}.kpi-4 .kv-btn{top:32px}.tick-disc{text-align:left}}
.tick-cv{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block}
.tick-glare{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.045),transparent 42%),
  linear-gradient(90deg,#030406,transparent 5%,transparent 95%,#030406)}
@media (max-width:760px){.tick{height:64px}}
@media (prefers-reduced-motion:reduce){.kpi-4 .kv4{display:none}.kpi-4 .kv2{display:block}.kpi-4 .kv-sec{background:#f4f1ec;--cap:#f4f1ec}}

/* ---------------------------------------------------------------- 4 · editorial rings: the numeral scrub in radintel.ai's ring style */
.gv4 .gv-stage{background:radial-gradient(80% 90% at 75% 30%,rgba(112,205,220,.22),transparent 60%),radial-gradient(60% 70% at 10% 100%,rgba(25,61,91,.6),transparent 70%),#00667f}
.g4 .dh .acc{color:#bdeef6}
.g4 .g-anchor span{color:#fff}.g4 .g-anchor b{color:#d6eef3}
.g4 .g-axis{color:#cdeef4}.g4 .g-axis span.lit{color:#fff}
.g4 .gv-legend{color:#d6eef3}
.g4 .g2-out{-webkit-text-stroke:1.2px rgba(255,255,255,.34)}
.g4 .g2-fill{color:transparent;text-shadow:none;filter:drop-shadow(0 10px 30px rgba(18,13,31,.35))}
.g4 .gx-grid line{stroke:rgba(255,255,255,.12)}
.g4-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;max-width:none}
.g4-svg .gx-line{stroke:#fff;filter:drop-shadow(0 0 6px rgba(112,205,220,.9))}
.g4-svg stop:first-child{stop-color:#193d5b;stop-opacity:.7}.g4-svg stop:last-child{stop-color:#193d5b;stop-opacity:0}
.g4 .gx-head{background:#fff;box-shadow:0 0 0 4px rgba(112,205,220,.45),0 0 26px 8px rgba(112,205,220,.7)}
.g4-node{position:absolute;z-index:2;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:#193d5b;border:2px solid rgba(112,205,220,.45);
  transition:border-color .35s,box-shadow .35s,transform .35s cubic-bezier(.2,.9,.3,1.4);transform:scale(.7)}
.g4-node:first-child{margin-left:-4px}.g4-end{margin-left:-14px}
.g4-node.on{border-color:#fff;transform:none;box-shadow:0 0 0 3px rgba(112,205,220,.35),0 0 18px rgba(112,205,220,.7),inset 0 0 8px rgba(112,205,220,.6)}
.g4-node > i{position:absolute;inset:-2px;border-radius:50%;border:2px solid #70cddc;opacity:0}
.g4-node.on > i{animation:ringout 3.2s ease-out infinite}.g4-node.on > i + i{animation-delay:1.6s}
.g4-end{width:28px;height:28px;margin-top:-14px}
.g4-v{position:absolute;font:600 13px var(--fb);color:#fff;white-space:nowrap;opacity:0;transition:opacity .4s;background:#193d5b;border:1px solid rgba(112,205,220,.5);padding:3px 9px;border-radius:999px}
.g4-v1{left:0;bottom:calc(20 / 220 * 100% + 18px)}
.g4-v2{right:-6px;top:calc(16 / 220 * 100% - 44px)}
.g4-v.on{opacity:1}
/* the beat at the end: the finished numeral catches one light pass while the section holds */
.g4 .g2-fill{background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,1) 50%,transparent 60%) -150% 0/60% 100% no-repeat,linear-gradient(to top left,#aeb3b7,#eef0f1 62%);
  -webkit-background-clip:text;background-clip:text}
.gv4.done .g2-fill{animation:g4shine 1.5s cubic-bezier(.4,0,.2,1) .2s 1 both}
@keyframes g4shine{to{background-position:260% 0,0 0}}
@media (prefers-reduced-motion:reduce){.g4-node > i{display:none}.gv4.done .g2-fill{animation:none}}
