/* ═══════════════════════════════════════════════════════════════════════════
   kliktron.space · V1.2 (PROTOTYPE 2)
   Design system: Deck V2. Ice/white ground, Rubik Medium headlines in blue,
   Inter body, lime only on dark, horizontal rules only.
   No inline styles anywhere (CSP style-src 'self'); JS only sets CSSOM values.
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face{font-family:"Rubik";src:url(../fonts/rubik-var.woff2) format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --ink:#0B1D3F; --ink-2:#2B3A58; --muted:#5A6B8C; --faint:#8593AE;
  --navy:#061436; --blue:#1269F7; --blue-deep:#0A3DA8; --blue-2:#3D86FF; --blue-soft:#9DB6E8;
  --pale:#DCE7FF; --ice:#F3F7FF; --ice-2:#EAF1FF;
  --lime:#C9FA64; --amber:#FCA649; --mint:#49E889; --violet:#EE8DFF;
  --t-silver:#79839A; --t-gold:#FCA649; --t-crystal:#49E889; --t-project:#1269F7;
  --line:rgba(11,29,63,.10); --line-2:rgba(11,29,63,.16);
  --head:"Rubik",system-ui,-apple-system,"Segoe UI",sans-serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,"Cascadia Code",Consolas,Menlo,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --wrap:1240px; --gutter:clamp(16px,4vw,40px);
  --navh:68px;
  --sh-1:0 1px 2px rgba(11,29,63,.05),0 8px 24px -10px rgba(11,29,63,.14);
  --sh-2:0 2px 6px rgba(11,29,63,.06),0 26px 60px -24px rgba(11,29,63,.32);
  --sh-3:0 40px 120px -30px rgba(6,20,54,.55);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
html.lock,html.lock body{overflow:hidden}
html.lock body{padding-right:var(--sbw,0)}
img,svg,canvas{display:block;max-width:100%}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:8px}
::selection{background:var(--lime);color:var(--navy)}
[hidden]{display:none !important}
html[data-lang="zh"] body{line-height:1.75}
.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}

.wrap{width:100%;max-width:calc(var(--wrap) + var(--gutter) * 2);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:12px;top:-60px;z-index:999;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;transition:top .2s}
.skip:focus{top:12px}

/* ─── type ─── */
.h2{font-family:var(--head);font-weight:300;font-size:clamp(30px,4.1vw,54px);line-height:1.08;letter-spacing:-.03em;color:var(--blue);max-width:22ch;text-wrap:balance}
.h2 strong{font-weight:500}
.h2--dark{color:#fff}
.h2--dark strong{color:var(--lime)}
.h2--page{font-size:clamp(34px,4.8vw,64px)}
.lede{font-size:clamp(16px,1.3vw,18px);line-height:1.7;color:var(--ink-2);max-width:56ch}
.lede--dark{color:rgba(255,255,255,.8)}
.tag{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:99px;background:var(--ice-2);border:1px solid rgba(18,105,247,.18);
  color:var(--blue);font-size:12px;font-weight:600;letter-spacing:.01em;white-space:nowrap}

/* section head: headline left, body right on the same band */
.shead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px clamp(32px,5vw,80px);align-items:end}
.shead .h2{max-width:20ch}
.shead .lede{justify-self:end;max-width:48ch;padding-bottom:.35em}
.h2--3l .ln{display:block}
.h2--3l{max-width:none}

/* ─── buttons ─── */
.btn{--bh:48px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;height:var(--bh);padding:0 22px;border-radius:12px;
  font-size:15px;font-weight:600;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;isolation:isolate;
  transition:transform .25s var(--ease),background-color .25s,color .25s,box-shadow .3s var(--ease),border-color .25s}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn:active{transform:scale(.97)}
.btn--sm{--bh:40px;padding:0 16px;font-size:14px;border-radius:10px}
.btn--block{width:100%}
.btn--primary{background:var(--blue);color:#fff;box-shadow:0 10px 24px -12px rgba(18,105,247,.7)}
.btn--primary:hover{background:var(--blue-deep);box-shadow:0 14px 30px -12px rgba(18,105,247,.8)}
.btn--ghost{background:rgba(255,255,255,.7);color:var(--ink);border:1px solid var(--line-2)}
.btn--ghost:hover{background:#fff;border-color:rgba(18,105,247,.45);color:var(--blue)}
.btn--lime{background:var(--lime);color:var(--navy)}
.btn--lime:hover{background:#d8ff86}
.btn--white{background:#fff;color:var(--navy)}
.btn--white:hover{background:var(--ice)}
.btn--glass{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.45)}
.btn--glass:hover{background:rgba(255,255,255,.28)}
.ripple{position:absolute;border-radius:50%;pointer-events:none;background:currentColor;opacity:.22;transform:scale(0);animation:ripple .6s var(--ease) forwards;z-index:-1}
@keyframes ripple{to{transform:scale(1);opacity:0}}

/* ─── reveal ─── */
html.js .rv{opacity:0;transform:translate3d(0,26px,0);transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)}
html.js .rv.in,html.rv-off .rv{opacity:1;transform:none}
.is-source{opacity:0 !important;transition:none !important}

/* ═════════════ NAV ═════════════ */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:transform .45s var(--ease)}
.nav::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);
  border-bottom:1px solid var(--line);opacity:0;transition:opacity .3s}
.nav.is-solid::before,.nav.is-open::before,.nav.menu-open::before{opacity:1}
.nav.is-hidden{transform:translate3d(0,-100%,0)}
.nav__prog{position:absolute;left:0;right:0;bottom:-1px;height:2px;z-index:2;pointer-events:none}
.nav__prog i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--blue),var(--mint));transform-origin:0 50%;transform:scaleX(0)}
.nav__bar{position:relative;display:flex;align-items:center;height:var(--navh);gap:20px}
.nav__logo{display:flex;align-items:flex-start;gap:1px;flex:none}
.nav__logo img{height:27px;width:auto}
.nav__logo sup{font-size:10px;font-weight:600;color:var(--blue);line-height:1;margin-top:-1px}
.nav__menu{margin:0 auto}
.nav__menu ul{display:flex;gap:4px}
.nav__item{display:flex;align-items:center;gap:2px;height:40px;padding:0 8px 0 14px;border-radius:10px;font-size:15px;font-weight:500;color:var(--ink-2);transition:background-color .2s,color .2s}
.nav__link{padding:0 14px}
.nav__chev{display:grid;place-items:center;width:22px;height:26px;border-radius:7px;transition:background-color .2s}
.nav__chev svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.nav__item:hover{background:rgba(18,105,247,.07);color:var(--blue)}
.nav__item:hover .nav__chev{background:rgba(18,105,247,.1)}
.nav__item[aria-expanded="true"]{background:rgba(18,105,247,.1);color:var(--blue)}
.nav__item[aria-expanded="true"] .nav__chev svg{transform:rotate(180deg)}
.nav__link[aria-current="page"]{color:var(--blue);background:rgba(18,105,247,.08)}
.nav__right{display:flex;align-items:center;gap:10px;flex:none}

.lang{position:relative}
.lang__btn{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.6);transition:border-color .2s,background-color .2s,color .2s}
.lang__btn:hover,.lang__btn[aria-expanded="true"]{border-color:rgba(18,105,247,.45);background:#fff;color:var(--blue)}
.lang__globe{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lang__list{position:absolute;right:0;top:calc(100% + 8px);width:250px;padding:6px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2);animation:pop .28s var(--ease)}
.lang__list button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;text-align:left;font-size:14px;transition:background-color .2s}
.lang__list button b{min-width:34px;font-size:12px;letter-spacing:.06em;color:var(--blue)}
.lang__list button:hover{background:var(--ice)}
.lang__list button[aria-checked="true"]{background:var(--ice-2)}
.lang__list button[aria-checked="true"]::after{content:"";margin-left:auto;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.lang__note{padding:8px 12px 6px;font-size:11.5px;line-height:1.45;color:var(--faint);border-top:1px solid var(--line);margin-top:4px}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}

.nav__burger{display:none;width:42px;height:42px;border-radius:11px;border:1px solid var(--line-2);background:rgba(255,255,255,.7);position:relative}
.nav__burger span{position:absolute;left:12px;right:12px;height:2px;border-radius:2px;background:var(--ink);transition:transform .35s var(--ease),top .35s var(--ease)}
.nav__burger span:first-child{top:16px}
.nav__burger span:last-child{top:24px}
.nav__burger[aria-expanded="true"] span:first-child{top:20px;transform:rotate(45deg)}
.nav__burger[aria-expanded="true"] span:last-child{top:20px;transform:rotate(-45deg)}

