/* =========================================================================
   BEST AMERICAN DIAGNOSTIC — Design System v1.0
   Proposal build. Brand: Infinity Navy #001C77 · Tahoe Green #00C6C1
   ========================================================================= */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root{
  /* Brand */
  --navy:#001C77;
  --navy-800:#001459;
  --navy-900:#000B33;
  --navy-600:#12309A;
  --teal:#00C6C1;
  --teal-600:#00A9A5;
  --teal-050:#E4FAF9;

  /* Neutrals */
  --ink:#0A1030;
  --muted:#5B6485;
  --muted-2:#8B93AE;
  --line:#E4E7F2;
  --line-soft:#EEF1F8;
  --paper:#F6F8FC;
  --paper-2:#FBFCFE;
  --white:#FFFFFF;

  /* On dark */
  --on-dark:#EAEEFF;
  --on-dark-muted:#9FADDF;
  --dark-line:rgba(255,255,255,.14);

  /* Gradients */
  --grad-brand:linear-gradient(120deg,var(--navy) 0%,#0B3AB0 45%,var(--teal) 100%);
  --grad-soft:linear-gradient(140deg,#EAF0FF 0%,#E4FAF9 100%);
  --grad-line:linear-gradient(90deg,transparent,var(--teal),transparent);

  /* Type */
  --f-display:"Inter Tight","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --f-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --t-hero:clamp(2.9rem,6.4vw,5.6rem);
  --t-h1:clamp(2.4rem,4.6vw,4rem);
  --t-h2:clamp(1.9rem,3.4vw,3rem);
  --t-h3:clamp(1.28rem,1.7vw,1.6rem);
  --t-h4:1.075rem;
  --t-lede:clamp(1.02rem,1.25vw,1.25rem);
  --t-body:1rem;
  --t-sm:.9rem;
  --t-xs:.78rem;

  /* Space */
  --sp-section:clamp(4.5rem,8.5vw,9rem);
  --sp-gap:clamp(1.5rem,2.6vw,2.75rem);
  --container:1280px;
  --container-narrow:900px;
  --gutter:clamp(1.15rem,4vw,3.25rem);

  /* Shape */
  --r-xs:6px;
  --r-sm:10px;
  --r-md:16px;
  --r-lg:26px;
  --r-pill:999px;

  /* Elevation */
  --sh-1:0 1px 2px rgba(10,16,48,.05),0 8px 24px -12px rgba(10,16,48,.18);
  --sh-2:0 2px 4px rgba(10,16,48,.04),0 26px 60px -28px rgba(0,28,119,.32);
  --sh-3:0 40px 90px -40px rgba(0,28,119,.45);

  /* Motion */
  --e-out:cubic-bezier(.19,1,.22,1);
  --e-inout:cubic-bezier(.65,.05,.36,1);
  --d-1:.28s;
  --d-2:.5s;
  --d-3:.9s;

  --header-h:76px;
}

/* ---------- 2. Reset ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:var(--f-body);font-size:var(--t-body);line-height:1.65;
  font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none;overflow-wrap:break-word}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea,select{font:inherit;color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,p,figure,blockquote{margin:0}
hr{border:0;border-top:1px solid var(--line);margin:0}
/* a display value on a component must never beat the hidden attribute */
[hidden]{display:none!important}
::selection{background:var(--teal);color:var(--navy-900)}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px}

/* ---------- 3. Typography ------------------------------------------------ */
h1,h2,h3,h4,.display{font-family:var(--f-display);font-weight:600;letter-spacing:-.032em;line-height:1.04;color:var(--ink)}
h1{font-size:var(--t-h1)}
h2{font-size:var(--t-h2)}
h3{font-size:var(--t-h3);letter-spacing:-.02em;line-height:1.18}
h4{font-size:var(--t-h4);letter-spacing:-.012em;line-height:1.3}
.hero-title{font-size:var(--t-hero);letter-spacing:-.04em;line-height:.98}
.lede{font-size:var(--t-lede);color:var(--muted);line-height:1.6;max-width:62ch}
.small{font-size:var(--t-sm)}
.muted{color:var(--muted)}
.tint{color:var(--teal-600)}
.grad-text{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
strong{font-weight:600}

.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:var(--t-xs);font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--teal-600);
}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.85}
.eyebrow--plain::before{display:none}
.on-dark .eyebrow,.sec--dark .eyebrow,.hero .eyebrow,.phero .eyebrow,.cta .eyebrow{color:var(--teal)}

/* ---------- 4. Layout ---------------------------------------------------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.container--narrow{max-width:var(--container-narrow)}
.sec{padding-block:var(--sp-section);position:relative}
.sec--tight{padding-block:clamp(3rem,5vw,5rem)}
.sec--paper{background:var(--paper)}
.sec--soft{background:var(--grad-soft)}
.sec--dark{background:var(--navy-900);color:var(--on-dark)}
.sec--dark h1,.sec--dark h2,.sec--dark h3,.sec--dark h4{color:#fff}
.sec--dark .lede,.sec--dark .muted{color:var(--on-dark-muted)}
.sec--brand{background:var(--navy);color:var(--on-dark)}
.sec--brand h2,.sec--brand h3{color:#fff}

.grid{display:grid;gap:var(--sp-gap)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.split--wide-left{grid-template-columns:1.15fr .85fr}
.split--wide-right{grid-template-columns:.85fr 1.15fr}
.stack>*+*{margin-top:1.15rem}
.stack-sm>*+*{margin-top:.6rem}
.stack-lg>*+*{margin-top:2rem}
.row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.center{text-align:center}
.center .lede{margin-inline:auto}
.mt-0{margin-top:0}.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}.mt-3{margin-top:3rem}
.sec-head{max-width:76ch}
.sec-head--split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,4rem);align-items:end}
.sec-head .lede{margin-top:1.15rem}
.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}

/* Rule with animated draw */
.rule{height:1px;background:var(--line);position:relative;overflow:hidden}
.rule::after{content:"";position:absolute;inset:0;background:var(--grad-line);transform:translateX(-100%);transition:transform 1.2s var(--e-out)}
.is-in .rule::after,.rule.is-in::after{transform:translateX(0)}

.ico{width:1em;height:1em;flex:none}

