:root{
  /* one CSS pixel of design: 1px up to a 1371px-wide window, then grows with the screen (1.4px at 1920, like 140% zoom), capped at 1.6px */
  --u:clamp(1px,calc(100vw / 1371),1.6px);
  --nav:calc(72*var(--u));
  /* "Steel & Signal": dark engineered neutrals + iDefender cyan as the only accent */
  --night:#07090c; --graphite:#0e1217; --gunmetal:#171c23; --steel:#232b35; --slate:#3a4554;
  --navy:#0f1e35; --deep:#0b2540; --concrete:#e8ebee;
  --fg:#f2f5f8; --fg-2:#9aa6b4; --ink:#0a0d11; --ink-2:#4a5562;
  --cyan:#29a8e0; --cyan-hi:#5cc4f0; --line:rgba(255,255,255,.1);
  --r-panel:calc(60*var(--u)); --r-card:calc(34*var(--u));
  --gut:clamp(calc(16*var(--u)),3.4vw,calc(48*var(--u)));
  --display:var(--font-display),system-ui,sans-serif;
  --text:var(--font-text),system-ui,sans-serif;
  --ease:cubic-bezier(.22,.8,.24,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--night);color:var(--fg);font:400 calc(15*var(--u))/1.6 var(--text);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.02em}