/* mega menu · panels slide when switching (Stripe pattern) */
.mega{position:absolute;left:0;right:0;top:100%;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  border-bottom:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(11,29,63,.3);animation:megaIn .3s var(--ease)}
@keyframes megaIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.mega__in{padding-top:26px;padding-bottom:30px}
.mega__stage{position:relative;overflow:hidden;transition:height .45s var(--ease)}
.mpanel{position:absolute;left:0;right:0;top:0;display:grid;grid-template-columns:260px 1fr;gap:40px;transition:transform .45s var(--ease),opacity .35s var(--ease)}
.mpanel.is-in{position:relative;opacity:1;transform:none}
.mpanel.from-right,.mpanel.to-right{opacity:0;transform:translateX(56px)}
.mpanel.from-left,.mpanel.to-left{opacity:0;transform:translateX(-56px)}
.mpanel.to-left,.mpanel.to-right{pointer-events:none}
.mpanel__intro h3{font-family:var(--head);font-weight:500;font-size:26px;letter-spacing:-.02em;color:var(--blue);line-height:1.1}
.mpanel__intro p{margin-top:10px;font-size:14px;line-height:1.55;color:var(--muted)}
.mpanel__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 18px}
.mpanel__grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mpanel__grid--4{grid-template-columns:1.15fr 1fr 1fr 1fr}
.mcol h4{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:6px 12px 6px}
.mi{position:relative;display:flex;gap:12px;align-items:flex-start;width:100%;padding:11px 12px;border-radius:12px;text-align:left;transition:background-color .2s}
.mi:hover{background:var(--ice)}
.mi__ic{flex:none;width:36px;height:36px;border-radius:10px;background:var(--ice-2);display:grid;place-items:center;overflow:hidden}
.mi__ic img{width:30px;height:30px}
.mi__t{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.mi__d{display:block;font-size:13px;line-height:1.45;color:var(--muted);margin-top:2px}
.mi:hover .mi__t{color:var(--blue)}
.mi--sm{padding:7px 12px}
.mi--sm .mi__t{font-weight:500;font-size:14px}
.mcard{padding:16px;border-radius:16px;border:1px solid var(--line);background:#fff}
.mcard small{display:block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.mcard b{display:block;font-family:var(--head);font-weight:500;font-size:20px;letter-spacing:-.02em;color:var(--blue);margin-top:8px}
.mcard span{display:block;font-size:13px;color:var(--muted);margin-top:2px}

/* mobile sheet */
.mnav{position:fixed;left:0;right:0;top:var(--navh);bottom:0;z-index:99;background:#fff;display:flex;flex-direction:column;animation:sheetIn .35s var(--ease)}
@keyframes sheetIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.mnav__scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px var(--gutter) 20px}
.mnav__foot{padding:14px var(--gutter) max(14px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.mgrp{border-bottom:1px solid var(--line)}
.mgrp__q{width:100%;display:flex;align-items:center;justify-content:space-between;padding:18px 2px;font-family:var(--head);font-size:22px;font-weight:500;letter-spacing:-.02em;text-align:left}
.mgrp__q svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .3s var(--ease)}
.mgrp__q[aria-expanded="true"]{color:var(--blue)}
.mgrp__q[aria-expanded="true"] svg{transform:rotate(180deg)}
a.mgrp__q{color:var(--ink)}
.mgrp__a{padding:0 0 14px}
.mgrp__a .mi{padding:10px 8px}
.mgrp__a h4{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:12px 8px 4px}
.mnav .mpanel{position:relative;display:block;transform:none;opacity:1}
.mnav .mpanel__intro{display:none}
.mnav .mpanel__grid{grid-template-columns:1fr;gap:0}
.mnav .mcard{margin:6px 0}
.mlang{display:flex;gap:8px;padding:18px 0 4px}
.mlang button{flex:1;height:42px;border-radius:10px;border:1px solid var(--line-2);font-size:13px;font-weight:600}
.mlang button[aria-checked="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.mco{margin-top:22px;padding:20px 18px;border-radius:18px;background:var(--ice)}
.mco img{height:24px;width:auto}
.mco p{margin-top:12px;font-family:var(--head);font-size:17px;line-height:1.35;color:var(--blue)}
.mco small{display:block;margin-top:12px;font-size:13px;line-height:1.55;color:var(--muted)}
.mco small b{color:var(--ink);font-weight:600}

/* ═════════════ HERO ═════════════ */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;overflow:hidden;background:#fff;isolation:isolate}
.hero__field{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.hero__wash{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(60% 55% at 88% 78%,rgba(201,250,100,.28),rgba(201,250,100,0) 70%),
  radial-gradient(55% 60% at 78% 18%,rgba(18,105,247,.12),rgba(18,105,247,0) 70%),
  radial-gradient(70% 70% at 10% 90%,rgba(220,231,255,.9),rgba(220,231,255,0) 70%),
  linear-gradient(180deg,#fff 0%,var(--ice) 100%)}
.hero__in{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:space-between;min-height:100vh;min-height:100svh;
  padding-top:calc(var(--navh) + clamp(40px,11vh,130px));padding-bottom:clamp(40px,8vh,84px);pointer-events:none}
.hero__in > *{pointer-events:auto}
.hero__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:12.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.hero__meta > b:first-child{font-weight:700;color:var(--ink)}
.hero__live{display:inline-flex;align-items:center;gap:8px;padding-left:14px;border-left:1px solid var(--line-2)}
.hero__live i{position:relative;width:7px;height:7px;border-radius:50%;background:var(--mint)}
.hero__live i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--mint);animation:pulse 2s var(--ease) infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.4);opacity:0}}
.hero__count{font-family:var(--head);font-size:15px;font-weight:600;letter-spacing:.02em;color:var(--blue);font-variant-numeric:tabular-nums;display:inline-block;min-width:9ch;text-align:left}
.hero__count.tick{animation:tick .7s var(--ease)}
@keyframes tick{0%{color:var(--mint);transform:translateY(-3px)}100%{color:var(--blue);transform:none}}
.hero__title{font-family:var(--head);font-weight:500;font-size:clamp(44px,6.5vw,96px);line-height:1;letter-spacing:-.04em;color:var(--blue);margin-top:34px}
.hero__title .ln{display:block}
.hero__title .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.hero__title .w > i{display:inline-block;font-style:normal;will-change:transform}
html.js:not(.rv-off) .hero__title:not(.split-done){opacity:0}
.hero__sub{margin-top:clamp(36px,7vh,76px);font-size:clamp(18px,1.75vw,25px);line-height:1.45;font-weight:400;letter-spacing:-.01em;color:var(--ink)}
.hero__sub .ln{display:block}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.hero__logo{position:absolute;z-index:1;right:max(-6vw,-90px);bottom:-13vw;width:min(47vw,720px);pointer-events:none}
.hero__logo-float{will-change:transform}
.hero__logo img{width:100%;height:auto;filter:drop-shadow(0 40px 60px rgba(18,105,247,.28)) drop-shadow(0 12px 22px rgba(11,29,63,.16))}

/* ═════════════ TICKER ═════════════ */
.ticker{position:relative;z-index:3;background:var(--blue);color:#fff;overflow:hidden;height:46px;display:flex;align-items:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.ticker__track{display:flex;width:max-content;animation:ticker 60s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
.ticker__group{display:flex;flex:none}
.ticker__group li{display:flex;align-items:center;white-space:nowrap;font-size:14px;letter-spacing:.01em;padding:0 22px;color:rgba(255,255,255,.88)}
.ticker__group li b{font-weight:600;color:#fff;margin-right:6px}
.ticker__group li::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime);margin-left:44px;flex:none}
@keyframes ticker{to{transform:translate3d(-50%,0,0)}}

/* ═════════════ SECTIONS ═════════════ */
.sec{position:relative;padding:clamp(84px,10vw,140px) 0}

/* ─── value ─── */
.value__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,5vw,72px);align-items:center}
.value .h2{max-width:17ch}
.value .lede{margin-top:26px}
.value__cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.vcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:14px 14px 22px;box-shadow:var(--sh-1);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .3s}
.vcard:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:rgba(18,105,247,.25)}
.vcard__viz{height:132px;border-radius:14px;background:var(--ice);overflow:hidden}
.vcard__viz canvas{width:100%;height:100%}
.vcard h3{font-family:var(--head);font-weight:500;font-size:19px;letter-spacing:-.02em;color:var(--ink);margin:18px 6px 0}
.vcard p{font-size:14.5px;line-height:1.6;color:var(--muted);margin:8px 6px 0}

