/* Recognize Technologies — homepage
   Brand system v1.0. Archivo + Newsreader, cobalt & mist, pulse accent. */

@font-face{font-family:Archivo;src:url(fonts/archivo-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{
  --cobalt:#14428F; --cobalt-lift:#1B55B5; --mist:#B9D2F0; --pulse:#00C2D1; --pulse-deep:#00707A;
  --ink:#0A1F3C; --ink-deep:#071628;
  --n0:#FFFFFF; --n1:#F5F7FA; --n2:#E4E9F0; --n3:#C8D0DB; --n4:#8B96A6; --n5:#4A5568;
  --muted-on-dark:#9DB6DA;

  --g-deep:linear-gradient(135deg,#0A1F3C 0%,#14428F 100%);
  --g-signal:linear-gradient(135deg,#14428F 0%,#00C2D1 100%);
  --g-mist:linear-gradient(135deg,#B9D2F0 0%,#F5F7FA 100%);

  --sans:Archivo,"Helvetica Neue",Arial,sans-serif;
  --serif:Newsreader,Georgia,serif;

  --max:1240px;
  --pad:24px;
  --r-lg:24px; --r-md:16px; --r-sm:12px;
  --sec:112px;      /* between sections */
  --blk:56px;       /* between blocks inside a section */
  --hd:20px;        /* heading to its content */
  --gap:24px;       /* between cards */
  --header-h:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,p,ul,ol,li,figure,dl,dd,blockquote,fieldset{margin:0;padding:0}
ul,ol{list-style:none}
img,picture,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
}

html{
  background:var(--ink-deep);   /* the canvas: anything below the footer is ink, never white */
  overflow-x:clip;              /* clip does not create a scroll container, unlike hidden */
}
body{
  font-family:var(--sans);
  font-size:17px; line-height:1.65; color:var(--n5);
  background:var(--n0);
  min-height:100%;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:clip;
}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;background:var(--pulse-deep);color:#fff;padding:12px 18px;border-radius:0 0 var(--r-sm) 0;z-index:200;font-weight:600}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--pulse);outline-offset:3px;border-radius:4px}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--sans);color:var(--ink);font-weight:600;letter-spacing:-.022em;line-height:1.15}
h1{font-size:clamp(34px,5.1vw,58px);line-height:1.06;letter-spacing:-.03em}
h2{font-size:clamp(27px,3.3vw,40px);line-height:1.12;letter-spacing:-.026em}
h3{font-size:clamp(18px,1.6vw,21px);line-height:1.3;letter-spacing:-.016em}
.eyebrow{
  display:inline-block;font-size:13px;font-weight:600;line-height:1;letter-spacing:-.005em;
  color:var(--cobalt);background:rgba(20,66,143,.07);
  border:1px solid rgba(20,66,143,.16);
  padding:8px 15px;border-radius:8px;
}
.dark .eyebrow,.hero .eyebrow{color:#7FE3ED;background:rgba(0,194,209,.10);border-color:rgba(0,194,209,.26)}
.wash .eyebrow{background:rgba(20,66,143,.09)}
.lede{font-size:clamp(16px,1.35vw,19px);line-height:1.62;color:var(--n5);max-width:62ch}
.small{font-size:14px;line-height:1.55;color:var(--n5)}
.serif{font-family:var(--serif);font-weight:400;letter-spacing:-.005em}
.tnum{font-variant-numeric:tabular-nums}

/* ---------- buttons ---------- */
.btn svg{width:16px;height:16px;flex:0 0 auto}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-size:15px;font-weight:600;letter-spacing:-.005em;
  padding:15px 26px;border-radius:999px;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--g-signal);color:#fff;box-shadow:0 6px 20px rgba(0,112,122,.28)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,112,122,.36)}
.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.34);backdrop-filter:blur(8px)}
.btn-ghost:hover{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.1);transform:translateY(-2px)}
.btn-line{color:var(--cobalt);border:1px solid var(--n3)}
.btn-line:hover{border-color:var(--cobalt);background:#fff;transform:translateY(-2px);box-shadow:0 10px 26px rgba(20,66,143,.14)}
.btn-sm{padding:11px 20px;font-size:14px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}

.arrow-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--cobalt)}
.arrow-link svg{width:15px;height:15px;transition:transform .18s ease}
.arrow-link:hover svg{transform:translateX(3px)}

/* ---------- header ---------- */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:100;height:var(--header-h);
  background:#071628;
  backdrop-filter:saturate(150%) blur(16px);-webkit-backdrop-filter:saturate(150%) blur(16px);
  border-bottom:1px solid rgba(185,210,240,.14);
}
.header-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:0}
.brand{display:flex;align-items:center;gap:13px;flex-shrink:0}
.brand .sym{height:30px;width:auto}
.brand .bar{width:1px;height:22px;background:rgba(185,210,240,.4)}
.brand .wm{height:13px;width:auto}