h1{font-size:clamp(calc(44*var(--u)),4.9vw,calc(90*var(--u)));line-height:1.08}
h2{font-size:clamp(calc(34*var(--u)),3.8vw,calc(58*var(--u)));line-height:1.08}
h3{font-size:clamp(calc(22*var(--u)),2vw,calc(30*var(--u)));font-weight:500;line-height:1.3}
:focus-visible{outline:calc(2*var(--u)) solid var(--cyan);outline-offset:calc(3*var(--u));border-radius:calc(6*var(--u))}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:calc(8*var(--u));height:calc(44*var(--u));padding:0 calc(24*var(--u));border-radius:calc(999*var(--u));font:500 calc(15*var(--u))/1 var(--display);white-space:nowrap;transition:transform .3s var(--ease),background .3s,color .3s,border-color .3s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--cyan);color:#04131d}.btn-primary:hover{background:var(--cyan-hi)}
.btn-small{height:calc(36*var(--u));padding:0 calc(18*var(--u));font-size:calc(13*var(--u))}
.btn-light{background:#fff;color:#000}.btn-light:hover{background:var(--concrete)}
.btn-ghost{border:1px solid rgba(255,255,255,.35)}.btn-ghost:hover{border-color:#fff}
.btn-xl{height:calc(56*var(--u));padding:0 calc(32*var(--u));font-size:calc(18*var(--u))}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto;height:var(--nav);z-index:100;background:rgba(7,9,12,.92);backdrop-filter:blur(calc(12*var(--u)));display:flex;align-items:center;gap:calc(32*var(--u));padding:0 var(--gut);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-color:var(--line)}
.nav{transition:transform .5s var(--ease),border-color .3s}
.nav.hide{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){.nav{transition:none}}
.nav .logo img{height:calc(26*var(--u));width:auto}
.nav-links{display:flex;align-items:center;gap:calc(26*var(--u));font:400 calc(15*var(--u))/1 var(--display);color:#d5dbe2}
.nav-links>a,.drop>a{padding:calc(8*var(--u)) 0;position:relative}
.nav-links>a::after,.drop>a::after{content:"";position:absolute;left:0;right:0;bottom:calc(2*var(--u));height:1px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-links>a:hover,.drop:hover>a{color:#fff}
.nav-links>a:hover::after,.drop:hover>a::after{transform:scaleX(1)}
.drop{position:relative}
.drop>a::before{content:"";display:inline-block;width:calc(6*var(--u));height:calc(6*var(--u));border:solid currentColor;border-width:0 calc(1.3*var(--u)) calc(1.3*var(--u)) 0;transform:translateY(-25%) rotate(45deg);margin-left:calc(9*var(--u))}
.drop>a{display:inline-flex;align-items:center;flex-direction:row-reverse}
.drop-panel{position:absolute;top:100%;left:-18px;min-width:calc(230*var(--u));background:var(--gunmetal);border:1px solid var(--line);border-radius:calc(18*var(--u));padding:calc(10*var(--u));box-shadow:0 calc(24*var(--u)) calc(50*var(--u)) rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(calc(6*var(--u)));transition:.25s var(--ease)}
.drop:hover .drop-panel,.drop:focus-within .drop-panel{opacity:1;visibility:visible;transform:none}
.drop-panel a{display:block;padding:calc(10*var(--u)) calc(12*var(--u));border-radius:calc(10*var(--u))}
.drop-panel a:hover{background:var(--steel);color:#fff}
.nav-cta{margin-left:auto;display:flex;align-items:center;gap:calc(22*var(--u));font:400 calc(15*var(--u))/1 var(--display);color:#d5dbe2}
.nav-cta .call{text-decoration:underline;text-underline-offset:calc(4*var(--u));text-decoration-color:rgba(255,255,255,.35)}
.nav-cta .call:hover{color:#fff;text-decoration-color:var(--cyan)}
.burger{display:none;margin-left:auto;width:calc(40*var(--u));height:calc(40*var(--u));border:0;background:none;cursor:pointer;position:relative}
.burger span{position:absolute;left:calc(10*var(--u));right:calc(10*var(--u));height:calc(1.5*var(--u));background:#fff;transition:.3s var(--ease)}
.burger span:nth-child(1){top:calc(14*var(--u))}.burger span:nth-child(2){top:calc(20*var(--u))}.burger span:nth-child(3){top:calc(26*var(--u))}
.menu-open .burger span:nth-child(1){top:calc(20*var(--u));transform:rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){top:calc(20*var(--u));transform:rotate(-45deg)}
/* menu sheet (phones + tablets): big rows, Services folds open in place, actions pinned to the bottom */
.mmenu{position:fixed;inset:var(--nav) 0 0;z-index:99;background:var(--night);display:flex;flex-direction:column;overflow:hidden;font:400 calc(15*var(--u))/1.4 var(--text);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s var(--ease),transform .25s var(--ease),visibility 0s .25s}
.menu-open .mmenu{opacity:1;visibility:visible;transform:none;transition:opacity .25s var(--ease),transform .25s var(--ease)}
body.menu-open{overflow:hidden}
.mm-list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:calc(4*var(--u)) var(--gut) calc(16*var(--u))}
.mm-row{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:calc(60*var(--u));border-bottom:1px solid var(--line);font:500 calc(24*var(--u))/1.2 var(--display);letter-spacing:-.01em;cursor:pointer}
.mm-row::after{content:"";width:calc(8*var(--u));height:calc(8*var(--u));margin-right:calc(6*var(--u));border:solid currentColor;border-width:calc(1.6*var(--u)) calc(1.6*var(--u)) 0 0;opacity:.5;transform:rotate(45deg);transition:transform .3s var(--ease)}
button.mm-row::after{transform:translateY(-3px) rotate(135deg)}
button.mm-row[aria-expanded="true"]::after{transform:translateY(calc(2*var(--u))) rotate(-45deg)}
.mm-row:focus-visible,.mm-sub a:focus-visible{outline:calc(2*var(--u)) solid var(--brand);outline-offset:calc(2*var(--u))}
.mm-sub{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .3s var(--ease),visibility 0s .3s}
.mm-row[aria-expanded="true"]+.mm-sub{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .3s var(--ease)}
.mm-sub>div{overflow:hidden;display:flex;flex-direction:column;border-bottom:1px solid var(--line)}
.mm-sub a{display:flex;align-items:center;justify-content:space-between;min-height:calc(44*var(--u));padding-left:calc(2*var(--u));font:400 calc(17*var(--u))/1.3 var(--display);color:var(--mute)}
.mm-sub a::after{content:"→";margin-right:calc(4*var(--u));opacity:.6}
.mm-sub a:first-child{margin-top:calc(6*var(--u))}.mm-sub a:last-child{margin-bottom:calc(10*var(--u))}
.mm-sub a:hover{color:var(--ink)}
.mm-foot{flex:none;padding:calc(14*var(--u)) var(--gut) calc(calc(12*var(--u)) + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.mm-ctas{display:grid;grid-template-columns:1fr 1fr;gap:calc(10*var(--u))}
.mm-ctas .btn{justify-content:center;height:calc(48*var(--u));padding:0 calc(12*var(--u));font-size:calc(15*var(--u))}
.mm-meta{display:flex;align-items:center;flex-wrap:wrap;gap:0 calc(14*var(--u));margin-top:calc(6*var(--u));font-size:calc(13*var(--u));color:var(--mute)}
.mm-meta a{display:inline-flex;align-items:center;min-height:calc(44*var(--u))}
.mm-meta a:hover{color:var(--ink)}

/* ---------- stacking panels ---------- */
main{position:relative}
.panel{position:sticky;border-radius:var(--r-panel) var(--r-panel) 0 0;box-shadow:0 -30px calc(70*var(--u)) rgba(0,0,0,.45)}
.pad{padding:clamp(calc(48*var(--u)),7vw,calc(104*var(--u))) var(--gut)}
.head{display:grid;grid-template-columns:1.15fr 1fr;gap:calc(24*var(--u)) calc(48*var(--u));align-items:start;margin-bottom:clamp(calc(32*var(--u)),4vw,calc(56*var(--u)))}
.head .copy{max-width:calc(460*var(--u));padding-top:calc(6*var(--u));color:var(--fg-2)}
.head .copy p{margin-bottom:calc(20*var(--u));font-size:calc(16*var(--u))}
.eyebrow{font:600 calc(12*var(--u))/1 var(--text);letter-spacing:.14em;text-transform:uppercase;margin-bottom:calc(16*var(--u));display:block;color:var(--cyan)}

/* reveal */
.rv{opacity:0;transform:translateY(calc(28*var(--u)));transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}

/* ---------- footer ---------- */
footer{position:relative;z-index:7;background:var(--graphite);border-top:1px solid var(--line);padding:calc(64*var(--u)) var(--gut) calc(32*var(--u));font-size:calc(13*var(--u));color:#c9d1da}
.fgrid{display:grid;grid-template-columns:1.2fr 3fr;gap:calc(48*var(--u))}
.fbrand img{height:calc(28*var(--u));width:auto;margin-bottom:calc(16*var(--u))}
.fbrand p{color:var(--fg-2);max-width:calc(300*var(--u))}
.fcols{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(28*var(--u))}
.fcols div{display:flex;flex-direction:column;gap:calc(9*var(--u))}
.fcols .h{font:600 calc(12*var(--u))/1.4 var(--text);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:calc(6*var(--u))}
.fcols a:hover{color:var(--cyan)}
.fcols .t{color:var(--fg-2)}
.ai{display:flex;flex-wrap:wrap;align-items:center;gap:calc(8*var(--u));margin-top:calc(44*var(--u));padding-top:calc(24*var(--u));border-top:1px solid var(--line)}
.ai span{margin-right:calc(8*var(--u));font-weight:500;color:#fff}
.ai a{border:1px solid var(--line);padding:calc(8*var(--u)) calc(14*var(--u));border-radius:calc(999*var(--u));transition:border-color .25s,color .25s}
.ai a:hover{border-color:var(--cyan);color:#fff}
.legal{display:flex;justify-content:space-between;gap:calc(16*var(--u));flex-wrap:wrap;margin-top:calc(24*var(--u));color:var(--fg-2);font-size:calc(12*var(--u));letter-spacing:.06em}


/* ---------- responsive (nav + footer only) ---------- */
@media (max-width:1024px){
  .nav-links,.nav-cta{display:none}
  .burger{display:block}
}
@media (max-width:768px){
  :root{--nav:calc(60*var(--u))}
  .fgrid{grid-template-columns:1fr}
  .fcols{grid-template-columns:1fr 1fr}
}

/* ---------- cookie notice (src/app/(site)/_consent.tsx): fixed bar, never moves the page ---------- */
/* Fixed colours, not the page's tokens: pages with the light theme redefine --fg as black (black on dark). iDefender blue,
   white text 5.4:1. */
.consent{position:fixed;left:var(--gut);right:var(--gut);bottom:calc(16*var(--u));z-index:200;max-width:calc(880*var(--u));margin:0 auto;display:flex;align-items:center;gap:calc(20*var(--u));padding:calc(16*var(--u)) calc(20*var(--u));background:#0d6fa8;color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:calc(18*var(--u));box-shadow:0 calc(24*var(--u)) calc(50*var(--u)) rgba(0,0,0,.45);font-size:calc(14*var(--u))}
.consent p{flex:1}
.consent p a{color:#fff;text-decoration:underline;text-underline-offset:calc(3*var(--u))}
.consent .btn-primary{background:#fff;color:#0b2540}.consent .btn-primary:hover{background:#e3f2fb}
.consent .btn-ghost{color:#fff;background:transparent;border:1px solid rgba(255,255,255,.6)}.consent .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.consent div{display:flex;gap:calc(10*var(--u));flex-shrink:0}
@media (max-width:640px){.consent{flex-direction:column;align-items:stretch}.consent div .btn{flex:1;justify-content:center}}