/* ─── how (AOS) ─── */
.how{color:#fff;overflow:hidden;isolation:isolate;background:var(--navy);padding:clamp(72px,8vw,112px) 0}
.how__bg{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(60% 50% at 70% 60%,rgba(18,105,247,.55),rgba(18,105,247,0) 70%),
  radial-gradient(40% 40% at 12% 12%,rgba(61,134,255,.35),rgba(61,134,255,0) 70%),
  radial-gradient(35% 35% at 95% 95%,rgba(201,250,100,.14),rgba(201,250,100,0) 70%),
  linear-gradient(160deg,#061436 0%,#0A2A7A 55%,#0A3DA8 100%)}
.how__bg::after{content:"";position:absolute;inset:0;opacity:.35;
  background-image:radial-gradient(rgba(255,255,255,.35) 1px,transparent 1.2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(70% 70% at 60% 50%,#000,transparent);mask-image:radial-gradient(70% 70% at 60% 50%,#000,transparent)}
.how .shead .h2{max-width:21ch}
.aos{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,60px);align-items:center;margin-top:clamp(40px,5vw,64px)}
.aos__stage{position:relative;max-width:600px;width:100%;justify-self:center}
.aos__svg{width:100%;height:auto;overflow:visible}
.aos__svg .aos-ring{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1.4}
.aos__svg .spoke{stroke:rgba(255,255,255,.16);stroke-width:1.4;transition:stroke .5s}
.aos__svg .spoke.on{stroke:rgba(201,250,100,.75)}
.aos__svg .node{cursor:pointer;outline:none}
.aos__svg .node-c{transition:transform .6s var(--ease),stroke-width .4s;transform-box:fill-box;transform-origin:center;stroke:rgba(255,255,255,0);stroke-width:0}
.aos__svg .node:hover .node-c,.aos__svg .node:focus-visible .node-c{transform:scale(1.04)}
.aos__svg .node.on .node-c{transform:scale(1.08);stroke:#fff;stroke-width:4}
.aos__svg .node-halo{fill:none;stroke:rgba(255,255,255,.5);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
.aos__svg .node.on .node-halo{animation:halo 2.2s var(--ease) infinite}
@keyframes halo{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
.aos__svg .n-t{font-family:var(--body);font-weight:700;font-size:21px;letter-spacing:-.01em}
.aos__svg .n-s{font-family:var(--body);font-weight:400;font-size:17px}
.aos__svg .n-m{display:none;font-family:var(--body);font-weight:700;font-size:25px}
.aos__svg .core-c{fill:#0A3DA8;stroke:rgba(255,255,255,.28);stroke-width:2}
.aos__svg .core-pulse{fill:none;stroke:rgba(201,250,100,.6);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:halo 3s var(--ease) infinite}
.aos__svg .pk{filter:url(#aosGlow)}

/* rotating card deck (Showcase 3 · rotasi card) */
.aos__deck{display:flex;flex-direction:column;align-items:center;min-width:0}
.rcar{--cw:300px;--ch:440px;position:relative;width:100%;height:calc(var(--ch) + 40px);perspective:1400px;touch-action:pan-y;user-select:none;-webkit-user-select:none;
  cursor:grab;outline:none;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 84%,transparent 100%)}
.rcar.dragging{cursor:grabbing}
.rcar:focus-visible{outline:2px solid var(--lime);outline-offset:4px;border-radius:24px}
.rcar__ring{position:absolute;left:50%;top:20px;width:var(--cw);height:var(--ch);margin-left:calc(var(--cw) / -2);transform-style:preserve-3d;will-change:transform}
.rcard{position:absolute;inset:0;display:flex;flex-direction:column;padding:26px 24px 22px;border-radius:26px;background:var(--cbg,#1269F7);color:var(--cfg,#fff);
  -webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0 30px 70px -28px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.25);overflow:hidden}
.rcard::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 70% at 100% 0%,rgba(255,255,255,.28),rgba(255,255,255,0) 55%)}
.rcard__n{position:relative;font-family:var(--head);font-weight:600;font-size:56px;line-height:1;letter-spacing:-.04em}
.rcard__of{position:relative;margin-top:6px;font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;opacity:.7}
.rcard h3{position:relative;margin-top:22px;font-family:var(--head);font-weight:500;font-size:30px;letter-spacing:-.025em;line-height:1.05}
.rcard__role{position:relative;display:inline-flex;align-self:flex-start;margin-top:10px;padding:4px 11px;border-radius:99px;font-size:12px;font-weight:600;letter-spacing:.03em;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.35)}
.rcard--light .rcard__role{background:rgba(11,29,63,.08);border-color:rgba(11,29,63,.14)}
.rcard__body{position:relative;margin-top:14px;font-size:14.5px;line-height:1.6;opacity:.92}
.rcard__core{position:relative;margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.3);font-size:11.5px;line-height:1.5;opacity:.85}
.rcard--light .rcard__core{border-top-color:rgba(11,29,63,.18)}
.rcard__core b{display:block;font-weight:700;font-size:12px;margin-bottom:2px}
.rcar__foot{display:flex;justify-content:center;width:100%;margin-top:6px}
.rcar__dots{display:flex;gap:8px}
.rcar__dots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.28);transition:background-color .3s,transform .3s var(--ease)}
.rcar__dots button[aria-current="true"]{background:var(--lime);transform:scale(1.3)}

/* ─── journey (pinned stack) ─── */
.journey{padding-bottom:0;isolation:isolate;background:radial-gradient(60% 50% at 85% 10%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%),radial-gradient(50% 40% at 0% 100%,rgba(143,214,43,.45),rgba(143,214,43,0) 70%),linear-gradient(180deg,#D6FC85 0%,#C9FA64 45%,#BCF052 100%)}
.journey__bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.journey__bg canvas{position:sticky;top:0;display:block;width:100%;height:100vh;height:100svh}
.journey > .wrap,.journey .jpin{position:relative;z-index:1}
.journey .lede{color:var(--ink)}
.jpin{position:relative;height:420vh}
.jpin__sticky{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;padding-top:calc(var(--navh) * .5)}
.jpin__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,56px);height:min(72vh,640px)}
.jframe{display:flex;flex-direction:column;height:100%;border-radius:26px;background:#fff;border:1px solid rgba(11,29,63,.08);box-shadow:0 1px 2px rgba(11,29,63,.06),0 22px 50px -26px rgba(11,29,63,.4);overflow:hidden}
.jframe__stage{position:relative;flex:1;min-height:0;overflow:hidden;background:
  radial-gradient(60% 60% at 80% 20%,rgba(18,105,247,.16),rgba(18,105,247,0) 70%),
  radial-gradient(50% 50% at 15% 90%,rgba(201,250,100,.25),rgba(201,250,100,0) 70%),var(--ice)}
.jframe__stage::before{content:"";position:absolute;inset:0;opacity:.6;background-image:radial-gradient(rgba(18,105,247,.18) 1px,transparent 1.2px);background-size:22px 22px}
.jshot{position:absolute;inset:0;opacity:0;transform:scale(.96) translateY(14px);transition:opacity .6s var(--ease),transform .8s var(--ease);pointer-events:none}
.jshot.on{opacity:1;transform:none}
.jshot img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.jshot--phone img{height:86%;width:auto;border-radius:26px;border:7px solid var(--navy);box-shadow:0 30px 60px -20px rgba(11,29,63,.45);background:#fff}
.jshot--mock img{height:94%;width:auto;filter:drop-shadow(0 26px 40px rgba(11,29,63,.35))}
.jshot--desk img{width:88%;height:auto;max-height:82%;object-fit:cover;object-position:top left;border-radius:12px;border-top:22px solid #E6ECF7;box-shadow:0 30px 70px -24px rgba(11,29,63,.5)}
.jframe__cap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-top:1px solid var(--line);font-size:14px;color:var(--muted);min-height:70px}
.jframe__cap b{color:var(--ink);font-weight:600}
#jCap.swap{animation:swapIn .5s var(--ease)}
@keyframes swapIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.jring{flex:none;width:44px;height:44px;transform:rotate(-90deg)}
.jring circle{fill:none;stroke-width:3.5}
.jring__bg{stroke:var(--pale)}
.jring__fg{stroke:var(--blue);stroke-linecap:round;stroke-dasharray:100.53;stroke-dashoffset:83.8;transition:stroke-dashoffset .7s var(--ease)}
.jring text{transform:rotate(90deg);transform-origin:20px 20px;font-family:var(--body);font-size:13px;font-weight:700;fill:var(--ink)}
.jstack{--hh:58px;position:relative;height:100%;overflow:hidden;border-radius:22px;border:1.5px solid var(--blue);background:#fff;
  box-shadow:0 1px 2px rgba(11,29,63,.06),0 22px 50px -26px rgba(11,29,63,.4)}
.jcard{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;background:#fff;border-top:1.5px solid var(--blue);padding:0 26px 22px;
  box-shadow:0 -14px 26px -20px rgba(11,29,63,.4);will-change:transform}
.jcard:first-child{border-top:0;box-shadow:none}
.jcard__top{display:flex;align-items:center;gap:14px;height:var(--hh)}
.jcard__n{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--blue);letter-spacing:.06em;min-width:22px}
.jcard h3{flex:1;font-family:var(--head);font-weight:500;font-size:22px;letter-spacing:-.02em;color:var(--ink);line-height:1.1;transition:font-size .5s var(--ease)}
.jcard.on h3{font-size:clamp(28px,2.6vw,38px)}
.jcard.on .jcard__top{height:calc(var(--hh) + 18px);align-items:flex-end;padding-bottom:4px}
.jcard > p:not(.jcard__res),.jcard__list,.jcard__res{opacity:0;transform:translateY(8px);transition:opacity .45s var(--ease),transform .5s var(--ease)}
.jcard.on > p:not(.jcard__res),.jcard.on .jcard__list,.jcard.on .jcard__res{opacity:1;transform:none}
.jcard.on .jcard__list{transition-delay:.12s}
.jcard.on .jcard__res{transition-delay:.2s}
.jcard > p:not(.jcard__res){margin-top:12px;font-size:16.5px;line-height:1.65;color:var(--ink-2);max-width:46ch}
.jcard__list{margin-top:16px;display:grid;gap:8px}
.jcard__list li{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.jcard__list li::before{content:"";width:18px;height:18px;margin-top:1px;border-radius:50%;background:var(--ice-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 8.2 2.3 2.3 4.7-4.9' fill='none' stroke='%231269F7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.jcard__res{margin-top:auto;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--ice);border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--ink)}
.jcard.measure .jcard__res{margin-top:18px}
.jcard__res small{flex:none;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--blue);border-radius:99px;padding:3px 9px}
.jcard.is-lite .jcard__list,.jcard.is-min .jcard__res{display:none}

/* ─── proof ─── */
.proof{background:var(--ice)}
.proof__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:clamp(40px,5vw,60px)}
.pcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:30px;overflow:hidden;cursor:pointer;
  box-shadow:var(--sh-1);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.pcard__media{position:relative;aspect-ratio:16/11;overflow:hidden;margin:10px 10px 0;border-radius:22px;background:#dfe7f6;isolation:isolate}
.pcard__media--dark{background:#0b0f18}
.pcard__bg{position:absolute;left:-7%;top:-7%;width:114%;height:114%;max-width:none;object-fit:cover}
.pcard__tint{position:absolute;inset:0;background:linear-gradient(160deg,rgba(18,105,247,.35),rgba(6,20,54,.25))}
.pcard__tint--dark{background:linear-gradient(160deg,rgba(6,20,54,.2),rgba(6,20,54,.65))}
[data-depth]{will-change:transform}
.mock{position:absolute;border-radius:18px;padding:14px 16px;font-size:12px;box-shadow:0 30px 60px -20px rgba(6,20,54,.55)}
.mock__head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:12.5px}
.mock__head em{margin-left:auto;font-style:normal;font-weight:500;font-size:11px;opacity:.6}
.mock__dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 3px rgba(73,232,137,.2)}
.mock--report{left:7%;top:8%;width:min(62%,330px);background:#fff;color:var(--ink)}
.mock__ring{display:flex;align-items:center;gap:14px;margin:12px 0 8px}
.mock__ring svg{width:62px;height:62px;transform:rotate(-90deg);flex:none}
.mock__ring circle{fill:none;stroke-width:7}
.mr-bg{stroke:var(--pale)}
.mr-fg{stroke:var(--blue);stroke-linecap:round;stroke-dasharray:201.06;stroke-dashoffset:201.06;transition:stroke-dashoffset .8s var(--ease)}
.mock__ring b{font-family:var(--head);font-weight:600;font-size:28px;letter-spacing:-.02em;color:var(--blue);font-variant-numeric:tabular-nums}
.mock__ring span{font-family:var(--head);font-size:16px;color:var(--faint)}
.mock__ring small{display:block;font-size:11px;color:var(--muted)}
.mock__bar{height:5px;border-radius:5px;background:var(--pale);overflow:hidden;margin-bottom:6px}
.mock__bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--mint));transition:width .8s var(--ease)}
.mock__rows li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--line);font-size:11.5px}
.mock__rows li.new{animation:rowIn .6s var(--ease)}
@keyframes rowIn{from{opacity:0;transform:translateY(-8px);background:rgba(73,232,137,.18)}to{opacity:1;transform:none}}
.mock__rows time{font-family:var(--mono);color:var(--muted)}
.mock__rows span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mock__rows i{font-style:normal;font-size:10px;font-weight:700;padding:2px 7px;border-radius:99px;background:rgba(73,232,137,.16);color:#15803D}
.mock--fleet{right:6%;top:10%;width:min(66%,360px);background:rgba(11,17,32,.86);color:#fff;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.mock__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.mock__kpis div{padding:10px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.mock__kpis small{display:block;font-size:10px;color:rgba(255,255,255,.55)}
.mock__kpis b{display:block;font-family:var(--head);font-weight:600;font-size:18px;margin-top:4px;font-variant-numeric:tabular-nums}
.mock__kpis .warn b{color:var(--amber)}
.mock__grid{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin-top:10px}
.mock__grid i{aspect-ratio:1;border-radius:5px;background:rgba(73,232,137,.75);transition:background-color .4s}
.mock__grid i.w{background:var(--amber)}
.mock__grid i.flash{background:var(--lime)}
.mock-chip{position:absolute;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap;
  background:rgba(255,255,255,.82);color:var(--ink);border:1px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 14px 30px -14px rgba(6,20,54,.5)}
.mock-chip svg{width:12px;height:12px;fill:var(--blue);stroke:var(--blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.mock-chip i{width:8px;height:8px;border-radius:50%;background:var(--mint)}
.mock-chip--a{right:7%;top:46%}
.mock-chip--b{left:12%;bottom:8%}
.mock-chip--c{left:7%;bottom:12%}
.mock-chip--c svg{fill:none}
.mock-chip--d{right:8%;bottom:12%}
.pcard__body{padding:24px 28px 30px}
.pcard__tag{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.pcard__tag span{color:var(--faint);letter-spacing:.06em}
.pcard h3{font-family:var(--head);font-weight:500;font-size:clamp(26px,2.5vw,34px);letter-spacing:-.025em;margin-top:10px;line-height:1.1}
.pcard__body p:last-child{margin-top:10px;font-size:15.5px;line-height:1.65;color:var(--muted);max-width:52ch}
.plus{position:absolute;right:22px;top:22px;z-index:3;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:rgba(11,29,63,.38);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.55);color:#fff;
  transition:transform .5s var(--ease),background-color .3s,border-color .3s}
.plus svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.pcard:hover .plus,.pcard:focus-visible .plus{transform:rotate(90deg);background:var(--blue);border-color:var(--blue)}
.pcard:focus-visible,.scard:focus-visible{outline:3px solid var(--blue);outline-offset:4px}

/* ─── solutions: blue cards, drifting background ─── */
.solutions{overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--ice-2) 0%,#D6E4FF 100%)}
.solutions__bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.solutions__bg i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.75;will-change:transform}
.solutions__bg i:nth-child(1){width:46vmax;height:46vmax;left:-12%;top:-18%;background:rgba(18,105,247,.22);animation:drift1 22s ease-in-out infinite}
.solutions__bg i:nth-child(2){width:36vmax;height:36vmax;right:-10%;top:10%;background:rgba(201,250,100,.4);animation:drift2 26s ease-in-out infinite}
.solutions__bg i:nth-child(3){width:30vmax;height:30vmax;left:30%;bottom:-20%;background:rgba(238,141,255,.2);animation:drift3 19s ease-in-out infinite}
@keyframes drift1{50%{transform:translate(10vw,8vh) scale(1.1)}}
@keyframes drift2{50%{transform:translate(-12vw,10vh) scale(.9)}}
@keyframes drift3{50%{transform:translate(8vw,-10vh) scale(1.15)}}
.sol__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:clamp(40px,5vw,60px)}
.scard{--mx:50%;--my:0%;position:relative;display:flex;flex-direction:column;border-radius:28px;padding:10px;cursor:pointer;color:#fff;overflow:hidden;
  background:linear-gradient(165deg,#1f74ff 0%,#1269F7 40%,#0A3DA8 100%);
  box-shadow:0 1px 2px rgba(11,29,63,.08),0 30px 60px -30px rgba(10,61,168,.7);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.scard::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .45s var(--ease);
  background:radial-gradient(420px circle at var(--mx) var(--my),rgba(255,255,255,.24),rgba(255,255,255,0) 60%)}
.scard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.22);transition:border-color .4s}
.scard:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 1px 2px rgba(11,29,63,.08),0 44px 80px -30px rgba(10,61,168,.8)}
.scard:hover::before{opacity:1}
.scard:hover::after{border-color:rgba(255,255,255,.5)}
.scard .plus{right:30px;top:30px}
.scard:hover .plus,.scard:focus-visible .plus{transform:rotate(90deg);background:var(--lime);border-color:var(--lime);color:var(--navy)}
.scard__media{position:relative;aspect-ratio:4/3.1;border-radius:20px;overflow:hidden;background:#0a1b4a}
.scard__media img{position:absolute;left:-8%;top:-8%;width:116%;height:116%;max-width:none;object-fit:cover}
.scard__body{position:relative;z-index:2;display:flex;flex-direction:column;flex:1;padding:22px 14px 14px}
.scard__kick{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.scard__kick span{font-family:var(--mono);letter-spacing:.04em;color:var(--navy);background:var(--lime);border-radius:99px;padding:2px 8px}
.scard h3{font-family:var(--head);font-weight:500;font-size:clamp(26px,2.4vw,32px);letter-spacing:-.03em;margin-top:12px;line-height:1.05}
.scard__desc{margin-top:10px;font-size:15px;line-height:1.62;color:rgba(255,255,255,.84)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.chips li{font-size:12px;font-weight:500;padding:5px 10px;border-radius:99px;background:var(--ice);border:1px solid var(--line);color:var(--ink-2)}
.scard .chips li{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.26);color:#fff}
.scard__body .chips{margin-bottom:20px}
.scard__key{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.24);font-size:13px;font-weight:600;color:var(--lime);letter-spacing:.01em;line-height:1.45}

/* ─── network ─── */
.network{color:#fff;overflow:hidden;isolation:isolate;--gx:70%;--gy:30%}
.network__bg{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(50% 60% at 80% 30%,rgba(61,134,255,.55),rgba(61,134,255,0) 70%),
  radial-gradient(40% 40% at 10% 90%,rgba(201,250,100,.18),rgba(201,250,100,0) 70%),
  linear-gradient(170deg,#1269F7 0%,#0B4FD0 55%,#0A3DA8 100%);overflow:hidden}
.network__bg::before{content:"";position:absolute;inset:-64px;opacity:.25;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:64px 64px;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);
  animation:gridDrift 18s linear infinite}
@keyframes gridDrift{to{transform:translate3d(64px,64px,0)}}
.network__bg::after{content:"";position:absolute;width:60vmax;height:60vmax;left:-10vmax;top:20%;border-radius:50%;background:rgba(61,134,255,.35);filter:blur(90px);animation:drift2 24s ease-in-out infinite}
.network__glow{position:absolute;left:var(--gx);top:var(--gy);width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.2),rgba(255,255,255,0) 60%);opacity:0;transition:opacity .5s var(--ease)}
.network.glow-on .network__glow{opacity:1}
.map{position:relative;margin-top:clamp(36px,4vw,56px)}
.map__legend{display:flex;flex-wrap:wrap;gap:8px}
.lg{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:99px;font-size:13px;font-weight:500;color:#fff;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);transition:background-color .25s,opacity .25s,border-color .25s}
.lg:hover{background:rgba(255,255,255,.18)}
.lg i{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px #fff}
.lg[aria-pressed="false"]{opacity:.45;border-style:dashed}
.t-silver{background:var(--t-silver)}.t-gold{background:var(--t-gold)}.t-crystal{background:var(--t-crystal)}.t-project{background:var(--t-project)}
.map__canvas{position:relative;margin-top:22px;aspect-ratio:1600/586}
.map__img{position:absolute;inset:0;width:100%;height:100%;opacity:.95;filter:drop-shadow(0 20px 40px rgba(6,20,54,.3))}
.map__fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.map__pins{position:absolute;inset:0}
.pin{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--pc,#1269F7);border:2px solid #fff;
  box-shadow:0 2px 6px rgba(6,20,54,.35);transition:transform .3s var(--ease),opacity .3s,box-shadow .3s;z-index:1}
.pin::before{content:"";position:absolute;inset:-9px;border-radius:50%}
.pin::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--pc,#1269F7);opacity:0}
.pin:hover,.pin:focus-visible{transform:scale(1.5);z-index:3}
.pin.on{transform:scale(1.7);z-index:4;box-shadow:0 0 0 4px rgba(255,255,255,.45),0 4px 12px rgba(6,20,54,.45)}
.pin.ping::after{animation:ping 1.2s var(--ease)}
.pin.dim{opacity:.18;pointer-events:none;transform:scale(.7)}
.pin.pop{animation:pinIn .6s var(--ease) both;animation-delay:var(--pd,0s)}
@keyframes pinIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes ping{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(3.2)}}
.pin[data-tier="Silver"]{--pc:var(--t-silver)}.pin[data-tier="Gold"]{--pc:var(--t-gold)}.pin[data-tier="Crystal"]{--pc:var(--t-crystal)}.pin[data-tier="Project"]{--pc:var(--t-project)}
.gdlg{position:absolute;z-index:6;width:300px;padding:18px;border-radius:22px;color:#fff;
  background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.06)),rgba(6,24,70,.5);
  -webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%);
  border:1px solid rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 30px 70px -20px rgba(6,20,54,.6);animation:gIn .35s var(--ease)}
