/* ── FONTS ────────────────────────────────────────────────────────────
   These @font-face rules are exactly what fonts.googleapis.com used to
   return, pasted in. That removes a blocking round trip to a second
   origin before anything could paint. All three families are VARIABLE,
   so six files cover every weight the site uses. The woff2 still come
   from fonts.gstatic.com (preconnected in the head).
   If text ever renders in a fallback face, Google rotated these URLs —
   re-pull them from the css2 endpoint, or self-host the six files.
   ──────────────────────────────────────────────────────────────────── */
@font-face{font-family:'Sora';font-style:normal;font-weight:400 800;font-display:swap;src:url(https://fonts.gstatic.com/s/sora/v17/xMQ9uFFYT72X5wkB_18qmnndmSdSnh2BAfO5mnuyOo1lfiQwV6-xo6eeIw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Sora';font-style:normal;font-weight:400 800;font-display:swap;src:url(https://fonts.gstatic.com/s/sora/v17/xMQ9uFFYT72X5wkB_18qmnndmSdSnh2BAfO5mnuyOo1lfiQwWa-xo6eeI7fM.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500 700;font-display:swap;src:url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwgknk-4.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500 700;font-display:swap;src:url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwgknk-6nFg.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ══════════════════════════════════════════════════════════════
   THE CLIFTON AGENCY — "DEEP FIELD"
   Near-black space · one electric accent · warp-drive hero
   ══════════════════════════════════════════════════════════════ */
:root{
  --void:#03040A;
  --deep:#070A16;
  --panel:#0A0E1C;
  --panel-2:#0E1426;
  --text:#F3F6FC;
  --muted:#96A3BC;
  --muted-2:#65718C;
  --ice:#5FE3FF;
  --ice-2:#2B9CFF;
  --gold:#E9C07A;
  --line:rgba(255,255,255,.075);
  --line-2:rgba(255,255,255,.15);
  --glow:0 0 0 1px rgba(95,227,255,.28), 0 18px 60px -18px rgba(43,156,255,.55);
  --grad:linear-gradient(96deg,#5FE3FF 0%,#2B9CFF 52%,#8E7BFF 100%);
  --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --sd:0ms;            /* splash offset — JS raises this when the intro plays */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
section[id]{scroll-margin-top:88px}   /* clear the sticky nav on anchor jumps */
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--void);color:var(--text);line-height:1.6;font-size:16px;
  -webkit-font-smoothing:antialiased;overflow-x:clip;max-width:100%;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:'Sora',sans-serif;line-height:1.03;letter-spacing:-.035em;font-weight:800}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;position:relative;z-index:3}
.mono{font-family:'JetBrains Mono',monospace}
.ice{color:var(--ice)}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.muted{color:var(--muted)}
::selection{background:rgba(95,227,255,.28)}

.skip{position:absolute;left:-9999px;top:0;z-index:210;background:var(--ice);color:#04070F;font-weight:700;
  font-size:14px;padding:12px 18px;border-radius:0 0 10px 0}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:6px}

/* ── scroll progress ── */
#progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:100;background:var(--grad);box-shadow:0 0 14px rgba(95,227,255,.7)}

/* ── ambient aurora: slow colour drifting behind every section ── */
.aurora{position:fixed;inset:-18vh 0;width:100%;z-index:0;pointer-events:none;overflow:hidden}
/* radial-gradient glows rather than blur() — same softness, a fraction of the cost */
.aurora i{position:absolute;border-radius:50%;will-change:transform}
.aurora i:nth-child(1){width:78vw;height:78vw;left:-24vw;top:20%;
  background:radial-gradient(circle,rgba(27,111,224,.30),rgba(27,111,224,.10) 42%,transparent 68%);
  animation:au1 28s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:68vw;height:68vw;right:-20vw;top:46%;
  background:radial-gradient(circle,rgba(14,156,201,.26),rgba(14,156,201,.08) 44%,transparent 70%);
  animation:au2 34s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:62vw;height:62vw;left:24%;top:78%;
  background:radial-gradient(circle,rgba(91,71,214,.22),rgba(91,71,214,.07) 44%,transparent 70%);
  animation:au3 40s ease-in-out infinite alternate}
@keyframes au1{to{transform:translate(9vw,7vh) scale(1.14)}}
@keyframes au2{to{transform:translate(-8vw,-9vh) scale(1.1)}}
@keyframes au3{to{transform:translate(6vw,-6vh) scale(1.16)}}
@media(max-width:760px){.aurora i{animation:none}}      /* phones keep the colour, skip the drift */
@media(prefers-reduced-motion:reduce){.aurora i{animation:none}}

@media(hover:none),(pointer:coarse){#spot{display:none}}

/* ── cursor spotlight ── */
#spot{position:fixed;width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;pointer-events:none;z-index:1;opacity:0;transition:opacity .4s;
  background:radial-gradient(circle,rgba(43,156,255,.10),transparent 62%)}

/* ══ SPLASH / INTRO ══
   Hidden by default. JS opts it in, and a CSS keyframe — not a timer —
   is what clears it, so a script error can never trap the visitor. */
#splash{display:none}
.splash-on #splash{
  display:grid;place-items:center;position:fixed;inset:0;z-index:200;background:var(--void);
  animation:splashout 2.35s var(--ease-out) forwards}
