/* Quantprima - corporate site
   tokens · base · chrome · homepage chapters · shared components */

:root{
  --bg:#05070c;
  --bg-2:#080b12;
  --bg-3:#0d1119;
  --surface:#0c1018;
  --surface-hover:#111725;
  --glass:rgba(16,22,34,.58);
  --text:#eef1f5;
  --muted:#a2abb8;
  --dim:#8b93a0;
  --border:rgba(255,255,255,.08);
  --border-active:rgba(255,255,255,.18);
  --brand-accent:#c6cfda;

  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --gutter:clamp(20px,5vw,64px);
  --max:1240px;
  --rule:1px solid var(--border);
  --ease:cubic-bezier(.22,.68,.32,1);
}

*,*::before,*::after{box-sizing:border-box}
:root{--scale:1;--fab:46px}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:calc(16px * var(--scale))}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);
  font-size:calc(17px * var(--scale));line-height:1.6;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.032em;line-height:1.06}
p{margin:0}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid #7fb2ff;outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;padding:12px 18px;background:var(--text);color:#000;z-index:100}
.skip:focus{left:12px;top:12px}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:70;pointer-events:none}
.progress i{display:block;height:100%;width:0;
  background:linear-gradient(90deg,#5b8cd6,#cfe0f8);box-shadow:0 0 12px rgba(150,195,255,.6)}
.totop{position:fixed;right:clamp(16px,3vw,28px);z-index:65;
  bottom:calc(clamp(16px,3vw,28px) + env(safe-area-inset-bottom,0px));
  width:var(--fab);height:var(--fab);box-sizing:border-box;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  border:1px solid rgba(255,255,255,.14);color:#dbe6f5;
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02)),rgba(10,14,22,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 34px rgba(0,0,0,.5);
  opacity:0;transform:translateY(12px) scale(.9);pointer-events:none;
  transition:opacity .4s var(--ease),transform .4s var(--ease),border-color .3s var(--ease)}
.totop.on{opacity:1;transform:none;pointer-events:auto}
.totop:hover{border-color:rgba(255,255,255,.3)}
.totop svg{width:19px;height:19px}

/* ---------- layout ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);position:relative;z-index:1}
section{position:relative}
.band{padding:clamp(66px,9vw,116px) 0}
.band--tight{padding:clamp(50px,7vw,84px) 0}
.bg-1{background:var(--bg)}
.bg-2{background:var(--bg-2)}
.bg-3{background:var(--bg-3)}
.edge{position:relative}
.edge::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16) 22%,rgba(255,255,255,.16) 78%,transparent)}

.h1{font-size:clamp(2.1rem,4.6vw,3.5rem);font-weight:640}
.h2{font-size:clamp(1.85rem,4vw,3rem);font-weight:620}
.h3{font-size:clamp(1.2rem,2vw,1.5rem);font-weight:600;letter-spacing:-.026em}
.lede{font-size:clamp(1.02rem,1.5vw,1.22rem);color:var(--muted);line-height:1.5;max-width:56ch}
.body{color:var(--muted);max-width:62ch}
.body + .body{margin-top:1em}
.tick{font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;color:var(--dim);text-transform:uppercase}
.head{max-width:64ch;margin-bottom:clamp(28px,4vw,46px)}
.head .lede{margin-top:16px}

.link{display:inline-flex;align-items:center;gap:.5em;color:var(--text);font-weight:500;
  border-bottom:1px solid var(--border-active);padding-bottom:2px;transition:border-color .25s var(--ease)}
.link svg{transition:transform .3s var(--ease)}
.link:hover{border-color:var(--brand-accent)}
.link:hover svg{transform:translateX(4px)}
.btn{display:inline-flex;align-items:center;gap:.55em;padding:13px 22px;border-radius:100px;
  border:1px solid var(--border-active);font-weight:520;font-size:.97rem;
  transition:background .28s var(--ease),border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease)}
.btn svg{transition:transform .3s var(--ease)}
.btn:hover{border-color:rgba(255,255,255,.4);transform:translateY(-1px)}
.btn:hover svg{transform:translateX(3px)}
.btn--solid{background:var(--text);color:#07080a;border-color:var(--text)}
.btn--solid:hover{background:#fff;border-color:#fff;box-shadow:0 6px 34px rgba(200,220,255,.22)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn[disabled]:hover{transform:none;border-color:var(--border-active);box-shadow:none}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.tag{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
  border:1px solid var(--border);border-radius:100px;padding:5px 11px;white-space:nowrap}
.ticks{margin:0;padding:0;list-style:none;display:grid;gap:0}
.ticks li{position:relative;padding:11px 0 11px 24px;border-bottom:var(--rule);color:var(--muted);font-size:.96rem}
.ticks li:first-child{border-top:var(--rule)}
.ticks li::before{content:"";position:absolute;left:2px;top:19px;width:6px;height:6px;border-radius:50%;
  background:var(--brand-accent);opacity:.7}
.sep{margin-top:26px;padding-top:20px;border-top:1px solid var(--border-active);
  font-size:1.02rem;color:var(--text);line-height:1.5;letter-spacing:-.015em}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:60;transition:background .4s var(--ease),backdrop-filter .4s}
.hdr::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:transparent;transition:background .4s var(--ease)}
.hdr.is-stuck{background:rgba(5,6,8,.74);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%)}
.hdr.is-stuck::after{background:var(--border)}
/* With the drawer open the page never scrolls, so .is-stuck never fired and the
   header sat transparent while drawer rows slid behind the logo. Give it the
   same treatment the stuck header already uses, hairline included, so the edge
   reads as a header rather than an accident. */
body.menu-open .hdr{background:#05060a;backdrop-filter:none;-webkit-backdrop-filter:none}
body.menu-open .hdr::after{background:var(--border)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:84px}
.hdr__logo img{width:auto;height:38px;opacity:1;transition:height .3s var(--ease)}
.nav{display:flex;align-items:center;gap:clamp(10px,1.6vw,22px)}
.navlink{position:relative;font-size:.93rem;color:var(--muted);padding:8px 2px;
  transition:color .25s var(--ease)}
.navlink span{position:relative;display:block}
/* underline draws out from the centre */
.navlink span::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;
  background:linear-gradient(90deg,transparent,var(--text),transparent);
  transform:scaleX(0);transform-origin:center;
  transition:transform .38s cubic-bezier(.3,.8,.3,1)}
.navlink:hover{color:var(--text)}
.navlink:hover span::after{transform:scaleX(1)}
.navlink[aria-current=page]{color:var(--text)}
.navlink[aria-current=page] span::after{transform:scaleX(1);
  background:linear-gradient(90deg,transparent,#9fc4ff,transparent);
  box-shadow:0 0 10px rgba(140,190,255,.6)}

/* the one action in the bar */
.navcta{position:relative;overflow:hidden;font-size:.9rem;font-weight:520;color:var(--text);
  border:1px solid rgba(255,255,255,.16);border-radius:100px;padding:9px 20px;margin-left:6px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease)}
.navcta span{position:relative;z-index:1;display:inline-flex;align-items:center;gap:.5em}
.navcta svg{transition:transform .35s var(--ease)}
.navcta:hover svg{transform:translateX(3px)}
.navcta::before{content:"";position:absolute;top:0;bottom:0;width:40%;left:-50%;z-index:0;
  background:linear-gradient(100deg,transparent,rgba(190,220,255,.3),transparent);
  filter:blur(6px);will-change:transform;transition:transform .55s var(--ease)}
.navcta:hover{border-color:rgba(160,205,255,.5);transform:translateY(-1px);
  box-shadow:0 6px 22px rgba(0,0,0,.4),0 0 26px rgba(120,175,255,.28)}
.navcta:hover::before{transform:translateX(425%)}
.navcta[aria-current=page]{border-color:rgba(160,205,255,.55);
  box-shadow:0 0 22px rgba(120,175,255,.26)}
.burger{display:none;width:40px;height:40px;margin-right:-8px;align-items:center;justify-content:center;
  background:none;border:0;cursor:pointer}
.burger span{display:block;width:19px;height:1.5px;background:var(--text);position:relative;transition:background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:19px;height:1.5px;background:var(--text);transition:transform .3s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
body.menu-open .burger span{background:transparent}
body.menu-open .burger span::before{transform:translateY(6px) rotate(45deg)}
body.menu-open .burger span::after{transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:55;overflow-x:hidden;overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:radial-gradient(120% 70% at 82% 2%,#0d1524 0%,rgba(5,6,8,.99) 58%),rgba(5,6,8,.99);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  padding:calc(70px + env(safe-area-inset-top)) var(--gutter) calc(26px + env(safe-area-inset-bottom));
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transition:opacity .32s var(--ease),visibility .32s}
body.menu-open .drawer{opacity:1;visibility:visible}
.drawer__glow{position:fixed;top:-24%;right:-28%;width:min(560px,120%);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle,rgba(110,165,255,.22),rgba(96,150,235,.05) 42%,transparent 68%);
  opacity:0;transform:scale(.9);transition:opacity 1s var(--ease) .1s,transform 1.4s var(--ease) .1s}
body.menu-open .drawer__glow{opacity:1;transform:none}

.dnav{position:relative;display:flex;flex-direction:column;margin:auto 0;padding-left:24px}
/* a rail that draws down as the menu opens, with a node beside every row */
.dnav::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(150,190,255,.55) 12%,rgba(150,190,255,.55) 88%,transparent);
  transform:scaleY(0);transform-origin:top;
  transition:transform .9s cubic-bezier(.3,.75,.3,1) .1s}
body.menu-open .dnav::before{transform:scaleY(1)}
.dlink{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:0 18px;padding:17px 2px 17px 0;border-bottom:1px solid rgba(255,255,255,.07);
  opacity:0;transform:translateX(22px);
  transition:opacity .45s var(--ease),transform .5s var(--ease),
             background .3s var(--ease),padding-left .3s var(--ease)}
.dlink:first-child{border-top:1px solid rgba(255,255,255,.07)}
body.menu-open .dlink{opacity:1;transform:none;
  transition-delay:calc(var(--i) * 55ms + 90ms),calc(var(--i) * 55ms + 90ms),0s,0s}
.dlink__i{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;color:var(--dim);
  align-self:start;padding-top:9px;transition:color .3s var(--ease)}
.dlink__t{display:block;font-size:1.6rem;font-weight:580;letter-spacing:-.035em;line-height:1.1}
.dlink__d{display:block;margin-top:4px;font-size:.82rem;color:var(--dim);letter-spacing:.01em}
.dlink__a{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--dim);
  border:1px solid rgba(255,255,255,.09);
  transition:transform .35s var(--ease),color .3s var(--ease),border-color .3s var(--ease),
             background .3s var(--ease)}
.dlink:active{background:linear-gradient(90deg,rgba(120,175,255,.09),transparent 70%);padding-left:10px}
.dlink:active .dlink__a{transform:translateX(3px);color:var(--text);border-color:rgba(160,205,255,.4);
  background:rgba(120,175,255,.12)}
.dlink[href="/contact/"]{border-bottom:0}
.dlink[href="/contact/"] .dlink__a{color:var(--text);border-color:rgba(160,205,255,.45);
  background:linear-gradient(180deg,rgba(150,195,255,.18),rgba(150,195,255,.05))}
.dlink.is-here .dlink__i{color:#9fc4ff}
.dlink.is-here .dlink__t{color:#fff}
.dlink::before{content:"";position:absolute;left:-22px;top:50%;width:7px;height:7px;border-radius:50%;
  background:rgba(150,190,255,.35);transform:translate(0,-50%) scale(.4);opacity:0;
  transition:opacity .4s var(--ease),transform .5s cubic-bezier(.3,1.5,.5,1),
             background .3s var(--ease),box-shadow .3s var(--ease)}
body.menu-open .dlink::before{opacity:1;transform:translate(0,-50%) scale(1);
  transition-delay:calc(var(--i) * 55ms + 260ms)}
.dlink.is-here::before{width:11px;height:11px;left:-24px;background:#cfe4ff;
  box-shadow:0 0 10px #fff,0 0 26px rgba(150,205,255,.95)}

.dcta{display:flex;align-items:center;justify-content:center;gap:.6em;margin-top:26px;
  padding:16px 22px;border-radius:100px;font-size:1rem;font-weight:560;letter-spacing:-.01em;
  color:#06080d;background:linear-gradient(180deg,#fff,#dfe8f5);
  box-shadow:0 10px 34px rgba(0,0,0,.5),0 0 34px rgba(150,195,255,.28);
  opacity:0;transform:translateY(12px);
  transition:opacity .5s var(--ease) .4s,transform .5s var(--ease) .4s}
body.menu-open .dcta{opacity:1;transform:none}
.dcta:active{transform:scale(.985)}
.dcta svg{transition:transform .3s var(--ease)}
.dcta:active svg{transform:translateX(3px)}
@media (max-height:680px){.dcta{margin-top:16px;padding:13px 20px;font-size:.94rem}}
@media (prefers-reduced-motion:reduce){.dcta{opacity:1 !important;transform:none !important}}
.drawer__foot{margin-top:0;padding-top:22px;display:flex;align-items:center;
  justify-content:space-between;gap:14px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.07);
  opacity:0;transform:translateY(10px);
  transition:opacity .5s var(--ease) .45s,transform .5s var(--ease) .45s}
body.menu-open .drawer__foot{opacity:1;transform:none}
.drawer__legal{font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim)}
.drawer__mini{display:flex;align-items:center;gap:9px;font-size:.78rem}
.drawer__mini a{color:var(--muted)}
.drawer__mini i{width:2px;height:2px;border-radius:50%;background:var(--dim)}

@media (prefers-reduced-motion:reduce){
  .dlink,.drawer__foot,.drawer__glow{opacity:1 !important;transform:none !important;
    transition-delay:0s !important}
}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(26px);filter:blur(4px);will-change:opacity,transform;
  transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s var(--ease)}