.nav{display:flex;align-items:center;gap:6px}
.nav a{
  font-size:14.5px;font-weight:500;color:#D6E4F7;padding:9px 14px;border-radius:999px;
  transition:color .16s ease,background-color .16s ease;
}
.nav a:hover{color:#fff;background:rgba(185,210,240,.12)}
.header-cta{display:flex;align-items:center;gap:8px;flex-shrink:0}
.lbl-m{display:none}

.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;border-radius:10px;flex-shrink:0}
.burger:hover{background:rgba(185,210,240,.12)}
.burger span{display:block;width:21px;height:2.2px;background:#fff;border-radius:2px;position:relative;transition:transform .22s ease,opacity .18s ease}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:21px;height:2.2px;background:#fff;border-radius:2px;transition:transform .22s ease,opacity .18s ease}
.burger span::before{top:-6.6px}
.burger span::after{top:6.6px}
.burger[aria-expanded="true"] span{transform:rotate(45deg)}
.burger[aria-expanded="true"] span::before{opacity:0}
.burger[aria-expanded="true"] span::after{transform:rotate(-90deg) translateX(0);top:0}

.msheet{
  position:fixed;left:0;right:0;top:var(--header-h);z-index:99;
  background:rgba(7,22,40,.97);backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(185,210,240,.14);
  padding:10px var(--pad) 26px;
  transform:translateY(-8px);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
}
.msheet.open{transform:none;opacity:1;visibility:visible;pointer-events:auto}
.msheet a{display:block;font-size:17px;font-weight:500;color:#EAF1FB;padding:15px 6px;border-bottom:1px solid rgba(185,210,240,.12)}
.msheet a:last-of-type{border-bottom:0}
.msheet .btn{margin-top:18px;width:100%}

/* ---------- hero ---------- */
.hero-block{
  position:relative;
  background:
    radial-gradient(1100px 620px at 82% 8%, rgba(0,194,209,.13) 0%, rgba(0,194,209,0) 62%),
    radial-gradient(900px 560px at 8% 96%, rgba(20,66,143,.42) 0%, rgba(20,66,143,0) 60%),
    linear-gradient(160deg, #061426 0%, #0A1F3C 46%, #102F5C 100%);
}
.hero{position:relative;padding-top:calc(var(--header-h) + 40px);padding-bottom:0}
.hero-stage{
  position:relative;border-radius:var(--r-lg);overflow:hidden;isolation:isolate;
  min-height:600px;display:flex;align-items:center;
  box-shadow:0 24px 60px rgba(4,12,26,.5);
}
.hero-stage img.bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  transform:scale(1.02);transition:transform 1.2s cubic-bezier(.2,.6,.2,1);
}
.hero-stage:hover img.bg{transform:scale(1.06)}
.hero-stage::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(100deg, rgba(7,22,40,.94) 0%, rgba(7,22,40,.82) 38%, rgba(7,22,40,.34) 68%, rgba(7,22,40,.12) 100%);
}
.hero-inner{position:relative;z-index:2;width:100%;padding:64px 56px}
.hero .eyebrow{color:#7FE3ED}
.hero h1{color:#fff;margin-top:18px;max-width:17ch}
.hero .lede{color:#C9DCF3;margin-top:22px;max-width:52ch}
.hero .cta-row{margin-top:34px}

.glass{
  margin-top:44px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:2px;
  background:rgba(185,210,240,.16);
  border:1px solid rgba(185,210,240,.22);
  border-radius:var(--r-md);overflow:hidden;
  max-width:760px;
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
}
.glass div{background:rgba(10,31,60,.52);padding:20px 22px}
.glass .k{font-size:14px;font-weight:600;color:#fff;line-height:1.35}
.glass .v{font-size:12.5px;color:#A9C5E8;margin-top:6px;line-height:1.45}

/* ---------- deadline band ---------- */
.band{background:transparent;padding:28px 0 44px}
.band-glass{
  display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  padding:20px 26px;border-radius:var(--r-md);
  background:rgba(185,210,240,.10);
  border:1px solid rgba(185,210,240,.22);
  backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);
  box-shadow:0 10px 30px rgba(4,12,26,.28);
}
.band-btn{flex-shrink:0}
.band .pill{
  flex-shrink:0;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:#0A1F3C;background:#FFB020;padding:7px 14px;border-radius:999px;
}
.band p{color:#D6E5F8;font-size:15.5px;line-height:1.55;flex:1;min-width:240px}
.band strong{color:#fff;font-weight:600}


/* ---------- section shell ---------- */
main section{padding-block:var(--sec)}
.tint{background:#EAF1FA}
.wash{background:linear-gradient(168deg,#F7FAFD 0%,#DCE9F8 100%)}
.closing-sec{background:#fff;padding-block:var(--sec) !important}
main section.dark{background:var(--ink)}
.sec-head{max-width:64ch}
.sec-head h2{margin-top:14px}
.sec-head .lede{margin-top:var(--hd)}
.dark .sec-head h2{color:#fff}
.dark .sec-head .lede{color:var(--mist)}
.dark .eyebrow{color:#7FE3ED}

/* ---------- position ---------- */
.pos-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:start}
.pos-list{display:grid;gap:14px}
.pos-item{background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:22px 24px;display:flex;gap:16px;align-items:flex-start;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.pos-item:hover{border-color:rgba(20,66,143,.28);box-shadow:0 12px 30px rgba(10,31,60,.08);transform:translateX(3px)}
.pos-item .ic{flex-shrink:0;width:38px;height:38px;border-radius:10px;background:var(--g-mist);display:grid;place-items:center}
.pos-item .ic svg{width:19px;height:19px;color:var(--cobalt)}
.pos-item h3{font-size:16px}
.pos-item p{font-size:14.5px;line-height:1.55;color:var(--n5);margin-top:5px}
.quote-card{background:var(--ink);border-radius:var(--r-lg);padding:40px 38px;position:relative;overflow:hidden}
.quote-card .serif{font-size:clamp(21px,2.1vw,27px);line-height:1.34;color:#fff}
.quote-card .attrib{margin-top:22px;font-size:13px;color:var(--muted-on-dark);letter-spacing:.04em}
.quote-card img.mark{position:absolute;right:26px;bottom:24px;width:132px;height:auto;aspect-ratio:300/320;object-fit:contain;opacity:.11}

/* ---------- services ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@supports(grid-template-rows:subgrid){
  .svc-grid{grid-template-rows:auto}
}
.svc{
  background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:26px 24px 24px;
  display:flex;flex-direction:column;gap:12px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.svc:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(10,31,60,.11);border-color:rgba(20,66,143,.3)}
.svc.feature:hover{border-color:rgba(0,194,209,.45);box-shadow:0 18px 42px rgba(4,12,26,.34)}
.svc .ic,.why .ic,.pos-item .ic{transition:background-color .2s ease,transform .2s ease}
.svc:hover .ic{transform:scale(1.06)}
.svc .ic{width:40px;height:40px;border-radius:11px;background:var(--n1);display:grid;place-items:center}
.svc .ic svg{width:20px;height:20px;color:var(--cobalt)}
.svc h3{font-size:17px}
.svc p{font-size:14px;line-height:1.55;color:var(--n5);flex:1}
.svc .arrow-link{margin-top:2px}
.svc.feature{background:var(--ink);border-color:var(--ink)}
.svc.feature h3{color:#fff}
.svc.feature p{color:var(--mist)}
.svc.feature .ic{background:rgba(0,194,209,.16)}
.svc.feature .ic svg{color:#5EEAD4}
.svc.feature .arrow-link{color:#7FE3ED}
.svc .tag{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#7FE3ED}

/* ---------- stages ---------- */
.stage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.stage{background:#fff;border:1px solid rgba(20,66,143,.14);border-radius:var(--r-md);padding:30px 28px;display:flex;flex-direction:column;gap:12px;
  box-shadow:0 8px 26px rgba(10,31,60,.06);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.stage:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(10,31,60,.12);border-color:rgba(20,66,143,.3)}
.stage .num{transition:opacity .2s ease}
.stage:hover .num{opacity:.6}
.stage .num{font-size:34px;font-weight:600;letter-spacing:-.03em;line-height:1;color:var(--cobalt);opacity:.34;font-variant-numeric:tabular-nums}
.stage h3{font-size:19px}
.stage p{font-size:14.5px;line-height:1.6;color:var(--n5);flex:1}

/* ---------- method ---------- */
.method{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:var(--blk);
  border:1px solid rgba(185,210,240,.2);border-radius:var(--r-lg);overflow:hidden;background:rgba(185,210,240,.08)}
.step{padding:30px 26px 32px;background:rgba(10,31,60,.55);position:relative}
.step + .step{border-left:1px solid rgba(185,210,240,.16)}
.step .dot{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.step .dot i{width:9px;height:9px;border-radius:50%;background:var(--pulse);display:block;flex-shrink:0}
.step .dot span{font-size:11.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#7FE3ED}
.step h3{font-size:18px;color:#fff}
.step p{font-size:14px;line-height:1.6;color:var(--mist);margin-top:9px}

/* ---------- why ---------- */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap)}
.why{background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:26px 28px;display:flex;gap:18px;align-items:flex-start;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.why:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(10,31,60,.09);border-color:rgba(20,66,143,.26)}
.why:hover .ic{transform:scale(1.06)}
.why .ic{flex-shrink:0;width:42px;height:42px;border-radius:11px;background:var(--g-mist);display:grid;place-items:center}
.why .ic svg{width:20px;height:20px;color:var(--cobalt)}
.why h3{font-size:17px}
.why p{font-size:14.5px;line-height:1.58;color:var(--n5);margin-top:6px}

/* ---------- insights ---------- */
.ins-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.ins{background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:24px 22px;display:flex;flex-direction:column;gap:10px;
  transition:transform .2s ease,box-shadow .2s ease}
.ins:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(10,31,60,.11);border-color:rgba(20,66,143,.28)}
.ins h3{transition:color .18s ease}
.ins:hover h3{color:var(--cobalt)}
.ins .chip{align-self:flex-start;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px}
.ins h3{font-size:16px;line-height:1.35}
.ins p{font-size:13.5px;line-height:1.55;color:var(--n5);flex:1}
.ins .meta{font-size:12.5px;color:var(--n5)}
.c-amber{background:#FFF3DE;color:#8A5A00}
.c-green{background:#E4F7ED;color:#155F38}
.c-violet{background:#EDEAFF;color:#3A2599}
.c-sky{background:#E6F2FF;color:#0B4A8A}

/* ---------- closing ---------- */
.closing{background:var(--g-deep);border-radius:var(--r-lg);padding:56px 52px;position:relative;overflow:hidden}
.closing h2{color:#fff;max-width:19ch}
.closing p{color:var(--mist);margin-top:16px;max-width:56ch;font-size:16.5px;line-height:1.6}
.closing .cta-row{margin-top:30px}
.closing img.mark{position:absolute;right:34px;top:34px;width:190px;height:auto;aspect-ratio:300/320;object-fit:contain;opacity:.10}

/* ---------- footer ---------- */
.site-footer{background:var(--ink-deep);color:var(--mist);padding-top:72px;padding-bottom:32px}
.f-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:44px}
.f-brand .row{display:flex;align-items:center;gap:12px}
.f-brand .row .sym{height:32px;width:auto}
.f-brand .row .bar{width:1px;height:23px;background:rgba(185,210,240,.4)}
.f-brand .row .wm{height:14px;width:auto}
.f-brand p{margin-top:18px;font-size:14px;line-height:1.65;color:var(--muted-on-dark);max-width:34ch}
.f-col h2,.f-col h4{font-size:12px;line-height:1.4;letter-spacing:.14em;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#7FE3ED;margin-bottom:16px}
.f-col li{margin-bottom:10px}
.f-col a{font-size:14.5px;color:#CFE0F5}
.f-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.f-col address{font-style:normal;font-size:14px;line-height:1.7;color:#CFE0F5}
.f-bottom{margin-top:56px;padding-top:24px;border-top:1px solid rgba(185,210,240,.16);
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--muted-on-dark)}
.f-bottom .links{display:flex;gap:22px;flex-wrap:wrap}
.f-bottom a:hover{color:#fff}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  :root{--sec:88px;--blk:44px}
  .svc-grid,.ins-grid{grid-template-columns:repeat(2,1fr)}
  .method{grid-template-columns:repeat(2,1fr)}
  .step:nth-child(3){border-left:0}
  .step:nth-child(n+3){border-top:1px solid rgba(185,210,240,.16)}
  .pos-grid{grid-template-columns:1fr;gap:40px}
  .f-grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media (max-width:900px){
  .nav{display:none}
  .burger{display:flex}
  .header-cta .btn{display:none}
  .header-cta .btn.mobile-keep{display:inline-flex}
}
@media (max-width:900px){
  .lbl-d{display:none}
  .lbl-m{display:inline}
  .brand .sym{height:26px}
  .brand .wm{height:11px}
  .brand .bar{height:19px}
  .brand{gap:10px}
  .header-cta .btn-sm{padding:10px 16px;font-size:13.5px}
  .burger{width:40px;height:40px;margin-right:-10px}
}
@media (max-width:760px){
  :root{--pad:20px;--sec:72px;--blk:36px;--gap:16px;--header-h:64px;--r-lg:18px;--r-md:14px}
  .hero{padding-top:calc(var(--header-h) + 20px);padding-bottom:24px}
  .hero-stage{min-height:0}
  .hero-inner{padding:38px 24px 40px}
  .hero h1{max-width:none}
  .hero .lede{margin-top:16px}
  .hero .cta-row{margin-top:26px}
  .hero .cta-row .btn{flex:1 1 100%}
  .glass{grid-template-columns:1fr;margin-top:32px;max-width:none}
  .glass div{padding:16px 18px}
  .band{padding:20px 0}
  .band-in{gap:14px}
  .svc-grid,.ins-grid,.stage-grid,.why-grid{grid-template-columns:1fr}
  .method{grid-template-columns:1fr}
  .step + .step{border-left:0;border-top:1px solid rgba(185,210,240,.16)}
  .quote-card{padding:30px 24px}
  .closing{padding:38px 24px}
  .why{padding:22px 20px;gap:14px}
  .f-grid{grid-template-columns:1fr;gap:32px}
  .f-bottom{margin-top:40px}
}

/* ============================================================
   Services dropdown
   ============================================================ */
.navitem{position:relative}
.nav .drop-trigger{display:inline-flex;align-items:center;gap:6px}
.nav .chev{width:14px;height:14px;transition:transform .18s ease;opacity:.8}
.navitem:hover .chev,.navitem:focus-within .chev{transform:rotate(180deg)}

.drop{
  position:absolute;top:calc(100% + 35px);left:50%;transform:translateX(-50%) translateY(-6px);
  width:min(620px,calc(100vw - 48px));
  background:rgba(4,12,24,.985);
  backdrop-filter:blur(26px) saturate(150%);-webkit-backdrop-filter:blur(26px) saturate(150%);
  border:1px solid rgba(185,210,240,.2);border-radius:var(--r-md);
  box-shadow:0 26px 60px rgba(4,12,26,.5);
  padding:12px;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  z-index:120;
}
.drop::before{content:"";position:absolute;left:0;right:0;top:-36px;height:36px}
.navitem:hover .drop,.navitem:focus-within .drop{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%)}
.drop-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.drop-grid a{display:block;padding:12px 14px;border-radius:10px;background:transparent;transition:background-color .15s ease}
.drop-grid a:hover{background:rgba(185,210,240,.11)}
.drop-grid b{display:block;font-size:14px;font-weight:600;color:#fff;letter-spacing:-.01em}
.drop-grid i{display:block;font-style:normal;font-size:12.5px;color:#9DB6DA;margin-top:3px;line-height:1.4}
.drop-all{
  display:block;margin-top:10px;padding:12px;border-radius:10px;text-align:center;
  font-size:13.5px;font-weight:600;color:#7FE3ED;background:rgba(0,194,209,.10);
  border:1px solid rgba(0,194,209,.22);
}
.drop-all:hover{background:rgba(0,194,209,.18)}

/* mobile services sublist */
.msub{padding:4px 0 10px 14px;border-bottom:1px solid rgba(185,210,240,.12)}
.msub a{font-size:15px;color:#B7CCEA;padding:11px 6px;border-bottom:0}

/* ============================================================
   Mobile refinements
   ============================================================ */
@media (max-width:900px){
  .drop{display:none}
  /* header proportions tuned to the symbol height */
  .brand .sym{height:30px}
  .brand .wm{height:12px}
  .brand .bar{height:21px}
  .header-cta .btn-sm{height:40px;padding:0 18px;font-size:14px;line-height:40px}
  .burger{width:40px;height:40px;margin-right:-9px}
}

@media (max-width:760px){
  :root{--sec:64px;--blk:32px}

  /* hero: tighter, no dead space under the copy */
  .hero{padding-top:calc(var(--header-h) + 16px)}
  .hero-stage{min-height:0}
  .hero-inner{padding:34px 22px 34px}
  .hero h1{font-size:32px;line-height:1.1}
  .hero .lede{font-size:15.5px;margin-top:14px}
  .hero .cta-row{margin-top:22px;gap:10px}
  .hero .cta-row .btn{flex:1 1 100%;padding:14px 22px}
  .glass{margin-top:26px;gap:1px}
  .glass div{padding:15px 17px}
  .glass .k{font-size:13.5px}
  .glass .v{font-size:12px;margin-top:4px}

  /* deadline strip */
  .band{padding:20px 0 30px}
  .band-glass{padding:18px 18px 20px;gap:14px;flex-direction:column;align-items:flex-start}
  .band p{font-size:14.5px;min-width:0}
  .band-btn{width:100%}

  /* one consistent rhythm for every section head and grid */
  .sec-head .lede{font-size:15.5px}
  .svc-grid,.stage-grid,.why-grid,.ins-grid{margin-top:26px !important}
  .pos-list{margin-top:24px !important}
  .method{margin-top:26px}
  .pos-grid{gap:26px}

  /* cards: even internal padding everywhere */
  .svc{padding:22px 20px}
  .stage{padding:24px 20px}
  .stage .num{font-size:28px}
  .why{padding:20px 18px}
  .ins{padding:20px 18px}
  .pos-item{padding:18px 18px}
  .quote-card{padding:28px 22px}
  .quote-card img.mark{width:96px;right:18px;bottom:18px}

  /* closing: centred, balanced */
  .closing{padding:34px 22px 36px;text-align:center}
  .closing h2{max-width:none;margin-inline:auto}
  .closing p{margin-inline:auto;max-width:none;font-size:15.5px}
  .closing .cta-row{justify-content:center;margin-top:24px}
  .closing .cta-row .btn{flex:1 1 100%}
  .closing img.mark{position:static;width:64px;margin:0 auto 18px;opacity:.22}

  /* insights CTA centred to match */
  section.tint .cta-row{justify-content:center}
  section.tint .cta-row .btn{flex:1 1 100%}

  /* footer breathing room without gaps */
  .site-footer{padding-top:52px}
  .f-grid{gap:28px}
  .f-bottom{margin-top:32px;gap:12px}
}

@media (max-width:420px){
  .hero h1{font-size:29px}
  h2{font-size:25px}
}

/* ============================================================
   Footer social
   ============================================================ */
.f-social{display:flex;gap:10px;margin-top:44px}
.f-social a{
  width:42px;height:42px;border-radius:11px;display:grid;place-items:center;
  color:#CFE0F5;background:rgba(185,210,240,.08);border:1px solid rgba(185,210,240,.16);
  transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease;
}
.f-social a svg{width:19px;height:19px}
.f-social a:hover{color:#fff;background:rgba(0,194,209,.16);border-color:rgba(0,194,209,.4);transform:translateY(-3px)}
.f-bottom{margin-top:24px}

/* ============================================================
   Fixes from review — mobile
   ============================================================ */
@media (max-width:760px){
  /* deadline strip: normal-sized button, left aligned, icon under control */
  .band-glass{padding:18px 18px 20px}
  .band-btn{width:auto;align-self:flex-start;padding:12px 20px;font-size:14px}
  .band-btn svg{width:15px;height:15px}

  /* closing: mark sits above the heading, never against the buttons */
  .closing{display:flex;flex-direction:column;align-items:center}
  .closing img.mark{order:-1;position:static;width:58px;margin:0 0 20px;opacity:.24}
  .closing h2,.closing p,.closing .cta-row{width:100%}
  .closing .cta-row{margin-top:26px;gap:12px}
}

/* keep the eyebrow chip from crowding its heading on small screens */
@media (max-width:760px){
  .eyebrow{font-size:12.5px;padding:7px 13px}
  .sec-head h2{margin-top:16px}
  .hero h1{margin-top:16px}
}

/* ============================================================
   Page hero (every page except home)
   ============================================================ */
.phero{padding-top:calc(var(--header-h) + 76px);padding-bottom:84px}
.phero-tight{padding-bottom:68px}
.phero-in{max-width:none}
.phero h1{color:#fff;margin-top:20px;max-width:19ch}
.phero .lede{color:#C9DCF3;margin-top:20px;max-width:62ch}
.phero .cta-row{margin-top:30px}
.phero .glass{max-width:none;margin-top:44px}

/* ============================================================
   Services hub — service rows
   ============================================================ */
.srow-list{margin-top:var(--blk);display:grid;gap:14px}
.srow{
  display:flex;align-items:center;gap:24px;
  background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);
  padding:26px 28px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.srow:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(10,31,60,.1);border-color:rgba(20,66,143,.3)}
.srow-main{flex:1;min-width:0}
.srow-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.srow h3{font-size:20px}
.srow p{font-size:14.5px;line-height:1.6;color:var(--n5);margin-top:8px;max-width:74ch}
.srow-meta{font-size:12.5px !important;color:var(--n4) !important;margin-top:10px !important}
.srow-tag{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--pulse-deep);
  background:rgba(0,194,209,.1);border:1px solid rgba(0,194,209,.28);padding:5px 10px;border-radius:7px}
.srow-go{flex-shrink:0;width:44px;height:44px;border-radius:12px;background:var(--g-mist);
  display:grid;place-items:center;color:var(--cobalt);transition:background .2s ease,transform .2s ease,color .2s ease}
.srow-go svg{width:18px;height:18px}
.srow:hover .srow-go{background:var(--g-signal);color:#fff;transform:translateX(4px)}
.srow-feature{background:var(--ink);border-color:var(--ink)}
.srow-feature h3{color:#fff}
.srow-feature p{color:var(--mist)}
.srow-feature .srow-meta{color:#7E9BC4 !important}
.srow-feature .srow-tag{color:#7FE3ED}
.srow-feature .srow-go{background:rgba(0,194,209,.16);color:#7FE3ED}
.srow-feature:hover{border-color:rgba(0,194,209,.45);box-shadow:0 18px 42px rgba(4,12,26,.32)}

/* ============================================================
   Capability grid
   ============================================================ */
.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.cap{background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:26px 24px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.cap:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(10,31,60,.09);border-color:rgba(20,66,143,.26)}
.cap h3{font-size:17px}
.cap p{font-size:14px;line-height:1.6;color:var(--n5);margin-top:10px}

/* ============================================================
   Numbered flow (dark)
   ============================================================ */
.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:var(--blk);
  border:1px solid rgba(185,210,240,.2);border-radius:var(--r-lg);overflow:hidden}
.flow li{padding:28px 22px 30px;background:rgba(10,31,60,.5)}
.flow li + li{border-left:1px solid rgba(185,210,240,.16)}
.flow .fn{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;
  background:rgba(0,194,209,.14);border:1px solid rgba(0,194,209,.3);
  color:#7FE3ED;font-size:14px;font-weight:600;margin-bottom:16px;font-variant-numeric:tabular-nums}
.flow h3{font-size:17px;color:#fff}
.flow p{font-size:13.5px;line-height:1.6;color:var(--mist);margin-top:8px}

/* ============================================================
   Split: ticks + honesty panel
   ============================================================ */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.ticks{display:grid;gap:12px}
.ticks li{position:relative;padding-left:34px;font-size:15.5px;line-height:1.55;color:var(--n5)}
.ticks li::before{
  content:"";position:absolute;left:0;top:2px;width:21px;height:21px;border-radius:7px;
  background:rgba(0,194,209,.12);border:1px solid rgba(0,194,209,.3);
}
.ticks li::after{
  content:"";position:absolute;left:6px;top:8px;width:9px;height:5px;
  border-left:2px solid var(--pulse-deep);border-bottom:2px solid var(--pulse-deep);
  transform:rotate(-45deg);
}
.honest{background:#E4FBF6;border:1px solid rgba(0,112,122,.22);border-radius:var(--r-md);padding:30px 30px}
.honest h3{font-size:19px;color:#00565E}
.honest p{font-size:15px;line-height:1.65;color:#0B4B50;margin-top:14px}
.honest em{font-style:normal;font-weight:600}

/* ============================================================
   Contact
   ============================================================ */
.contact-sec{padding-block:var(--sec)}
.contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:var(--gap)}
.form-card{background:#fff;border:1px solid var(--n2);border-radius:var(--r-lg);padding:38px 36px;
  box-shadow:0 14px 40px rgba(10,31,60,.06)}
.form-card h2{font-size:26px}
.form-sub{font-size:13.5px;color:var(--n4);margin-top:8px;margin-bottom:26px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{margin-bottom:18px;display:flex;flex-direction:column}
.field label{font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:8px}
.field input,.field select,.field textarea{
  font-family:inherit;font-size:15px;color:var(--ink);
  background:var(--n1);border:1px solid var(--n2);border-radius:10px;
  padding:13px 14px;width:100%;
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease;
}
.field textarea{resize:vertical;min-height:120px;line-height:1.6}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--n3)}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;background:#fff;border-color:var(--cobalt);box-shadow:0 0 0 3px rgba(20,66,143,.13)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-card .btn{margin-top:6px}
.form-note{font-size:12.5px;color:var(--n4);margin-top:16px}

.side-col{display:grid;gap:var(--gap);align-content:start}
.side-card{background:#fff;border:1px solid var(--n2);border-radius:var(--r-md);padding:26px 26px}
.side-card h3{font-size:17px}
.side-list{margin-top:16px;display:grid;gap:12px}
.side-list li{display:flex;gap:14px;font-size:14.5px;color:var(--n5);line-height:1.5}
.side-list li span{flex:0 0 58px;font-size:12.5px;font-weight:600;color:var(--n4);padding-top:2px}
.side-list a{color:var(--cobalt);font-weight:500}
.side-list a:hover{text-decoration:underline;text-underline-offset:3px}
.side-steps{margin-top:16px;display:grid;gap:16px;counter-reset:s}
.side-steps li{position:relative;padding-left:36px;counter-increment:s}
.side-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:8px;
  background:rgba(20,66,143,.08);border:1px solid rgba(20,66,143,.18);color:var(--cobalt);
  font-size:12px;font-weight:600;display:grid;place-items:center}
.side-steps b{display:block;font-size:14.5px;color:var(--ink);font-weight:600}
.side-steps span{display:block;font-size:13.5px;color:var(--n5);line-height:1.55;margin-top:4px}
.side-dark{background:var(--ink);border-color:var(--ink)}
.side-dark h3{color:#fff}
.side-dark address{font-style:normal;font-size:14px;line-height:1.7;color:var(--mist);margin-top:14px}
.side-note{font-size:13px;color:#9DB6DA;margin-top:14px;line-height:1.55}

/* ============================================================
   Thank you / 404
   ============================================================ */
.mini-sec{padding-top:calc(var(--header-h) + 90px);padding-bottom:110px;background:var(--n1)}
.mini-card{max-width:640px;margin-inline:auto;text-align:center;background:#fff;
  border:1px solid var(--n2);border-radius:var(--r-lg);padding:52px 44px;
  box-shadow:0 16px 44px rgba(10,31,60,.07)}
.mini-card .tick{width:58px;height:58px;border-radius:16px;margin:0 auto 24px;display:grid;place-items:center;
  background:var(--g-signal);color:#fff}
.mini-card .tick svg{width:26px;height:26px}
.mini-card .code{font-size:48px;font-weight:600;letter-spacing:-.03em;color:var(--cobalt);opacity:.28;
  font-variant-numeric:tabular-nums;line-height:1;margin-bottom:14px}
.mini-card h1{font-size:clamp(28px,3.4vw,40px)}
.mini-card p{font-size:16px;line-height:1.65;color:var(--n5);margin-top:16px}
.mini-card a:not(.btn){color:var(--cobalt);font-weight:600}
.mini-card .cta-row{justify-content:center;margin-top:30px}

/* ============================================================
   Responsive for the new components
   ============================================================ */
@media (max-width:1080px){
  .cap-grid{grid-template-columns:repeat(2,1fr)}
  .flow{grid-template-columns:repeat(3,1fr)}
  .flow li:nth-child(4){border-left:0}
  .flow li:nth-child(n+4){border-top:1px solid rgba(185,210,240,.16)}
  .split{grid-template-columns:1fr;gap:36px}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .phero{padding-top:calc(var(--header-h) + 42px);padding-bottom:52px}
  .phero-tight{padding-bottom:44px}
  .phero h1{max-width:none}
  .phero .glass{margin-top:28px}
  .phero .cta-row{margin-top:24px}
  .phero .cta-row .btn{flex:1 1 100%}

  .srow{flex-direction:row;align-items:flex-start;gap:14px;padding:22px 20px}
  .srow h3{font-size:17px}
  .srow-go{width:36px;height:36px;border-radius:10px}
  .srow-go svg{width:16px;height:16px}

  .cap-grid{grid-template-columns:1fr}
  .cap{padding:22px 20px}

  .flow{grid-template-columns:1fr}
  .flow li + li{border-left:0;border-top:1px solid rgba(185,210,240,.16)}
  .flow li{padding:22px 20px 24px}

  .ticks li{font-size:15px}
  .honest{padding:24px 20px}

  .contact-sec{padding-block:var(--sec)}
  .form-card{padding:26px 20px;border-radius:var(--r-md)}
  .f-row{grid-template-columns:1fr;gap:0}
  .form-card .btn{width:100%}
  .side-card{padding:22px 20px}

  .mini-sec{padding-top:calc(var(--header-h) + 44px);padding-bottom:64px}
  .mini-card{padding:34px 22px}
  .mini-card .cta-row .btn{flex:1 1 100%}
}

/* accessible muted tone for small labels on light grounds (AA at 12-14px) */
:root{--n4-text:#5E6B7C}
.srow-meta{color:var(--n4-text) !important}
.form-sub,.form-note,.side-list li span,.side-note{color:var(--n4-text)}
.side-dark .side-note{color:#9DB6DA}

/* ============================================================
   Contact: plain page ground, Mist rise gradient on the form card
   ============================================================ */
.contact-sec{background:var(--n1)}
.form-card{
  background:linear-gradient(150deg,#CFE0F5 0%,#EAF1FA 42%,#FFFFFF 100%);
  border-color:rgba(20,66,143,.16);
  box-shadow:0 16px 44px rgba(10,31,60,.09);
}
.form-card .field input,
.form-card .field select,
.form-card .field textarea{background:#fff;border-color:rgba(20,66,143,.18)}
.form-card .field input:hover,
.form-card .field select:hover,
.form-card .field textarea:hover{border-color:rgba(20,66,143,.38)}

/* the closing band needs air above it on every page */
.dark + .closing-sec,
.tint + .closing-sec,
.wash + .closing-sec{padding-top:var(--sec) !important}

/* small print sits on the tinted end of the form gradient, so it needs the darker tone */
.form-card .form-sub,.form-card .form-note{color:var(--n5)}

/* ============================================================
   Flow variants + related-service links
   ============================================================ */
.flow-4{grid-template-columns:repeat(4,1fr)}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.rel{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:#fff;border:1px solid rgba(20,66,143,.14);border-radius:var(--r-md);
  padding:22px 24px;box-shadow:0 8px 26px rgba(10,31,60,.06);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.rel:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(10,31,60,.12);border-color:rgba(20,66,143,.32)}
.rel h3{font-size:17px}
.rel span{flex-shrink:0;width:38px;height:38px;border-radius:11px;background:var(--g-mist);
  display:grid;place-items:center;color:var(--cobalt);transition:background .2s ease,color .2s ease,transform .2s ease}
.rel span svg{width:16px;height:16px}
.rel:hover span{background:var(--g-signal);color:#fff;transform:translateX(3px)}

@media (max-width:1080px){
  .flow-4{grid-template-columns:repeat(2,1fr)}
  .flow-4 li:nth-child(3){border-left:0}
  .flow-4 li:nth-child(n+3){border-top:1px solid rgba(185,210,240,.16)}
  .rel-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .flow-4{grid-template-columns:1fr}
  .flow-4 li + li{border-left:0;border-top:1px solid rgba(185,210,240,.16)}
  .rel{padding:20px 18px}
}

/* ============================================================
   Article layout
   ============================================================ */
.art-head h1{max-width:22ch}
.art-meta{margin-top:22px;font-size:13.5px;color:#9DB6DA}
.art-sec{padding-block:var(--sec)}
.art-wrap{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:start}
.keybox{
  position:sticky;top:calc(var(--header-h) + 28px);
  background:linear-gradient(150deg,#CFE0F5 0%,#EAF1FA 46%,#FFFFFF 100%);
  border:1px solid rgba(20,66,143,.16);border-radius:var(--r-md);padding:26px 24px;
  box-shadow:0 12px 32px rgba(10,31,60,.07);
}
.keybox h2{font-size:13px;font-weight:600;letter-spacing:-.005em;color:var(--cobalt);margin-bottom:14px}
.keybox ul{display:grid;gap:12px}
.keybox li{position:relative;padding-left:20px;font-size:14px;line-height:1.55;color:var(--n5)}
.keybox li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--pulse-deep)}

.art-body{max-width:68ch}
.art-body h2{font-size:clamp(22px,2.1vw,27px);margin-top:44px;margin-bottom:14px}
.art-body h2:first-child{margin-top:0}
.art-body p{font-size:17px;line-height:1.75;color:var(--n5);margin-bottom:18px}
.art-body p strong{color:var(--ink);font-weight:600}
.art-body p.disclaimer{margin-top:34px;padding:18px 20px;background:var(--n1);border:1px solid var(--n2);
  border-radius:var(--r-sm);font-size:14px;line-height:1.6;color:var(--n5)}

.ins-link{text-decoration:none}
.ins-grid .ins-link h3{transition:color .18s ease}

@media (max-width:1080px){
  .art-wrap{grid-template-columns:1fr;gap:34px}
  .keybox{position:static;top:auto}
}
@media (max-width:760px){
  .art-head h1{max-width:none}
  .art-body h2{margin-top:34px}
  .art-body p{font-size:16px;line-height:1.72}
  .keybox{padding:22px 20px}
}

/* ============================================================
   Cookie banner
   ============================================================ */
.cookiebar{
  position:fixed;left:0;right:0;bottom:0;z-index:150;
  background:rgba(6,18,36,.97);
  backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);
  border-top:1px solid rgba(185,210,240,.12);
  box-shadow:0 -14px 40px rgba(4,12,26,.36);
  padding:18px 0;
}
.cookiebar[hidden]{display:none}
.cookiebar-in{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.cookiebar-copy{flex:1;min-width:260px}
.cookiebar p{font-size:14px;line-height:1.6;color:var(--mist)}
.cookiebar p strong{color:#fff;font-weight:600}
.cookiebar-link{margin-top:6px}
.cookiebar-link a{color:#7FE3ED;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.cookiebar-link a:hover{color:#fff}
.cookiebar-actions{display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap}
.cookiebar-actions .btn{white-space:nowrap}

/* ============================================================
   Legal documents
   ============================================================ */
.legal-jump ul{gap:9px}
.legal-jump li{padding-left:0}
.legal-jump li::before{display:none}
.legal-jump a{font-size:13.5px;line-height:1.5;color:var(--n5)}
.legal-jump a:hover{color:var(--cobalt);text-decoration:underline;text-underline-offset:3px}
.legal-body h2{font-size:clamp(20px,1.9vw,24px);margin-top:44px;scroll-margin-top:calc(var(--header-h) + 24px)}
.legal-body h3{font-size:17px;margin-top:26px;margin-bottom:10px}
.legal-body p{font-size:16px;line-height:1.72}
.legal-body a{color:var(--cobalt);font-weight:500;text-decoration:underline;text-underline-offset:3px}
.legal-body a:hover{color:var(--pulse-deep)}
.legal-body code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;
  background:var(--n1);border:1px solid var(--n2);border-radius:6px;padding:2px 7px;color:var(--ink)}
.lbullets{display:grid;gap:10px;margin:0 0 18px}
.lbullets li{position:relative;padding-left:22px;font-size:16px;line-height:1.68;color:var(--n5)}
.lbullets li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;border-radius:50%;background:var(--pulse-deep)}
.ltable{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:15px}
.ltable th,.ltable td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--n2);line-height:1.6}
.ltable th{font-weight:600;color:var(--ink);white-space:nowrap;background:var(--n1);width:1%}
.ltable tr:first-child th:not(:only-of-type){white-space:normal}
.ltable td{color:var(--n5)}

@media (max-width:760px){
  .cookiebar{padding:16px 0}
  .cookiebar-in{gap:14px}
  .cookiebar-actions{width:100%}
  .cookiebar-actions .btn{flex:1 1 0}
  .legal-body p,.lbullets li{font-size:15.5px}
  .ltable{font-size:14px}
  .ltable th,.ltable td{padding:10px 10px}
  .ltable th{white-space:normal}
}

/* cookie bar: reserve the space INSIDE the footer, so the reserved strip is ink
   rather than a white band below the document. */
body.has-cookiebar .site-footer{padding-bottom:164px}
/* the bar is a programmatic focus target, not a control, so it shows no ring.
   The buttons and the link inside it keep their own visible focus states. */
.cookiebar:focus,.cookiebar:focus-visible{outline:none;box-shadow:0 -14px 40px rgba(4,12,26,.36)}
.linkbtn{
  font:inherit;font-size:13px;color:inherit;background:none;border:0;padding:0;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;
}
.linkbtn:hover{color:#fff}
@media (max-width:760px){ body.has-cookiebar .site-footer{padding-bottom:250px} }

/* ============================================================
   About: vision and mission pair
   ============================================================ */
.vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.vm{background:#fff;border:1px solid rgba(20,66,143,.14);border-radius:var(--r-md);padding:34px 32px;
  box-shadow:0 10px 30px rgba(10,31,60,.06);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.vm:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(10,31,60,.12);border-color:rgba(20,66,143,.3)}
.vm-label{display:inline-block;font-size:13px;font-weight:600;color:var(--cobalt);
  background:rgba(20,66,143,.07);border:1px solid rgba(20,66,143,.16);
  padding:7px 14px;border-radius:8px;margin-bottom:22px}
.vm-alt .vm-label{color:var(--pulse-deep);background:rgba(0,194,209,.09);border-color:rgba(0,194,209,.26)}
.vm-statement{font-size:clamp(18px,1.7vw,21px);font-weight:600;line-height:1.34;letter-spacing:-.018em;color:var(--ink)}
.vm-body{font-size:15px;line-height:1.68;color:var(--n5);margin-top:18px;padding-top:18px;border-top:1px solid var(--n2)}

@media (max-width:1080px){ .vm-grid{grid-template-columns:1fr} }
@media (max-width:760px){ .vm{padding:26px 20px} .vm-label{margin-bottom:18px} }

/* form validation banner, shown when sendlead.php bounces back with ?error=1 */
.formerror{
  background:#FFE9E6;border:1px solid rgba(255,90,69,.42);border-radius:var(--r-sm);
  padding:14px 16px;margin-bottom:22px;font-size:14.5px;line-height:1.55;color:#7A1F10;
}
.formerror[hidden]{display:none}
.formerror strong{font-weight:600}
.formerror:focus{outline:2px solid #FF5A45;outline-offset:2px}

/* ============================================================
   How we work — expanded stages
   ============================================================ */
.wstage-list{display:grid;gap:18px}
.wstage{
  display:grid;grid-template-columns:280px 1fr;gap:40px;
  background:#fff;border:1px solid rgba(20,66,143,.14);border-radius:var(--r-md);
  padding:32px 34px;box-shadow:0 8px 26px rgba(10,31,60,.06);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.wstage:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(10,31,60,.11);border-color:rgba(20,66,143,.3)}
.wstage-head{display:flex;gap:18px;align-items:flex-start}
.wstage-n{
  flex-shrink:0;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:var(--g-mist);color:var(--cobalt);
  font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;
  border:1px solid rgba(20,66,143,.16);
}
.wstage h3{font-size:22px}
.wstage-dur{font-size:13px;color:var(--n4-text);margin-top:6px}
.wstage-body p{font-size:15.5px;line-height:1.68;color:var(--n5)}
.wstage-label{font-size:11.5px !important;font-weight:600;letter-spacing:.02em;color:var(--cobalt) !important;
  margin-top:22px;margin-bottom:10px}
.wstage-body .ticks{gap:9px}
.wstage-body .ticks li{font-size:14.5px}
.wstage-cost{margin-top:24px;padding:18px 20px;background:#E4FBF6;border:1px solid rgba(0,112,122,.2);border-radius:var(--r-sm)}
.wstage-cost .wstage-label{margin-top:0;color:#00565E !important}
.wstage-cost p{font-size:14.5px;line-height:1.62;color:#0B4B50}

@media (max-width:1080px){
  .wstage{grid-template-columns:1fr;gap:22px;padding:26px 24px}
}
@media (max-width:760px){
  .wstage{padding:22px 20px;gap:18px}
  .wstage h3{font-size:19px}
  .wstage-n{width:40px;height:40px;font-size:17px;border-radius:11px}
  .wstage-cost{padding:16px 16px}
}

/* ------------------------------------------------------------------
   cause 3: the closed mobile menu was a ~800px tall fixed element.
   visibility:hidden still contributes to scrollable overflow in WebKit,
   which is what produced the empty space below the footer on iPhone.
   Collapsing it to zero height removes the contribution entirely, and
   gives the sheet its own scroll when it is taller than the screen.
   ------------------------------------------------------------------ */
.msheet{
  max-height:0;
  overflow:hidden;
  padding-block:0;
  contain:layout;
}
.msheet.open{
  max-height:calc(100vh - var(--header-h));
  max-height:calc(100dvh - var(--header-h));
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding-block:10px 26px;
}

/* ------------------------------------------------------------------
   Footer "Get in touch": even optical spacing between the address
   block, the email and the phone. The values differ because the
   address and the list items carry different leading.
   ------------------------------------------------------------------ */
.f-col address{margin:0}
.f-col .f-contact{margin-top:13px}
.f-col .f-contact li{margin-bottom:12px}
.f-col .f-contact li:last-child{margin-bottom:0}

/* mobile menu CTA: .msheet a sets display:block, which made the pill's
   label sit left. Restore the button's own centred flex layout. */
.msheet a.btn{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

/* ============================================================
   Footer contact strip — email, phone and hours get their own band
   so the address column can align cleanly with the nav columns.
   ============================================================ */
.f-contactbar{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  margin-top:48px;
  background:rgba(185,210,240,.16);
  border:1px solid rgba(185,210,240,.18);
  border-radius:var(--r-md);
  overflow:hidden;
}
.f-cbitem{
  display:flex;align-items:center;gap:16px;
  background:var(--ink-deep);
  padding:22px 24px;
  transition:background-color .18s ease;
}
a.f-cbitem:hover{background:rgba(0,194,209,.09)}
.f-cbitem .ic{
  flex-shrink:0;width:40px;height:40px;border-radius:12px;
  background:rgba(185,210,240,.08);border:1px solid rgba(185,210,240,.18);
  display:grid;place-items:center;color:#7FE3ED;
  transition:background-color .18s ease,border-color .18s ease,transform .18s ease;
}
.f-cbitem .ic svg{width:18px;height:18px}
a.f-cbitem:hover .ic{background:rgba(0,194,209,.16);border-color:rgba(0,194,209,.4);transform:scale(1.05)}
.f-cbtext{min-width:0}
.f-cbitem .k{display:block;font-size:12px;line-height:1.3;color:var(--muted-on-dark);margin-bottom:5px}
.f-cbitem strong{
  display:block;font-size:15px;font-weight:500;line-height:1.35;color:#fff;letter-spacing:-.005em;
  overflow-wrap:anywhere;transition:color .18s ease;
}
a.f-cbitem:hover strong{color:#7FE3ED}

.f-social{margin-top:36px}

@media (max-width:1080px){
  .f-contactbar{grid-template-columns:1fr 1fr}
  .f-cbitem:last-child{grid-column:1 / -1}
}
@media (max-width:760px){
  .f-contactbar{grid-template-columns:1fr;margin-top:32px}
  .f-cbitem{padding:18px 18px;gap:14px}
  .f-cbitem:last-child{grid-column:auto}
  .f-cbitem strong{font-size:14.5px}
  .f-social{margin-top:28px}
}