@keyframes gIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.gdlg__top{display:flex;align-items:center;justify-content:space-between}
.gdlg__tier{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 10px;border-radius:99px;background:rgba(255,255,255,.18);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.gdlg__tier::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pc,#fff)}
.gdlg__nav{display:flex;gap:4px}
.gdlg__nav button{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);transition:background-color .2s}
.gdlg__nav button:hover{background:rgba(255,255,255,.28)}
.gdlg__nav svg{width:12px;height:12px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gdlg__name{font-family:var(--head);font-weight:500;font-size:22px;letter-spacing:-.02em;line-height:1.15;margin-top:14px}
.gdlg__city{font-size:13px;color:rgba(255,255,255,.75);margin-top:2px}
.gdlg__facts{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.2)}
.gdlg__facts dt{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.gdlg__facts dd{font-size:13.5px;font-weight:600;margin-top:2px}
.gdlg__note{font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.75);margin-top:14px}
.gdlg__acts{display:flex;gap:8px;margin-top:14px}
.gdlg__acts .btn{flex:1;padding:0 10px}
.audience{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:clamp(40px,5vw,64px)}
.acard{--mx:50%;--my:0%;position:relative;padding:28px 26px 30px;border-radius:24px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);
  transition:background-color .45s var(--ease),border-color .45s,transform .6s var(--ease),box-shadow .6s var(--ease);overflow:hidden}