.js .rv.in{opacity:1;transform:none;filter:none}
@media (hover:none){.js .rv{filter:blur(3px);transform:translateY(28px);
  transition:opacity .85s var(--ease),transform .85s var(--ease),filter .85s var(--ease)}}

/* ==========================================================================
   HOMEPAGE
   ========================================================================== */
.glass{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.008) 40%),var(--glass);
  border:1px solid rgba(255,255,255,.09);border-radius:20px;
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 24px 70px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.06)}

.ch{padding:clamp(88px,11vw,150px) 0;position:relative;overflow:hidden}
.ch::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.05) 10%,var(--wash,rgba(150,190,255,.55)) 50%,rgba(255,255,255,.05) 90%,transparent);
  opacity:0;transform:scaleX(.35);transition:opacity 1.1s var(--ease),transform 1.5s var(--ease);
  box-shadow:0 0 24px var(--wash,rgba(150,190,255,.3))}
.ch.lit::before{opacity:1;transform:none}
.ch__light{position:absolute;inset:-38% -12% auto -12%;height:88%;pointer-events:none;opacity:0;
  transform:translateY(-26px);transition:opacity 1.8s var(--ease),transform 1.8s var(--ease);
  background:radial-gradient(56% 50% at 50% 0%,var(--glow,rgba(120,165,235,.15)),transparent 70%)}