.splash-on.splash-skip #splash{animation:splashout .45s var(--ease-out) forwards}
@keyframes splashout{
  0%,74%{opacity:1;transform:scale(1);visibility:visible}
  100%{opacity:0;transform:scale(1.09);visibility:hidden;pointer-events:none}
}
.splash-on{overflow:hidden}
#splash .sp{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;padding:24px}
#splash .ring{position:relative;width:96px;height:96px;display:grid;place-items:center}
#splash .ring img{width:52px;height:52px;object-fit:contain;opacity:0;animation:spmark .9s var(--ease-out) .1s forwards}
#splash .ring svg{position:absolute;inset:0;width:96px;height:96px;transform:rotate(-90deg)}
#splash .ring circle{fill:none;stroke:var(--ice);stroke-width:1.25;stroke-linecap:round;
  stroke-dasharray:289;stroke-dashoffset:289;animation:spring 1.5s var(--ease-out) .15s forwards;filter:drop-shadow(0 0 8px rgba(95,227,255,.7))}
@keyframes spmark{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}
@keyframes spring{to{stroke-dashoffset:0}}
#splash .wm{font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(19px,3.4vw,30px);text-transform:uppercase;
  letter-spacing:.42em;opacity:0;animation:spwm 1.4s var(--ease-out) .35s forwards}
@keyframes spwm{from{opacity:0;letter-spacing:.42em;filter:blur(9px)}to{opacity:1;letter-spacing:.05em;filter:blur(0)}}
#splash .sub{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted-2);
  opacity:0;animation:fadeup .8s var(--ease-out) .62s forwards}
#splash .bar{width:min(220px,60vw);height:1px;background:rgba(255,255,255,.12);overflow:hidden;margin-top:6px}
#splash .bar i{display:block;height:100%;width:0;background:var(--grad);box-shadow:0 0 12px rgba(95,227,255,.9);
  animation:spbar 1.6s var(--ease) .25s forwards}
@keyframes spbar{to{width:100%}}
#splash .skip{position:absolute;bottom:34px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted-2);opacity:0;animation:fadeup .6s ease .55s forwards}
@media(prefers-reduced-motion:reduce){.splash-on #splash{display:none}.splash-on{overflow:auto}}

/* ══ NAV ══ */
.nav{position:sticky;top:0;z-index:60;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(3,4,10,.82);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:11px}
.brand img{width:38px;height:38px;object-fit:contain}
.brand .bt{display:flex;flex-direction:column;line-height:1.15}
.brand b{font-family:'Sora';font-size:15.5px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.brand small{font-size:9.5px;font-weight:600;color:var(--muted-2);letter-spacing:.16em;text-transform:uppercase;font-family:'JetBrains Mono',monospace}
.nav-links{display:flex;gap:30px;list-style:none;align-items:center}
.nav-cta-m{display:none}
.nav-links a{font-size:14px;font-weight:500;color:var(--muted);position:relative;padding:4px 0;transition:color .2s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--ice);transition:width .25s var(--ease)}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{width:100%}
.nav-right{display:flex;align-items:center;gap:12px}
.nav-tel{font-size:13.5px;font-weight:600;color:var(--muted);font-family:'JetBrains Mono',monospace}
.nav-tel:hover{color:var(--ice)}
.nav-toggle{display:none;background:none;border:1px solid var(--line-2);border-radius:10px;padding:8px;color:var(--text);cursor:pointer}
.nav-toggle svg{width:20px;height:20px;display:block}

/* ── recoloured logo lockups. The images only exist in the deploy folder, so
      each one reveals itself on load and the typed wordmark stays as the fallback. ── */
#splash .wmimg{width:min(330px,74vw);height:auto;opacity:0;animation:spwm2 1.4s var(--ease-out) .35s forwards}
@keyframes spwm2{from{opacity:0;transform:translateY(10px) scale(.96);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
.sp.haslogo .wm,.sp.haslogo .sub{display:none}
.brand img.wmimg-f{width:min(250px,100%);height:auto;object-fit:contain;display:none}
.brand.haslogo img.wmimg-f{display:block}
.brand.haslogo img:not(.wmimg-f),.brand.haslogo .bt{display:none}
.brand.brand-full{align-items:flex-start}

/* ══ BUTTONS ══ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:'Inter';font-weight:600;font-size:14.5px;border-radius:11px;padding:13px 22px;border:1px solid transparent;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s;white-space:nowrap}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--grad);color:#04070F;font-weight:700;box-shadow:0 10px 34px -8px rgba(43,156,255,.65)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 46px -10px rgba(95,227,255,.7)}
.btn-ghost{background:rgba(255,255,255,.035);border-color:var(--line-2);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(95,227,255,.5);transform:translateY(-2px)}
.btn-lg{padding:16px 30px;font-size:16px;border-radius:13px}
.btn-nav{padding:10px 19px;font-size:13px;font-weight:700;border-radius:999px;letter-spacing:.01em;
  background:rgba(95,227,255,.10);border-color:rgba(95,227,255,.72);color:#FFFFFF;
  box-shadow:0 0 22px -8px rgba(95,227,255,.55), inset 0 0 20px -8px rgba(95,227,255,.75)}
.btn-nav svg{width:13px;height:13px}
.btn-nav:hover{background:rgba(95,227,255,.19);border-color:var(--ice);color:#fff;transform:translateY(-1px);
  box-shadow:0 0 26px -3px rgba(95,227,255,.6), inset 0 0 22px -8px rgba(95,227,255,.85)}

/* ══ HERO / WARP ══ */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:40px 0 70px;margin-top:-74px;padding-top:114px}
#warp{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 83%,transparent 99%);
  mask-image:linear-gradient(180deg,#000 0%,#000 83%,transparent 99%)}
.hero-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(54% 44% at 50% 44%,rgba(3,4,10,.72) 0%,rgba(3,4,10,.34) 55%,transparent 82%),
             linear-gradient(180deg,rgba(3,4,10,.82) 0%,transparent 20%,transparent 100%)}
/* hyperspace flash */
#flash{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 46%,#EAF9FF,rgba(95,227,255,.5) 22%,transparent 60%);opacity:0}
.js #flash{animation:flash 1.5s var(--ease-out) var(--sd) forwards}
@keyframes flash{0%{opacity:.85}18%{opacity:.5}100%{opacity:0}}

.hero .container{text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#CFE9F7;
  background:rgba(95,227,255,.06);border:1px solid rgba(95,227,255,.26);border-radius:999px;padding:8px 16px}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--ice);box-shadow:0 0 10px var(--ice);animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.hero h1{font-size:clamp(42px,9.2vw,116px);font-weight:800;letter-spacing:-.05em;margin:28px auto 0;max-width:15ch;text-transform:uppercase;text-wrap:balance;
  text-shadow:0 0 90px rgba(43,156,255,.4), 0 2px 40px rgba(3,4,10,.85)}
.hero h1 .w{display:inline-block}
.js .hero h1 .w{opacity:0;transform:translateY(28px) scale(.94);filter:blur(14px)}
.js .hero h1 .w.on{animation:wordin .95s var(--ease-out) forwards}
@keyframes wordin{to{opacity:1;transform:none;filter:blur(0)}}
.hero .lead{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:640px;margin:26px auto 0;line-height:1.65}
.hero-cta{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.hero-meta{display:flex;gap:10px 26px;justify-content:center;flex-wrap:wrap;margin-top:32px;color:var(--muted);font-size:13.5px;font-weight:500}
.hero-meta span{display:inline-flex;align-items:center;gap:8px}
.hero-meta svg{width:15px;height:15px;color:var(--ice)}
.js .fade-up{opacity:0;transform:translateY(20px)}
.js .fade-up.on{animation:fadeup .9s var(--ease-out) forwards}
@keyframes fadeup{to{opacity:1;transform:none}}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:4;display:flex;flex-direction:column;align-items:center;gap:9px;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted-2)}
.scroll-cue i{display:block;width:1px;height:44px;background:linear-gradient(180deg,rgba(95,227,255,.9),transparent);position:relative;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;top:0;left:0;width:1px;height:14px;background:var(--ice);animation:cue 1.9s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-16px);opacity:0}35%{opacity:1}100%{transform:translateY(46px);opacity:0}}

