/* ───────────────────────── tokens ───────────────────────── */
:root{
  --navy-950:#01233c; --navy-900:#003a63; --navy-800:#0a4a7a; --navy-700:#0f5c96;
  --blue-600:#0077c0; --blue-400:#1ab7ea; --blue-100:#d6eefb; --blue-50:#eef8fd;
  --amber-400:#fbbf24; --amber-500:#f59e0b; --amber-600:#d97706; --amber-700:#b45309;
  --sand-50:#faf7f2; --sand-100:#f3ede3;
  --ink-900:#0f172a; --ink-700:#334155; --ink-600:#475569; --ink-500:#64748b; --ink-400:#94a3b8;
  --line:rgb(15 23 42 / .09);
  --green:#6fcf8a;

  --font-sans:'Geist',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --font-serif:'Instrument Serif',ui-serif,Georgia,serif;

  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-sheet:40px;
  --shadow-card:0 1px 0 rgb(15 23 42 / .04), 0 18px 40px -28px rgb(0 58 99 / .45);
  --ease:cubic-bezier(.2,.7,.2,1);
  --wrap:1200px;
}

/* ───────────────────────── base ───────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{margin:0; font-family:var(--font-sans); font-size:16px; line-height:1.6; color:var(--ink-900); background:#fff; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
img{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4,p{margin:0}
ul{margin:0; padding:0; list-style:none}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:3px solid var(--amber-500); outline-offset:3px; border-radius:6px}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 20px}
@media (min-width:768px){.wrap{padding:0 32px}}
.mono{font-family:var(--font-mono)}
.serif{font-family:var(--font-serif); font-style:italic; font-weight:400; letter-spacing:-.01em}
.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}
.skip{position:absolute; left:12px; top:-60px; z-index:200; background:var(--amber-500); color:var(--navy-950); padding:10px 16px; border-radius:999px; font-weight:600}
.skip:focus{top:12px}

.eyebrow{display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--amber-700)}
.eyebrow::before{content:""; width:22px; height:2px; border-radius:2px; background:currentColor}
.h2{margin-top:14px; font-size:clamp(30px,4.2vw,48px); line-height:1.08; font-weight:700; letter-spacing:-.03em; color:var(--navy-950)}
.lede{margin-top:14px; max-width:620px; font-size:17px; color:var(--ink-600)}
.section{padding:88px 0}
@media (min-width:1024px){.section{padding:112px 0}}
.head-row{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px}

/* buttons — pill shapes, amber primary */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:0 24px; border-radius:999px; font-weight:600; font-size:15px; cursor:pointer; border:1px solid transparent; transition:transform .2s var(--ease), background-color .2s, border-color .2s, box-shadow .2s; touch-action:manipulation}
.btn .a{transition:transform .2s var(--ease)}
.btn:hover .a{transform:translateX(4px)}
.btn-primary{background:var(--amber-500); color:var(--navy-950); box-shadow:0 10px 24px -12px rgb(245 158 11 / .7)}
.btn-primary:hover{background:var(--amber-400); transform:translateY(-1px)}
.btn-ghost-dark{border-color:rgb(255 255 255 / .22); color:#fff}
.btn-ghost-dark:hover{border-color:#fff; background:rgb(255 255 255 / .06)}
.btn-ghost{border-color:var(--line); color:var(--navy-950); background:#fff}
.btn-ghost:hover{border-color:var(--navy-700)}
.link-arrow{display:inline-flex; align-items:center; gap:8px; font-weight:600; color:var(--navy-800)}
.link-arrow .a{transition:transform .2s var(--ease)}
.link-arrow:hover .a{transform:translateX(4px)}

/* ───────────────────────── utility bar ───────────────────────── */
.util{background:var(--navy-950); color:#b9c4d4; font-size:13px}
.util .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:40px}
.util-l,.util-r{display:flex; align-items:center; gap:22px}
.util a{display:inline-flex; align-items:center; gap:7px; transition:color .2s}
.util a:hover{color:#fff}
.util svg{width:14px; height:14px; flex:none}
.pill-live{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#fff}
.pulse{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 0 rgb(111 207 138 / .6); animation:halo 2.4s ease-out infinite}
@keyframes halo{to{box-shadow:0 0 0 10px rgb(111 207 138 / 0)}}
.util .hide-sm{display:none}
@media (min-width:900px){.util .hide-sm{display:inline-flex}}
@media (max-width:560px){.util .util-r{display:none}}

/* ───────────────────────── header ───────────────────────── */
.hdr{position:sticky; top:0; z-index:60; background:rgb(255 255 255 / .9); backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid transparent; transition:border-color .25s, box-shadow .25s}
.hdr.scrolled{border-color:var(--line); box-shadow:0 10px 30px -24px rgb(1 35 60 / .5)}
.hdr .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; height:76px}
.logo img{height:28px; width:auto}
.nav{display:none; align-items:center; gap:2px}
.nav > li{position:relative}
.nav > li > a{display:inline-flex; align-items:center; gap:6px; padding:10px 14px; border-radius:999px; font-size:15px; font-weight:500; color:var(--ink-700); transition:color .2s, background-color .2s}
.nav > li > a:hover,.nav > li > a[aria-current]{color:var(--navy-950); background:var(--sand-100)}
.nav .chev{width:12px; height:12px; transition:transform .2s}
.dd{position:absolute; left:50%; top:calc(100% + 10px); width:560px; transform:translate(-50%,6px); opacity:0; visibility:hidden; transition:opacity .2s, transform .2s var(--ease), visibility .2s; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); box-shadow:0 30px 60px -30px rgb(1 35 60 / .45); padding:18px; display:grid; grid-template-columns:1fr 1fr; gap:4px}
.dd::before{content:""; position:absolute; left:0; right:0; top:-12px; height:12px}
.nav > li:hover .dd,.nav > li:focus-within .dd{opacity:1; visibility:visible; transform:translate(-50%,0)}
.nav > li:hover .chev,.nav > li:focus-within .chev{transform:rotate(180deg)}
.dd a{display:block; padding:10px 12px; border-radius:var(--r-sm); font-size:14px; font-weight:500; color:var(--ink-700)}
.dd a small{display:block; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-500); margin-top:2px}
.dd a:hover{background:var(--sand-50); color:var(--navy-950)}
.dd .all{grid-column:1/-1; margin-top:6px; border-top:1px solid var(--line); border-radius:0; padding-top:14px; color:var(--amber-700); font-weight:600}
.hdr-cta{display:none}
.menu-btn{display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:999px; border:1px solid var(--line); background:#fff; cursor:pointer}
.menu-btn svg{width:22px; height:22px}
@media (min-width:1080px){.nav{display:flex} .hdr-cta{display:inline-flex} .menu-btn{display:none}}

.mnav{display:none; border-top:1px solid var(--line); background:#fff; max-height:calc(100dvh - 76px); overflow:auto}
.mnav.open{display:block}
.mnav .wrap{padding-top:12px; padding-bottom:24px}
.mnav a{display:flex; align-items:center; justify-content:space-between; min-height:48px; padding:0 4px; border-bottom:1px solid var(--line); font-weight:500}
.mnav .sub a{padding-left:18px; font-size:15px; color:var(--ink-600)}
.mnav .btn{margin-top:18px; width:100%}
@media (min-width:1080px){.mnav{display:none !important}}

/* ───────────────────────── hero ───────────────────────── */
.hero{position:relative; overflow:hidden; background:var(--navy-950); color:#e6ecf5; padding:64px 0 128px}
@media (min-width:1024px){.hero{padding:88px 0 150px}}
.hero-bg{position:absolute; inset:0; pointer-events:none}
.hero-bg .grid{position:absolute; inset:0; background-image:linear-gradient(rgb(255 255 255 / .045) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .045) 1px,transparent 1px); background-size:56px 56px; mask-image:radial-gradient(90% 70% at 70% 30%,#000 30%,transparent 75%); -webkit-mask-image:radial-gradient(90% 70% at 70% 30%,#000 30%,transparent 75%)}
.hero-bg .glow-a{position:absolute; width:620px; height:620px; right:-160px; top:-220px; border-radius:50%; background:radial-gradient(closest-side,rgb(26 183 234 / .28),transparent)}
.hero-bg .glow-b{position:absolute; width:520px; height:520px; left:-200px; bottom:-260px; border-radius:50%; background:radial-gradient(closest-side,rgb(245 158 11 / .18),transparent)}
.hero .wrap{position:relative; display:grid; gap:56px; align-items:center}
.hero .wrap > *,.contact > *,.partners > *{min-width:0}
@media (min-width:1024px){.hero .wrap{grid-template-columns:1fr 1.02fr; gap:64px}}
.badge-row{display:flex; flex-wrap:wrap; gap:10px}
.chip{display:inline-flex; align-items:center; gap:9px; padding:7px 14px 7px 10px; border-radius:999px; border:1px solid rgb(255 255 255 / .14); background:rgb(255 255 255 / .04); font-family:var(--font-mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:#cfd8e6}
.chip img{width:18px; height:auto; border-radius:3px}
.hero h1{margin-top:28px; font-size:clamp(42px,6.6vw,80px); line-height:.98; letter-spacing:-.045em; font-weight:700; color:#fff}
.hero h1 .serif{color:var(--amber-400); letter-spacing:-.02em}
.hero .sub{margin-top:24px; max-width:540px; font-size:18px; line-height:1.65; color:#b9c4d4}
.hero .sub strong{color:#fff; font-weight:600}
.hero .ctas{margin-top:34px; display:flex; flex-wrap:wrap; gap:12px}
.certs{margin-top:36px; display:flex; flex-wrap:wrap; gap:10px 22px; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:#8c9ab0}
.certs span{display:inline-flex; align-items:center; gap:8px}
.certs span::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--green)}

/* hero entrance — one orchestrated load */
.js .rise{opacity:0; transform:translateY(18px); animation:rise .8s var(--ease) forwards}
.js .rise.d1{animation-delay:.06s} .js .rise.d2{animation-delay:.16s} .js .rise.d3{animation-delay:.26s}
.js .rise.d4{animation-delay:.36s} .js .rise.d5{animation-delay:.46s} .js .rise.d6{animation-delay:.6s}
@keyframes rise{to{opacity:1; transform:none}}

/* ops console */
.console{position:relative; border-radius:var(--r-lg); background:linear-gradient(180deg,#033456,#01223a); border:1px solid rgb(255 255 255 / .08); box-shadow:0 50px 90px -40px rgb(0 0 0 / .7), inset 0 1px 0 rgb(255 255 255 / .06); padding:22px; overflow:hidden}
.console::after{content:""; position:absolute; inset:0; background:radial-gradient(120% 60% at 50% 0%,rgb(26 183 234 / .14),transparent 60%); pointer-events:none}
.c-top{display:flex; justify-content:space-between; align-items:center; font-family:var(--font-mono); font-size:11.5px; color:#8c9ab0}
.c-top .l{display:inline-flex; align-items:center; gap:8px; color:#dbe3ee}
.c-kpis{margin-top:18px; display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.c-kpi{border-radius:12px; background:rgb(255 255 255 / .04); border:1px solid rgb(255 255 255 / .05); padding:12px}
.c-kpi .k{font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#8c9ab0}
.c-kpi .v{margin-top:6px; font-size:clamp(22px,3vw,30px); font-weight:600; color:#fff; font-variant-numeric:tabular-nums; letter-spacing:-.02em}
.c-kpi .v small{font-size:.6em; color:#8c9ab0; margin-left:2px}
.c-kpi .n{margin-top:3px; font-family:var(--font-mono); font-size:10.5px; color:var(--amber-400)}
.c-jobs{margin-top:18px}
.c-jobs .hd{display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#8c9ab0}
.job{margin-top:11px}
.job .row{display:flex; justify-content:space-between; gap:12px; font-family:var(--font-mono); font-size:12px; color:#dbe3ee}
.job .row span:first-child{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.job .row b{font-weight:500; color:#8c9ab0}
.bar{margin-top:6px; height:5px; border-radius:99px; background:rgb(255 255 255 / .07); overflow:hidden}
.bar i{display:block; height:100%; width:var(--w); border-radius:99px; background:linear-gradient(90deg,var(--blue-400),var(--amber-400)); transform-origin:left; animation:fill 1.8s var(--ease) .6s both}
@keyframes fill{from{transform:scaleX(0)}}
.ticker{margin:18px -22px -22px; padding:11px 0; border-top:1px solid rgb(255 255 255 / .06); overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker > div{display:flex; gap:28px; width:max-content; white-space:nowrap; font-family:var(--font-mono); font-size:11.5px; color:#8c9ab0; animation:slide 36s linear infinite}
.ticker em{font-style:normal; color:var(--green)}
@keyframes slide{to{transform:translateX(-50%)}}
.c-note{margin-top:12px; text-align:right; font-family:var(--font-mono); font-size:10.5px; color:#5d6d86}

/* ───────────────────────── sheet (rounded-top overlap) ───────────────────────── */
.sheet{position:relative; z-index:2; margin-top:calc(var(--r-sheet) * -1); border-radius:var(--r-sheet) var(--r-sheet) 0 0; background:#fff}
.sheet.sand{background:var(--sand-50)}
.sheet.navy{background:var(--navy-950); color:#e6ecf5}

/* ───────────────────────── clients strip ───────────────────────── */
.clients{padding:52px 0 40px}
.clients .lbl{text-align:center; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-500)}
.marquee{margin-top:26px; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee ul{display:flex; gap:56px; width:max-content; align-items:center; animation:slide 48s linear infinite}
.marquee:hover ul{animation-play-state:paused}
.marquee li{font-size:21px; font-weight:700; letter-spacing:-.02em; color:#9aa6b8; white-space:nowrap; transition:color .25s}
.marquee li:hover{color:var(--navy-900)}
.marquee li .sec{display:block; font-family:var(--font-mono); font-size:10px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-400); text-align:center}

/* ───────────────────────── industries ───────────────────────── */
.ind-grid{margin-top:48px; display:grid; gap:16px; grid-template-columns:1fr}
@media (min-width:640px){.ind-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.ind-grid{grid-template-columns:repeat(3,1fr)}}
.ind{position:relative; display:flex; flex-direction:column; gap:14px; padding:26px; border-radius:var(--r-md); border:1px solid var(--line); background:#fff; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s}
.ind:hover{transform:translateY(-3px); box-shadow:var(--shadow-card); border-color:rgb(15 92 150 / .3)}
.ind .top{display:flex; align-items:center; justify-content:space-between}
.ico{display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:14px; background:var(--blue-50); color:var(--navy-800); transition:background-color .3s, color .3s}
.ico svg{width:22px; height:22px}
.ind:hover .ico{background:var(--navy-900); color:var(--amber-400)}
.ind h3{font-size:20px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.ind p{font-size:14.5px; color:var(--ink-600)}
.ind .who{font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--amber-700)}
.ind .tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:4px}
.ind .tags a{font-size:12.5px; font-weight:500; padding:5px 11px; border-radius:999px; background:var(--sand-50); border:1px solid var(--sand-100); color:var(--ink-700); transition:background-color .2s, border-color .2s}
.ind .tags a:hover{background:#fff; border-color:var(--navy-700); color:var(--navy-900)}

/* ───────────────────────── services ───────────────────────── */
.svc-grid{margin-top:48px; display:grid; gap:16px; grid-template-columns:1fr}
@media (min-width:640px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.svc-grid{grid-template-columns:repeat(4,1fr)}}
.svc{position:relative; display:flex; flex-direction:column; gap:12px; padding:24px; border-radius:var(--r-md); background:#fff; border:1px solid var(--line); overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s}
.svc:hover{transform:translateY(-3px); box-shadow:var(--shadow-card); border-color:rgb(15 92 150 / .3)}
.svc:hover .ico{background:var(--navy-900); color:var(--amber-400)}
.svc h3{font-size:17px; font-weight:700; letter-spacing:-.015em; color:var(--navy-950)}
.svc p{font-size:14px; color:var(--ink-600)}
.svc .vend{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-500)}
.svc .more{margin-top:auto; padding-top:6px; font-size:14px}
.svc.flag{background:var(--navy-950); color:#cfd8e6; border-color:transparent; padding:28px}
@media (min-width:1024px){.svc.flag{grid-column:span 2}}
.svc.flag .ico{background:rgb(255 255 255 / .08); color:var(--amber-400)}
.svc.flag h3{font-size:23px; color:#fff}
.svc.flag p{font-size:15px; color:#b9c4d4}
.svc.flag .vend{color:#8c9ab0}
.svc.flag .more{color:var(--amber-400)}
.svc.flag .tag{position:absolute; top:24px; right:24px; font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; padding:5px 10px; border-radius:999px; background:var(--amber-500); color:var(--navy-950); font-weight:600}
.svc.flag .facts{display:flex; flex-wrap:wrap; gap:6px 18px; font-family:var(--font-mono); font-size:11.5px; color:#dbe3ee}
.svc.flag .facts span{display:inline-flex; align-items:center; gap:7px}
.svc.flag .facts span::before{content:""; width:5px; height:5px; border-radius:50%; background:var(--green)}
.svc-cta{justify-content:space-between; gap:20px; background:linear-gradient(135deg,var(--amber-500),var(--amber-400)); border-color:transparent}
.svc-cta h3{font-size:22px}
.svc-cta p{margin-top:6px; color:var(--navy-900); max-width:520px}
.svc-cta .btn{align-self:flex-start; flex:none; white-space:nowrap; background:var(--navy-950); color:#fff; box-shadow:none}
@media (min-width:1024px){.svc-cta .btn{align-self:center}}
.svc-cta:hover .btn{background:var(--navy-800)}
@media (min-width:640px){.svc-cta{grid-column:1/-1}}
@media (min-width:1024px){.svc-cta{grid-column:span 3; flex-direction:row; align-items:center}}
.svc.flag::after{content:""; position:absolute; right:-80px; bottom:-120px; width:280px; height:280px; border-radius:50%; background:radial-gradient(closest-side,rgb(26 183 234 / .18),transparent); pointer-events:none}

/* ───────────────────────── numbers band ───────────────────────── */
.numbers{padding:72px 0 calc(72px + var(--r-sheet))}
.num-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:36px 20px}
@media (min-width:900px){.num-grid{grid-template-columns:repeat(4,1fr)}}
.num .v{font-size:clamp(48px,6vw,72px); font-weight:600; line-height:1; letter-spacing:-.05em; color:#fff; font-variant-numeric:tabular-nums}
.num .v sup{font-size:.45em; vertical-align:top; position:relative; top:.25em; color:var(--amber-400); margin-left:2px}
.num .l{margin-top:10px; font-size:15px; color:#b9c4d4}
.num .k{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber-400); margin-bottom:12px}
@media (min-width:900px){.num + .num{border-left:1px solid rgb(255 255 255 / .1); padding-left:28px}}

/* ───────────────────────── process ───────────────────────── */
.steps{margin-top:52px; display:grid; gap:18px; grid-template-columns:1fr; counter-reset:s}
@media (min-width:768px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.steps{grid-template-columns:repeat(4,1fr); gap:0}}
.step{position:relative; padding:28px 26px; border-radius:var(--r-md); background:#fff; border:1px solid var(--line)}
@media (min-width:1080px){
  .step{border-radius:0; border-right:none}
  .step:first-child{border-radius:var(--r-md) 0 0 var(--r-md)}
  .step:last-child{border-radius:0 var(--r-md) var(--r-md) 0; border-right:1px solid var(--line); background:var(--navy-950); color:#cfd8e6}
  .step:last-child h3{color:#fff}
  .step:last-child p{color:#b9c4d4}
}
.step .n{display:flex; align-items:center; justify-content:space-between; font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber-700)}
.step:last-child .n{color:var(--amber-400)}
.step .n i{font-style:normal; font-size:28px; letter-spacing:-.04em; color:var(--ink-400)}
.step h3{margin-top:22px; font-size:22px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.step p{margin-top:8px; font-size:14.5px; color:var(--ink-600)}
.step ul{margin-top:14px; display:grid; gap:6px; font-size:13.5px}
.step li{display:flex; gap:8px; color:inherit}
.step li::before{content:"→"; color:var(--amber-600)}

/* ───────────────────────── case studies ───────────────────────── */
.cases{margin-top:48px; display:grid; gap:18px; grid-template-columns:1fr}
@media (min-width:900px){.cases{grid-template-columns:repeat(3,1fr)}}
.case{display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:#fff; transition:transform .3s var(--ease), box-shadow .3s}
.case:hover{transform:translateY(-3px); box-shadow:var(--shadow-card)}
.case .cover{position:relative; padding:24px; background:var(--navy-900); color:#fff; min-height:150px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden}
.case .cover::after{content:""; position:absolute; inset:0; background-image:linear-gradient(rgb(255 255 255 / .05) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .05) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(135deg,transparent 30%,#000); -webkit-mask-image:linear-gradient(135deg,transparent 30%,#000)}
.case .sector{position:relative; z-index:1; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber-400)}
.case .metric{position:relative; z-index:1; font-size:40px; font-weight:600; letter-spacing:-.04em; line-height:1}
.case .metric small{display:block; margin-top:6px; font-size:13px; font-weight:400; letter-spacing:0; color:#b9c4d4}
.case .body{padding:24px; display:flex; flex-direction:column; gap:14px; flex:1}
.case h3{font-size:19px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950); line-height:1.3}
.case dl{margin:0; display:grid; gap:10px; font-size:14px}
.case dt{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-500)}
.case dd{margin:2px 0 0; color:var(--ink-700)}
.case .stack{margin-top:auto; display:flex; flex-wrap:wrap; gap:6px}
.case .stack span{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; padding:4px 9px; border-radius:999px; background:var(--blue-50); color:var(--navy-800)}
/* placeholder markers — every one must be replaced with verified figures before go-live */
.tbd{display:inline-block; min-width:2.2em; padding:0 .3em; border:1.5px dashed var(--amber-600); border-radius:6px; color:var(--amber-700); background:rgb(245 158 11 / .08); font-weight:600}
.case .cover .tbd{color:var(--amber-400); border-color:var(--amber-400); background:rgb(245 158 11 / .1)}
.draft-note{margin-top:18px; display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11.5px; color:var(--amber-700)}

/* ───────────────────────── partners ───────────────────────── */
.partners{display:grid; gap:40px; align-items:center}
@media (min-width:1024px){.partners{grid-template-columns:.9fr 1.1fr; gap:64px}}
.p-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px}
@media (min-width:640px){.p-grid{grid-template-columns:repeat(3,1fr)}}
.p{display:flex; flex-direction:column; justify-content:center; gap:4px; min-height:84px; padding:14px 18px; border-radius:var(--r-md); border:1px solid var(--line); background:#fff; transition:border-color .25s, box-shadow .25s}
.p:hover{border-color:rgb(15 92 150 / .3); box-shadow:var(--shadow-card)}
.p b{font-size:18px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.p span{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-500)}
.p.feat{flex-direction:row; align-items:center; gap:14px; grid-column:1/-1; background:var(--navy-950); border-color:transparent}
.p.feat img{width:40px; border-radius:4px}
.p.feat b{color:#fff}
.p.feat span{color:var(--amber-400)}

/* ───────────────────────── contact ───────────────────────── */
.contact{display:grid; gap:48px}
@media (min-width:1024px){.contact{grid-template-columns:.9fr 1.1fr; gap:64px}}
.contact .h2{color:#fff}
.contact .h2 .serif{color:var(--amber-400)}
.contact .lede{color:#b9c4d4}
.c-list{margin-top:32px; display:grid; gap:14px}
.c-list a,.c-list div{display:flex; gap:14px; align-items:flex-start; color:#dbe3ee}
.c-list a:hover{color:#fff}
.c-list .ic{flex:none; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:12px; background:rgb(255 255 255 / .06); color:var(--amber-400)}
.c-list .ic svg{width:20px; height:20px}
.c-list small{display:block; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:#8c9ab0}
.form{border-radius:var(--r-lg); background:#fff; color:var(--ink-900); padding:28px; box-shadow:0 40px 80px -40px rgb(0 0 0 / .6)}
@media (min-width:768px){.form{padding:36px}}
.form h3{font-size:22px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.form .hint{margin-top:4px; font-size:14px; color:var(--ink-600)}
.fg{margin-top:22px; display:grid; gap:16px}
@media (min-width:640px){.fg.two{grid-template-columns:1fr 1fr}}
.fg + .fg{margin-top:16px}
.field label{display:block; font-size:13.5px; font-weight:600; color:var(--ink-700); margin-bottom:6px}
.field label i{font-style:normal; color:var(--amber-700)}
.field input,.field select,.field textarea{display:block; width:100%; min-height:48px; padding:12px 14px; border-radius:12px; border:1px solid rgb(15 23 42 / .16); background:#fff; font-size:16px; transition:border-color .2s, box-shadow .2s}
.field textarea{min-height:120px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--navy-700); box-shadow:0 0 0 4px rgb(15 92 150 / .14)}
.field [aria-invalid="true"]{border-color:#dc2626}
.field .err{margin-top:6px; font-size:13px; color:#b91c1c; display:none}
.field [aria-invalid="true"] + .err{display:block}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form .btn{margin-top:22px; width:100%}
.form .btn[disabled]{opacity:.6; cursor:progress}
.form .fine{margin-top:12px; font-size:12.5px; color:var(--ink-500); text-align:center}
.status{margin-top:14px; padding:12px 14px; border-radius:12px; font-size:14px; display:none}
.status.ok{display:block; background:#ecfdf3; color:#166534; border:1px solid #bbf7d0}
.status.bad{display:block; background:#fef2f2; color:#991b1b; border:1px solid #fecaca}

/* ───────────────────────── footer ───────────────────────── */
.ftr{background:var(--navy-950); color:#8c9ab0; border-top:1px solid rgb(255 255 255 / .08)}
.ftr .wrap{padding-top:56px; padding-bottom:32px}
.f-grid{display:grid; gap:36px; grid-template-columns:1fr}
@media (min-width:768px){.f-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}}
.ftr .logo img{filter:brightness(0) invert(1); height:26px}
.ftr p{margin-top:16px; max-width:360px; font-size:14px}
.ftr h4{font-size:13px; font-weight:600; color:#fff; letter-spacing:.02em}
.ftr ul{margin-top:14px; display:grid; gap:9px; font-size:14px}
.ftr a:hover{color:#fff}
.f-bot{margin-top:44px; padding-top:22px; border-top:1px solid rgb(255 255 255 / .08); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:13px}

/* ───────────────────────── scroll reveal (JS only) ───────────────────────── */
.js [data-reveal]{opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.js [data-reveal].in{opacity:1; transform:none}
.js [data-stagger] > *{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease)}
.js [data-stagger].in > *{opacity:1; transform:none}
.js [data-stagger].in > *:nth-child(2){transition-delay:50ms}
.js [data-stagger].in > *:nth-child(3){transition-delay:100ms}
.js [data-stagger].in > *:nth-child(4){transition-delay:150ms}
.js [data-stagger].in > *:nth-child(5){transition-delay:200ms}
.js [data-stagger].in > *:nth-child(6){transition-delay:250ms}
.js [data-stagger].in > *:nth-child(7){transition-delay:300ms}
.js [data-stagger].in > *:nth-child(8){transition-delay:350ms}
.js [data-stagger].in > *:nth-child(9){transition-delay:400ms}
.js [data-stagger].in > *:nth-child(10){transition-delay:450ms}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
  .js .rise,.js [data-reveal],.js [data-stagger] > *{opacity:1 !important; transform:none !important}
  .marquee ul{animation:none !important; flex-wrap:wrap; width:auto; justify-content:center; row-gap:24px}
  .marquee li[aria-hidden],.ticker{display:none}
}

/* ═════════════════════════ INNER PAGES ═════════════════════════ */
/* serif accent inside headings: authored as <em> */
.h2 em,.phero h1 em,.note h3 em,.cta-band h2 em,.form h3 em{font-family:var(--font-serif); font-style:italic; font-weight:400; letter-spacing:-.01em}
.phero h1 em,.note h3 em{color:var(--amber-400)}
.h2 em,.cta-band h2 em{color:var(--navy-700)}

/* page hero — shorter sibling of the home hero */
.phero{position:relative; overflow:hidden; background:var(--navy-950); color:#e6ecf5; padding:48px 0 120px}
@media (min-width:1024px){.phero{padding:64px 0 136px}}
.phero .wrap{position:relative; display:grid; gap:44px; align-items:center}
.phero .wrap > *{min-width:0}
@media (min-width:1024px){.phero.split .wrap{grid-template-columns:1.1fr .9fr; gap:64px}}
.crumbs{display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:#8c9ab0}
.crumbs a:hover{color:#fff}
.crumbs span[aria-current]{color:var(--amber-400)}
.crumbs .sep{color:#4a5d78}
.phero .ico-lg{margin-top:26px; display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:16px; background:rgb(255 255 255 / .07); border:1px solid rgb(255 255 255 / .1); color:var(--amber-400)}
.phero .ico-lg svg{width:26px; height:26px}
.phero .kicker{margin-top:22px; font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--amber-400)}
.phero h1{margin-top:12px; font-size:clamp(38px,5.4vw,66px); line-height:1.02; letter-spacing:-.04em; font-weight:700; color:#fff}
.phero .sub{margin-top:20px; max-width:600px; font-size:18px; line-height:1.65; color:#b9c4d4}
.phero .ctas{margin-top:30px; display:flex; flex-wrap:wrap; gap:12px}
.tagrow{margin-top:28px; display:flex; flex-wrap:wrap; align-items:center; gap:8px}
.tagrow .lbl{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#8c9ab0; margin-right:4px}
.tagrow .t{font-family:var(--font-mono); font-size:11.5px; padding:5px 12px; border-radius:999px; border:1px solid rgb(255 255 255 / .14); color:#dbe3ee}

/* outcomes card (console family) */
.oc{position:relative; border-radius:var(--r-lg); background:linear-gradient(180deg,#033456,#01223a); border:1px solid rgb(255 255 255 / .08); box-shadow:0 50px 90px -40px rgb(0 0 0 / .7), inset 0 1px 0 rgb(255 255 255 / .06); padding:24px}
.oc ul{margin-top:18px; display:grid; gap:16px}
.oc li{display:flex; gap:14px}
.oc li .b{flex:none; display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; background:rgb(245 158 11 / .12); color:var(--amber-400)}
.oc li .b svg{width:18px; height:18px}
.oc li:nth-child(2) .b{background:rgb(26 183 234 / .12); color:var(--blue-400)}
.oc li:nth-child(3) .b{background:rgb(111 207 138 / .12); color:var(--green)}
.oc li b{display:block; font-size:15.5px; font-weight:600; color:#fff}
.oc li span{display:block; margin-top:2px; font-size:13.5px; color:#9fb0c6}
.oc .m{margin-top:20px; padding-top:18px; border-top:1px solid rgb(255 255 255 / .08); display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.oc .m div{min-width:0}
.oc .m small{display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#8c9ab0}
.oc .m strong{display:block; margin-top:4px; font-size:clamp(18px,2.2vw,24px); font-weight:600; letter-spacing:-.02em; color:#fff; overflow-wrap:anywhere}

/* body: prose + checklist */
.split2{display:grid; gap:48px}
@media (min-width:1024px){.split2{grid-template-columns:1fr 1fr; gap:64px; align-items:start}}
.split2 > *{min-width:0}
.prose{margin-top:22px; display:grid; gap:16px; font-size:16.5px; line-height:1.75; color:var(--ink-700)}
.prose strong{color:var(--navy-950)}
.prose a{color:var(--navy-700); text-decoration:underline; text-underline-offset:3px}
.checks{display:grid; gap:10px}
.checks li{display:flex; gap:12px; align-items:flex-start; padding:15px 16px; border-radius:14px; background:#fff; border:1px solid var(--line); font-size:15px; color:var(--ink-700)}
.checks li::before{content:""; flex:none; width:22px; height:22px; margin-top:1px; border-radius:50%; background:var(--navy-900) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fbbf24' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/14px no-repeat}

/* note — navy statement card */
.note{position:relative; overflow:hidden; border-radius:var(--r-lg); background:var(--navy-950); color:#cfd8e6; padding:36px}
@media (min-width:768px){.note{padding:52px}}
.note::after{content:""; position:absolute; inset:0; background-image:linear-gradient(rgb(255 255 255 / .04) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .04) 1px,transparent 1px); background-size:32px 32px; mask-image:linear-gradient(120deg,transparent 35%,#000); -webkit-mask-image:linear-gradient(120deg,transparent 35%,#000); pointer-events:none}
.note > *{position:relative; z-index:1}
.note .eyebrow{color:var(--amber-400)}
.note h3{margin-top:14px; font-size:clamp(26px,3.2vw,36px); line-height:1.12; font-weight:700; letter-spacing:-.03em; color:#fff}
.note p{margin-top:16px; max-width:760px; font-size:17px; line-height:1.7; color:#b9c4d4}

/* closing call to action */
.cta-band{text-align:center}
.cta-band h2{font-size:clamp(30px,4vw,46px); line-height:1.08; font-weight:700; letter-spacing:-.03em; color:var(--navy-950)}
.cta-band p{margin:14px auto 0; max-width:580px; font-size:17px; color:var(--ink-600)}
.cta-band .ctas{margin-top:28px; display:flex; flex-wrap:wrap; justify-content:center; gap:12px}
.sheet.navy .cta-band h2{color:#fff}
.sheet.navy .cta-band h2 em{color:var(--amber-400)}
.sheet.navy .cta-band p{color:#b9c4d4}

/* generic card grid for overview pages */
.cards{margin-top:44px; display:grid; gap:16px; grid-template-columns:1fr}
@media (min-width:640px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.cards.c3{grid-template-columns:repeat(3,1fr)} .cards.c4{grid-template-columns:repeat(4,1fr)}}
.cards > *{min-width:0}
.group-title{margin-top:64px; display:flex; align-items:center; gap:12px; font-size:22px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.group-title:first-of-type{margin-top:44px}
.group-title .ico{width:40px; height:40px; border-radius:12px}
.group-title .ico svg{width:19px; height:19px}
.group-title + .cards{margin-top:20px}

/* long-form text (privacy, terms) */
.legal{max-width:760px}
.legal h2{margin-top:44px; font-size:24px; font-weight:700; letter-spacing:-.02em; color:var(--navy-950)}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{margin-top:12px; font-size:16px; line-height:1.75; color:var(--ink-700)}
.legal ul{margin-top:8px; padding-left:20px; list-style:disc}
.legal a{color:var(--navy-700); text-decoration:underline; text-underline-offset:3px}
.draft-banner{margin-bottom:32px; padding:14px 18px; border-radius:12px; border:1.5px dashed var(--amber-600); background:rgb(245 158 11 / .08); color:var(--amber-700); font-size:14.5px}

/* CTA card filling a short related-services row */
@media (min-width:1024px){.cards.c3 .svc-cta{grid-column:span var(--span,1); flex-direction:column; align-items:flex-start}}
@media (min-width:1024px){.cards.c3 .svc-cta[style*="--span:2"]{flex-direction:row; align-items:center}}

/* cta band: the eyebrow is a <p> too — keep it label-sized */
.cta-band .eyebrow{margin:0; font-size:11.5px; color:var(--amber-700)}
.sheet.navy .cta-band .eyebrow{color:var(--amber-400)}

/* clients page */
.pg-clients .p b{font-size:19px}
@media (max-width:639px){.pg-clients ul.cards{grid-template-columns:repeat(2,1fr); gap:10px} .pg-clients ul.cards .p{padding:12px 14px} .pg-clients ul.cards .p b{font-size:16px}}
.pg-clients .p.join{height:100%; background:var(--navy-950); border-color:transparent}
.pg-clients .p.join b{color:#fff}
.pg-clients .p.join span{color:var(--amber-400)}
.pg-clients .ind ul{display:grid}
.pg-clients .ind li{padding:9px 0; border-top:1px solid var(--line); font-weight:600; color:var(--navy-950)}
.pg-clients .ind li:last-child{border-bottom:1px solid var(--line)}
.pg-clients .quote{display:flex; flex-direction:column; gap:20px; margin:0; padding:32px; border-radius:var(--r-lg); background:var(--sand-50); border:1px solid var(--sand-100)}
.pg-clients .quote svg{width:32px; height:32px; color:var(--amber-500)}
.pg-clients .quote blockquote{margin:0; font-size:clamp(19px,2vw,22px); line-height:1.5; letter-spacing:-.01em; color:var(--navy-950)}
.pg-clients .quote figcaption{margin-top:auto; font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-500)}

/* 404 page */
.pg-404 .big{font-size:clamp(120px,22vw,260px); font-weight:700; line-height:.85; letter-spacing:-.07em; color:transparent; -webkit-text-stroke:1.5px rgb(255 255 255 / .22); text-align:center; user-select:none}
.pg-404 .big span{-webkit-text-stroke:0; color:var(--amber-400); font-family:var(--font-serif); font-style:italic; font-weight:400; letter-spacing:-.02em}
@media (max-width:1023px){.pg-404 .big{display:none}}

/* 3-step variant of .steps (services + products overviews) */
@media (min-width:768px){.steps.s3{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1080px){.steps.s3 .step:last-child{background:#fff; color:inherit} .steps.s3 .step:last-child h3{color:var(--navy-950)} .steps.s3 .step:last-child p{color:var(--ink-600)} .steps.s3 .step:last-child .n{color:var(--amber-700)}}

/* 3-column card grids: flagships don't span, and a 2-card group fills its row */
@media (min-width:1024px){
  .cards.c3 > .svc.flag{grid-column:auto}
  .cards.c3:has(> :nth-child(2):last-child):not(:has(> .svc-cta)){grid-template-columns:repeat(2,1fr)}
}

/* products overview: outlined tier tag */
.prod-overview .svc.flag .tag{background:transparent; border:1px solid var(--amber-400); color:var(--amber-400)}
.legal address{margin-top:12px; font-style:normal; font-size:16px; line-height:1.75; color:var(--ink-700)}