.ch.lit .ch__light{opacity:1;transform:none}
.ch--origin{background:linear-gradient(180deg,#070a10,#0b0f18 52%,#06080e);--wash:rgba(190,210,245,.5);--glow:rgba(150,180,235,.14)}
.ch--portfolio{background:#05070c;--wash:rgba(120,180,255,.5);--glow:rgba(90,150,235,.13)}
.ch--engine{background:linear-gradient(180deg,#070a11,#0a0f1a 52%,#070a11);--wash:rgba(150,130,255,.45);--glow:rgba(120,110,220,.12)}
.ch--data{background:#05070c;--wash:rgba(90,210,235,.45);--glow:rgba(60,170,210,.12)}
.ch--bid{background:linear-gradient(180deg,#06080d,#0a0d13 48%,#06080d);--wash:rgba(255,214,130,.42);--glow:rgba(210,165,80,.1)}
.ch--scale{background:#05070c;--wash:rgba(120,200,255,.5);--glow:rgba(80,160,225,.13)}
.ch--scaleup{background:linear-gradient(180deg,#06090f,#0a0f1c 54%,#070a12);
  --wash:rgba(140,200,255,.55);--glow:rgba(100,160,240,.15)}
.ch--2030{background:linear-gradient(180deg,#070b14,#0c1526 50%,#070b14);
  --wash:rgba(120,190,255,.6);--glow:rgba(80,150,245,.17)}
.ch--value{background:linear-gradient(180deg,#06080e,#020407);--wash:rgba(200,220,250,.5);--glow:rgba(140,175,230,.12)}

/* ---------- hero ---------- */
.hero{position:relative;padding:clamp(120px,15vw,168px) 0 clamp(48px,6vw,74px);overflow:hidden;
  background:radial-gradient(120% 80% at 78% 6%,#0d1524 0%,#05070c 58%)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(45% 30% at 12% 8%,rgba(150,190,255,.14),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 22%)}
.hero__shine{position:absolute;inset:-30% -20%;z-index:1;pointer-events:none;overflow:hidden}
.hero__shine::before{content:"";position:absolute;top:0;bottom:0;width:26%;left:0;
  will-change:transform;transform:translateX(-215%);
  background:linear-gradient(100deg,transparent,rgba(190,220,255,.10),transparent);filter:blur(28px)}
.hero.lit .hero__shine::before{animation:heroShine 9s ease-in-out 1.2s infinite}
@keyframes heroShine{0%{transform:translateX(-215%)}60%,100%{transform:translateX(462%)}}
.hero__aura{position:absolute;top:-18%;right:-8%;width:min(880px,105vw);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle,rgba(110,165,255,.28),rgba(96,150,235,.07) 40%,transparent 66%);
  opacity:0;transition:opacity 1.8s var(--ease)}
.hero.lit .hero__aura{opacity:1;animation:aura 14s ease-in-out infinite alternate}
@keyframes aura{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-3%,3%,0) scale(1.1)}}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:1fr;
  gap:clamp(30px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(1.95rem,3.4vw,2.85rem);margin-bottom:20px;max-width:16ch}
.hero .lede{margin-bottom:30px;max-width:46ch}

/* signature: the ranked market board */
.board2{padding:18px 18px 14px;position:relative;overflow:hidden}
.board2__top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.board2__title{font-size:.9rem;font-weight:540;letter-spacing:-.015em}
.pill{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.58rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
  border:1px solid var(--border);border-radius:100px;padding:5px 10px}
.pill i{width:6px;height:6px;border-radius:50%;background:#8fb8e8;box-shadow:0 0 8px rgba(143,184,232,.7)}
.board2__rows{display:grid;gap:7px}
.brow{display:grid;grid-template-columns:26px 1fr 1.05fr 42px;gap:12px;align-items:center;
  padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.022);
  border:1px solid transparent;opacity:0;transform:translateY(10px);
  transition:opacity .6s var(--ease),transform .6s var(--ease),background .5s var(--ease),
             border-color .5s var(--ease),box-shadow .5s var(--ease)}
.board2.on .brow{opacity:1;transform:none;transition-delay:calc(var(--i) * 90ms)}
.board2.on .brow:first-child{background:linear-gradient(100deg,rgba(255,255,255,.075),rgba(255,255,255,.015));
  border-color:rgba(255,255,255,.16);box-shadow:0 0 40px rgba(140,180,255,.14)}
.brow__rank{font-family:var(--mono);font-size:.7rem;color:var(--dim);text-align:center}
.board2.on .brow:first-child .brow__rank{color:#fff}
.brow__name{font-size:.88rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.board2.on .brow:first-child .brow__name{color:var(--text);font-weight:520}
.brow__bar{height:7px;border-radius:5px;background:rgba(255,255,255,.055);position:relative;overflow:hidden}
.brow__bar i{position:absolute;inset:0;border-radius:5px;transform-origin:left;transform:scaleX(0);
  background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 25%,transparent));
  box-shadow:0 0 14px color-mix(in srgb,var(--c) 45%,transparent);
  transition:transform 1.1s var(--ease) calc(var(--i) * 90ms + 250ms)}
.board2.on .brow__bar i{transform:scaleX(var(--w))}
.brow__score{font-family:var(--mono);font-size:.78rem;color:var(--text);text-align:right}
.board2__foot{margin-top:13px;padding-top:11px;border-top:1px solid var(--border);
  font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.board2__sweep{position:absolute;inset:0;pointer-events:none;border-radius:20px;overflow:hidden}
.board2__sweep::before{content:"";position:absolute;top:-40%;bottom:-40%;width:34%;left:0;
  will-change:transform;transform:translateX(-218%);
  background:linear-gradient(100deg,transparent,rgba(190,215,255,.13),transparent);filter:blur(10px)}
.board2.on .board2__sweep::before{animation:sweep2 5.5s ease-in-out 1.4s infinite}
@keyframes sweep2{0%{transform:translateX(-218%)}55%,100%{transform:translateX(353%)}}

/* portfolio trajectory */
.traj{margin-top:clamp(38px,6vw,70px)}
.traj__found{display:flex;align-items:center;gap:14px;font-family:var(--mono);font-size:.62rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:clamp(14px,2vw,22px)}
.traj__found i{width:3px;height:3px;border-radius:50%;background:var(--dim);flex:0 0 auto}
.traj__stage{position:relative;display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:clamp(14px,3vw,40px);min-height:clamp(210px,21vw,264px)}
.traj__h,.traj__v{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.traj__v{display:none}
.traj__line{fill:none;stroke-width:1.6;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s cubic-bezier(.3,.7,.3,1)}
.traj__glowline{fill:none;stroke:#7fb0ff;stroke-width:5;stroke-linecap:round;opacity:0;
  filter:blur(7px);stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 2.2s cubic-bezier(.3,.7,.3,1),opacity 1.2s var(--ease)}
.traj.on .traj__line,.traj.on .traj__glowline{stroke-dashoffset:0}
.traj.on .traj__glowline{opacity:.5}
.traj__dust circle{fill:#dbeaff;opacity:0;transition:opacity 1s var(--ease) 1.4s}
.traj.on .traj__dust circle{opacity:.85;filter:drop-shadow(0 0 6px rgba(160,205,255,.9))}

.tg{position:relative;z-index:2}
.tg--a{align-self:end;text-align:left;margin-bottom:clamp(52px,5.2vw,70px)}
.tg--m{align-self:center;text-align:center}
.tg--b{align-self:start;text-align:right;margin-top:clamp(52px,5.2vw,70px)}
.tg__n{display:block;font-size:clamp(2.4rem,5vw,4rem);font-weight:660;letter-spacing:-.055em;line-height:.95;
  background:linear-gradient(180deg,#fff,#93a9c6);-webkit-background-clip:text;background-clip:text;
  color:transparent;text-shadow:0 0 44px rgba(120,175,255,.3)}
.tg__n--end{background:linear-gradient(180deg,#fff,#bcd6f7);-webkit-background-clip:text;background-clip:text;
  text-shadow:0 0 60px rgba(140,195,255,.75),0 0 26px rgba(190,220,255,.5)}
.tg__x{display:block;font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:620;letter-spacing:-.045em;
  line-height:1;color:#dbeaff;text-shadow:0 0 30px rgba(130,185,255,.5)}
.tg__l{display:block;margin-top:9px;color:var(--dim);font-size:.78rem;letter-spacing:.01em}
.tg__y{display:block;margin-top:3px;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--muted)}
.tdot{position:absolute;z-index:1;width:10px;height:10px;border-radius:50%;background:#cfe4ff;
  transform:translate(-50%,-50%) scale(.4);opacity:0;
  transition:opacity .7s var(--ease),transform .7s cubic-bezier(.3,1.5,.5,1)}
.tdot--a{left:2.6%;top:82.3%;box-shadow:0 0 16px rgba(150,200,255,.85);transition-delay:.35s}
.tdot--b{left:97.4%;top:16.9%;width:13px;height:13px;
  box-shadow:0 0 12px #fff,0 0 34px rgba(150,205,255,1),0 0 70px rgba(120,180,255,.75);
  transition-delay:2.1s}
.traj.on .tdot{opacity:1;transform:translate(-50%,-50%) scale(1)}
.tdot--b::after{content:"";position:absolute;inset:-9px;border-radius:50%;
  border:1px solid rgba(170,210,255,.5);opacity:0}
.traj.on .tdot--b::after{animation:ping 3.4s ease-out 2.6s infinite}
@keyframes ping{0%{opacity:.8;transform:scale(.6)}70%,100%{opacity:0;transform:scale(2.1)}}
.traj__tag{margin-top:clamp(14px,2vw,22px);font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;
  text-transform:uppercase;color:#b7f2d6;border:1px solid rgba(110,225,175,.26);
  background:rgba(70,200,150,.08);border-radius:100px;padding:4px 10px;display:inline-block}

@media (max-width:760px){
  .traj__h{display:none}
  .traj__v{display:block}
  .traj__stage{grid-template-columns:34px 1fr;gap:0 16px;min-height:0;align-items:stretch}
  .traj__h,.traj__v{inset:0 auto 0 0;width:34px}
  .tg{grid-column:2;text-align:left !important;margin:0 !important;padding:0 0 clamp(26px,7vw,40px)}
  .tg--b{padding-bottom:0}
  .tg--a,.tg--m,.tg--b{align-self:auto}
  .tg__n{font-size:clamp(2.2rem,10vw,3rem)}
  .tdot{display:none}
  /* the three nodes brighten down the rail: 2030 dimmest, 2040 brightest.
     Sizes step 7 / 9 / 12 and every left offset keeps the centres on the rail. */
  .tg::after{content:"";position:absolute;top:11px;border-radius:50%;
    opacity:0;transition:opacity .7s var(--ease)}
  /* centres must land on the rail at x=37; the rail sits 8.5px left of where
     these used to be drawn, which is why the nodes floated beside the line. */
  .tg--a::after{width:11px;height:11px;left:-38.5px;background:var(--bg);box-sizing:border-box;
    border:1.5px solid rgba(150,185,230,.55);transition-delay:.35s}
  .tg--m::after{width:11px;height:11px;left:-38.5px;background:var(--bg);box-sizing:border-box;
    border:1.5px solid rgba(190,215,250,.85);
    box-shadow:inset 0 0 0 2px rgba(198,220,250,.9),0 0 12px rgba(150,200,255,.45);
    transition-delay:1.1s}
  .tg--b::after{width:13px;height:13px;left:-39.5px;background:#fff;box-sizing:border-box;
    transition-delay:1.9s;
    box-shadow:0 0 0 4px rgba(150,205,255,.14),0 0 12px #fff,0 0 34px rgba(150,205,255,.95),
      0 0 66px rgba(120,180,255,.6)}
  .traj.on .tg::after{opacity:1}
}
/* ---------- word origin ---------- */
.origin{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,26px)}
.ocard{padding:clamp(26px,3.4vw,40px);position:relative;overflow:hidden}
.ocard::after{content:"";position:absolute;inset:auto -20% -60% -20%;height:100%;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 100%,rgba(150,190,255,.16),transparent 68%)}
.ocard__word{display:block;font-size:clamp(2.2rem,4.4vw,3.2rem);font-weight:680;letter-spacing:-.045em;
  line-height:1;background:linear-gradient(180deg,#fff,#a8b7cb);-webkit-background-clip:text;
  background-clip:text;color:transparent}
.ocard__word.is-light{font-weight:230;letter-spacing:-.018em}
.ocard__root{display:block;margin-top:16px;font-size:1.18rem;font-style:italic;color:#e4ebf5;letter-spacing:-.01em}
.ocard__lang{display:block;margin-top:6px;font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;
  text-transform:uppercase;color:#9fc4ff}
.ocard__eng{display:block;margin-top:10px;color:var(--muted);font-size:.9rem}
.ocard__mean{display:block;margin-top:16px;padding-top:14px;border-top:1px solid var(--border);
  font-size:1.06rem;color:var(--text);letter-spacing:-.018em}
.origin__line{margin-top:clamp(26px,4vw,40px);font-size:clamp(1.1rem,1.9vw,1.45rem);color:var(--text);
  max-width:46ch;letter-spacing:-.02em;line-height:1.4;font-weight:440}

/* ---------- portfolio ---------- */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pc{position:relative;display:flex;flex-direction:column;gap:13px;padding:18px;border-radius:18px;
  border:1px solid rgba(255,255,255,.075);overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.004) 44%),rgba(12,17,26,.7);
  transition:transform .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease)}
.pc__glow{position:absolute;inset:auto -30% -70% -30%;height:120%;pointer-events:none;opacity:0;
  background:radial-gradient(50% 50% at 50% 100%,var(--brand-accent),transparent 66%);
  transition:opacity .55s var(--ease)}
.pc::after{content:"";position:absolute;inset:0 0 auto 0;height:1px;opacity:0;
  background:linear-gradient(90deg,transparent,var(--brand-accent),transparent);transition:opacity .5s var(--ease)}
.pc:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.2);
  box-shadow:0 22px 60px rgba(0,0,0,.5)}
.pc:hover .pc__glow{opacity:.15}
.pc:hover::after{opacity:.9}
.pc__cat{color:color-mix(in srgb,var(--brand-accent) 62%,#fff);font-size:.78rem;letter-spacing:.01em}
.pc__line{color:var(--muted);font-size:.92rem;flex:1;line-height:1.5}
.pc__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;
  padding-top:12px;border-top:1px solid var(--border)}
.pc__metric{font-size:1.05rem;font-weight:600;letter-spacing:-.03em;color:var(--text);display:block}
.pc__metric em{display:block;font-style:normal;font-family:var(--mono);font-size:.54rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim);margin-top:3px;font-weight:400}
.pc__go{display:inline-flex;align-items:center;gap:.45em;font-size:.85rem;font-weight:500;white-space:nowrap}
.pc__go svg{transition:transform .35s var(--ease)}
.pc:hover .pc__go svg{transform:translateX(4px)}
.stage,.plate{display:flex;align-items:center;justify-content:center;width:100%;height:92px;
  padding:12px 18px;border-radius:12px;overflow:hidden;
  background:radial-gradient(120% 140% at 50% 0%,rgba(255,255,255,.06),rgba(255,255,255,.012) 62%);
  border:1px solid rgba(255,255,255,.07);
  transition:border-color .45s var(--ease),background .45s var(--ease),box-shadow .45s var(--ease)}
.stage img,.plate img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  transition:transform .5s var(--ease),filter .5s var(--ease)}
.plate--lg{height:118px}
.plate .wordfall{font-size:1.5rem}
.pc:hover .stage,.card:hover .plate{border-color:rgba(255,255,255,.16);
  background:radial-gradient(120% 140% at 50% 0%,rgba(255,255,255,.1),rgba(255,255,255,.02) 62%);
  box-shadow:inset 0 0 44px color-mix(in srgb,var(--brand-accent) 14%,transparent)}
.pc:hover .stage img,.card:hover .plate img{transform:translateY(-2px) scale(1.03);
  filter:drop-shadow(0 6px 20px color-mix(in srgb,var(--brand-accent) 38%,transparent))}

/* ---------- engine ---------- */
.egrid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.egrid__line{position:absolute;left:8%;right:8%;top:50%;height:1px;background:var(--border);z-index:0}
.egrid__line i{display:block;height:100%;width:0;background:linear-gradient(90deg,#5d6a7d,#dfe8f5);
  box-shadow:0 0 12px rgba(160,200,255,.5);transition:width 2.2s var(--ease)}
.egrid.on .egrid__line i{width:100%}
.ecard{position:relative;z-index:1;padding:30px 24px;border-radius:16px;text-align:center;
  display:flex;flex-direction:column;align-items:center;width:100%;font:inherit;color:inherit;cursor:pointer;
  -webkit-appearance:none;appearance:none;
  border:1px solid rgba(255,255,255,.075);overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.005) 46%),rgba(11,15,24,.82);
  transition:transform .45s var(--ease),border-color .45s var(--ease),box-shadow .45s var(--ease)}
.ecard::after{content:"";position:absolute;inset:auto -30% -70% -30%;height:120%;pointer-events:none;
  opacity:0;background:radial-gradient(50% 50% at 50% 100%,rgba(150,195,255,.5),transparent 66%);
  transition:opacity .9s var(--ease)}
.ecard.lit::after{opacity:.2}
.ecard.lit{border-color:rgba(150,190,255,.24);box-shadow:0 0 44px rgba(110,160,235,.14)}
.ecard:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.24);
  box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 50px rgba(120,170,240,.16)}
.ecard:active{transform:translateY(-2px)}
.ecard.open{border-color:rgba(160,205,255,.55);
  box-shadow:0 0 60px rgba(120,175,255,.3),inset 0 0 30px rgba(120,175,255,.08)}
.ecard.open .ecard__i{color:#fff;border-color:rgba(180,215,255,.6);
  box-shadow:inset 0 0 26px rgba(160,205,255,.4),0 0 44px rgba(140,190,255,.6)}
.ecard.open::after{opacity:.34}
.ecard__i{display:flex;align-items:center;justify-content:center;width:66px;height:66px;
  border-radius:19px;margin-bottom:20px;line-height:0;flex:0 0 auto;
  color:#d6e5fb;border:1px solid rgba(255,255,255,.13);position:relative;
  background:linear-gradient(160deg,rgba(150,190,255,.18),rgba(150,190,255,.035));
  box-shadow:inset 0 0 20px rgba(140,180,255,.14);
  transition:box-shadow .7s var(--ease),color .7s var(--ease),border-color .7s var(--ease),
             transform .45s var(--ease)}
.ecard.lit .ecard__i{color:#fff;border-color:rgba(160,200,255,.45);
  box-shadow:inset 0 0 24px rgba(150,195,255,.3),0 0 34px rgba(130,180,255,.45)}
.ecard:hover .ecard__i{transform:scale(1.06)}
.ecard__i svg{display:block;width:38px;height:38px;stroke-width:1.35}
.ecard b{display:block;font-size:1.02rem;font-weight:580;letter-spacing:-.02em}
.ecard b + span{display:block;margin-top:8px;color:var(--muted);font-size:.9rem;max-width:26ch}

/* ---------- data lattice: seven datasets being structured ---------- */
.dataos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.lat{border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:18px 18px 16px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.006) 44%),rgba(10,14,22,.72);
  box-shadow:0 22px 60px rgba(0,0,0,.45)}
.lat__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.lat__stage{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;
  color:#9fc4ff;transition:color .5s var(--ease)}
.lat__grid{position:relative;height:calc(8 * 34px)}
.lrw{position:absolute;left:0;right:0;height:28px;display:grid;grid-template-columns:96px 1fr;
  gap:12px;align-items:center;
  transform:translateY(calc(var(--i) * 34px));
  transition:transform .95s var(--ease),opacity .7s var(--ease)}
.lrw__lab{font-family:var(--mono);font-size:.56rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--dim);text-align:right;opacity:0;transition:opacity .6s var(--ease),color .6s var(--ease)}
.lat.s2 .lrw__lab{opacity:1}
.lrw__cells{display:flex;gap:6px;align-items:center}
.lcell{width:16px;height:9px;border-radius:3px;background:rgba(150,175,215,.22);
  transform:translateX(var(--tx,0));
  transition:transform .95s var(--ease),background .8s var(--ease),opacity .8s var(--ease),
             box-shadow .8s var(--ease),width .6s var(--ease)}
.lat.s2 .lcell{transform:none}
.lat.s3 .lcell.on{background:color-mix(in srgb,var(--c) 78%,#dbe7f8)}
.lat.s3 .lcell.off{opacity:.16}
.lat.s4 .lrw:first-child .lrw__lab{color:#fff}
.lat.s4 .lrw:first-child .lcell.on{background:var(--c);
  box-shadow:0 0 14px color-mix(in srgb,var(--c) 65%,transparent)}
.lcell.pulse{background:#fff !important;box-shadow:0 0 18px rgba(200,225,255,.9) !important}
.lat__scan{position:absolute;top:0;bottom:0;width:70px;pointer-events:none;left:0;opacity:0;
  will-change:transform;transform:translateX(-114%);
  background:linear-gradient(90deg,transparent,rgba(180,215,255,.16),transparent);filter:blur(8px)}
.lat.s4 .lat__scan{opacity:1;animation:latScan 5.5s ease-in-out 1s infinite}
@keyframes latScan{0%{transform:translateX(-114%)}60%,100%{transform:translateX(calc(100vw))}}
.lat__foot{margin-top:16px;padding-top:13px;border-top:1px solid var(--border);
  font-size:.8rem;color:var(--dim);opacity:0;transition:opacity .8s var(--ease)}
.lat.s4 .lat__foot{opacity:1}

/* ---------- bidding ---------- */
.eng{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(26px,4vw,52px);align-items:start}
.board{padding:16px}
.board__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.replay{background:none;border:1px solid var(--border);border-radius:100px;padding:7px 14px;
  font-size:.82rem;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:.5em;
  transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
.replay:hover{color:var(--text);border-color:var(--border-active)}
.board__rows{position:relative;height:256px}
.board__intro{font-size:.85rem;color:var(--dim);margin-bottom:14px;line-height:1.5}
.bid{position:absolute;left:0;right:0;height:56px;display:grid;width:100%;text-align:left;
  font:inherit;color:inherit;cursor:pointer;appearance:none;
  grid-template-columns:44px 1fr 1fr 52px auto;align-items:center;gap:14px;padding:0 14px;
  border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(13,18,28,.85);
  transform:translateY(calc(var(--i) * 64px));
  transition:transform .85s var(--ease),border-color .6s var(--ease),background .6s var(--ease),box-shadow .6s var(--ease)}
.bid__pos b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:.82rem;
  font-weight:600;color:#0a0c10;background:#5b636e;transition:background .6s var(--ease),box-shadow .6s var(--ease)}
.bid[data-rank="0"] .bid__pos b{background:linear-gradient(160deg,#ffdf8a,#d9a326);box-shadow:0 0 18px rgba(255,206,84,.5)}
.bid[data-rank="1"] .bid__pos b{background:linear-gradient(160deg,#e8eef5,#a7b2be);box-shadow:0 0 14px rgba(220,232,246,.34)}
.bid[data-rank="2"] .bid__pos b{background:linear-gradient(160deg,#e2a276,#a3663c);box-shadow:0 0 14px rgba(210,140,90,.3)}
.bid[data-rank="0"]{border-color:rgba(255,214,120,.45);background:linear-gradient(100deg,#16150e,#101319 60%);
  box-shadow:0 0 60px rgba(255,205,90,.16),inset 0 0 34px rgba(255,205,90,.07)}
.bid[data-rank="0"] .bid__name{color:#ffeec6}
.bid__name{display:flex;align-items:center;gap:9px;min-width:0;overflow:hidden}
.bid__who{font-weight:520;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bid__meter{height:6px;border-radius:4px;background:rgba(255,255,255,.06);overflow:hidden}
.bid__meter i{display:block;height:100%;border-radius:4px;width:var(--m,20%);
  background:linear-gradient(90deg,rgba(238,244,252,.95),rgba(238,244,252,.4));
  transition:width .85s var(--ease)}
.bid[data-rank="0"] .bid__meter i{background:linear-gradient(90deg,#ffe6a6,rgba(255,214,120,.45));
  box-shadow:0 0 16px rgba(255,205,90,.45)}
.bid__val{font-family:var(--mono);font-size:.9rem;color:var(--muted)}
.bid__vis{font-family:var(--mono);font-size:.76rem;color:var(--dim);text-align:right;transition:color .6s var(--ease)}
.bid[data-rank="0"] .bid__vis{color:#ffe6a6}
.bid:hover{border-color:rgba(255,255,255,.24)}
.bid:hover .bid__name{color:#fff}
.bid.up{border-color:rgba(190,214,255,.55);box-shadow:0 0 34px rgba(150,190,255,.2)}
.bid.up .bid__val{color:#dce9ff}
.bid.moved{animation:landed 1s var(--ease) 1}
@keyframes landed{0%{box-shadow:0 0 0 rgba(190,214,255,0)}30%{box-shadow:0 0 46px rgba(190,214,255,.34)}
  100%{box-shadow:0 0 0 rgba(190,214,255,0)}}
.newbid{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);
  font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;
  color:#dce9ff;border:1px solid rgba(160,200,255,.45);border-radius:100px;padding:3px 9px;
  background:rgba(120,170,255,.12);
  opacity:0;transform:scale(.9);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.newbid::before{content:"";width:0;height:0;border-left:3.5px solid transparent;
  border-right:3.5px solid transparent;border-bottom:5px solid #9fc4ff}
.newbid.on{opacity:1;transform:none}
.board__note{margin-top:14px;font-size:.85rem;color:var(--dim);opacity:0;transition:opacity .6s var(--ease)}
.board__note.on{opacity:1}
.decay{border:1px solid var(--border);border-radius:14px;padding:18px}
.decay__label{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dim);margin-bottom:14px}
.decay__bars{display:flex;align-items:flex-end;gap:10px}
.dbar{flex:1;display:flex;flex-direction:column}
.dbar .track{height:118px;display:flex;align-items:flex-end}
.dbar i{display:block;width:100%;border-radius:7px 7px 2px 2px;height:0;flex:none;
  background:linear-gradient(180deg,var(--dc),color-mix(in srgb,var(--dc) 18%,transparent));
  box-shadow:0 0 20px color-mix(in srgb,var(--dc) 45%,transparent);
  transition:height 1.1s var(--ease) calc(var(--k) * 140ms)}
.decay.on .dbar i{height:var(--h)}
.decay__note{margin-top:14px;font-size:.78rem;color:var(--dim)}
.dbar u{display:block;text-decoration:none;text-align:center;margin-top:8px;font-family:var(--mono);
  font-size:.6rem;color:var(--dim)}
.dbar b{display:block;text-align:center;font-family:var(--mono);font-size:.66rem;color:var(--muted);
  margin-bottom:6px;opacity:0;transition:opacity .5s var(--ease) calc(var(--k) * 130ms + 700ms)}
.decay.on .dbar b{opacity:1}
.dbar:first-child b{color:#ffe6a6}

/* ---------- scale of the platform ---------- */
/* ---------- long-term value ---------- */
.vgrid{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:var(--border);border:1px solid var(--border);border-radius:16px;overflow:hidden}
.vgrid li{background:rgba(9,13,20,.8);padding:20px 24px;color:var(--muted);font-size:.98rem;
  position:relative;padding-left:48px}
.vgrid li::before{content:"";position:absolute;left:24px;top:29px;width:6px;height:6px;border-radius:50%;
  background:#9fc4ff;box-shadow:0 0 10px rgba(140,190,255,.7)}
.cta{margin-top:clamp(44px,6vw,72px);text-align:center}

/* ---------- opportunity graph ---------- */
.opp{overflow:hidden}
.opp__title{font-size:.9rem;font-weight:540;letter-spacing:-.015em}
.opp__bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:16px 18px;border-bottom:var(--rule)}
.modes{display:flex;gap:6px;background:rgba(255,255,255,.045);padding:4px;border-radius:100px}
.modes button{border:0;background:none;border-radius:100px;padding:8px 16px;font-size:.86rem;
  color:var(--muted);cursor:pointer;
  transition:color .3s var(--ease),background .3s var(--ease)}
.modes button.on{background:rgba(238,244,252,.95);color:#06080d;font-weight:560;
  box-shadow:0 3px 18px rgba(150,190,255,.22)}
.opp__plot{position:relative;padding:14px 10px 4px}
.opp__plot svg{display:block;overflow:visible}
.g-grid{stroke:rgba(255,255,255,.055)}
.g-ax{fill:#8b93a0;font-size:10px;font-family:ui-monospace,Menlo,monospace;letter-spacing:.08em}
.g-ax--x{text-anchor:middle;font-size:11px;fill:#a2abb8}
.g-unit{fill:#a2abb8;font-size:9.5px;font-family:ui-monospace,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase}
.g-scn{fill:#8b93a0;font-size:8.5px;font-family:ui-monospace,Menlo,monospace;letter-spacing:.16em}
.g-line{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  transition:opacity .4s var(--ease),stroke-width .4s var(--ease)}
.g-line.dim{opacity:.16}
.g-line.sel{stroke-width:3}
.g-dot{transition:opacity .45s var(--ease)}
.g-dot.dim{opacity:.14}
.g-end{font-size:10.5px;letter-spacing:-.01em;transition:opacity .4s var(--ease)}
.g-end.dim{opacity:.16}
.g-hit{cursor:pointer}
.g-guide{stroke:rgba(255,255,255,.22);stroke-dasharray:3 4}
.opp__tip{position:absolute;transform:translate(-50%,-118%);pointer-events:none;opacity:0;z-index:4;
  background:rgba(9,12,17,.97);border:1px solid var(--border-active);border-radius:12px;padding:10px 13px;
  transition:opacity .18s var(--ease);white-space:nowrap;box-shadow:0 14px 40px rgba(0,0,0,.55)}
.opp__tip.on{opacity:1}
.opp__tip b{display:block;font-size:1.15rem;letter-spacing:-.03em}
.opp__tip u{display:block;text-decoration:none;font-size:.82rem;color:var(--muted);margin-top:3px}
.opp__tip em{display:block;font-style:normal;margin-top:6px;font-family:var(--mono);font-size:.58rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.opp__legend{display:flex;flex-wrap:wrap;gap:7px;padding:12px 18px;border-top:var(--rule)}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:none;
  border-radius:100px;padding:7px 13px;font-size:.82rem;color:var(--muted);cursor:pointer;
  transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--brand-accent);
  box-shadow:0 0 8px var(--brand-accent);flex:0 0 auto}
.chip:hover{color:var(--text);border-color:var(--border-active)}
.chip.on{color:var(--text);border-color:color-mix(in srgb,var(--brand-accent) 55%,transparent);
  background:color-mix(in srgb,var(--brand-accent) 11%,transparent)}
.opp__panel{border-top:var(--rule);padding:20px 18px;display:none}
.opp__panel.on{display:block}
.pan{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(20px,3vw,44px)}
.pan__h{display:flex;align-items:center;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.pan__h b{font-size:1.15rem;letter-spacing:-.03em}
.pan__h span{font-size:.8rem;color:color-mix(in srgb,var(--brand-accent) 62%,#fff)}
.pan .ticks li{font-size:.92rem;padding:9px 0 9px 22px}
.pan .ticks li::before{top:17px}
.pan__side{display:grid;gap:14px;align-content:start}
.pan__metric{border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.pan__metric b{display:block;font-size:1.5rem;letter-spacing:-.04em;
  color:color-mix(in srgb,var(--brand-accent) 46%,#fff)}
.pan__metric > span:last-child{display:block;margin-top:4px;font-family:var(--mono);font-size:.6rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.kind{display:block;width:fit-content;font-family:var(--mono);font-size:.55rem;letter-spacing:.14em;
  text-transform:uppercase;border-radius:100px;padding:4px 9px;margin-bottom:8px;border:1px solid}
.kind--industry{color:#9fd3ff;border-color:rgba(120,180,255,.32);background:rgba(90,150,230,.09)}
.kind--vendor{color:#ffd7a1;border-color:rgba(255,190,120,.3);background:rgba(220,160,80,.09)}
.kind--internal{color:#b7f2d6;border-color:rgba(110,225,175,.28);background:rgba(70,200,150,.08)}
.pan__proof{font-size:.86rem;color:var(--muted);line-height:1.5}
.pan__proof em{display:block;font-style:normal;margin-top:6px;font-family:var(--mono);font-size:.58rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}
.matrix{margin-top:18px;padding:18px}
.matrix__h{font-size:.84rem;letter-spacing:-.01em;color:var(--dim);margin-bottom:12px}
.matrix__plot svg{display:block;overflow:visible}
.m-lab{font-size:11px;fill:#dfe6ef;letter-spacing:-.01em;paint-order:stroke;stroke:rgba(5,7,12,.92);
  stroke-width:3.5px;stroke-linejoin:round}
.m-ax{font-size:9.5px;fill:#8b93a0;font-family:ui-monospace,Menlo,monospace;letter-spacing:.1em}
.m-quad{stroke:rgba(255,255,255,.05);stroke-dasharray:2 5}

/* ==========================================================================
   SHARED COMPONENTS (portfolio, property, platform, legal pages)
   ========================================================================== */
.wall{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{grid-column:span 3;position:relative;display:flex;flex-direction:column;gap:16px;padding:20px;
  border-radius:18px;border:1px solid var(--border);overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,0) 46%),var(--surface);
  transition:transform .5s var(--ease),border-color .5s var(--ease)}
.card--lg{grid-column:span 4;padding:24px}
.card__glow{position:absolute;inset:auto -30% -70% -30%;height:120%;pointer-events:none;opacity:0;
  background:radial-gradient(50% 50% at 50% 100%,var(--brand-accent),transparent 68%);
  transition:opacity .55s var(--ease)}
.card::after{content:"";position:absolute;inset:0 0 auto 0;height:1px;opacity:0;
  background:linear-gradient(90deg,transparent,var(--brand-accent),transparent);transition:opacity .55s var(--ease)}
.card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.17)}
.card:hover .card__glow{opacity:.12}
.card:hover::after{opacity:.85}
.card__body{display:flex;flex-direction:column;gap:9px;flex:1}
.card__cat,.panel__cat{color:color-mix(in srgb,var(--brand-accent) 62%,#fff);font-size:.82rem}
.card__desc{color:var(--muted);font-size:.96rem}
.card__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-top:14px;border-top:var(--rule);font-size:.9rem}
.card__go{display:inline-flex;align-items:center;gap:.5em;font-weight:500}
.card__go svg{transition:transform .35s var(--ease)}
.card:hover .card__go svg{transform:translateX(4px)}
.status{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;color:var(--dim);white-space:nowrap}
.status i{width:5px;height:5px;border-radius:50%;background:var(--brand-accent);opacity:.85}
.wordfall{color:var(--brand-accent);font-weight:660;letter-spacing:-.03em}

.two{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,4vw,56px)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,32px)}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:center}
.block{border-top:1px solid var(--border-active);padding-top:22px}
.block h2{font-size:1.06rem;font-weight:580;letter-spacing:-.02em;line-height:1.35;margin-bottom:10px}
.block p{color:var(--muted);font-size:.98rem}
.prose{max-width:70ch}
.prose h2{font-size:clamp(1.35rem,2.4vw,1.75rem);margin:clamp(38px,5vw,56px) 0 12px}
.prose h2:first-child{margin-top:0}
.prose p{color:var(--muted);margin-bottom:14px}
.prose ul{color:var(--muted);padding-left:20px;margin:0 0 14px}
.prose li{margin-bottom:8px}
.prose a{border-bottom:1px solid var(--border-active)}

.prop__top{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.prop__logo{margin:0}
.prop__logo img{width:100%;max-width:min(460px,86vw);height:auto;object-fit:contain}
.prop__logo .wordfall{font-size:clamp(2rem,5vw,3rem)}

.cells{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}
.cell{aspect-ratio:1;border-radius:2px;background:rgba(255,255,255,.045);transition:background .6s var(--ease)}
.cell.on{background:rgba(255,255,255,.16)}
.cell.hot{background:rgba(214,228,247,.42)}
.list{display:grid;margin-top:26px;border-top:var(--rule)}
.list div{padding:15px 0;border-bottom:var(--rule);display:flex;gap:16px;align-items:baseline;
  color:var(--muted);font-size:.97rem}
.list b{color:var(--text);font-weight:540;min-width:168px}

.qp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}
.qp__word{font-size:clamp(2.6rem,7vw,5rem);font-weight:680;letter-spacing:-.045em;line-height:1}
.qp__word.is-light{font-weight:220;letter-spacing:-.02em}
.qp__def{color:var(--muted);margin-top:14px;font-size:1.02rem}
.qp__cell{position:relative;padding-top:26px;border-top:1px solid var(--border-active)}
.qp__note{margin-top:clamp(30px,4vw,44px);font-size:clamp(1.1rem,1.9vw,1.45rem);color:var(--text);
  max-width:46ch;font-weight:440;letter-spacing:-.02em;line-height:1.4}

.form{background:var(--surface);border:var(--rule);border-radius:16px;padding:clamp(22px,3vw,34px);max-width:640px}
.field{margin-bottom:18px}
.field label{display:block;font-size:.88rem;color:var(--muted);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;background:var(--bg);color:var(--text);
  border:1px solid var(--border-active);border-radius:10px;padding:12px 14px;font:inherit;font-size:.97rem}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#7fb2ff;outline:none}
.formnote{margin-top:14px;font-size:.86rem;color:var(--dim)}
.field .opt{color:var(--dim);font-size:.78rem;margin-left:6px}
.err{margin-top:7px;font-size:.82rem;color:#ff9d95;display:none}
.field.bad input,.field.bad textarea,.field.bad select{border-color:rgba(255,120,110,.55)}
.field.bad .err{display:block}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formstate{margin-top:14px;font-size:.9rem;padding:12px 14px;border-radius:10px;display:none}
.formstate.ok{display:block;color:#b7f2d6;border:1px solid rgba(110,225,175,.3);background:rgba(70,200,150,.08)}
.formstate.no{display:block;color:#ff9d95;border:1px solid rgba(255,120,110,.3);background:rgba(220,90,80,.08)}
.crumbs{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim);flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--text)}
.crumbs b{color:var(--text);font-weight:500}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px;text-align:center}
.stat b{display:block;font-size:clamp(2rem,4vw,3rem);font-weight:640;letter-spacing:-.04em}
.stat span{display:block;color:var(--muted);font-size:.9rem;margin-top:6px}

/* ---------- footer ---------- */
.ftr{background:#040507;border-top:var(--rule);padding:clamp(52px,7vw,84px) 0 34px}
.ftr__top{display:grid;grid-template-columns:1.4fr 2.6fr;gap:clamp(28px,5vw,64px)}
.ftr__logo img{height:38px;width:auto;margin-bottom:18px}
.ftr__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.ftr .ftr__h{font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);font-weight:500;
  margin-bottom:14px;font-family:var(--mono)}
.ftr li{list-style:none}
.ftr ul{margin:0;padding:0;display:grid;gap:9px}
.ftr ul a{color:var(--muted);font-size:.93rem}
.ftr ul a:hover{color:var(--text)}
.ftr__disc{margin-top:clamp(34px,5vw,52px);padding-top:22px;border-top:var(--rule);
  font-size:.78rem;line-height:1.6;color:var(--dim);max-width:96ch}
.ftr__base{margin-top:22px;padding-top:20px;border-top:var(--rule);display:flex;
  justify-content:space-between;gap:18px;flex-wrap:wrap;color:var(--dim);font-size:.85rem}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1024px){
  .hero__in{grid-template-columns:1fr;gap:36px}
  .hero__text{max-width:none}
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .egrid{grid-template-columns:repeat(2,1fr)}
  .smgrid{grid-template-columns:repeat(2,1fr)}
  .layers__grid{grid-template-columns:1fr}
  .egrid__line{display:none}
  .origin,.dataos,.eng,.vgrid,.pan,.split,.two,.three{grid-template-columns:1fr}
  .mets{grid-template-columns:repeat(2,1fr)}
  .wall{grid-template-columns:repeat(6,1fr)}
  .card{grid-column:span 3}
  .card--lg{grid-column:span 6}
  .ftr__top{grid-template-columns:1fr}

}
@media (max-width:1000px){
  .nav{display:none}
  .burger{display:flex}
  .hdr__in{height:70px}
  .hdr__logo img{height:34px}
  .drawer{padding-top:96px}
}
@media (max-width:640px){
  body{font-size:calc(16.5px * var(--scale))}
  .ch{padding:clamp(66px,13vw,96px) 0}
  .hero{padding-top:clamp(104px,26vw,132px)}
  .pgrid,.wall,.egrid{grid-template-columns:1fr}
  .card,.card--lg{grid-column:span 1}
  .mets{grid-template-columns:1fr 1fr}
  .met{padding:16px 14px}
  .met b{font-size:1.6rem}
  .stage,.plate,.plate--lg{height:82px}
  .brow{grid-template-columns:22px 1fr 34px;gap:10px;padding:9px 10px}
  .brow__bar{display:none}
  .board2{padding:14px 14px 12px}
  .ocard{padding:22px}
  .trow{grid-template-columns:1fr;gap:6px}
  .ftr__cols{grid-template-columns:1fr 1fr}
  .ftr__logo img{height:34px}
  :root{--fab:42px}
  .ecard{padding:26px 18px}
  .ecard__i{width:62px;height:62px;border-radius:18px;margin-bottom:16px}
  .ecard__i svg{width:34px;height:34px}
  .list b{min-width:auto;display:block}
  .list div{flex-direction:column;gap:4px}
  .opp__bar{padding:12px;gap:10px}
  .opp__bar .tag{white-space:normal;width:100%;text-align:center;line-height:1.6;letter-spacing:.1em}
  .modes{width:100%}
  .modes button{flex:1;padding:9px 8px;font-size:.8rem;display:flex;align-items:center;
    justify-content:center;min-height:42px}
  .opp__legend{padding:10px 12px}
  .chip{font-size:.78rem;padding:8px 12px}
  .opp__panel{padding:16px 14px}
  .g-end{display:none}
  .board__top{flex-wrap:wrap;gap:10px}
  .board .tag{white-space:normal;line-height:1.5}
  .replay{padding:7px 12px;font-size:.78rem}
  .board__rows{height:248px}
  .bid{grid-template-columns:34px 1fr 44px auto;height:54px;gap:8px;padding:0 10px;
    transform:translateY(calc(var(--i) * 62px))}
  .bid__meter{display:none}
  .bid__vis{font-size:.7rem}
  .bid__val{font-size:.8rem}
  .bid__name{gap:7px}
  .newbid{font-size:0;padding:5px 7px;gap:0}
  .newbid::before{border-left-width:4px;border-right-width:4px;border-bottom-width:6px}
  .smgrid{grid-template-columns:1fr}
  .sm{padding:22px 20px 20px}
  .vgrid li{padding:16px 18px 16px 40px}
  .vgrid li::before{left:18px;top:25px}
  .matrix{padding:14px 10px}
  .dbar .track{height:96px}
  .lat{padding:14px 14px 12px}
  .lat__grid{height:calc(8 * 30px)}
  .lrw{grid-template-columns:74px 1fr;gap:9px;height:24px;transform:translateY(calc(var(--i) * 30px))}
  .lrw__lab{font-size:.5rem;letter-spacing:.08em}
  .lcell{width:12px;height:8px;border-radius:2px}
  .lrw__cells{gap:5px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important}
  .js .rv{opacity:0;transform:none !important;filter:none !important;
    transition:opacity .4s linear !important}
  .js .rv.in{opacity:1}
  .hero__h,.hero__s,.hero__b{opacity:1;transform:none;filter:none}
  .hero__canvas{display:none}
  .ch__light,.ch::before{opacity:1;transform:none}
  .egrid__line i{width:100%}
  .board2 .brow{opacity:1;transform:none}
  .board2 .brow__bar i{transform:scaleX(var(--w))}
  .decay .dbar i{height:var(--h)}
  .hero__aura{opacity:1;animation:none}
  .board2__sweep{display:none}
}

@media (max-width:360px){
  .lrw{grid-template-columns:64px 1fr;gap:7px}
  .lcell{width:9px;height:7px}
  .lrw__cells{gap:4px}
}

/* ---------- operating-system popups (additive) ---------- */
.ops{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:clamp(16px,4vw,40px)}
.ops[hidden]{display:none}
.ops__scrim{position:absolute;inset:0;background:rgba(3,5,9,.72);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  opacity:0;transition:opacity .28s var(--ease)}
.ops.on .ops__scrim{opacity:1}
.ops__panel{position:relative;width:min(440px,100%);border-radius:24px;padding:34px 32px 32px;
  text-align:center;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 42%),rgba(13,18,29,.94);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 40px 110px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.08);
  opacity:0;transform:translateY(16px) scale(.965);
  transition:opacity .26s var(--ease),transform .28s var(--ease)}
.ops.on .ops__panel{opacity:1;transform:none}
.ops__glow{position:absolute;inset:-40% -20% auto -20%;height:100%;pointer-events:none;
  background:radial-gradient(50% 60% at 50% 0%,rgba(140,190,255,.26),transparent 70%)}
.ops__grip{display:none}
.ops__x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;display:grid;
  place-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  color:var(--muted);cursor:pointer;z-index:2;
  transition:color .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}
.ops__x:hover{color:var(--text);border-color:rgba(255,255,255,.28)}
.ops__x svg{width:15px;height:15px}
.ops__icon{position:relative;display:flex;align-items:center;justify-content:center;width:72px;height:72px;
  margin:0 auto 20px;border-radius:21px;line-height:0;color:#fff;
  border:1px solid rgba(180,215,255,.4);
  background:linear-gradient(160deg,rgba(150,195,255,.26),rgba(150,195,255,.05));
  box-shadow:inset 0 0 26px rgba(160,205,255,.34),0 0 48px rgba(130,180,255,.42)}
.ops__icon svg{display:block;width:38px;height:38px;stroke-width:1.35}
.ops__t{position:relative;font-size:1.55rem;font-weight:620;letter-spacing:-.035em}
.ops__lead{position:relative;margin-top:12px;font-size:1.02rem;color:var(--text);letter-spacing:-.018em;
  line-height:1.4}
.ops__metric{position:relative;margin:22px auto 0;padding:14px 18px;border-radius:14px;
  border:1px solid rgba(160,205,255,.24);background:rgba(110,165,240,.09);
  font-size:clamp(1.2rem,3.4vw,1.55rem);font-weight:620;letter-spacing:-.035em;
  background-clip:padding-box;color:#eaf2ff;
  opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease) .12s,transform .5s var(--ease) .12s}
.ops.on .ops__metric{opacity:1;transform:none}
.ops__body{position:relative;margin-top:18px;color:var(--muted);font-size:.94rem;line-height:1.55;
  max-width:34ch;margin-left:auto;margin-right:auto}

@media (max-width:640px){
  .ops{align-items:flex-end;padding:0}
  .ops__scrim{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
  .ops__panel{width:100%;border-radius:26px 26px 0 0;padding:14px 22px calc(30px + env(safe-area-inset-bottom));
    transform:translateY(100%);transition:transform .3s var(--ease),opacity .2s var(--ease);
    max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .ops.on .ops__panel{transform:none}
  .ops.drag .ops__panel{transition:none}
  .ops__grip{display:block;width:44px;height:4px;border-radius:3px;margin:0 auto 18px;
    background:rgba(255,255,255,.22)}
  .ops__x{top:10px;right:12px;width:38px;height:38px}
  .ops__icon{width:64px;height:64px;border-radius:19px;margin-bottom:16px}
  .ops__icon svg{width:34px;height:34px}
  .ops__t{font-size:1.4rem}
  .ops__metric{margin-top:18px;padding:13px 16px}
  .ops__body{margin-top:16px;max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .ops__scrim,.ops__panel,.ops__metric{transition:none !important}
  .ops__panel{opacity:1;transform:none}
  .ops__metric{opacity:1;transform:none}
}

/* ---------- 2030, at scale (additive) ---------- */
.s30__band{font-family:var(--mono);font-size:.64rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--dim);margin-bottom:18px}
.s30__split{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  margin-top:clamp(40px,5vw,64px);margin-bottom:18px}
.s30__band--scn{display:inline-flex;align-items:center;gap:9px;color:#b7f2d6;margin-bottom:0}
.s30__band--scn i{width:7px;height:7px;border-radius:50%;background:#4ade80;
  box-shadow:0 0 9px rgba(74,222,128,.8);flex:0 0 auto}
.s30__disc{font-size:.82rem;color:var(--dim)}
.s30__closer{margin-top:clamp(38px,5vw,60px);font-size:clamp(1.2rem,2.4vw,1.75rem);font-weight:560;
  letter-spacing:-.035em;line-height:1.32;color:var(--text);max-width:36ch}

@media (max-width:1024px){
  .s30grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:640px){
  .s30grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .s30{padding:20px 16px 18px;border-radius:16px}
  .s30__n{font-size:clamp(1.9rem,8vw,2.4rem)}
  .s30--long .s30__n{font-size:clamp(1.5rem,6.4vw,1.95rem)}
  .s30--xlong .s30__n{font-size:clamp(1.1rem,4.6vw,1.4rem)}
  .s30__l{margin-top:10px;font-size:.88rem}
  .s30__note{font-size:.75rem}
  .s30__split{gap:8px}
}
@media (max-width:360px){
  .s30__n{font-size:1.65rem}
  .s30--long .s30__n{font-size:1.35rem}
  .s30--xlong .s30__n{font-size:1.05rem}
  .s30__l{font-size:.82rem}
}

.stamp{margin-top:clamp(30px,4vw,44px);padding-top:18px;border-top:1px solid var(--border);
  font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}

/* short phones: tighten the drawer so the whole menu fits without scrolling */
@media (max-height:680px){
  .drawer{padding-top:calc(62px + env(safe-area-inset-top))}
  .dlink{padding:12px 2px}
  .dlink__t{font-size:1.32rem}
  .dlink__d{font-size:.76rem;margin-top:2px}
  .dlink__a{width:28px;height:28px}
  .drawer__foot{padding-top:16px}
}

/* ---------- contact form shell ---------- */
.cform{position:relative;display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(24px,4vw,56px);
  align-items:start;padding:clamp(24px,3.4vw,40px);border-radius:22px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.005) 46%),rgba(10,14,22,.76)}
.cform__glow{position:absolute;inset:-40% -20% auto -20%;height:110%;pointer-events:none;
  background:radial-gradient(50% 60% at 78% 0%,rgba(120,175,255,.18),transparent 70%)}
.cform .form{position:relative;max-width:none;margin:0}
.cform__side{position:relative;display:grid;gap:2px;align-content:start;
  border-left:1px solid var(--border);padding-left:clamp(18px,2.4vw,30px)}
.croute{padding:13px 0;border-bottom:var(--rule)}
.croute:last-child{border-bottom:0}
.croute b{display:block;font-size:.94rem;font-weight:560;letter-spacing:-.015em}
.croute span{display:block;margin-top:4px;color:var(--dim);font-size:.82rem;line-height:1.5}
#contactSend[disabled]{opacity:.6;pointer-events:none}
@media (max-width:820px){
  .cform{grid-template-columns:1fr;padding:20px 18px}
  .cform__side{border-left:0;border-top:1px solid var(--border);padding-left:0;padding-top:8px}
}

/* ==========================================================================
   COMPANY + INVESTORS  (reuses the existing system; only new structures here)
   ========================================================================== */
.sect{font-family:var(--mono);font-size:.62rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--dim);margin-bottom:clamp(16px,2.4vw,26px)}

/* the illuminated step chain */
.flow{position:relative;display:grid;gap:0;padding-left:38px}
.flow__rail{position:absolute;left:11px;top:10px;bottom:10px;width:1px;transform-origin:top;
  background:linear-gradient(180deg,transparent,rgba(150,190,255,.55) 10%,rgba(150,190,255,.55) 90%,transparent);
  transform:scaleY(0);transition:transform 1.1s cubic-bezier(.3,.75,.3,1) .15s}
.flow.on .flow__rail{transform:scaleY(1)}
.flow__s{position:relative;padding:clamp(15px,2vw,22px) 0;border-bottom:1px solid rgba(255,255,255,.07)}
.flow__s:first-child{border-top:1px solid rgba(255,255,255,.07)}
.flow__s::before{content:"";position:absolute;left:-31px;top:50%;width:7px;height:7px;border-radius:50%;
  background:rgba(160,200,255,.55);transform:translateY(-50%);
  box-shadow:0 0 12px rgba(140,190,255,.5)}
.flow__s:last-child::before{width:11px;height:11px;left:-33px;background:#cfe4ff;
  box-shadow:0 0 10px #fff,0 0 28px rgba(150,205,255,.9)}
.flow__n{font-family:var(--mono);font-size:.56rem;letter-spacing:.15em;color:var(--dim);
  display:block;margin-bottom:6px}
.flow__t{display:block;font-size:clamp(1.15rem,2.4vw,1.65rem);font-weight:600;letter-spacing:-.03em}
.flow__d{display:block;margin-top:6px;color:var(--muted);font-size:.92rem;max-width:52ch}

/* company: the seven properties as a quiet list */
.cprops{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.cprop{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 18px;border-radius:16px;
  border:1px solid rgba(255,255,255,.075);background:rgba(11,16,26,.72);
  transition:transform .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease)}
.cprop:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.2);
  box-shadow:0 18px 46px rgba(0,0,0,.45),0 0 34px color-mix(in srgb,var(--brand-accent) 16%,transparent)}
.cprop__dot{width:8px;height:8px;border-radius:50%;background:var(--brand-accent);
  box-shadow:0 0 12px var(--brand-accent)}
.cprop__n{font-size:1rem;font-weight:580;letter-spacing:-.02em}
.cprop__m{color:var(--dim);font-size:.84rem}

/* company: editorial vs sponsored */
.sep{padding:clamp(22px,3vw,32px)}
.sep__k{display:inline-block;font-family:var(--mono);font-size:.55rem;letter-spacing:.15em;
  text-transform:uppercase;color:#9fd3ff;border:1px solid rgba(120,180,255,.3);
  background:rgba(90,150,230,.09);border-radius:100px;padding:4px 10px}
.sep--paid .sep__k{color:#ffd7a1;border-color:rgba(255,190,120,.3);background:rgba(220,160,80,.09)}
.sep__t{margin:16px 0 4px;font-size:1.12rem;font-weight:560;letter-spacing:-.022em}

/* investors: the property register */
.mkt{border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-top:16px}
.mkt__r{display:grid;grid-template-columns:14px 1.1fr 1.2fr auto;gap:14px;align-items:center;
  padding:15px 20px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(9,13,21,.6)}
.mkt__r:last-child{border-bottom:0}
.mkt__d{width:9px;height:9px;border-radius:50%;background:var(--brand-accent);
  box-shadow:0 0 11px var(--brand-accent)}
.mkt__r b{font-size:.98rem;font-weight:560;letter-spacing:-.018em}
.mkt__r span{color:var(--muted);font-size:.9rem}
.mkt__r em{font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dim);white-space:nowrap}

/* investors: the operating-leverage diagram */
.lev{position:relative;margin-top:clamp(22px,3vw,34px)}
.lev__top{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;align-items:end}
.lev__node{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  gap:9px;text-align:center}
.lev__dot{width:10px;height:10px;border-radius:50%;background:var(--brand-accent);
  box-shadow:0 0 14px var(--brand-accent)}
.lev__lbl{font-size:.76rem;color:var(--muted);line-height:1.3}
.lev__fan{display:block;width:100%;height:clamp(48px,6vw,74px);overflow:visible}
.lev__fan line{stroke:rgba(150,190,255,.32);stroke-width:1;
  stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1s cubic-bezier(.3,.75,.3,1) .2s}
.lev.on .lev__fan line{stroke-dashoffset:0}
.lev__core{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;
  padding:20px 24px;border-radius:16px;border:1px solid rgba(160,200,255,.3);
  background:linear-gradient(180deg,rgba(150,195,255,.14),rgba(150,195,255,.03));
  box-shadow:inset 0 0 34px rgba(150,195,255,.12),0 0 46px rgba(120,175,255,.22)}
.lev__core b{font-size:clamp(1.05rem,2vw,1.35rem);font-weight:600;letter-spacing:-.028em}
.lev__core span{color:var(--muted);font-size:.86rem}
.lev__outs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.lev__out b{display:block;font-size:.92rem;font-weight:560;letter-spacing:-.018em}
.lev__out span{display:block;margin-top:4px;color:var(--dim);font-size:.74rem;line-height:1.35}

/* a metric that has no value yet is described, never faked */

@media (max-width:1024px){
  .cprops{grid-template-columns:repeat(2,1fr)}
  .lev__outs{grid-template-columns:repeat(3,1fr)}
  .lev__fan--d{height:clamp(40px,5vw,58px)}
}
@media (max-width:760px){
  .lev__top{grid-template-columns:repeat(4,1fr);gap:14px 6px}
  .lev__fan{display:none}
  .lev__core{margin:22px 0;position:relative}
  .lev__core::before,.lev__core::after{content:"";position:absolute;left:50%;width:1px;height:22px;
    background:linear-gradient(180deg,transparent,rgba(150,190,255,.6));transform:translateX(-50%)}
  .lev__core::before{top:-22px}
  .lev__core::after{bottom:-22px;background:linear-gradient(180deg,rgba(150,190,255,.6),transparent)}
  .lev__outs{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .cprops{grid-template-columns:1fr}
  .flow{padding-left:30px}
  .flow__rail{left:7px}
  .flow__s::before{left:-27px}
  .flow__s:last-child::before{left:-29px}
  .mkt__r{grid-template-columns:12px 1fr;gap:6px 12px;padding:14px 16px}
  .mkt__r span{grid-column:2}
  .mkt__r em{grid-column:2}
  .lev__top{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .flow__rail{transform:scaleY(1) !important}
  .lev__fan line{stroke-dashoffset:0 !important}
}

/* ==========================================================================
   STATIC METRICS - one open editorial system. No cards.
   A container is for a real object, an interaction, a state or a comparison.
   Static numbers get typography, alignment, rules and space instead.
   ========================================================================== */
.slab{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.6rem;
  letter-spacing:.18em;text-transform:uppercase;color:#9fc4ff;margin-bottom:clamp(18px,2.4vw,28px)}
.slab::before{content:"";width:5px;height:5px;border-radius:50%;background:#7fb0ff;
  box-shadow:0 0 9px rgba(140,190,255,.9);flex:0 0 auto}

.mlead{position:relative;padding:2px 0 clamp(26px,3.4vw,38px) clamp(20px,2.6vw,30px);
  border-bottom:1px solid rgba(255,255,255,.1)}
.mlead::before{content:"";position:absolute;left:0;top:6px;bottom:clamp(26px,3.4vw,38px);width:2px;
  border-radius:2px;background:linear-gradient(180deg,#9fc4ff,rgba(120,175,255,.15));
  transform:scaleY(0);transform-origin:top;transition:transform .9s cubic-bezier(.3,.75,.3,1) .1s}
.mlead.in::before{transform:scaleY(1)}
.mlead__v{display:block;font-size:clamp(3.2rem,7.4vw,5.6rem);font-weight:660;letter-spacing:-.062em;
  line-height:.9;background:linear-gradient(180deg,#fff,#93a9c6);-webkit-background-clip:text;
  background-clip:text;color:transparent;text-shadow:0 0 70px rgba(120,175,255,.3)}
.mlead__l{display:block;margin-top:16px;font-size:clamp(1rem,1.5vw,1.16rem);letter-spacing:-.016em;
  color:var(--text);max-width:34ch}
.mlead__n{display:block;margin-top:9px;color:var(--dim);font-size:.86rem;line-height:1.55;max-width:56ch}

.mrail{display:grid;grid-template-columns:repeat(4,1fr);gap:0 clamp(18px,2.6vw,44px)}
.mrail--3{grid-template-columns:repeat(3,1fr)}
.mrail--2{grid-template-columns:repeat(2,1fr)}
.mrail__i{position:relative;padding:clamp(22px,2.6vw,30px) 0 clamp(24px,2.8vw,32px)}
.mrail__i::before{content:"";position:absolute;left:0;top:-1px;width:34px;height:1px;
  background:linear-gradient(90deg,rgba(150,195,255,.75),transparent);
  transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.mrail__i.in::before{transform:scaleX(1)}
.m__v{display:block;font-size:clamp(1.7rem,3.1vw,2.45rem);font-weight:640;letter-spacing:-.05em;
  line-height:1;background:linear-gradient(180deg,#fff,#9db2cc);-webkit-background-clip:text;
  background-clip:text;color:transparent;white-space:nowrap}
.m__v--long{font-size:clamp(1.35rem,2.3vw,1.85rem)}
.m__v--xlong{font-size:clamp(1.1rem,1.75vw,1.45rem)}
.m__l{display:block;margin-top:12px;font-size:.97rem;letter-spacing:-.012em;color:var(--text);line-height:1.4}
.m__n{display:block;margin-top:7px;color:var(--dim);font-size:.81rem;line-height:1.55}
.m__k{display:inline-block;margin-top:11px;font-family:var(--mono);font-size:.5rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);border:1px solid rgba(255,255,255,.13);
  border-radius:100px;padding:3px 8px}
.m__k--source{color:#a8c8ff;border-color:rgba(120,180,255,.3)}
.m__k--planning,.m__k--scenario{color:#b7f2d6;border-color:rgba(110,225,175,.3)}
.m__k--estimate,.m__k--counted{color:#ffd7a1;border-color:rgba(255,190,120,.3)}
.m__k--fact{color:var(--muted)}

.rate{border-top:1px solid rgba(255,255,255,.14)}
.rate__h{display:grid;grid-template-columns:minmax(120px,.3fr) 1fr auto;gap:22px;padding:0 2px 11px;
  font-family:var(--mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.rate__r{position:relative;display:grid;grid-template-columns:minmax(120px,.3fr) 1fr auto;
  gap:6px 22px;align-items:baseline;padding:clamp(17px,2vw,22px) 2px;
  border-top:1px solid rgba(255,255,255,.085)}
.rate__r::after{content:"";position:absolute;left:0;top:-1px;width:46px;height:1px;
  background:linear-gradient(90deg,rgba(150,195,255,.7),transparent);
  transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.rate__r.in::after{transform:scaleX(1)}
.rate__v{font-size:clamp(1.45rem,2.5vw,2rem);font-weight:640;letter-spacing:-.045em;white-space:nowrap;
  background:linear-gradient(180deg,#fff,#9db2cc);-webkit-background-clip:text;background-clip:text;
  color:transparent}
.rate__n{font-size:1.02rem;font-weight:520;letter-spacing:-.018em;color:var(--text)}
.rate__t{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);white-space:nowrap}
.rate__x{grid-column:2/-1;margin-top:2px;color:var(--dim);font-size:.83rem;line-height:1.55;max-width:64ch}

.enote{position:relative;padding:18px 0 18px 20px;border-top:1px solid rgba(255,255,255,.1);
  color:var(--dim);font-size:.93rem;line-height:1.65;max-width:64ch}
.enote::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,rgba(150,195,255,.5),rgba(150,195,255,.06))}

.lev__out{text-align:center;padding:14px 6px 0}

@media (max-width:1024px){.mrail,.mrail--3{grid-template-columns:repeat(2,1fr);gap:0 clamp(18px,3vw,32px)}}
@media (max-width:600px){
  .mrail,.mrail--3,.mrail--2{grid-template-columns:repeat(2,1fr);gap:0 18px}
  .m__v{font-size:clamp(1.45rem,7vw,1.9rem)}
  .m__v--long{font-size:clamp(1.15rem,5.4vw,1.45rem)}
  .m__v--xlong{font-size:clamp(.95rem,4.4vw,1.2rem)}
  .m__l{font-size:.88rem;margin-top:9px}.m__n{font-size:.76rem}
  .rate__r,.rate__h{grid-template-columns:1fr auto;gap:3px 14px}
  .rate__h span:nth-child(2){display:none}
  .rate__n{grid-column:1}.rate__t{grid-column:2;grid-row:1;align-self:center}
  .rate__x{grid-column:1/-1}
}
@media (prefers-reduced-motion:reduce){
  .mlead::before,.mrail__i::before,.rate__r::after{transform:none !important}
}

/* three revenue layers - open rows, no container */
.layers{margin-top:clamp(44px,6vw,72px)}
.layers__h{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.6rem;
  letter-spacing:.18em;text-transform:uppercase;color:#9fc4ff;margin-bottom:18px}
.layers__h::before{content:"";width:5px;height:5px;border-radius:50%;background:#7fb0ff;
  box-shadow:0 0 9px rgba(140,190,255,.9);flex:0 0 auto}
.layers__grid{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(26px,3.4vw,40px) clamp(28px,4vw,64px);
  border-top:1px solid rgba(255,255,255,.09);padding-top:clamp(24px,3vw,34px)}
.rl{position:relative;padding-left:20px}
.rl::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;
  background:#7fb0ff;box-shadow:0 0 10px rgba(140,190,255,.75)}
.rl b{display:block;font-size:1.06rem;font-weight:580;letter-spacing:-.022em;color:var(--text)}
.rl span{display:block;margin-top:8px;color:var(--muted);font-size:.9rem;line-height:1.55}
@media (max-width:760px){.layers__grid{grid-template-columns:1fr}}

/* ==========================================================================
   BALANCE PASS - open by default, contained only where containment earns it.
   Roughly two thirds editorial, one third strategic panels.
   ========================================================================== */

/* 2 x 2 open grid. Whitespace does the separating; one rule marks the group. */
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(30px,4.4vw,58px) clamp(34px,5vw,80px);
  padding-top:clamp(28px,3.4vw,42px);margin-top:clamp(6px,1vw,12px);
  border-top:1px solid rgba(255,255,255,.09)}
.mcell{position:relative}
.mcell__v{display:block;font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:640;letter-spacing:-.05em;
  line-height:1;white-space:nowrap;background:linear-gradient(180deg,#fff,#9db2cc);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.mcell__v--long{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.mcell__l{display:block;margin-top:13px;font-size:1rem;letter-spacing:-.014em;color:var(--text);
  line-height:1.35}
.mcell__n{display:block;margin-top:8px;color:var(--dim);font-size:.82rem;line-height:1.5;max-width:42ch}
.mcell__k{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:.5rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  border:1px solid rgba(255,255,255,.13);border-radius:100px;padding:3px 8px}
.mcell__k--source{color:#a8c8ff;border-color:rgba(120,180,255,.3)}
.mcell__k--planning{color:#b7f2d6;border-color:rgba(110,225,175,.3)}
.mcell__k--estimate{color:#ffd7a1;border-color:rgba(255,190,120,.3)}

/* restrained panel - used only where provenance adds authority */
.mcell--panel{padding:clamp(20px,2.4vw,26px) clamp(20px,2.4vw,26px) clamp(22px,2.6vw,28px);
  border:1px solid rgba(255,255,255,.09);border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.006))}

/* economics: two premium products */
.ppair{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(24px,3vw,34px)}
.ppanel{position:relative;overflow:hidden;padding:clamp(26px,3vw,36px) clamp(24px,2.8vw,32px);
  border:1px solid rgba(160,200,255,.22);border-radius:14px;
  background:linear-gradient(180deg,rgba(120,175,255,.09),rgba(120,175,255,.015))}
.ppanel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,#9fc4ff,rgba(120,175,255,.12))}
.ppanel__v{display:block;font-size:clamp(2.2rem,4vw,3rem);font-weight:660;letter-spacing:-.055em;
  line-height:1;background:linear-gradient(180deg,#fff,#a8bcd6);-webkit-background-clip:text;
  background-clip:text;color:transparent}
.ppanel__l{display:block;margin-top:14px;font-size:1.08rem;font-weight:540;letter-spacing:-.02em}
.ppanel__n{display:block;margin-top:9px;color:var(--muted);font-size:.88rem;line-height:1.5}

/* economics: the remaining three, one group, faint dividers */
.plist{margin-top:clamp(26px,3.2vw,40px)}
.plist__r{display:grid;grid-template-columns:minmax(110px,.26fr) 1fr;gap:20px;align-items:baseline;
  padding:clamp(15px,1.8vw,19px) 2px}
.plist__r + .plist__r{border-top:1px solid rgba(255,255,255,.06)}
.plist__v{font-size:clamp(1.25rem,2.1vw,1.6rem);font-weight:620;letter-spacing:-.04em;
  white-space:nowrap;color:#dbe6f5}
.plist__n{font-size:1rem;color:var(--muted);letter-spacing:-.014em}

/* economics: two summary panels closing the section */
.spair{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(30px,4vw,48px)}
.spanel{padding:clamp(22px,2.6vw,30px) clamp(20px,2.4vw,28px);
  border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.018)}
.spanel__v{display:block;font-size:clamp(1.7rem,3vw,2.3rem);font-weight:650;letter-spacing:-.05em;
  line-height:1;white-space:nowrap;background:linear-gradient(180deg,#fff,#9db2cc);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.spanel__v--long{font-size:clamp(1.3rem,2.2vw,1.75rem)}
.spanel__l{display:block;margin-top:12px;font-size:.98rem;letter-spacing:-.014em;line-height:1.35}
.spanel__n{display:block;margin-top:7px;color:var(--dim);font-size:.81rem;line-height:1.5}

/* one methodology line instead of a citation under every figure */
/* sources: present and checkable, but not competing with the figures */
.meth{margin-top:clamp(30px,4vw,48px);padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}
.meth > summary{display:inline-flex;align-items:center;gap:9px;cursor:pointer;list-style:none;
  font-family:var(--mono);font-size:.55rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--muted);padding:4px 0;transition:color .25s var(--ease)}
.meth > summary::-webkit-details-marker{display:none}
.meth > summary::before{content:"";width:7px;height:7px;flex:0 0 auto;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);transition:transform .3s var(--ease)}
.meth[open] > summary::before{transform:rotate(-135deg) translate(-2px,-2px)}
.meth > summary:hover{color:#a8c8ff}
.meth > p{margin-top:10px;color:var(--dim);font-size:.75rem;line-height:1.75;max-width:92ch}
@media (max-width:760px){.meth > p{font-size:.72rem;line-height:1.8}}

@media (max-width:760px){
  .ppair,.spair{grid-template-columns:1fr}
  .mgrid{gap:clamp(26px,6vw,34px) clamp(20px,5vw,28px);
    padding-top:clamp(24px,5vw,30px)}
  .mcell__v{font-size:clamp(1.55rem,7.4vw,2rem)}
  .mcell__v--long{font-size:clamp(1.2rem,5.6vw,1.5rem)}
  .mcell__l{font-size:.9rem;margin-top:10px}
  .mcell__n{font-size:.76rem;margin-top:6px}
  .mcell--panel{padding:18px 16px 20px}
  .plist__r{grid-template-columns:1fr;gap:2px;padding:14px 2px}
  .plist__n{font-size:.92rem}
  .meth{font-size:.73rem}
}

/* ---------- tonal separation: one blue, three depths -----------------------
   scale = blue-black, 2030 = the bluest lift, economics = charcoal-navy.
   Felt before it is noticed; no second brand colour anywhere.             */
.ch--econ{background:linear-gradient(180deg,#080a0e,#10131b 54%,#080a10);
  --wash:rgba(150,190,245,.45);--glow:rgba(110,150,215,.11)}

/* supporting figures pick up a cool ice cast rather than warm grey.
   background-image only: the `background` shorthand resets background-clip
   and the gradient would paint the box instead of the glyphs. */
.mcell__v,.spanel__v{background-image:linear-gradient(180deg,#fff,#9ab3d2)}
.plist__v{color:#d5e2f2}

/* hairlines alternate: a faint blue at group boundaries, neutral inside a group */
.mgrid{border-top-color:rgba(140,180,240,.16)}
.layers__grid{border-top-color:rgba(140,180,240,.16)}
.plist__r + .plist__r{border-top-color:rgba(255,255,255,.055)}
.meth{border-top-color:rgba(255,255,255,.06)}

/* the two premium products carry the faintest blue edge in the section */
.ppanel{border-color:rgba(150,195,255,.26);
  background:linear-gradient(180deg,rgba(125,175,255,.085),rgba(125,175,255,.012))}
.ppanel::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,rgba(160,205,255,.55),transparent 62%)}
.spanel{border-color:rgba(255,255,255,.095);background:rgba(148,178,220,.028)}

.rl__closer{margin-top:clamp(28px,3.6vw,44px);font-size:clamp(1.05rem,1.9vw,1.35rem);font-weight:560;
  letter-spacing:-.028em;color:var(--text)}

/* four capabilities sit 2x2 rather than stranding the fourth */
.layers__grid--4{grid-template-columns:repeat(2,1fr)}
@media (max-width:760px){.layers__grid--4{grid-template-columns:1fr}}

/* the closing CTA centred its heading and copy while the button packed left,
   so the block read as two alignments. Left everything on narrow screens. */
@media (max-width:760px){
  .cta{text-align:left}
  .cta .lede{margin-left:0;margin-right:0}
}

/* hyphenated product terms must not break across a line.
   Needs span.nb and the inherits: component rules like `.rl span` set
   display:block and their own type, which would otherwise capture it. */
span.nb{white-space:nowrap;display:inline;margin:0;padding:0;
  color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;
  letter-spacing:inherit}

/* open cells sitting beside panelled ones take the panel's vertical padding,
   plus its 1px border, so every figure in a row starts on the same line */
.mgrid--mixed .mcell:not(.mcell--panel){
  padding:calc(clamp(20px,2.4vw,26px) + 1px) 0 calc(clamp(22px,2.6vw,28px) + 1px)}

/* ==========================================================================
   AMBIENT MOTION — transform and opacity only, so layout never shifts.
   Everything here is switched off under prefers-reduced-motion at the end.
   ========================================================================== */

/* Only the end-of-line dot is alive; the 40m+ figure stays fully legible.
   The dot pulses and a sonar ring expands off it, like a live beacon.
   3.2s cycle = 0.31 Hz, far below the 3 Hz flash threshold. */
@keyframes beaconDot{
  0%,100%{opacity:.45;transform:scale(.82)}
  50%    {opacity:1;transform:scale(1.12)}
}
@keyframes beaconRing{
  0%  {opacity:.85;transform:scale(1)}
  80% {opacity:0;transform:scale(3.4)}
  100%{opacity:0;transform:scale(3.4)}
}
/* mobile rail: the dot is .tg--b::after, the ring shares its centre */
.traj.on .tg--b::after{animation:beaconDot 3.2s ease-in-out 1.6s infinite;will-change:opacity,transform;
  box-shadow:0 0 12px #fff,0 0 34px rgba(150,205,255,1),0 0 70px rgba(120,180,255,.75)}
.tg--b::before{content:"";position:absolute;top:11px;left:-39.5px;width:13px;height:13px;
  border-radius:50%;box-sizing:border-box;border:1.5px solid rgba(170,215,255,.9);
  opacity:0;pointer-events:none}
.traj.on .tg--b::before{animation:beaconRing 3.2s ease-out 1.6s infinite;will-change:opacity,transform}
@media (min-width:761px){.tg--b::before{display:none}}
/* desktop curve: the end dot pulses; its existing ping ring keeps running */
.traj.on .tdot--b{animation:beaconDot 3.2s ease-in-out 1.6s infinite}

/* section marker dots: a slow tick, never a blink */
@keyframes markerPulse{
  0%,100%{opacity:.55;box-shadow:0 0 6px rgba(140,190,255,.45)}
  50%    {opacity:1;box-shadow:0 0 12px rgba(140,190,255,.95)}
}
.slab.in::before,.layers__h.in::before{animation:markerPulse 4.4s ease-in-out infinite}
.rl.in::before{animation:markerPulse 4.4s ease-in-out infinite}
.rl:nth-child(2).in::before{animation-delay:.5s}
.rl:nth-child(3).in::before{animation-delay:1s}

/* one light sweep across a lead figure as it arrives, then it stops */
@keyframes leadSheen{
  0%  {background-position:-140% 0}
  100%{background-position:240% 0}
}
.mlead.in .mlead__v{
  background-image:linear-gradient(100deg,#fff 0%,#93a9c6 34%,#eaf2ff 47%,#93a9c6 60%,#93a9c6 100%);
  background-size:260% 100%;
  animation:leadSheen 2.4s ease-out .5s 1 both}

/* brand logos settle when a card is hovered */
.pc .stage img{transition:transform .5s var(--ease)}
.pc:hover .stage img{transform:scale(1.045)}

/* engine cards lift with the same hand as the portfolio cards */
.ecard{transition:transform .35s var(--ease),border-color .35s var(--ease),
  background .35s var(--ease)}
.ecard:hover{transform:translateY(-3px)}

/* the leverage core keeps a slow glow on the investors diagram */
@keyframes coreGlow{
  0%,100%{box-shadow:0 0 22px rgba(120,175,255,.22)}
  50%    {box-shadow:0 0 38px rgba(120,175,255,.45)}
}
.lev__core{animation:coreGlow 6.2s ease-in-out infinite}

@media (prefers-reduced-motion:reduce){
  /* Reduce Motion targets movement and scaling. The dot keeps an opacity-only
     pulse; the expanding ring is scaling, so it goes. The figure never moves. */
  @keyframes beaconSoft{0%,100%{opacity:.45}50%{opacity:1}}
  .traj.on .tg--b::after,.traj.on .tdot--b{
    animation:beaconSoft 3.6s ease-in-out 1.2s infinite !important;transform:none !important}
  .traj.on .tg--b::before,
  .slab.in::before,.layers__h.in::before,.rl.in::before,
  .mlead.in .mlead__v,.lev__core{animation:none !important}
  .mlead.in .mlead__v{background-image:linear-gradient(180deg,#fff,#93a9c6)}
  .pc:hover .stage img,.ecard:hover{transform:none}
}

/* Engine cards: left-aligned like the rest of the site rather than centred
   SaaS tiles, each carrying a concrete fact and an obvious open affordance. */
.ecard{text-align:left;align-items:stretch;padding:24px 22px 20px}
.ecard__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.ecard__i{width:50px;height:50px;margin:0}
.ecard__more{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;border:1px solid rgba(255,255,255,.14);color:var(--dim);flex:0 0 auto;
  transition:color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.ecard__more svg{width:14px;height:14px}
.ecard:hover .ecard__more,.ecard.open .ecard__more{color:#cfe4ff;
  border-color:rgba(150,200,255,.5);transform:translateX(2px)}
.ecard b{font-size:1.12rem;letter-spacing:-.022em}
.ecard > span:not(.ecard__top):not(.ecard__m){color:var(--muted);font-size:.92rem;line-height:1.5;
  margin-top:7px;margin-bottom:18px}
.ecard__m{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);
  font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;
  color:#9fc4ff;position:relative}
.ecard__m::before{content:"";position:absolute;left:0;top:-1px;width:28px;height:1px;
  background:linear-gradient(90deg,rgba(150,195,255,.8),transparent)}
@media (max-width:560px){.ecard{padding:20px 18px 18px}.ecard__i{width:44px;height:44px}}

/* Text size rail: lower-left, collapsed to an Aa button until tapped.
   Shares the exact bottom offset and 46px height of the back-to-top button
   so the two sit on the same line. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tsz{position:fixed;left:clamp(16px,3vw,28px);z-index:65;
  bottom:calc(clamp(16px,3vw,28px) + env(safe-area-inset-bottom,0px));
  height:var(--fab);box-sizing:border-box;display:flex;align-items:center;gap:0;
  padding:0 4px 0 0;border-radius:100px;
  border:1px solid rgba(255,255,255,.14);color:#dbe6f5;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02)),rgba(10,14,22,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 34px rgba(0,0,0,.5);
  transition:border-color .3s var(--ease)}
.tsz__t{width:calc(var(--fab) - 4px);height:calc(var(--fab) - 4px);flex:0 0 auto;border:0;background:none;cursor:pointer;color:#dbe6f5;
  font:inherit;font-size:14px;font-weight:600;letter-spacing:-.01em;padding:0;line-height:1;
  display:grid;place-items:center;border-radius:50%}
.tsz__t:hover{color:#fff}
.tsz__p{display:flex;align-items:center;gap:8px;
  max-width:0;opacity:0;pointer-events:none;overflow:hidden;
  transition:max-width .35s var(--ease),opacity .28s var(--ease),padding .35s var(--ease)}
.tsz.open .tsz__p{max-width:150px;opacity:1;pointer-events:auto;padding:0 6px 0 2px}
.tsz.open{border-color:rgba(150,200,255,.34)}
.tsz__b{width:28px;height:28px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;
  cursor:pointer;border:1px solid rgba(255,255,255,.14);color:#dbe6f5;background:rgba(255,255,255,.04);
  font:inherit;font-size:14px;line-height:1;padding:0;
  transition:color .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}
.tsz__b:hover:not(:disabled){border-color:rgba(150,200,255,.5);background:rgba(150,200,255,.12)}
.tsz__b:disabled{opacity:.32;cursor:default}
.tsz__d{display:flex;gap:4px;flex:0 0 auto}
.tsz__d i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.2);
  transition:background .25s var(--ease)}
.tsz__d i.on{background:#9fc4ff}
@media (max-width:380px){.tsz__d{display:none}.tsz.open .tsz__p{max-width:96px}}
@media (prefers-reduced-motion:reduce){.tsz__p{transition:none}}

/* The name section's payoff, set in the two weights the cards use: the heavy
   Quant face for "How much", the light Prima face for "for first?" so the
   wordplay is visible rather than just clever. Homepage only. */
.origin__line--big{margin-top:clamp(40px,6vw,72px);margin-bottom:clamp(8px,1.4vw,18px);
  max-width:none;text-align:center;line-height:1.05;letter-spacing:-.045em;
  font-size:clamp(2rem,5.4vw,3.4rem)}
.origin__line--big .olq,.origin__line--big .olp{
  background:linear-gradient(180deg,#fff,#a8b7cb);-webkit-background-clip:text;
  background-clip:text;color:transparent}
.origin__line--big .olq{font-weight:680}
.origin__line--big .olp{font-weight:230;letter-spacing:-.018em}
@media (max-width:560px){
  .origin__line--big{font-size:clamp(1.9rem,8.6vw,2.4rem);line-height:1.12}
  .origin__line--big .olq,.origin__line--big .olp{display:block}
}

/* Briefing film: a quiet poster until asked, then native controls */
.film{position:relative;margin:0;border-radius:18px;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.09);box-shadow:0 30px 80px -40px rgba(0,0,0,.85)}
.film__v{display:block;width:100%;height:auto;aspect-ratio:1280/536;background:#000}
.film__play{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:clamp(14px,2.4vw,28px);margin:0;border:0;background:linear-gradient(to top,rgba(3,5,10,.62),rgba(3,5,10,0) 46%);color:#fff;font:inherit;text-align:left;cursor:pointer}
.film__play[hidden]{display:none}
.film__pill{display:inline-flex;align-items:center;gap:.75em;padding:.55em 1.1em .55em .55em;border-radius:999px;background:rgba(10,14,24,.72);border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-weight:600;font-size:clamp(.92rem,1.2vw,1.02rem);letter-spacing:.01em;transition:background-color .25s ease,border-color .25s ease,transform .25s ease}
.film__icon{display:grid;place-items:center;width:2.3em;height:2.3em;border-radius:50%;background:#fff;color:#05060a;flex:none}
.film__icon svg{width:1.05em;height:1.05em;margin-left:.12em}
.film__dur{color:var(--muted);font-weight:500;font-variant-numeric:tabular-nums}
.film__play:hover .film__pill{background:rgba(16,22,34,.88);border-color:rgba(255,255,255,.34);transform:translateY(-1px)}
.film__play:focus-visible{outline:none}
.film__play:focus-visible .film__pill{outline:2px solid #7fb2ff;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.film__pill{transition:none}.film__play:hover .film__pill{transform:none}}
@media (max-width:560px){.film{border-radius:14px}.film__play{padding:10px}.film__pill{font-size:.84rem;gap:.55em;padding:.38em .85em .38em .38em}.film__icon{width:1.95em;height:1.95em}}

/* FAQ: each answer collapsed behind its question, so the page scans in seconds */
.faq__i{border-bottom:1px solid rgba(255,255,255,.1);padding:0;margin:0}
.faq__i > summary{padding:1.15em 2.2em 1.15em 0;position:relative;display:block;width:100%}
.faq__i > summary h2{margin:0;font-size:clamp(1.02rem,1.9vw,1.2rem);line-height:1.35;
  font-weight:600;color:#eef3fb;letter-spacing:-.01em;
  font-family:var(--font);text-transform:none}
.faq__i > summary::before{position:absolute;right:4px;top:50%;margin:0;
  transform:rotate(45deg) translate(-50%,-50%);transform-origin:0 0}
.faq__i[open] > summary::before{transform:rotate(-135deg) translate(-50%,-50%)}
.faq__i > summary:hover h2{color:#a8c8ff}
.faq__i > p{margin:0 0 1.5em;max-width:62ch;color:#a2abb8}

/* Trajectory rail: the curve rises through the middle label's baseline, so lift
   that one label clear of it. Desktop only; below 760px the rail is vertical. */
@media (min-width:761px){
  .tg--m{transform:translateY(-30px)}
}