/* ══ SECTIONS ══ */
.section{padding:94px 0;position:relative;z-index:3}
.section--tight{padding:72px 0}
.section--alt{background:none}   /* tinted bands created visible seams — the aurora does this job now */
.kicker{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ice)}
.kicker::before{content:"";width:22px;height:1px;background:var(--ice);opacity:.6}
.shead{max-width:760px;margin:0 auto 58px}
.shead.center{text-align:center}
.shead.center .kicker::after{content:"";width:22px;height:1px;background:var(--ice);opacity:.6}
.shead h2{font-size:clamp(30px,5.4vw,60px);margin:18px 0 16px;text-transform:uppercase;text-wrap:balance;letter-spacing:-.045em}
.shead p{color:var(--muted);font-size:17px;line-height:1.7}
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out)}
.js .reveal.in{opacity:1;transform:none}

.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}

/* ══ CARDS ══ */
.card{position:relative;background:linear-gradient(180deg,var(--panel),rgba(10,14,28,.5));border:1px solid var(--line);border-radius:16px;padding:28px;transition:transform .3s var(--ease),border-color .3s,background .3s;overflow:hidden}
.card::after{content:"";pointer-events:none;position:absolute;inset:-1px;border-radius:16px;padding:1px;background:linear-gradient(135deg,rgba(95,227,255,.55),transparent 45%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s}
.card:hover{transform:translateY(-5px);background:var(--panel-2)}
.card:hover::after{opacity:1}
.card h3{font-size:19px;margin:18px 0 9px;font-weight:700;letter-spacing:-.02em}
.card p{color:var(--muted);font-size:14.5px;line-height:1.65}
.ibadge{width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:rgba(95,227,255,.09);color:var(--ice);border:1px solid rgba(95,227,255,.24)}
.ibadge svg{width:21px;height:21px}

/* ══ PROBLEM ══ */
.prob{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.prob h2{font-size:clamp(28px,4.6vw,50px);text-transform:none;letter-spacing:-.04em;margin:18px 0 20px;text-wrap:balance}
.prob p{color:var(--muted);font-size:16.5px;line-height:1.75;margin-bottom:16px}
.leaks{display:flex;flex-direction:column;gap:1px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--line)}
.leak{display:flex;align-items:center;gap:14px;padding:17px 20px;background:var(--panel);font-size:14.5px;color:var(--muted);transition:background .25s,color .25s}
.leak:hover{background:var(--panel-2);color:var(--text)}
.leak i{flex:none;width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:rgba(233,192,122,.1);border:1px solid rgba(233,192,122,.28);color:var(--gold);font-style:normal;font-size:13px;font-weight:700;line-height:1}
.leak b{color:var(--text);font-weight:600}

/* ── movement helpers ── */
.js .wsplit .w{display:inline-block;opacity:0;transform:translateY(18px);filter:blur(7px)}
.js .wsplit.in .w{animation:wordin .58s var(--ease-out) forwards}
.wcard{will-change:transform}
.par{will-change:transform}
.btn{will-change:transform}

/* ══ SERVICES — capability index ══ */
.svc-head{max-width:none;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end;margin-bottom:44px}
.svc-head>div{max-width:640px}
@media(max-width:820px){
  .svc-head{grid-template-columns:1fr;gap:22px;align-items:start}
  .svc-head>div{max-width:none}
  .svc-head .btn{width:100%}
}
.svc{display:grid;grid-template-columns:.92fr 1.08fr;gap:48px;align-items:start}
.svc-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.svc-item{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;
  width:100%;padding:24px 6px;border:0;border-bottom:1px solid var(--line);background:none;cursor:pointer;
  text-align:left;font-family:inherit;transition:padding .35s var(--ease)}
.svc-item .n{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--muted-2);transition:color .3s}
.svc-item .t{font-family:'Sora';font-weight:700;font-size:clamp(17px,2.05vw,23px);letter-spacing:-.03em;color:var(--muted);transition:color .3s}
.svc-item .ar{width:17px;height:17px;color:var(--ice);opacity:0;transform:translateX(-8px);transition:.35s var(--ease)}
.svc-item:hover .t{color:var(--text)}
.svc-item.on{padding-left:16px}
.svc-item.on .t{color:var(--text)}
.svc-item.on .n{color:var(--ice)}
.svc-item.on .ar{opacity:1;transform:none}
.svc-item .prog{pointer-events:none;position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--grad);box-shadow:0 0 10px rgba(95,227,255,.6)}
.svc-item.on .prog{animation:svcprog 6.4s linear forwards}
.svc.manual .svc-item.on .prog{width:100%;animation:none}
@keyframes svcprog{to{width:100%}}