/* ---------- 5. Buttons --------------------------------------------------- */
.btn{
  --btn-bg:var(--navy);--btn-fg:#fff;--btn-sweep:var(--teal);
  position:relative;display:inline-flex;align-items:center;gap:.7rem;
  padding:.95rem 1.6rem;border-radius:var(--r-pill);
  background:var(--btn-bg);color:var(--btn-fg);
  font-size:.945rem;font-weight:600;letter-spacing:-.008em;line-height:1;
  overflow:hidden;isolation:isolate;white-space:nowrap;
  transition:transform var(--d-1) var(--e-out),box-shadow var(--d-1) var(--e-out),color var(--d-1) var(--e-out);
  box-shadow:0 10px 24px -14px rgba(0,28,119,.9);
}
.btn::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--btn-sweep);
  transform:translateY(101%);transition:transform .48s var(--e-out);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -16px rgba(0,28,119,.85)}
.btn:hover::before{transform:translateY(0)}
.btn:active{transform:translateY(0)}
.btn .ico{width:16px;height:16px;flex:none;transition:transform var(--d-1) var(--e-out)}
.btn:hover .ico{transform:translateX(4px)}
.btn--teal{--btn-bg:var(--teal);--btn-fg:var(--navy-900);--btn-sweep:#fff}
.btn--light{--btn-bg:#fff;--btn-fg:var(--navy);--btn-sweep:var(--teal);box-shadow:var(--sh-1)}
.btn--ghost{
  --btn-fg:var(--navy);--btn-sweep:var(--navy);
  background:transparent;border:1.5px solid rgba(0,28,119,.22);box-shadow:none;
}
.btn--ghost:hover{color:#fff;border-color:var(--navy)}
.sec--dark .btn--ghost,.on-dark .btn--ghost,.hero .btn--ghost,.phero .btn--ghost,.cta .btn--ghost{--btn-fg:#fff;--btn-sweep:#fff;border-color:var(--dark-line)}
.sec--dark .btn--ghost:hover,.on-dark .btn--ghost:hover,.hero .btn--ghost:hover,.phero .btn--ghost:hover,.cta .btn--ghost:hover{color:var(--navy-900);border-color:#fff}
.btn--wa{--btn-bg:#25D366;--btn-fg:#06331A;--btn-sweep:#fff;box-shadow:0 10px 24px -14px rgba(37,211,102,.9)}
.btn--wa:hover{box-shadow:0 16px 34px -16px rgba(37,211,102,.85)}
.btn--sm{padding:.7rem 1.15rem;font-size:.86rem}
.btn--lg{padding:1.1rem 2rem;font-size:1rem}
.btn--block{width:100%;justify-content:center}

/* Text link with underline reveal */
.tlink{
  display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.945rem;
  color:var(--navy);position:relative;padding-bottom:3px;
  min-height:34px;                     /* comfortable tap target on touch screens */
}
.tlink::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e-out)}
.tlink:hover::after{transform:scaleX(1);transform-origin:left}
.tlink .ico{width:15px;height:15px;transition:transform var(--d-1) var(--e-out)}
.tlink:hover .ico{transform:translateX(4px)}
.sec--dark .tlink,.on-dark .tlink,.hero .tlink,.phero .tlink{color:var(--teal)}

/* ---------- 6. Header ---------------------------------------------------- */
.topbar{
  background:var(--navy-900);color:var(--on-dark-muted);font-size:var(--t-xs);
  letter-spacing:.01em;position:relative;z-index:60;
}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:38px;flex-wrap:nowrap;white-space:nowrap}
.topbar a{color:var(--on-dark);transition:color var(--d-1)}
.topbar a:hover{color:var(--teal)}
.topbar-list{display:flex;align-items:center;gap:1.5rem}
.topbar-list li{display:flex;align-items:center;gap:.45rem}
.topbar .ico{width:13px;height:13px;color:var(--teal)}

.lang{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--dark-line);border-radius:var(--r-pill);padding:2px}
.lang button{
  padding:.22rem .58rem;border-radius:var(--r-pill);font-size:.7rem;font-weight:700;letter-spacing:.08em;
  color:var(--on-dark-muted);transition:all var(--d-1) var(--e-out);
}
.lang button[aria-pressed="true"]{background:var(--teal);color:var(--navy-900)}

.header{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:box-shadow var(--d-2) var(--e-out),border-color var(--d-2) var(--e-out),background var(--d-2) var(--e-out);
}
.header.is-stuck{border-color:var(--line);box-shadow:0 12px 30px -24px rgba(10,16,48,.5);background:rgba(255,255,255,.95)}
.header .container{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:var(--header-h);flex-wrap:nowrap}
.brand{display:inline-flex;align-items:center;gap:.72rem;flex:none}
.brand-mark{height:44px;width:auto;max-width:230px;object-fit:contain;flex:none}
.brand-txt{display:flex;flex-direction:column;line-height:1.05}
.brand-name{font-family:var(--f-display);font-weight:700;font-size:.98rem;letter-spacing:.01em;text-transform:uppercase;color:var(--navy)}
.brand-sub{font-size:.62rem;letter-spacing:.17em;text-transform:uppercase;color:var(--muted);font-weight:600}
.brand-sub b{color:var(--teal-600);font-weight:700}
.brand--inverse .brand-name{color:#fff}
.brand--inverse .brand-sub{color:var(--on-dark-muted)}
.brand--inverse .brand-sub b{color:var(--teal)}

.nav{display:flex;align-items:center;gap:.15rem}
.nav>li>a,.nav>li>button{
  display:inline-flex;align-items:center;gap:.35rem;padding:.6rem .85rem;border-radius:var(--r-xs);
  font-size:.92rem;font-weight:500;color:var(--ink);position:relative;transition:color var(--d-1)
}
.nav>li>a::after{
  content:"";position:absolute;left:.85rem;right:.85rem;bottom:.28rem;height:1.5px;background:var(--teal);
  transform:scaleX(0);transform-origin:right;transition:transform .4s var(--e-out)
}
.nav>li>a:hover::after,.nav>li>a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav>li>a[aria-current="page"]{color:var(--navy);font-weight:600}
.nav .caret{width:10px;height:10px;transition:transform var(--d-1) var(--e-out)}
.has-mega[data-open="true"] .caret{transform:rotate(180deg)}
.header-cta{display:flex;align-items:center;gap:.6rem;flex:none;min-width:0}

/* Mega menu */
.has-mega{position:relative}
.mega{
  position:absolute;top:calc(100% + 14px);left:50%;translate:-50% 0;width:min(760px,86vw);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-2);
  padding:1.35rem;display:grid;grid-template-columns:1fr 1fr;gap:.35rem 1.5rem;
  opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;
  transition:opacity var(--d-2) var(--e-out),transform var(--d-2) var(--e-out),visibility var(--d-2);
}
.has-mega[data-open="true"] .mega{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
.mega-item{display:flex;gap:.85rem;padding:.7rem;border-radius:var(--r-sm);transition:background var(--d-1) var(--e-out)}
.mega-item:hover{background:var(--paper)}
.mega-item .m-ico{
  width:38px;height:38px;flex:none;border-radius:10px;background:var(--teal-050);color:var(--navy);
  display:grid;place-items:center;transition:background var(--d-1),color var(--d-1)
}
.mega-item:hover .m-ico{background:var(--navy);color:var(--teal)}
.mega-item .m-ico svg{width:19px;height:19px}
.mega-item b{display:block;font-family:var(--f-display);font-size:.95rem;font-weight:600;letter-spacing:-.015em}
.mega-item span{display:block;font-size:.8rem;color:var(--muted);line-height:1.45}
.mega-foot{grid-column:1/-1;margin-top:.5rem;padding-top:.9rem;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;align-items:center;gap:1rem}

/* Burger + mobile drawer */
.burger{display:none;width:44px;height:44px;border-radius:var(--r-xs);flex-direction:column;align-items:center;justify-content:center;flex:none}
.burger span{display:block;width:21px;height:1.7px;background:var(--ink);border-radius:2px;transition:transform .4s var(--e-out),opacity .25s}
.burger span+span{margin-top:5px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.7px) rotate(-45deg)}

.drawer{
  position:fixed;inset:0;z-index:45;background:var(--white);padding:calc(var(--header-h) + 28px) var(--gutter) 2rem;
  transform:translateY(-100%);transition:transform .6s var(--e-inout);overflow-y:auto;
}
.drawer.is-open{transform:translateY(0)}
.drawer nav a{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--f-display);font-size:1.65rem;font-weight:600;letter-spacing:-.03em;
  padding:.85rem 0;border-bottom:1px solid var(--line-soft);
  opacity:0;transform:translateY(14px);
}
.drawer.is-open nav a{animation:drawerIn .6s var(--e-out) forwards}
.drawer nav a .ico{width:17px;height:17px;color:var(--teal)}
@keyframes drawerIn{to{opacity:1;transform:translateY(0)}}
.drawer-foot{margin-top:2rem;display:grid;gap:.8rem}

/* Scroll progress */
.progress{position:fixed;top:0;left:0;height:2px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--grad-brand);z-index:70}