.acard::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .45s;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx) var(--my),rgba(255,255,255,.26),rgba(255,255,255,0) 60%)}
.acard:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.55);transform:translateY(-6px);
  -webkit-backdrop-filter:blur(8px) saturate(160%);backdrop-filter:blur(8px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 30px 60px -30px rgba(6,20,54,.6)}
.acard:hover::before{opacity:1}
.acard h3{position:relative;font-family:var(--head);font-weight:500;font-size:28px;letter-spacing:-.025em;line-height:1.1}
.acard p{position:relative;margin-top:10px;font-size:15px;line-height:1.65;color:rgba(255,255,255,.82)}

/* ─── reasons ─── */
.reasons{background:#fff}
.reasons__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,6vw,96px);align-items:start}
.reasons__head{position:sticky;top:120px}
.reasons__head .lede{margin-top:22px}
.reasons__orn{width:min(260px,60%);height:auto;margin-top:40px;will-change:transform}
.acc{border-bottom:1px solid var(--line)}
.acc__item{border-top:1px solid var(--line)}
.acc__q{width:100%;display:grid;grid-template-columns:48px 1fr 44px;align-items:center;gap:12px;padding:26px 0;text-align:left}
.acc__n{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--blue)}
.acc__t{font-family:var(--head);font-weight:500;font-size:clamp(21px,2.1vw,28px);letter-spacing:-.025em;line-height:1.2;color:var(--ink);transition:color .3s}
.acc__q:hover .acc__t,.acc__item.on .acc__t{color:var(--blue)}
.acc__ic{position:relative;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);transition:background-color .35s,border-color .35s,transform .5s var(--ease)}
.acc__ic::before,.acc__ic::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--ink);transition:transform .45s var(--ease),background-color .3s}
.acc__ic::after{transform:rotate(90deg)}
.acc__q:hover .acc__ic{border-color:var(--blue)}
.acc__item.on .acc__ic{background:var(--blue);border-color:var(--blue);transform:rotate(135deg)}
.acc__item.on .acc__ic::before,.acc__item.on .acc__ic::after{background:#fff}
.acc__a{height:0;overflow:hidden;transition:height .5s var(--ease)}
.acc__a p{padding:0 56px 28px 60px;font-size:17px;line-height:1.7;color:var(--ink-2);max-width:62ch}

/* ─── start / CTA ─── */
.start{background:var(--ice)}
.cta__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:clamp(40px,5vw,60px)}
.ccard{position:relative;aspect-ratio:4/5.2;border-radius:30px;overflow:hidden;color:#fff;isolation:isolate;background:var(--navy);
  box-shadow:0 30px 60px -32px rgba(6,20,54,.6);transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.ccard.tilting{transition:transform .15s linear,box-shadow .6s var(--ease)}
.ccard:hover{box-shadow:0 40px 80px -30px rgba(18,105,247,.6)}
.ccard__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.ccard__media img{position:absolute;left:-7%;top:-7%;width:114%;height:114%;max-width:none;object-fit:cover}
.ccard__shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,20,54,.05) 0%,rgba(6,20,54,.12) 28%,rgba(6,20,54,.72) 50%,rgba(6,20,54,.95) 72%)}
.ccard::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(500px circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.22),rgba(255,255,255,0) 50%)}
.ccard:hover::after{opacity:1}
.ccard__body{position:absolute;left:0;right:0;bottom:0;padding:28px}
.ccard__who{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.85)}
.ccard__who span{font-family:var(--mono);letter-spacing:.04em;background:var(--lime);color:var(--navy);border-radius:99px;padding:2px 8px}
.ccard h3{font-family:var(--head);font-weight:500;font-size:clamp(28px,2.6vw,36px);letter-spacing:-.03em;line-height:1.05;margin-top:12px}
.ccard p{margin-top:10px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.85)}
.ccard .btn{margin-top:20px}