.svc-panel{position:relative;border:1px solid var(--line);border-radius:20px;padding:34px;overflow:hidden;min-height:452px;
  background:radial-gradient(120% 95% at 100% 0%,rgba(43,156,255,.15),transparent 58%),var(--panel)}
.svc-panel .ghost{position:absolute;right:24px;top:-6px;font-family:'Sora';font-weight:800;font-size:154px;line-height:1;
  letter-spacing:-.06em;color:rgba(255,255,255,.03);pointer-events:none;user-select:none}
.svc-pane{display:none}
.svc-pane.on{display:block}
.js .svc-pane.on{animation:panein .55s var(--ease-out)}
@keyframes panein{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.svc-pane h3{font-size:clamp(21px,2.7vw,29px);letter-spacing:-.035em;margin-bottom:14px;position:relative}
.svc-pane p{color:var(--muted);font-size:15.5px;line-height:1.72;position:relative}
.svc-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;position:relative}
.svc-chips span{font-size:12.5px;color:#CFE4F5;border:1px solid rgba(95,227,255,.22);background:rgba(95,227,255,.055);border-radius:999px;padding:7px 13px}

/* mini visuals inside the panel */
.mv{margin-top:26px;border:1px solid var(--line);border-radius:14px;background:#070B16;padding:16px;position:relative}
.mvbar{display:flex;align-items:center;gap:6px;margin:-16px -16px 14px;padding:10px 14px;background:#0B1120;border-bottom:1px solid var(--line);border-radius:14px 14px 0 0}
.mvbar i{width:8px;height:8px;border-radius:50%;background:#2A3346}
.mvbar span{margin-left:8px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--muted-2)}
.mvwire b{display:block;height:11px;width:52%;border-radius:3px;background:linear-gradient(90deg,rgba(95,227,255,.55),rgba(43,156,255,.18));margin-bottom:10px}
.mvwire u{display:block;height:6px;width:82%;border-radius:3px;background:rgba(255,255,255,.07);margin-bottom:7px}
.mvwire em{display:inline-block;margin-top:12px;font-style:normal;font-size:10.5px;font-weight:700;color:#04070F;background:var(--grad);border-radius:6px;padding:6px 13px}
.mvserp{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid var(--line)}
.mvserp:last-child{border-bottom:0}
.mvserp s{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;text-decoration:none;
  font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--muted-2);border:1px solid var(--line)}
.mvserp.on s{color:#04070F;background:var(--ice);border-color:transparent;font-weight:700}
.mvserp div{flex:1}
.mvserp b{display:block;height:8px;width:70%;border-radius:3px;background:rgba(255,255,255,.14);margin-bottom:6px}
.mvserp.on b{background:linear-gradient(90deg,rgba(95,227,255,.7),rgba(43,156,255,.25))}
.mvserp u{display:block;height:5px;width:88%;border-radius:3px;background:rgba(255,255,255,.06)}
.mvserp em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.14em;color:var(--ice)}
.mvflow{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.mvflow span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  border:1px solid var(--line);border-radius:7px;padding:7px 11px}
.mvflow span:last-child{color:#04070F;background:var(--grad);border-color:transparent;font-weight:700}
.mvflow i{flex:1;height:1px;background:linear-gradient(90deg,rgba(95,227,255,.5),rgba(95,227,255,.12))}
.mvfun{display:flex;flex-direction:column;gap:6px;align-items:center}
.mvfun b{display:block;height:9px;border-radius:3px;background:linear-gradient(90deg,rgba(95,227,255,.45),rgba(43,156,255,.2))}
.mvup{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.mvup span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2)}
.mvup b{font-family:'Sora';font-weight:800;font-size:21px;letter-spacing:-.03em;color:var(--ice)}
.mvbars{display:flex;gap:4px}
.mvbars i{flex:1;height:26px;border-radius:2px;background:linear-gradient(180deg,rgba(95,227,255,.6),rgba(95,227,255,.16))}
.mvck{display:flex;align-items:center;gap:11px;padding:9px 0;font-size:13.5px;color:var(--muted);border-bottom:1px solid var(--line)}
.mvck:last-child{border-bottom:0}
.mvck em{flex:none;width:19px;height:19px;border-radius:5px;display:grid;place-items:center;font-style:normal;font-size:11px;
  color:var(--ice);background:rgba(95,227,255,.1);border:1px solid rgba(95,227,255,.28)}
.mvchat{max-width:80%;font-size:13px;line-height:1.5;padding:11px 14px;border-radius:13px;margin-bottom:9px}
.mvchat.you{background:rgba(255,255,255,.055);border:1px solid var(--line);color:var(--muted);border-bottom-left-radius:4px}
.mvchat.me{margin-left:auto;background:linear-gradient(100deg,rgba(95,227,255,.16),rgba(43,156,255,.1));
  border:1px solid rgba(95,227,255,.28);color:#DCF1FB;border-bottom-right-radius:4px}
@media(max-width:900px){
  .svc{grid-template-columns:1fr;gap:26px}
  .svc-panel{min-height:0;padding:26px}
  .svc-panel .ghost{font-size:110px;right:16px}
  .svc-item{padding:19px 4px}
}

/* ══ WORK ══ */
.work{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.wcard{display:block;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel);transition:transform .35s var(--ease),border-color .3s,box-shadow .35s}
.wcard:hover{transform:translateY(-6px);border-color:rgba(95,227,255,.36);box-shadow:0 30px 70px -30px rgba(43,156,255,.6)}
.wbar{display:flex;align-items:center;gap:6px;padding:11px 15px;background:#0C1122;border-bottom:1px solid var(--line)}
.wbar .d{width:9px;height:9px;border-radius:50%}
.wbar .u{margin-left:10px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--muted-2)}
.wthumb{position:relative;aspect-ratio:8/5;overflow:hidden;background:#080B18}
.wthumb .mock{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:26px}
.wthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .7s var(--ease)}
.wcard:hover .wthumb img{transform:scale(1.045)}
.wbody{padding:22px 24px 26px}
.wbody .cat{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);opacity:.85}
.wbody h3{font-size:20px;margin:11px 0 9px;font-weight:700}
.wbody p{color:var(--muted);font-size:14.5px;line-height:1.65}
.wbody .more{display:inline-block;margin-top:15px;font-size:13.5px;font-weight:600;color:var(--text);transition:color .2s,transform .2s}
.wcard:hover .more{color:var(--ice)}
.mock-t{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.mock-h{font-family:'Sora';font-weight:800;font-size:clamp(20px,2.4vw,30px);color:#fff;line-height:1.05;margin-top:10px;text-transform:uppercase;letter-spacing:-.03em}
.mock-b{display:inline-block;margin-top:14px;font-weight:700;font-size:10.5px;letter-spacing:.08em;padding:8px 17px;border-radius:8px}

/* ══ STEPS ══ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:s}
.step{position:relative;padding:30px 26px;border:1px solid var(--line);border-radius:16px;background:var(--panel);transition:transform .3s var(--ease),border-color .3s}
.step:hover{transform:translateY(-5px);border-color:rgba(95,227,255,.3)}
.step .n{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;color:var(--ice)}
.step h3{font-size:18px;margin:14px 0 10px;font-weight:700}
.step p{color:var(--muted);font-size:14px;line-height:1.6}
.step::before{content:"";pointer-events:none;position:absolute;top:0;left:26px;right:26px;height:1px;background:linear-gradient(90deg,var(--ice),transparent);opacity:.5}

/* ══ STATS ══ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.stat{background:var(--panel);padding:36px 22px 32px;text-align:center;position:relative;transition:background .3s var(--ease)}
.stat::before{content:"";pointer-events:none;position:absolute;top:0;left:24%;right:24%;height:1px;background:linear-gradient(90deg,transparent,rgba(95,227,255,.6),transparent);opacity:0;transition:opacity .3s}
.stat:hover{background:var(--panel-2)}
.stat:hover::before{opacity:1}
.stat b{display:block;font-family:'Sora';font-size:clamp(31px,3.9vw,44px);font-weight:800;letter-spacing:-.045em;line-height:1;white-space:nowrap}
.stat b .u{font-size:.46em;font-weight:700;letter-spacing:-.01em;margin-left:.12em;color:var(--muted)}
.stat .lbl{display:block;margin-top:13px;font-size:12.5px;color:var(--muted);line-height:1.5}

/* ══ WHY ══ */
.why{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.checks{list-style:none;display:flex;flex-direction:column;gap:16px;margin-top:26px}
.checks li{display:flex;gap:13px;align-items:flex-start;color:var(--muted);font-size:15.5px;line-height:1.6}
.checks svg{flex:none;width:20px;height:20px;color:var(--ice);margin-top:2px}
.panelbox{border:1px solid var(--line);border-radius:20px;padding:34px;background:
  radial-gradient(120% 90% at 100% 0%,rgba(43,156,255,.13),transparent 60%),var(--panel)}
.panelbox h3{font-size:21px;margin-bottom:14px}
.panelbox p{color:var(--muted);font-size:15px;line-height:1.7}
.mini{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.mini div{border:1px solid var(--line);border-radius:13px;padding:18px}
.mini b{display:block;font-family:'Sora';font-size:22px;font-weight:800;letter-spacing:-.03em}
.mini span{font-size:12px;color:var(--muted);display:block;margin-top:5px;line-height:1.45}

/* ══ PRICING ══ */
.buildbox{border:1px solid rgba(95,227,255,.28);border-radius:20px;padding:40px;background:
  radial-gradient(90% 120% at 0% 0%,rgba(43,156,255,.16),transparent 58%),var(--panel);
  display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.buildbox h3{font-size:clamp(24px,3.4vw,36px);text-transform:uppercase;letter-spacing:-.04em}
.buildbox p{color:var(--muted);font-size:15.5px;line-height:1.7;margin-top:16px}
.pricerow{display:flex;flex-direction:column;gap:12px}
.pline{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 18px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.02)}
.pline .l{font-size:14.5px;color:var(--muted)}
.pline .l b{display:block;color:var(--text);font-family:'Sora';font-weight:700;font-size:16px;margin-bottom:3px;letter-spacing:-.02em}
.pline .v{font-family:'Sora';font-weight:800;font-size:21px;letter-spacing:-.03em;white-space:nowrap}

.plans{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:22px}
.plan{border:1px solid var(--line);border-radius:16px;padding:24px 20px;background:var(--panel);display:flex;flex-direction:column;transition:transform .3s var(--ease),border-color .3s,background .3s}
.plan:hover{transform:translateY(-5px);border-color:rgba(95,227,255,.32);background:var(--panel-2)}
.plan.pop{border-color:rgba(95,227,255,.5);background:radial-gradient(120% 80% at 50% 0%,rgba(43,156,255,.15),transparent 60%),var(--panel-2);position:relative}
.plan.pop::before{content:"MOST POPULAR";pointer-events:none;position:absolute;top:-1px;left:50%;transform:translate(-50%,-50%);font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.16em;background:var(--grad);color:#04070F;font-weight:700;padding:5px 11px;border-radius:999px;white-space:nowrap}
.plan .pname{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ice)}
.plan .ptag{font-size:13px;color:var(--muted);margin-top:8px;min-height:34px;line-height:1.4}
.plan .pp{font-family:'Sora';font-weight:800;font-size:29px;letter-spacing:-.04em;margin-top:14px;line-height:1}
.plan .pp i{font-style:normal;font-size:13px;font-weight:600;color:var(--muted-2)}
.plan .setup{font-size:11.5px;color:var(--muted-2);margin-top:7px;font-family:'JetBrains Mono',monospace}
.plan ul{list-style:none;margin:18px 0 22px;display:flex;flex-direction:column;gap:10px}
.plan li{font-size:13px;color:var(--muted);line-height:1.5;padding-left:19px;position:relative}
.plan li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--ice);opacity:.7}
.plan .btn{margin-top:auto;width:100%}
.finenote{margin-top:22px;font-size:12.5px;color:var(--muted-2);line-height:1.7;text-align:center;max-width:820px;margin-left:auto;margin-right:auto}

/* ══ FOUNDER ══ */
#founder{padding-top:54px}
.founder{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center}
.fphoto{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line-2);min-height:400px;
  background:radial-gradient(110% 90% at 50% 0%,rgba(43,156,255,.22),var(--panel) 62%)}
.fphoto img{width:100%;aspect-ratio:4/5;object-fit:cover}
.fphoto::after{content:"";pointer-events:none;position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(3,4,10,.75))}
.fphoto .tagline{position:absolute;left:22px;right:22px;bottom:20px;z-index:2}
.fphoto .tagline b{font-family:'Sora';font-size:18px;font-weight:700;display:block}
.fphoto .tagline span{font-size:12.5px;color:var(--muted);font-family:'JetBrains Mono',monospace;letter-spacing:.06em}

/* ══ FAQ ══ */
.faq{max-width:840px;margin:0 auto;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
.fitem+.fitem{border-top:1px solid var(--line)}
.fq{width:100%;text-align:left;background:none;border:none;color:var(--text);font-family:'Sora';font-weight:700;font-size:16.5px;letter-spacing:-.02em;padding:22px 26px;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;transition:color .2s}
.fq:hover{color:var(--ice)}
.fq .pm{flex:none;width:22px;height:22px;position:relative}
.fq .pm::before,.fq .pm::after{content:"";position:absolute;background:var(--ice);left:50%;top:50%;transform:translate(-50%,-50%);transition:transform .3s var(--ease)}
.fq .pm::before{width:13px;height:1.5px}
.fq .pm::after{width:1.5px;height:13px}
.fitem.open .fq .pm::after{transform:translate(-50%,-50%) scaleY(0)}
.fa{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.fa p{padding:0 26px 24px;color:var(--muted);font-size:14.5px;line-height:1.75}

/* ══ CTA ══ */
.cta{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 50% 40%,rgba(9,14,32,.80) 0%,rgba(7,10,22,.45) 55%,transparent 82%);padding:104px 0 96px}
.cta::before{content:"";position:absolute;left:50%;top:-52%;width:120vw;height:120vw;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(43,156,255,.16),transparent 58%);pointer-events:none}
.cta h2{font-size:clamp(32px,6vw,68px);text-transform:uppercase;letter-spacing:-.05em;text-wrap:balance}

/* ══ CONTACT ══ */
.cgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start;max-width:1000px;margin:0 auto}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{margin-bottom:14px}
.field label{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);margin-bottom:7px}
.field input,.field textarea{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;
  padding:13px 15px;color:var(--text);font-family:inherit;font-size:14.5px;transition:border-color .2s,background .2s}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field input:focus,.field textarea:focus{outline:none;border-color:rgba(95,227,255,.55);background:rgba(95,227,255,.05)}
.field textarea{resize:vertical;min-height:104px}
form .ok{display:none;margin-top:14px;font-size:14px;color:var(--ice);text-align:center}
.inforows{display:flex;flex-direction:column;gap:1px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--line)}
.irow{display:flex;align-items:center;gap:14px;padding:15px 18px;background:var(--panel);transition:background .25s}
a.irow:hover{background:var(--panel-2)}
.irow .ibadge{width:38px;height:38px;flex:none;border-radius:10px}
.irow .ibadge svg{width:17px;height:17px}
.irow>span:last-child{font-size:13.5px;color:var(--muted);line-height:1.45}
.irow b{display:block;color:var(--text);font-family:'Sora';font-weight:700;font-size:14px;letter-spacing:-.02em;margin-bottom:2px}
@media(max-width:860px){.cgrid{grid-template-columns:1fr}}
@media(max-width:560px){.frow{grid-template-columns:1fr;gap:0}}