/* ---------- 7. Hero ------------------------------------------------------ */
.hero{position:relative;background:var(--navy-900);color:var(--on-dark);overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2}
.hero-media picture{display:block;width:100%;height:100%}
.hero-media img,.hero-media svg{width:100%;height:100%;object-fit:cover;animation:kenburns 24s var(--e-inout) infinite alternate}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(0,11,51,.95) 0%,rgba(0,20,89,.82) 45%,rgba(0,28,119,.35) 100%);
}
.hero-inner{padding-block:clamp(5rem,12vw,9.5rem) clamp(4rem,8vw,7rem);position:relative}
.hero-title{color:#fff;max-width:17ch}
.hero .lede{color:#C7D2FF;max-width:52ch;margin-top:1.5rem}
.hero-actions{margin-top:2.4rem}
.hero-meta{
  margin-top:clamp(3rem,6vw,5rem);padding-top:1.75rem;border-top:1px solid var(--dark-line);
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem
}
.hero-meta b{display:block;font-family:var(--f-display);font-size:1.85rem;font-weight:600;letter-spacing:-.035em;color:#fff}
.hero-meta>div>span{display:block;font-size:.815rem;color:var(--on-dark-muted);margin-top:.2rem;line-height:1.4}
.hero-meta b span,.stat b span{display:inline;font-size:inherit;color:inherit;margin:0;line-height:inherit}
.hero-meta b .suf,.stat b .suf{color:var(--teal)}
.hero-scroll{position:absolute;right:var(--gutter);bottom:2rem;display:flex;align-items:center;gap:.6rem;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--on-dark-muted)}
.hero-scroll i{display:block;width:1px;height:44px;background:linear-gradient(180deg,transparent,var(--teal));animation:scrollPulse 2.2s var(--e-inout) infinite}
@keyframes scrollPulse{0%,100%{opacity:.35;transform:scaleY(.7)}50%{opacity:1;transform:scaleY(1)}}

/* Page hero (interior) */
.phero{background:var(--navy-900);color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate}
.phero::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.5;
  background:radial-gradient(70% 120% at 82% 15%,rgba(0,198,193,.42) 0%,transparent 60%),
             radial-gradient(60% 100% at 10% 90%,rgba(18,48,154,.7) 0%,transparent 65%);
}
.phero-inner{padding-block:clamp(3.5rem,7vw,6rem) clamp(3rem,6vw,5rem)}
.phero h1{color:#fff;max-width:20ch}
.phero .lede{color:#C7D2FF;margin-top:1.15rem}
.crumbs{display:flex;gap:.5rem;align-items:center;font-size:var(--t-xs);color:var(--on-dark-muted);margin-bottom:1.4rem;letter-spacing:.04em}
.crumbs a:hover{color:var(--teal)}
.crumbs span{opacity:.5}

/* ---------- 8. Ticker / marquee ------------------------------------------ */
.ticker{overflow:hidden;border-block:1px solid var(--line);background:var(--white);padding-block:1.1rem;position:relative}
.ticker::before,.ticker::after{content:"";position:absolute;top:0;bottom:0;width:12%;z-index:2;pointer-events:none}
.ticker::before{left:0;background:linear-gradient(90deg,#fff,transparent)}
.ticker::after{right:0;background:linear-gradient(270deg,#fff,transparent)}
.ticker-track{display:flex;gap:3.5rem;width:max-content;animation:marquee 42s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-item{display:flex;align-items:center;gap:.65rem;font-family:var(--f-display);font-weight:600;font-size:.98rem;letter-spacing:-.01em;color:var(--muted);white-space:nowrap}
.ticker-item svg{width:15px;height:15px;color:var(--teal)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- 9. Cards ----------------------------------------------------- */
.card{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  padding:clamp(1.4rem,2.2vw,2rem);display:flex;flex-direction:column;gap:.85rem;overflow:hidden;
  transition:transform var(--d-2) var(--e-out),box-shadow var(--d-2) var(--e-out),border-color var(--d-2) var(--e-out);
}
.card::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad-brand);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--e-out)}
.card:hover{transform:translateY(-6px);box-shadow:var(--sh-2);border-color:transparent}
.card:hover::after{transform:scaleX(1)}
.card .c-ico{width:48px;height:48px;border-radius:13px;background:var(--teal-050);color:var(--navy);display:grid;place-items:center;transition:background var(--d-2) var(--e-out),color var(--d-2) var(--e-out),transform var(--d-2) var(--e-out)}
.card:hover .c-ico{background:var(--navy);color:var(--teal);transform:rotate(-6deg)}
.card .c-ico svg{width:23px;height:23px}
.card p{color:var(--muted);font-size:.95rem}
.card .tlink{margin-top:auto;padding-top:.4rem}
.card--dark{background:var(--navy-800);border-color:transparent;color:var(--on-dark)}
.card--dark h3{color:#fff}
.card--dark p{color:var(--on-dark-muted)}
.card--dark .tlink{color:var(--teal)}
.card--dark .c-ico{background:rgba(255,255,255,.08);color:var(--teal)}
.card--dark:hover .c-ico{background:var(--teal);color:var(--navy-900)}
.card--flat{border-radius:var(--r-sm);padding:1.3rem;gap:.5rem}
.card--flat:hover{transform:none;box-shadow:var(--sh-1)}
.card-num{font-family:var(--f-display);font-size:.8rem;font-weight:700;letter-spacing:.12em;color:var(--teal-600)}
.tag{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:var(--r-pill);background:var(--teal-050);color:var(--navy);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.tag--ghost{background:transparent;border:1px solid var(--line);color:var(--muted)}

/* Service index rows */
.srow{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(1rem,3vw,2.5rem);
  padding:clamp(1.35rem,2.4vw,2rem) 0;border-bottom:1px solid var(--line);position:relative;
}
.srow:first-child{border-top:1px solid var(--line)}
.srow::before{content:"";position:absolute;inset:0 -1.25rem;background:var(--paper);border-radius:var(--r-sm);opacity:0;transition:opacity var(--d-2) var(--e-out);z-index:-1}
.srow:hover::before{opacity:1}
.srow-n{font-family:var(--f-display);font-size:.8rem;font-weight:700;color:var(--teal-600);letter-spacing:.1em;width:2.5rem}
.srow h3{transition:transform var(--d-2) var(--e-out)}
.srow:hover h3{transform:translateX(6px)}
.srow p{color:var(--muted);font-size:.93rem;margin-top:.3rem;max-width:65ch}
.srow-go{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--navy);transition:all var(--d-2) var(--e-out);flex:none}
.srow:hover .srow-go{background:var(--navy);border-color:var(--navy);color:#fff;transform:rotate(-45deg)}
.srow-go svg{width:16px;height:16px}

/* ---------- 10. Figures / media ------------------------------------------ */
.fig{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--paper);box-shadow:var(--sh-2)}
.fig picture{display:block;width:100%;height:100%}
.card figure.fig picture{height:100%}
.fig img,.fig svg{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--e-out)}
.fig:hover img,.fig:hover svg{transform:scale(1.045)}
.fig--tall{aspect-ratio:4/5}
.fig--wide{aspect-ratio:16/10}
.fig--sq{aspect-ratio:1/1}
.fig-cap{position:absolute;left:1rem;right:1rem;bottom:1rem;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-radius:var(--r-sm);padding:.85rem 1rem;font-size:.83rem;color:var(--ink);box-shadow:var(--sh-1)}
.fig-badge{
  position:absolute;top:1rem;left:1rem;background:rgba(0,11,51,.72);backdrop-filter:blur(6px);
  color:#fff;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  padding:.4rem .75rem;border-radius:var(--r-pill)
}
.media-stack{position:relative}
.media-stack .fig--float{
  position:absolute;right:-8%;bottom:-10%;width:52%;border-radius:var(--r-md);box-shadow:var(--sh-3);
}

/* ---------- 11. Stats ---------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.stat{background:#fff;padding:clamp(1.5rem,2.6vw,2.25rem)}
.stat b{display:block;font-family:var(--f-display);font-size:clamp(2.1rem,3.6vw,3rem);font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--navy)}
.stat b .suf{color:var(--teal)}
.stat>span{display:block;margin-top:.55rem;font-size:.86rem;color:var(--muted);line-height:1.45}
.sec--dark .stats{background:var(--dark-line);border-color:var(--dark-line)}
.sec--dark .stat{background:var(--navy-900)}
.sec--dark .stat b{color:#fff}
.sec--dark .stat>span{color:var(--on-dark-muted)}

/* ---------- 12. Steps ---------------------------------------------------- */
.steps{counter-reset:s;display:grid;gap:1px;background:var(--line)}
.step{background:#fff;padding:clamp(1.5rem,2.6vw,2.2rem);display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:start;transition:background var(--d-2) var(--e-out)}
.step:hover{background:var(--paper-2)}
.step-n{
  counter-increment:s;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);
  display:grid;place-items:center;font-family:var(--f-display);font-weight:600;color:var(--navy);
  transition:all var(--d-2) var(--e-out)
}
.step-n::before{content:counter(s,decimal-leading-zero)}
.step:hover .step-n{background:var(--navy);border-color:var(--navy);color:var(--teal)}
.step p{color:var(--muted);font-size:.94rem;margin-top:.35rem}

/* ---------- 13. Accordion ------------------------------------------------ */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-btn{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;text-align:left;
  padding:1.35rem 0;font-family:var(--f-display);font-size:1.06rem;font-weight:600;letter-spacing:-.018em;
  transition:color var(--d-1)
}
.acc-btn:hover{color:var(--navy)}
.acc-ico{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;flex:none;transition:all var(--d-2) var(--e-out);position:relative}
.acc-ico::before,.acc-ico::after{content:"";position:absolute;background:currentColor;border-radius:2px;transition:transform .4s var(--e-out),opacity .3s}
.acc-ico::before{width:12px;height:1.6px}
.acc-ico::after{width:1.6px;height:12px}
.acc-item[data-open="true"] .acc-ico{background:var(--navy);border-color:var(--navy);color:var(--teal)}
.acc-item[data-open="true"] .acc-ico::after{transform:rotate(90deg);opacity:0}
.acc-panel{overflow:hidden;height:0;transition:height .48s var(--e-out)}
.acc-panel-in{padding-bottom:1.5rem;color:var(--muted);max-width:78ch}
.acc-panel-in p+p{margin-top:.75rem}

/* ---------- 14. Tabs ----------------------------------------------------- */
.tabs{display:flex;gap:.4rem;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:2.25rem}
.tab{
  padding:.6rem 1.1rem;border-radius:var(--r-pill);font-size:.88rem;font-weight:600;color:var(--muted);
  border:1px solid transparent;transition:all var(--d-1) var(--e-out)
}
.tab:hover{color:var(--navy);background:var(--paper)}
.tab[aria-selected="true"]{background:var(--navy);color:#fff}
.tabpanel[hidden]{display:none}
.tabpanel{animation:fadeUp .55s var(--e-out)}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ---------- 15. Quote ---------------------------------------------------- */
.quote{position:relative;padding-left:clamp(1.5rem,4vw,3rem);border-left:2px solid var(--teal)}
.quote blockquote{font-family:var(--f-display);font-size:clamp(1.3rem,2.4vw,2rem);font-weight:500;letter-spacing:-.028em;line-height:1.3}
.quote figcaption{margin-top:1.35rem;font-size:.87rem;color:var(--muted)}
.quote figcaption b{display:block;color:var(--ink);font-weight:600;font-size:.95rem}
.sec--dark .quote figcaption b{color:#fff}
.stars{display:flex;gap:.18rem;color:var(--teal);margin-bottom:1rem}
.stars svg{width:16px;height:16px}

/* Google reviews */
.rating-card{
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(1rem,3vw,2.25rem);
  padding:clamp(1.25rem,2.5vw,1.75rem) clamp(1.4rem,3vw,2rem);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1)
}
.rating-score{display:flex;align-items:baseline;gap:.5rem}
.rating-score b{font-family:var(--f-display);font-size:clamp(2.2rem,4vw,3rem);font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--navy)}
.rating-score span{font-size:.9rem;color:var(--muted)}
.rating-card .stars svg{width:20px;height:20px}
.rating-meta{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.rating-meta .small{color:var(--muted)}
.rating-card .btn{margin-left:auto}

.reviews-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-gap)}
.review{
  display:flex;flex-direction:column;gap:.75rem;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-md);padding:clamp(1.2rem,2vw,1.5rem);
  transition:transform var(--d-2) var(--e-out),box-shadow var(--d-2) var(--e-out)
}
.review:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.review-top{display:flex;align-items:center;gap:.7rem}
.review-avatar{
  width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--grad-brand);color:#fff;font-family:var(--f-display);font-weight:600;font-size:1rem
}
.review-top b{display:block;font-size:.92rem;font-weight:600;letter-spacing:-.01em}
.review-date{display:block;font-size:.76rem;color:var(--muted-2)}
.review-g{width:18px;height:18px;margin-left:auto;flex:none}
.review blockquote{font-size:.93rem;line-height:1.6;color:var(--muted)}
.review .stars svg{width:15px;height:15px}
@media (max-width:1080px){.reviews-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.reviews-grid{grid-template-columns:1fr}.rating-card .btn{margin-left:0;width:100%;justify-content:center}}

/* ---------- 16. Locations ------------------------------------------------ */
.loc{display:grid;grid-template-columns:1.1fr .9fr;gap:0;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:#fff}
.loc-body{padding:clamp(1.6rem,3vw,2.5rem);display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start}
.loc-body .dl,.loc-body .hours,.loc-body .row{width:100%}
.loc-map{position:relative;min-height:280px;background:var(--paper)}
.loc-map picture{display:block;width:100%;height:100%}
.loc-map svg,.loc-map img{width:100%;height:100%;object-fit:cover}
.dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.6rem 1rem;font-size:.93rem}
.dl dt{color:var(--muted-2);font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;padding-top:.18rem}
.dl dd{margin:0;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.dl dd a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}

.hours{display:grid;gap:.4rem;font-size:.92rem}
.hours div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-bottom:1px dashed var(--line)}
.hours div:last-child{border-bottom:0}
.hours .is-today{color:var(--navy);font-weight:600}

/* ---------- 17. CTA band -------------------------------------------------- */
.cta{position:relative;overflow:hidden;background:var(--navy);color:#fff;isolation:isolate}
.cta::before{
  content:"";position:absolute;inset:-40% -10%;z-index:-1;
  background:conic-gradient(from 180deg at 70% 40%,rgba(0,198,193,.55),transparent 35%,rgba(0,198,193,.35) 70%,transparent);
  filter:blur(60px);animation:slowspin 26s linear infinite
}
@keyframes slowspin{to{transform:rotate(1turn)}}
.cta-inner{padding-block:clamp(3.5rem,7vw,6rem);display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.75rem,4vw,3.5rem);align-items:center}
.cta h2{color:#fff;max-width:18ch}
.cta p{color:#C7D2FF;margin-top:1rem;max-width:48ch}
.cta-actions{display:flex;flex-direction:column;gap:.75rem;align-items:stretch}

/* ---------- 18. Forms ---------------------------------------------------- */
.form{display:grid;gap:1.05rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.btn.is-busy{pointer-events:none;opacity:.75}
.btn.is-busy .ico{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}
.form-err{display:none;font-size:.85rem;color:#D6455B;background:rgba(214,69,91,.08);border:1px solid rgba(214,69,91,.25);border-radius:var(--r-sm);padding:.75rem .9rem}
.form-err.is-on{display:block}
.field{display:grid;gap:.42rem}
.field label{font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.field .req{color:var(--teal-600)}
.field input,.field select,.field textarea{
  width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;
  font-size:.95rem;transition:border-color var(--d-1),box-shadow var(--d-1),background var(--d-1)
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(0,198,193,.18)}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field.is-invalid input,.field.is-invalid select,.field.is-invalid textarea{border-color:#D6455B;box-shadow:0 0 0 4px rgba(214,69,91,.12)}
.field-err{font-size:.78rem;color:#D6455B;display:none}
.field.is-invalid .field-err{display:block}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.84rem;color:var(--muted);line-height:1.5}
.check input{width:18px;height:18px;flex:none;margin-top:.15rem;accent-color:var(--navy)}
.form-note{font-size:.78rem;color:var(--muted-2);line-height:1.55}
.form-ok{
  display:none;gap:1rem;align-items:flex-start;padding:1.25rem;border-radius:var(--r-md);
  background:var(--teal-050);border:1px solid rgba(0,198,193,.4)
}
.form-ok.is-on{display:flex}
.form-ok svg{width:24px;height:24px;color:var(--teal-600);flex:none}
.form-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.5rem,3vw,2.5rem);box-shadow:var(--sh-1)}

/* ---------- 19. Footer --------------------------------------------------- */
.footer{background:var(--navy-900);color:var(--on-dark-muted);padding-block:clamp(3.5rem,6vw,5.5rem) 2rem;position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--grad-line);opacity:.5}
.footer a{transition:color var(--d-1)}
.footer a:hover{color:var(--teal)}
.footer-top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:clamp(1.75rem,4vw,3rem)}
.footer h4{color:#fff;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-bottom:1.1rem}
.footer li+li{margin-top:.6rem}
.footer li a{font-size:.92rem;overflow-wrap:anywhere}
.footer .brand-name{color:#fff}
.footer .brand-sub{color:var(--on-dark-muted)}
.footer-about{font-size:.92rem;line-height:1.7;max-width:38ch;margin-top:1.25rem}
.social{display:flex;gap:.55rem;margin-top:1.5rem}
.social a{width:38px;height:38px;border-radius:50%;border:1px solid var(--dark-line);display:grid;place-items:center;transition:all var(--d-2) var(--e-out)}
.social a:hover{background:var(--teal);border-color:var(--teal);color:var(--navy-900);transform:translateY(-3px)}
.social svg{width:16px;height:16px}
.footer-bottom{margin-top:clamp(2.5rem,5vw,4rem);padding-top:1.6rem;border-top:1px solid var(--dark-line);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.8rem}
.footer-bottom ul{display:flex;gap:1.4rem;flex-wrap:wrap}

/* Sticky mobile action bar */
.mobar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;gap:.5rem;padding:.6rem;
  background:rgba(255,255,255,.93);backdrop-filter:blur(12px);border-top:1px solid var(--line);
  transform:translateY(110%);transition:transform .5s var(--e-out)
}
.mobar.is-on{transform:translateY(0)}
.mobar .btn{flex:1;justify-content:center;padding:.85rem 1rem}

/* Floating WhatsApp — the quick-question lane */
.wafab{
  position:fixed;right:1.25rem;bottom:5rem;z-index:41;display:inline-flex;align-items:center;gap:0;
  height:54px;padding:0 15px;border-radius:var(--r-pill);background:#25D366;color:#06331A;
  box-shadow:0 14px 34px -12px rgba(37,211,102,.75),0 2px 6px rgba(6,51,26,.2);
  transition:gap .45s var(--e-out),padding .45s var(--e-out),transform var(--d-2) var(--e-out),box-shadow var(--d-2) var(--e-out);
}
.wafab svg{width:26px;height:26px;flex:none}
.wafab-txt{
  max-width:0;overflow:hidden;white-space:nowrap;font-weight:600;font-size:.92rem;
  transition:max-width .45s var(--e-out);
}
.wafab:hover,.wafab:focus-visible{gap:.6rem;padding-right:20px;transform:translateY(-3px);box-shadow:0 20px 40px -12px rgba(37,211,102,.85)}
.wafab:hover .wafab-txt,.wafab:focus-visible .wafab-txt{max-width:180px}
@media (max-width:900px){.wafab{display:none}}

/* Back to top */
.totop{
  position:fixed;right:1.6rem;bottom:1.25rem;z-index:41;width:46px;height:46px;border-radius:50%;
  background:var(--navy);color:#fff;display:grid;place-items:center;box-shadow:var(--sh-2);
  opacity:0;transform:translateY(14px) scale(.9);pointer-events:none;transition:all var(--d-2) var(--e-out)
}
.totop.is-on{opacity:1;transform:none;pointer-events:auto}
.totop:hover{background:var(--teal);color:var(--navy-900)}
.totop svg{width:17px;height:17px}

/* ---------- 20. Reveal animations ---------------------------------------- */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .85s var(--e-out),transform .85s var(--e-out)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="fade"]{transform:none}
[data-reveal="left"]{transform:translateX(-30px)}
[data-reveal="right"]{transform:translateX(30px)}
[data-reveal="zoom"]{transform:scale(.955)}
/* Horizontal entrances would widen the page on phones, where columns stack
   anyway — travel vertically there instead. */
@media (max-width:900px){
  [data-reveal="left"],[data-reveal="right"]{transform:translateY(26px)}
}
[data-reveal].is-in{transform:none}
[data-stagger]>*{opacity:0;transform:translateY(22px);transition:opacity .8s var(--e-out),transform .8s var(--e-out)}
[data-stagger].is-in>*{opacity:1;transform:none}
[data-stagger].is-in>*:nth-child(1){transition-delay:.05s}
[data-stagger].is-in>*:nth-child(2){transition-delay:.13s}
[data-stagger].is-in>*:nth-child(3){transition-delay:.21s}
[data-stagger].is-in>*:nth-child(4){transition-delay:.29s}
[data-stagger].is-in>*:nth-child(5){transition-delay:.37s}
[data-stagger].is-in>*:nth-child(6){transition-delay:.45s}
[data-stagger].is-in>*:nth-child(7){transition-delay:.53s}
[data-stagger].is-in>*:nth-child(8){transition-delay:.61s}

/* Split-text headline reveal */
.rt{display:inline-block;overflow:hidden;vertical-align:bottom}
.rt>span{display:inline-block;transform:translateY(105%);transition:transform 1s var(--e-out)}
.is-in .rt>span{transform:none}
.is-in .rt:nth-child(2)>span{transition-delay:.09s}
.is-in .rt:nth-child(3)>span{transition-delay:.18s}
.is-in .rt:nth-child(4)>span{transition-delay:.27s}

/* ---------- 21. Proposal page helpers ------------------------------------ */
.swatch{border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line)}
.swatch-chip{height:120px}
.swatch-meta{padding:.9rem 1rem;background:#fff;font-size:.82rem}
.swatch-meta b{display:block;font-family:var(--f-display);font-size:.95rem}
.swatch-meta code{font-size:.78rem;color:var(--muted)}
.spec{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.5rem 1.25rem;font-size:.9rem}
.spec dt{font-weight:600;color:var(--navy)}
.spec dd{margin:0;color:var(--muted)}
.map-list li{padding:.6rem 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:1rem;font-size:.93rem}
.map-list li b{font-weight:600;min-width:0;overflow-wrap:anywhere}
.map-list li span{color:var(--muted);font-size:.85rem;text-align:right}

.logo-slot{
  display:grid;place-items:center;gap:1rem;padding:clamp(1.5rem,3vw,2.5rem);
  border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);min-height:230px;
  transition:border-color var(--d-2) var(--e-out),box-shadow var(--d-2) var(--e-out);
}
.logo-slot:hover{box-shadow:var(--sh-1)}
.logo-slot img{max-height:120px;width:auto;max-width:100%}
.logo-slot--new{background:var(--navy-900);border-color:transparent}
.logo-slot--new .logo-cap{color:var(--on-dark-muted)}
.logo-cap{font-size:var(--t-xs);letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--muted-2);text-align:center}
.logo-lockup{display:flex;align-items:center;gap:.9rem}
.logo-lockup .brand-name{font-size:1.5rem}
.logo-lockup .brand-sub{font-size:.7rem}
.logo-slot--new .brand-name{color:#fff}
.logo-slot--new .brand-sub{color:var(--on-dark-muted)}

/* ---------- 22. Responsive ------------------------------------------------ */
@media (max-width:1080px){
  .g-4{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-meta{grid-template-columns:repeat(2,1fr);gap:1.25rem}
  .footer-top{grid-template-columns:1fr 1fr}
}
@media (max-width:1080px){
  .topbar-list li:nth-child(n+3){display:none}
}
@media (max-width:900px){
  .nav,.header-cta .btn--ghost{display:none}
  .topbar .row>a.small{display:none}
  .burger{display:flex}
  .split,.split--wide-left,.split--wide-right,.sec-head--split,.cta-inner,.loc,.g-3,.g-2{grid-template-columns:1fr}
  .sec-head--split{align-items:start}
  .media-stack .fig--float{position:static;width:100%;margin-top:1rem}
  .mobar{display:flex}
  body{padding-bottom:4.75rem}
  .totop{bottom:5.25rem}
  .loc-map{min-height:220px;order:-1}
}
@media (max-width:560px){
  .dl,.spec{grid-template-columns:1fr;gap:.1rem}
  .dl dt,.spec dt{padding-top:.65rem}
  .dl dt:first-child,.spec dt:first-child{padding-top:0}
}
@media (max-width:900px){
  /* the row hover background bleeds into the gutter — keep it on screen */
  .srow::before{inset:0 -.6rem}
}
@media (max-width:640px){
  /* keep the hero to roughly one screen: it is the first thing a patient sees
     and a two-screen hero buries the phone number */
  .hero-inner{padding-block:clamp(2.5rem,11vw,4rem) clamp(2rem,8vw,3rem)}
  .hero .lede{margin-top:1rem}
  .hero-actions{margin-top:1.6rem}
  .hero-meta{margin-top:2rem;padding-top:1.25rem;gap:.9rem 1.25rem}
  .hero-meta b{font-size:1.45rem}
  .hero-meta>div>span{font-size:.72rem}
  .hero-scroll{display:none}
  .topbar-list li:not(:first-child){display:none}
  .topbar .row>a.small{display:none}
  .header-cta .btn{display:none}
  .brand-mark{height:36px}
  .g-4,.stats{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .srow{grid-template-columns:1fr auto;gap:.75rem 1rem}
  .srow-n{display:none}
  .hero-meta{grid-template-columns:1fr 1fr}
  .footer-top{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column}
}

/* ---------- 23. Motion / print ------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-reveal],[data-stagger]>*,.rt>span{opacity:1!important;transform:none!important}
}
@media print{
  .header,.topbar,.footer,.mobar,.totop,.cta,.progress{display:none!important}
  body{color:#000}
  .sec{padding-block:1.5rem}
}

/* =========================================================================
   24. Accessibility preferences widget
   ========================================================================= */
.a11y-fab{
  position:fixed;right:1.25rem;top:50%;transform:translateY(-50%);z-index:60;
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:var(--navy);color:#fff;box-shadow:0 14px 34px -12px rgba(0,28,119,.8);
  transition:background var(--d-2) var(--e-out),transform var(--d-2) var(--e-out),box-shadow var(--d-2) var(--e-out);
}
.a11y-fab svg{width:27px;height:27px}
.a11y-fab:hover{background:var(--teal);color:var(--navy-900);transform:translateY(-50%) scale(1.06)}
.a11y-fab[aria-expanded="true"]{background:var(--teal);color:var(--navy-900)}

.a11y-scrim{position:fixed;inset:0;z-index:61;background:rgba(10,16,48,.35);backdrop-filter:blur(2px);animation:fadeIn .3s var(--e-out)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.a11y-panel{
  position:fixed;right:1.25rem;top:50%;transform:translateY(-50%);z-index:62;
  width:min(370px,calc(100vw - 2.5rem));max-height:min(86vh,720px);
  display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-3);
  animation:a11yIn .42s var(--e-out);
}
@keyframes a11yIn{from{opacity:0;transform:translateY(-50%) translateX(24px)}to{opacity:1;transform:translateY(-50%) translateX(0)}}
.a11y-head{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;flex:none;
  padding:1.05rem 1.25rem;background:var(--navy);color:#fff;
}
.a11y-head h2{font-size:1.05rem;color:#fff;letter-spacing:-.02em}
.a11y-close{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--dark-line);color:#fff;transition:background var(--d-1)}
.a11y-close:hover{background:rgba(255,255,255,.14)}
.a11y-close svg{width:16px;height:16px}
.a11y-body{padding:1.1rem 1.25rem;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
.a11y-legend{
  font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);
  font-weight:700;margin:.35rem 0 .7rem
}
.a11y-legend + .a11y-legend,.a11y-grid + .a11y-legend,.a11y-step + .a11y-legend{margin-top:1.4rem}
.a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.a11y-grid + .a11y-step{margin-top:1rem}
.a11y-tile{
  display:flex;align-items:center;gap:.55rem;text-align:left;min-height:52px;
  padding:.6rem .7rem;border:1px solid var(--line);border-radius:var(--r-sm);
  font-size:.83rem;font-weight:500;line-height:1.25;color:var(--ink);background:#fff;
  transition:border-color var(--d-1),background var(--d-1),color var(--d-1),box-shadow var(--d-1);
}
.a11y-tile svg{width:19px;height:19px;flex:none;color:var(--navy)}
.a11y-df{font-family:var(--f-display);font-weight:700;font-size:1rem;color:var(--navy);width:19px;flex:none;text-align:center}
.a11y-tile:hover{border-color:var(--navy);background:var(--paper)}
.a11y-tile[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 8px 20px -12px rgba(0,28,119,.9)}
.a11y-tile[aria-pressed="true"] svg,.a11y-tile[aria-pressed="true"] .a11y-df{color:var(--teal)}

.a11y-step{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.55rem 0}
.a11y-step + .a11y-step{border-top:1px solid var(--line-soft)}
.a11y-step-label{display:flex;align-items:center;gap:.55rem;font-size:.86rem;font-weight:500}
.a11y-step-label svg{width:19px;height:19px;color:var(--navy);flex:none}
.a11y-stepper{display:flex;align-items:center;gap:.35rem;flex:none}
.a11y-stepper button{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;
  font-size:1.1rem;font-weight:600;line-height:1;color:var(--navy);transition:all var(--d-1)
}
.a11y-stepper button:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.a11y-stepper output{min-width:2.1rem;text-align:center;font-size:.85rem;font-weight:600;font-variant-numeric:tabular-nums}
.a11y-foot{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;
  padding:.9rem 1.25rem;border-top:1px solid var(--line);background:var(--paper)
}
.a11y-foot .tlink{font-size:.8rem}

.a11y-guide{position:fixed;left:0;right:0;height:42px;z-index:59;pointer-events:none;
  background:rgba(0,28,119,.12);border-top:2px solid var(--navy);border-bottom:2px solid var(--navy)}

@media (max-width:640px){
  .a11y-fab{width:46px;height:46px;right:.9rem}
  .a11y-panel{
    right:0;left:0;bottom:0;top:auto;transform:none;width:100%;
    max-height:88vh;border-radius:var(--r-lg) var(--r-lg) 0 0;animation:sheetIn .42s var(--e-out)
  }
  @keyframes sheetIn{from{transform:translateY(100%)}to{transform:translateY(0)}}
}

/* ---- what the preferences actually do ---------------------------------- */
html[data-a11y-font="1"]{font-size:112.5%}
html[data-a11y-font="2"]{font-size:125%}
html[data-a11y-font="3"]{font-size:140%}
html[data-a11y-space="1"] body{letter-spacing:.03em;word-spacing:.08em}
html[data-a11y-space="2"] body{letter-spacing:.06em;word-spacing:.16em}
html[data-a11y-space="3"] body{letter-spacing:.1em;word-spacing:.26em}
html[data-a11y-line="1"] body{line-height:1.85}
html[data-a11y-line="2"] body{line-height:2.1}
html[data-a11y-line="3"] body{line-height:2.4}
html[data-a11y-line] p,html[data-a11y-line] li,html[data-a11y-line] blockquote{line-height:inherit}

html.a11y-readable body,html.a11y-readable h1,html.a11y-readable h2,html.a11y-readable h3,
html.a11y-readable h4,html.a11y-readable .btn,html.a11y-readable input,html.a11y-readable select,
html.a11y-readable textarea{
  font-family:Verdana,"Trebuchet MS",Tahoma,sans-serif!important;letter-spacing:normal
}
html.a11y-align p,html.a11y-align li,html.a11y-align h1,html.a11y-align h2,
html.a11y-align h3,html.a11y-align .lede,html.a11y-align blockquote{text-align:left!important}

html.a11y-links a{
  text-decoration:underline!important;text-underline-offset:3px;text-decoration-thickness:2px;
  outline:2px solid var(--teal);outline-offset:2px;border-radius:2px
}
html.a11y-noimg img,html.a11y-noimg .fig,html.a11y-noimg .hero-media,html.a11y-noimg .loc-map{
  visibility:hidden!important
}
html.a11y-noimg .fig,html.a11y-noimg .loc-map{background:var(--paper);visibility:visible!important}
html.a11y-noimg .fig img{display:none}

html.a11y-gray{filter:grayscale(1)}
html.a11y-contrast{filter:contrast(1.35) saturate(1.15)}
html.a11y-contrast.a11y-gray{filter:grayscale(1) contrast(1.5)}

html.a11y-cursor,html.a11y-cursor *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'%3E%3Cpath d='M5 3.5 18.5 11l-5.6 1.6L10.6 18Z' fill='%23fff' stroke='%23001C77' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2,auto!important
}
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{
  animation-play-state:paused!important;animation-duration:.001ms!important;
  transition-duration:.001ms!important;scroll-behavior:auto!important
}
html.a11y-still [data-reveal],html.a11y-still [data-stagger]>*,html.a11y-still .rt>span{
  opacity:1!important;transform:none!important
}

/* =========================================================================
   25. Cookie consent
   ========================================================================= */
.cookie{
  position:fixed;left:1.25rem;bottom:1.25rem;z-index:58;
  width:min(420px,calc(100vw - 2.5rem));display:flex;gap:.9rem;align-items:flex-start;
  padding:1.1rem 1.15rem;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-md);box-shadow:var(--sh-3);
  animation:cookieIn .55s var(--e-out) .6s both;
}
@keyframes cookieIn{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
.cookie.is-leaving{animation:cookieOut .4s var(--e-out) forwards}
@keyframes cookieOut{to{opacity:0;transform:translateY(16px) scale(.97)}}
.cookie-ico{
  width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:var(--teal-050);color:var(--navy)
}
.cookie-ico svg{width:22px;height:22px}
.cookie-body{min-width:0}
.cookie-body b{display:block;font-family:var(--f-display);font-size:.98rem;letter-spacing:-.02em}
.cookie-body p{margin-top:.3rem;font-size:.82rem;line-height:1.55;color:var(--muted)}
.cookie-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:.85rem}
.cookie-actions .tlink{font-size:.8rem}
.cookie-x{
  position:absolute;top:.6rem;right:.6rem;width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;color:var(--muted-2);transition:background var(--d-1),color var(--d-1)
}
.cookie-x:hover{background:var(--paper);color:var(--ink)}
.cookie-x svg{width:14px;height:14px}

@media (max-width:900px){
  .cookie{left:.75rem;right:.75rem;width:auto;bottom:5.5rem}
}
@media (max-width:400px){
  .cookie{padding:.9rem}
  .cookie-ico{display:none}
}