/* ─── Broadplay band: full section ─── */
.close{position:relative;overflow:hidden;isolation:isolate;padding:clamp(80px,10vw,140px) 0;color:#fff;
  background:radial-gradient(60% 80% at 90% 100%,rgba(201,250,100,.25),rgba(201,250,100,0) 70%),radial-gradient(50% 60% at 10% 0%,rgba(61,134,255,.5),rgba(61,134,255,0) 70%),linear-gradient(135deg,#0A3DA8 0%,#1269F7 100%)}
.close__field{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.close__in{position:relative;z-index:2}
.close__title{font-family:var(--head);font-weight:500;font-size:clamp(36px,5.4vw,76px);line-height:1.02;letter-spacing:-.035em;max-width:18ch}
.close__title em{font-style:normal;color:var(--lime)}
.br-m,.dot-m{display:none}
.close__sub{margin-top:22px;font-size:17px;color:rgba(255,255,255,.82);max-width:48ch}
.close__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px;max-width:min(780px,56%)}
.close__links a{display:inline-flex;gap:8px;align-items:center;height:42px;padding:0 16px;border-radius:99px;font-size:13.5px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);
  transition:background-color .25s,transform .25s var(--ease)}
.close__links a:hover{background:rgba(255,255,255,.24);transform:translateY(-2px)}
.close__links .ic{width:18px;height:18px;flex:none;color:var(--lime)}
/* the K-flower sits on top of everything in the band, at full strength (direction V2.0 deploy) */
.close__orn{position:absolute;right:max(-80px,-5vw);bottom:-110px;width:min(520px,44%);height:auto;z-index:3;pointer-events:none;will-change:transform}

/* ═════════════ PRICING PAGE ═════════════ */
.phero{overflow:hidden;isolation:isolate;padding-top:calc(var(--navh) + clamp(56px,8vw,100px));background:linear-gradient(180deg,#fff 0%,var(--ice) 100%)}
.phero__bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.phero__bg i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.7}
.phero__bg i:nth-child(1){width:40vmax;height:40vmax;right:-10%;top:-10%;background:rgba(18,105,247,.16);animation:drift2 26s ease-in-out infinite}
.phero__bg i:nth-child(2){width:32vmax;height:32vmax;left:-8%;bottom:10%;background:rgba(201,250,100,.3);animation:drift1 22s ease-in-out infinite}
.prc__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:clamp(44px,5vw,64px);align-items:stretch}
.prc{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:28px;padding:10px;box-shadow:var(--sh-1);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.prc:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.prc--feat{border-color:rgba(18,105,247,.45);box-shadow:0 0 0 1px rgba(18,105,247,.25),var(--sh-2)}
.prc__media{position:relative;aspect-ratio:16/10;border-radius:20px;overflow:hidden;background:#0a1b4a}
.prc__media img{position:absolute;left:-8%;top:-8%;width:116%;height:116%;max-width:none;object-fit:cover}
.prc__body{display:flex;flex-direction:column;flex:1;padding:22px 16px 16px}
.prc__kick{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.prc__kick span{font-family:var(--mono);letter-spacing:.04em;color:#fff;background:var(--blue);border-radius:99px;padding:2px 9px}
.prc__name{font-family:var(--head);font-weight:500;font-size:clamp(26px,2.4vw,32px);letter-spacing:-.03em;margin-top:12px;line-height:1.05;color:var(--ink)}
.prc__desc{margin-top:10px;font-size:15px;line-height:1.62;color:var(--muted)}
.prc__h{margin-top:18px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.chips--sm{margin-top:10px}
.chips--sm li{font-size:11.5px;padding:4px 9px}
.prc__price{position:relative;overflow:hidden;margin-top:auto;padding:18px 18px 16px;border-radius:18px;background:var(--navy);color:#fff;isolation:isolate;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.prc__price::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .45s var(--ease);background:radial-gradient(120% 90% at 100% 0%,rgba(201,250,100,.55),rgba(201,250,100,0) 60%),linear-gradient(135deg,#6FBE2C 0%,#4E9A1C 100%)}
.prc:hover .prc__price,.prc:focus-within .prc__price{box-shadow:0 18px 36px -18px rgba(78,154,28,.8);transform:translateY(-2px)}
.prc:hover .prc__price::before,.prc:focus-within .prc__price::before{opacity:1}
.prc:hover .prc__price span,.prc:focus-within .prc__price span{color:#fff}
.prc .chips{margin-bottom:22px}
.prc__price small,.prc__pay small{display:block;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.prc__price b{display:block;font-family:var(--head);font-weight:500;font-size:clamp(28px,2.8vw,36px);letter-spacing:-.03em;margin-top:6px;line-height:1.05;font-variant-numeric:tabular-nums}
.prc__price span{display:block;margin-top:4px;font-size:13px;color:rgba(255,255,255,.75)}
.prc__pay{margin-top:10px;padding:14px 18px;border-radius:18px;background:var(--ice);min-height:158px}
.prc__pay small{color:var(--faint);opacity:1}
.prc__pay b{display:block;margin-top:4px;font-size:15px;font-weight:600;color:var(--ink)}
.prc__pay span{display:block;margin-top:4px;font-size:13px;line-height:1.55;color:var(--muted)}
.prc .btn{margin-top:14px}
.pnotes{margin-top:clamp(40px,5vw,60px);padding-top:26px;border-top:1px solid var(--line);display:grid;grid-template-columns:200px 1fr;gap:20px}
.pnotes__h{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.pnotes ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 32px}
.pnotes li{position:relative;padding-left:18px;font-size:14px;line-height:1.6;color:var(--ink-2)}
.pnotes li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--blue)}

/* ═════════════ FOOTER ═════════════ */
.foot{background:#fff;padding:clamp(64px,7vw,96px) 0 28px;border-top:1px solid var(--line)}
.foot__top{display:grid;grid-template-columns:260px 1fr;gap:48px}
.foot__brand img{height:27px;width:auto}
.foot__tag{margin-top:16px;font-family:var(--head);font-size:18px;line-height:1.35;letter-spacing:-.01em;color:var(--blue)}
.foot__co{margin-top:18px;font-size:13.5px;line-height:1.6;color:var(--muted)}
.foot__co b{color:var(--ink);font-weight:600}
.foot__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 28px}
.fcol__t{display:flex;width:100%;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:12px;cursor:default;text-align:left}
.fcol__t svg{display:none;width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .3s var(--ease)}
.fcol li + li{margin-top:7px}
.flink{position:relative;display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--muted);text-align:left;border-radius:6px;overflow:hidden;isolation:isolate;padding:1px 4px;margin:-1px -4px;
  transition:color .2s}
.flink:hover{color:var(--blue)}
.flink::after{content:"";position:absolute;left:4px;right:4px;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--ease)}
.flink:hover::after{transform:scaleX(1)}
.flink.pressed{animation:press .35s var(--ease)}
@keyframes press{40%{transform:scale(.94)}}
.foot__bot{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px 24px;margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--faint)}
.foot__retail{justify-self:end;text-align:right}
.foot__retail a{color:var(--blue)}

/* ═════════════ MODAL ═════════════ */
.modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center}
.modal__scrim{position:absolute;inset:0;background:rgba(6,20,54,.5);-webkit-backdrop-filter:blur(10px) saturate(140%);backdrop-filter:blur(10px) saturate(140%);opacity:0}
.modal__panel{position:relative;width:min(980px,calc(100% - 32px));height:min(88vh,900px);border-radius:30px;background:#fff;box-shadow:var(--sh-3);overflow:hidden;transform-origin:50% 50%;will-change:transform,opacity;opacity:0}
.modal__scroll{height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.modal__close{position:absolute;right:16px;top:16px;z-index:5;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line-2);transition:transform .2s var(--ease),background-color .2s}
.modal__close:hover{background:#fff}
.modal__close:active{transform:scale(.9)}
.modal__close svg{width:15px;height:15px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round}
.modal__cover{position:relative;height:clamp(220px,42vh,400px);overflow:hidden;background:var(--navy)}
.modal__cover img{width:100%;height:100%;object-fit:cover}
.modal__cover::after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,#fff)}
.modal__body{position:relative;padding:0 clamp(22px,5vw,64px) clamp(40px,6vw,72px);margin-top:-56px}
.m-kick{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.m-title{font-family:var(--head);font-weight:500;font-size:clamp(36px,5.4vw,64px);letter-spacing:-.035em;line-height:1.02;margin-top:8px;color:var(--ink)}
.m-lead{margin-top:14px;font-size:clamp(18px,2vw,23px);line-height:1.45;color:var(--ink-2);max-width:40ch;letter-spacing:-.01em}
.m-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}
.m-cols h4{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:12px}
.m-cols p{font-size:15.5px;line-height:1.7;color:var(--ink-2)}
.m-list li{display:grid;grid-template-columns:22px 1fr;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:15px;line-height:1.55;color:var(--ink-2)}
.m-list li:first-child{border-top:0;padding-top:0}
.m-list li::before{content:"";width:18px;height:18px;margin-top:2px;border-radius:50%;background:var(--ice-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 8.2 2.3 2.3 4.7-4.9' fill='none' stroke='%231269F7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.m-sub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:36px}
.m-sub li{padding:16px 18px;border-radius:16px;background:var(--ice);border:1px solid var(--line)}
.m-sub b{display:block;font-size:15px;font-weight:600;color:var(--ink)}
.m-sub span{display:block;margin-top:4px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.m-sub-h{margin-top:36px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.m-sub-h + .m-sub{margin-top:12px}
.m-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px}
.m-metric{padding:20px;border-radius:18px;background:var(--ice)}
.m-metric b{display:block;font-family:var(--head);font-weight:500;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.035em;line-height:1;color:var(--blue)}
.m-metric span{display:block;margin-top:8px;font-size:13.5px;color:var(--muted)}
.m-next{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:36px;padding:22px 24px;border-radius:20px;background:var(--navy);color:#fff}
.m-next small{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.m-next b{display:block;font-family:var(--head);font-weight:500;font-size:clamp(20px,2.2vw,26px);letter-spacing:-.02em;margin-top:4px}
.m-next__acts{display:flex;flex-wrap:wrap;gap:10px}
.m-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.m-note{margin-top:22px;font-size:13px;line-height:1.6;color:var(--faint)}

/* ═════════════ CONTACT ═════════════ */
.contact{position:fixed;inset:0;z-index:320;display:grid;place-items:center;padding:16px}
.contact__scrim{position:absolute;inset:0;background:rgba(6,20,54,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:fade .3s var(--ease)}
.contact__panel{position:relative;width:min(680px,100%);max-height:min(92vh,860px);border-radius:28px;background:#fff;box-shadow:var(--sh-3);overflow:hidden;display:flex;animation:rise .45s var(--ease)}
.contact__scroll{overflow-y:auto;overscroll-behavior:contain;padding:clamp(28px,5vw,48px);width:100%}
@keyframes fade{from{opacity:0}}
@keyframes rise{from{opacity:0;transform:translateY(24px) scale(.98)}}
.contact.closing .contact__scrim{animation:fade .25s reverse forwards}
.contact.closing .contact__panel{animation:rise .25s reverse forwards}
.contact__title{font-family:var(--head);font-weight:500;font-size:clamp(34px,4vw,46px);letter-spacing:-.03em;color:var(--blue);line-height:1.05}
.contact__lede{margin-top:12px;font-size:15.5px;line-height:1.65;color:var(--muted);max-width:52ch}
.cform{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.cform__role{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.cform__role legend{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:10px;padding:0}
.cform__role label{position:relative;cursor:pointer}
.cform__role input{position:absolute;opacity:0;pointer-events:none}
.cform__role span{display:inline-flex;align-items:center;height:40px;padding:0 15px;border-radius:99px;border:1px solid var(--line-2);font-size:14px;font-weight:500;transition:background-color .2s,border-color .2s,color .2s}
.cform__role input:checked + span{background:var(--blue);border-color:var(--blue);color:#fff}
.cform__role input:focus-visible + span{outline:2px solid var(--blue);outline-offset:2px}
.cform__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-size:13px;font-weight:600;color:var(--ink-2)}
.field em{font-style:normal;color:var(--blue)}
.field input,.field textarea{width:100%;border:1px solid var(--line-2);border-radius:12px;padding:12px 14px;font-size:15px;background:var(--ice);transition:border-color .2s,background-color .2s,box-shadow .2s;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px rgba(18,105,247,.12)}
.field.bad input,.field.bad textarea{border-color:#E5484D;background:#FFF5F5}
.cform__err{font-size:13.5px;color:#C62828}
.cform__err:empty{display:none}
.cform__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.cform__ok{font-size:14px;color:#15803D;font-weight:500}
.cform__ok:empty{display:none}

.toast{position:fixed;left:50%;bottom:24px;z-index:400;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:12px 18px;border-radius:14px;background:var(--navy);color:#fff;
  font-size:14px;box-shadow:var(--sh-2);transition:opacity .3s,transform .4s var(--ease);max-width:calc(100% - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ═════════════ RESPONSIVE ═════════════ */
@media (max-width:1180px){
  .mpanel{grid-template-columns:200px 1fr;gap:28px}
  .mpanel__grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot__cols{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rcar{--cw:280px;--ch:430px}
}
@media (max-width:1023px){
  .nav__menu,.lang,.nav__cta{display:none}
  .nav__burger{display:block}
  .nav__right{margin-left:auto}
  .shead{grid-template-columns:1fr;align-items:start}
  .shead .lede{justify-self:start;padding-bottom:0}
  .value__grid{grid-template-columns:1fr}
  .aos{grid-template-columns:1fr}
  .aos__stage{max-width:520px}
  .proof__grid,.sol__grid,.cta__grid,.audience,.prc__grid{grid-template-columns:1fr 1fr}
  .reasons__grid{grid-template-columns:1fr}
  .reasons__head{position:static}
  .reasons__orn{display:none}
  .foot__top{grid-template-columns:1fr}
  .foot__bot{grid-template-columns:1fr;justify-items:center;text-align:center}
  .foot__retail{justify-self:center;text-align:center}
  .pnotes{grid-template-columns:1fr}
}
@media (orientation:portrait) and (min-width:861px){
  .jpin__grid{height:min(60vh,860px)}
}
@media (orientation:portrait) and (min-width:700px) and (max-width:1200px){
  .hero__in{justify-content:flex-start;padding-top:calc(var(--navh) + 12vh)}
  .hero__meta{font-size:13.5px}
  .hero__title{font-size:clamp(62px,9.2vw,104px);margin-top:40px}
  .hero__sub{font-size:clamp(22px,2.95vw,31px);margin-top:5.5vh}
  .hero__cta{margin-top:7vh}
  .hero__cta .btn{--bh:54px;padding:0 26px;font-size:16px}
  .hero__logo{width:70vw;right:-14vw;bottom:-18vw}
}
@media (max-width:860px){
  .jpin__grid{grid-template-columns:1fr;grid-template-rows:minmax(0,.74fr) minmax(0,1.26fr);height:calc(100svh - var(--navh) - 24px);gap:10px}
  .jpin__sticky{padding-top:calc(var(--navh) - 10px);align-items:flex-start}
  .jframe__cap{min-height:52px;padding:10px 14px;font-size:12.5px}
  .jring{width:36px;height:36px}
  .jstack{--hh:40px}
  .jcard{padding:0 16px 14px;border-radius:18px}
  .jcard__top{gap:10px}
  .jcard .tag{height:22px;font-size:11px;padding:0 8px}
  .jcard h3{font-size:17px}
  .jcard.on h3{font-size:22px}
  .jcard.on .jcard__top{height:calc(var(--hh) + 10px)}
  .jcard > p:not(.jcard__res){font-size:14.5px;line-height:1.55;margin-top:6px}
  .jcard__list{margin-top:10px;gap:5px}
  .jcard__list li{font-size:13px}
  .jcard__res{padding:9px 11px;font-size:12.5px}
  .jshot--mock img{height:96%}
  .jshot--phone img{height:90%;border-width:5px;border-radius:20px}
}
@media (max-width:760px){
  :root{--navh:62px}
  .hero__in{padding-top:calc(var(--navh) + 40px);padding-bottom:max(28px,env(safe-area-inset-bottom))}
  .hero__title{margin-top:26px}
  .hero__title .ln,.hero__sub .ln{display:inline}
  .hero__meta{font-size:11px;gap:6px 10px}
  .hero__logo{width:96vw;right:-36vw;bottom:-20vw}
  .hero__title{font-size:clamp(44px,13.4vw,64px);line-height:1.02}
  .hero__sub{margin-top:clamp(30px,6.5vh,64px)}
  .hero__cta{flex-direction:column;align-items:stretch;width:min(60%,250px);margin-top:28px;margin-bottom:clamp(8px,3vh,28px)}
  .hero__cta .btn--ghost{background:#fff;box-shadow:0 10px 24px -14px rgba(11,29,63,.45)}
  .h2--3l .ln{display:inline}
  .value__cards{grid-template-columns:1fr}
  .aos__svg .n-t,.aos__svg .n-s{display:none}
  .aos__svg .n-m{display:block}
  .rcar{--cw:258px;--ch:410px}
  .rcard{padding:22px 20px 18px}
  .rcard__n{font-size:46px}
  .rcard h3{font-size:26px;margin-top:16px}
  .proof__grid,.sol__grid,.cta__grid,.audience,.prc__grid{grid-template-columns:1fr}
  .pcard__media{aspect-ratio:4/3.4}
  .mock--report{width:74%}
  .mock--fleet{width:80%}
  .mock-chip--d{display:none}
  .ccard{aspect-ratio:4/4.8}
  .map__canvas{margin-left:calc(var(--gutter) * -1);margin-right:calc(var(--gutter) * -1)}
  .pin{width:10px;height:10px;margin:-5px 0 0 -5px;border-width:1.5px}
  .gdlg{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:auto;z-index:150}
  .acc__q{grid-template-columns:36px 1fr 40px;padding:22px 0}
  .acc__ic{width:40px;height:40px}
  .acc__a p{padding:0 0 24px 48px;font-size:16px}
  .m-cols,.m-sub{grid-template-columns:1fr}
  .m-metrics{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .m-metric{padding:14px}
  .cform__row{grid-template-columns:1fr}
  .modal__panel{width:100%;height:calc(100% - 16px);border-radius:26px 26px 0 0;align-self:end}
  .modal{place-items:end center}
  /* phones: the K-flower gets its own room under the contact chips, so it never covers them */
  .close{padding-bottom:calc(44vw + 64px)}
  .close__links{max-width:none}
  .close__orn{width:58%;right:-14%;bottom:-16vw}
  .br-m{display:inline}
  .dot-m{display:inline}
  .close__any{display:block;margin-top:6px;font-size:clamp(26px,7.6vw,34px);line-height:1.08;letter-spacing:-.03em}
  .pnotes ul{grid-template-columns:1fr}
  /* footer columns become toggles */
  .foot__cols{grid-template-columns:1fr;gap:0}
  .fcol{border-bottom:1px solid var(--line)}
  .fcol__t{margin:0;padding:16px 0;font-size:15px;cursor:pointer}
  .fcol__t svg{display:block}
  .fcol.open .fcol__t svg{transform:rotate(180deg)}
  .fcol ul{display:none;padding-bottom:16px}
  .fcol.open ul{display:block}
}
@media (max-width:420px){
  .hero__cta .btn{padding:0 14px}
  .m-metrics{grid-template-columns:1fr}
  .rcar{--cw:236px;--ch:420px}
}

/* ═════════════ REDUCED MOTION ═════════════ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  html.js .rv{opacity:1;transform:none}
  html.js .hero__title:not(.split-done){opacity:1}
  .ticker__track{animation:none}
  .ticker{overflow-x:auto}
}

/* phones held sideways: display and stack side by side so both stay usable */
@media (max-width:960px) and (orientation:landscape) and (max-height:560px){
  .jpin__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:none;height:calc(100svh - var(--navh) - 16px)}
  .jpin__sticky{padding-top:calc(var(--navh) - 6px);align-items:flex-start}
  .jframe__cap{display:none}
  .rcar{--ch:300px;--cw:240px}
  .rcard__body{font-size:13px}
  .rcard h3{margin-top:10px;font-size:22px}
  .rcard__n{font-size:36px}
}

/* ═════════════ 404 ═════════════ */
.nf{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:32px var(--gutter);
  background:radial-gradient(55% 50% at 85% 85%,rgba(201,250,100,.35),rgba(201,250,100,0) 70%),radial-gradient(50% 50% at 10% 10%,rgba(18,105,247,.14),rgba(18,105,247,0) 70%),var(--ice)}
.nf__box{max-width:560px;text-align:center;display:flex;flex-direction:column;align-items:center}
.nf__logo{width:120px;height:auto;filter:drop-shadow(0 20px 30px rgba(18,105,247,.28));animation:nfFloat 6s ease-in-out infinite}
@keyframes nfFloat{50%{transform:translateY(-10px) rotate(-3deg)}}
.nf__code{margin-top:26px;font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.2em;color:var(--blue)}
.nf__title{margin-top:10px;font-family:var(--head);font-weight:300;font-size:clamp(32px,6vw,52px);line-height:1.08;letter-spacing:-.03em;color:var(--blue)}
.nf__title strong{font-weight:500}
.nf__text{margin-top:14px;font-size:16px;line-height:1.65;color:var(--ink-2)}
.nf__acts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px}