/* ══ FOOTER ══ */
footer{background:rgba(3,4,10,.62);border-top:0;padding:62px 0 34px;position:relative;z-index:3}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px}
.fgrid h4{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-2);font-weight:500;margin-bottom:16px}
.fgrid ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.fgrid a,.fgrid li{font-size:14px;color:var(--muted)}
.fgrid a:hover{color:var(--ice)}
.fbot{margin-top:46px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted-2)}
.fbot a:hover{color:var(--ice)}

/* ══ INNER PAGES ══ */
.phero{position:relative;padding:132px 0 56px;overflow:hidden}
.phero::after{content:"";pointer-events:none;position:absolute;left:50%;top:-40%;width:130vw;height:130vw;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(43,156,255,.14),transparent 58%)}
.phero h1{font-size:clamp(32px,5.6vw,62px);letter-spacing:-.045em;margin:18px 0 18px;text-wrap:balance;max-width:19ch}
.phero p.lead{color:var(--muted);font-size:clamp(16px,2vw,19px);line-height:1.7;max-width:62ch}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:'JetBrains Mono',monospace;font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);margin-bottom:20px}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--ice)}
.crumbs i{font-style:normal;opacity:.5}
.crumbs span[aria-current]{color:var(--ice)}

.prose{max-width:74ch}
.prose h2{font-size:clamp(23px,3.1vw,32px);letter-spacing:-.035em;margin:46px 0 16px}
.prose h3{font-size:clamp(18px,2.2vw,22px);letter-spacing:-.025em;margin:32px 0 12px;font-weight:700}
.prose p{color:var(--muted);font-size:16px;line-height:1.78;margin-bottom:16px;overflow-wrap:anywhere}
.prose ul,.prose ol{margin:0 0 20px 0;padding-left:0;list-style:none}
.prose li{color:var(--muted);font-size:15.5px;line-height:1.7;padding-left:26px;position:relative;margin-bottom:10px;overflow-wrap:anywhere}
.prose li::before{content:"";position:absolute;left:2px;top:10px;width:7px;height:7px;border-radius:50%;background:var(--ice);opacity:.75}
.prose strong{color:var(--text);font-weight:600}
.prose a{color:var(--ice);border-bottom:1px solid rgba(95,227,255,.35)}
.prose a:hover{border-bottom-color:var(--ice)}
.prose>:first-child{margin-top:0}

.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
.side{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px}
.side .card{padding:24px}
.side h3{font-size:17px;margin:0 0 12px}
.side ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.side li a{font-size:14px;color:var(--muted);display:inline-flex;gap:8px}
.side li a:hover{color:var(--ice)}
.side .btn{width:100%}

.linkgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.linkgrid a{display:block;border:1px solid var(--line);border-radius:14px;padding:20px 22px;background:var(--panel);transition:all .28s var(--ease)}
.linkgrid a:hover{transform:translateY(-4px);border-color:rgba(95,227,255,.35);background:var(--panel-2)}
.linkgrid b{display:block;font-family:'Sora';font-size:16px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px}
.linkgrid span{font-size:13.5px;color:var(--muted);line-height:1.55}

.postmeta{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;font-size:13px;color:var(--muted-2);margin-top:6px}
.postmeta b{color:var(--muted);font-weight:600}
.posts{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.posts a{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;padding:26px;background:var(--panel);transition:all .28s var(--ease)}
.posts a:hover{transform:translateY(-4px);border-color:rgba(95,227,255,.32);background:var(--panel-2)}
.posts h3{font-size:19px;letter-spacing:-.025em;margin-bottom:9px}
.posts p{color:var(--muted);font-size:14.5px;line-height:1.6;flex:1}
.posts .more{margin-top:16px;font-size:13.5px;font-weight:600;color:var(--ice)}

.notfound{min-height:70vh;display:grid;place-items:center;text-align:center;padding:140px 0 90px}
.notfound .code{font-family:'Sora';font-weight:800;font-size:clamp(80px,18vw,190px);line-height:1;letter-spacing:-.06em}

@media(max-width:960px){
  .layout{grid-template-columns:1fr;gap:34px}
  .side{position:static}
  .linkgrid{grid-template-columns:1fr 1fr}
  .posts{grid-template-columns:1fr}
}
@media(max-width:620px){ .linkgrid{grid-template-columns:1fr} .phero{padding:112px 0 40px} }

/* ══ BOOKING ══ */
.cal-shell{max-width:940px;margin:0 auto}
.cal-wrap{background:#fff;border-radius:18px;padding:10px;overflow:hidden;border:1px solid var(--line-2);
  box-shadow:0 30px 80px -40px rgba(43,156,255,.55)}
.cal-wrap iframe{display:block;width:100%;border:0;min-height:760px;border-radius:12px}
.book-points{display:flex;gap:12px 26px;justify-content:center;flex-wrap:wrap;margin:0 0 32px;color:var(--muted);font-size:14.5px}
.book-points span{display:inline-flex;align-items:center;gap:8px}
.book-points svg{width:16px;height:16px;color:var(--ice);flex:none}
.book-alt{text-align:center;margin-top:26px;color:var(--muted);font-size:15px}
.book-alt a{color:var(--ice)}
@media(max-width:640px){.cal-wrap{padding:6px}.cal-wrap iframe{min-height:900px}.book-points{gap:10px 16px;font-size:13.5px}}

/* ══ RESPONSIVE ══ */
@media(max-width:1020px){
  .plans{grid-template-columns:repeat(2,1fr)}
  .g4{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .buildbox{grid-template-columns:1fr;gap:30px;padding:32px}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  /* On a phone the hero is tall and narrow, so the planet gets its own
     clear band of space under the content instead of crossing it. */
  .hero{min-height:auto;padding-top:100px;padding-bottom:104px}
  .scroll-cue{display:none}                 /* was landing on the meta row */
  .eyebrow{font-size:9.5px;letter-spacing:.14em;padding:7px 13px;white-space:nowrap}
  .hero h1{margin-top:22px}
  .hero .lead{margin-top:20px}
  .hero-meta{flex-direction:column;gap:13px;align-items:center;margin-top:28px}
}
@media(max-width:860px){
  .nav-links{position:fixed;inset:74px 0 auto 0;background:rgba(3,4,10,.97);backdrop-filter:blur(20px);flex-direction:column;gap:0;padding:12px 24px 24px;border-bottom:1px solid var(--line);display:none}
  .nav-links.open{display:flex}
  .nav-links a{padding:15px 0;font-size:16px;border-bottom:1px solid var(--line)}
  .nav-toggle{display:block}
  .nav-tel{display:none}
  .btn-nav{display:none}                    /* lives in the mobile menu instead */
  .nav-cta-m{display:block}
  .nav-cta-m a{color:var(--ice)!important;font-weight:700}
  .brand small{display:none}
  .brand b{font-size:14.5px}
  .nav:not(.scrolled){background:rgba(3,4,10,.6);backdrop-filter:blur(10px)}
  .g3,.g2,.work,.prob,.why,.founder{grid-template-columns:1fr}
  .prob,.why,.founder{gap:34px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .section{padding:58px 0}
  #founder{padding-top:30px}
  .hero + .section{padding-top:14px}   /* the hero already carries its own bottom space */
  .fphoto{max-width:340px}
}
@media(max-width:560px){
  .plans,.g4,.steps{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .hero{padding-top:100px}
  .card{padding:24px}
  .btn{width:100%}
  .hero-cta{flex-direction:column}
  .hero-cta .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .js .hero h1 .w,.js .fade-up,.js .reveal{opacity:1!important;transform:none!important;filter:none!important}
}
/* phones: the fade must not eat the horizon. With the globe raised, the only
   thing crossing the hero's bottom edge is the planet's dark body, so a short
   fade is enough to keep the blend that the 83% version was there to protect. */
@media(max-width:760px){#warp{
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 90%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 90%,transparent 100%)}}