/* ==========================================================================
   AURUMETRICS, site.css
   Brand System v1.0 - Clinical-Tech
   Typeface: Roboto only (brand system v1.0)
   ========================================================================== */

:root{
  /* Primary brand palette */
  --navy:#032638;        /* Deep Data Navy, dark backgrounds, executive blocks */
  --blue:#0F6FC6;        /* Clinical Blue, headers, primary buttons */
  --blue-2:#2190C8;      /* Data Blue, charts, secondary headings */
  --blue-3:#009DD9;      /* Signal Blue, graphs, linked-data, focus rings */
  --teal:#089CA2;        /* Evidence Teal, insight markers, CTA, connectors */
  --teal-2:#0B9B74;      /* Clinical Teal, positive findings, outcomes */
  --green:#54A838;       /* Health Green, improvement, patient impact */
  --lime:#A5C249;        /* Insight Lime, sparing highlight only */

  /* Neutrals */
  --white:#FFFFFF;
  --grey-bg:#F1F1F1;     /* Structure Grey */
  --grey-txt:#7F7F7F;    /* Text Grey */
  --grey-mid:#5C5C5C;    /* Analytical Grey */
  --charcoal:#1C1C1C;    /* Executive Charcoal */
  --ink:#0E1303;         /* Data Black */

  /* Derived */
  --navy-90:rgba(3,38,56,.90);
  --navy-70:rgba(3,38,56,.70);
  --line:#E3E7EA;
  --line-dark:rgba(255,255,255,.16);
  --paper:#FAFBFC;
  --ice:#9FD9E8;

  /* Accessible text variants. The brand teal and the soft grey work as fills but
     fall under 4.5:1 as small text on white, so text uses these instead.
     Every one of these clears 4.5:1 on white and on the tint background. */
  --teal-txt:#046F74;
  --soft-txt:#616968;
  --blue-txt:#0B5AA3;

  /* Type, Roboto only, per brand system v1.0 */
  --display:'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --body:'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Layout */
  --wrap:1200px;
  --wrap-narrow:860px;
  --gut:clamp(20px,5vw,48px);
  --sec:clamp(64px,8vw,112px);
  --radius:4px;
  --shadow:0 1px 2px rgba(3,38,56,.06), 0 8px 24px rgba(3,38,56,.06);
  --shadow-lg:0 2px 6px rgba(3,38,56,.08), 0 24px 60px rgba(3,38,56,.12);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:88px}
body{
  margin:0; background:var(--white); color:var(--charcoal);
  font-family:var(--body); font-size:17px; line-height:1.65; font-weight:400;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img,svg{max-width:100%; height:auto; display:block}
a{color:var(--blue); text-decoration:none}
a:hover{text-decoration:underline}
hr{border:0; border-top:1px solid var(--line); margin:0}

/* ---------- Type scale ---------- */
h1,h2,h3,h4{font-family:var(--display); font-weight:700; color:var(--navy); margin:0 0 .5em; letter-spacing:-.022em}
h1{font-size:clamp(2.3rem,4.8vw,3.7rem); line-height:1.08}
h2{font-size:clamp(1.75rem,3.1vw,2.6rem); line-height:1.16}
h3{font-size:clamp(1.2rem,1.85vw,1.5rem); line-height:1.26; letter-spacing:-.015em}
h4{font-size:1.08rem; line-height:1.35; font-weight:500; letter-spacing:-.008em}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
strong,b{font-weight:700; color:var(--charcoal)}
.lead{font-size:clamp(1.12rem,1.7vw,1.32rem); line-height:1.6; color:var(--grey-mid)}
.lead strong{color:var(--navy)}
small,.small{font-size:.85rem; line-height:1.55}

.eyebrow{
  font-family:var(--body); font-size:.74rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.13em; color:var(--teal-txt); margin:0 0 1.1rem; display:block;
}
.eyebrow--light{color:var(--blue-3)}

/* ---------- Layout ---------- */
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.wrap-narrow{max-width:var(--wrap-narrow); margin-inline:auto; padding-inline:var(--gut)}
.section{padding-block:var(--sec)}
.section--tight{padding-block:clamp(44px,5vw,68px)}
.band-white{background:var(--white)}
.band-grey{background:var(--grey-bg)}
.band-paper{background:var(--paper)}
.band-navy{background:var(--navy); color:rgba(255,255,255,.82)}
.band-navy h1,.band-navy h2,.band-navy h3,.band-navy h4{color:#fff}
.band-navy strong{color:#fff}
.band-navy a{color:var(--blue-3)}
/* Buttons are not links for colour purposes. .band-navy a is 0,1,1 and beat
   the 0,1,0 button rules, tinting every label on a navy band. */
.band-navy .btn-primary,.band-navy .btn-blue,.band-navy .btn-ghost-light,
.band-navy .nav-cta{color:#fff}
.band-navy .btn-ghost{color:var(--navy)}
.band-navy .lead{color:rgba(255,255,255,.78)}

.grid{display:grid; gap:clamp(20px,2.6vw,34px)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g-7-5{grid-template-columns:7fr 5fr; align-items:center; gap:clamp(28px,4vw,64px)}
.g-5-7{grid-template-columns:5fr 7fr; align-items:center; gap:clamp(28px,4vw,64px)}
.section-head{max-width:760px; margin-bottom:clamp(34px,4vw,56px)}
.section-head.center{margin-inline:auto; text-align:center}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:80; background:rgba(255,255,255,.94);
  backdrop-filter:saturate(150%) blur(10px); border-bottom:1px solid var(--line);
}
.header-inner{display:flex; align-items:center; gap:28px; height:76px; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.brand{display:flex; align-items:center; gap:11px; flex:0 0 auto}
.brand img{height:38px; width:auto}
.brand-name{font-family:var(--display); font-size:1.16rem; font-weight:700; color:var(--navy); letter-spacing:.055em; line-height:1; text-transform:uppercase}
/* Two-tone wordmark: Aurum (gold, blue) + metrics (measure, teal) */
.wordmark{background:linear-gradient(100deg,#1D6295 0%,#0F6FC6 38%,#089CA2 78%,#3A8F98 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent}
/* Safari and older Chrome support only the prefixed form. Testing just the
   unprefixed property would drop the gradient there, so test both. */
@supports not ((background-clip:text) or (-webkit-background-clip:text))
{.wordmark{color:var(--blue); -webkit-text-fill-color:var(--blue)}}
.wordmark-lg{font-weight:700; letter-spacing:.02em}
.nav{margin-left:auto; display:flex; align-items:center; gap:4px}
.nav a{
  font-size:.92rem; font-weight:500; color:var(--charcoal); padding:9px 13px;
  border-radius:var(--radius); text-decoration:none; white-space:nowrap; letter-spacing:.005em;
}
.nav a:hover{background:var(--grey-bg); color:var(--navy); text-decoration:none}
.nav a.is-current{color:var(--blue); box-shadow:inset 0 -2px 0 var(--teal)}
.nav-cta{
  background:#06797E; color:#fff !important; padding:11px 20px !important;
  font-weight:500; margin-left:10px;
}
.nav-cta:hover{background:#03585C; text-decoration:none !important}
.nav-toggle{display:none; margin-left:auto; background:none; border:1px solid var(--line); border-radius:var(--radius); padding:9px 12px; cursor:pointer}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--navy); margin:4px 0}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:9px; font-family:var(--body);
  font-size:.97rem; font-weight:500; padding:14px 26px; border-radius:var(--radius);
  border:1px solid transparent; cursor:pointer; text-decoration:none !important;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary{background:#06797E; color:#fff}
.btn-primary:hover{background:#03585C}
.btn-blue{background:var(--blue); color:#fff}
.btn-blue:hover{background:#0b5aa3}
.btn-ghost{background:transparent; color:var(--navy); border-color:#C6CFD5}
.btn-ghost:hover{border-color:var(--navy); background:var(--white)}
.btn-ghost-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.4)}
.btn-ghost-light:hover{border-color:#fff; background:rgba(255,255,255,.08)}
.btn-row{display:flex; flex-wrap:wrap; gap:14px; margin-top:30px}
.btn .arw{transition:transform .15s ease}
.btn:hover .arw{transform:translateX(3px)}

/* ---------- Hero ---------- */
.hero{position:relative; background:var(--navy); color:#fff; overflow:hidden; isolation:isolate}
.hero::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(1100px 520px at 78% 12%, rgba(9,157,217,.20), transparent 62%),
             radial-gradient(760px 460px at 4% 92%, rgba(8,156,162,.17), transparent 60%);
}
.hero-mesh{position:absolute; inset:0; z-index:-2; opacity:.5; pointer-events:none}
.hero-inner{position:relative; padding-block:clamp(72px,9vw,132px); max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.hero h1{color:#fff; max-width:17ch}
.hero .lead{color:rgba(255,255,255,.80); max-width:60ch; margin-top:1.1rem}
.hero-flag{
  display:inline-flex; align-items:center; gap:9px; font-size:.75rem; font-weight:500;
  text-transform:uppercase; letter-spacing:.13em; color:var(--blue-3);
  border:1px solid rgba(255,255,255,.2); border-radius:100px; padding:7px 16px; margin-bottom:1.6rem;
}
.hero-flag .dot{width:7px; height:7px; border-radius:50%; background:var(--teal); flex:0 0 auto}

/* ---------- Stat rail ---------- */
.statrail{border-top:1px solid var(--line-dark); margin-top:clamp(44px,5vw,64px); padding-top:clamp(28px,3vw,40px);
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,44px)}
.stat .num{font-family:var(--display); font-weight:700; letter-spacing:-.03em; font-size:clamp(1.9rem,3.2vw,2.7rem); line-height:1; color:#fff; display:block; margin-bottom:.35rem}
.stat .lbl{font-size:.9rem; color:rgba(255,255,255,.72); line-height:1.5}
.stat .lbl b{color:#fff; font-weight:500}
.statrail--light{border-top-color:var(--line)}
.statrail--light .num{color:var(--navy)}
.statrail--light .lbl{color:var(--grey-mid)}
.statrail--light .lbl b{color:var(--navy)}

/* ---------- Cards ---------- */
.card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(24px,2.4vw,34px); position:relative; transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.card::before{content:''; position:absolute; left:-1px; top:-1px; bottom:-1px; width:3px; background:var(--teal); opacity:0; transition:opacity .18s ease; border-radius:var(--radius) 0 0 var(--radius)}
.card:hover{box-shadow:var(--shadow); border-color:#D5DBE0}
.card:hover::before{opacity:1}
.card h3{margin-bottom:.5rem}
.card p{color:var(--grey-mid); font-size:.98rem}
.card p:last-child{margin-bottom:0}
.card-num{font-family:var(--display); font-weight:700; font-size:1.3rem; letter-spacing:.02em; color:var(--teal-txt); line-height:1; margin-bottom:.7rem; display:block}
.card--flat{border:0; background:var(--grey-bg)}
.card--flat:hover{box-shadow:none}
.card--dark{background:rgba(255,255,255,.05); border-color:var(--line-dark)}
.card--dark p{color:rgba(255,255,255,.72)}
.card--dark .card-num{color:var(--ice)}
.card-icon{width:44px; height:44px; margin-bottom:16px}

/* ---------- Callout ---------- */
.callout{
  border-left:3px solid var(--teal); background:var(--grey-bg);
  padding:clamp(22px,2.4vw,32px) clamp(24px,2.6vw,36px); border-radius:0 var(--radius) var(--radius) 0;
  margin-block:clamp(26px,3vw,40px);
}
.callout p{color:var(--grey-mid)}
.callout p strong{color:var(--navy)}
.callout--navy{background:rgba(255,255,255,.05); border-left-color:var(--blue-3)}
.callout--navy p{color:rgba(255,255,255,.8)}
.callout--warn{border-left-color:var(--blue-2); background:#F5F9FC}

/* ---------- Table ---------- */
.tbl-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
table.tbl{width:100%; border-collapse:collapse; font-size:.94rem; min-width:600px}
table.tbl th,table.tbl td{text-align:left; padding:15px 18px; border-bottom:1px solid var(--line); vertical-align:top}
table.tbl thead th{
  font-family:var(--body); font-size:.72rem; font-weight:500; text-transform:uppercase;
  letter-spacing:.11em; color:var(--soft-txt); border-bottom:1px solid #CBD3D8; white-space:nowrap;
}
table.tbl tbody tr:hover{background:#F8FAFB}
table.tbl td:first-child{font-weight:500; color:var(--navy); width:24%}
table.tbl td strong{color:var(--navy)}
table.tbl.tbl--plain td:first-child{width:auto}

/* ---------- Lists ---------- */
.ticks{list-style:none; padding:0; margin:0}
.ticks li{position:relative; padding-left:30px; margin-bottom:13px; color:var(--grey-mid)}
.ticks li::before{
  content:''; position:absolute; left:0; top:.62em; width:14px; height:2px; background:var(--teal);
}
.ticks li strong{color:var(--navy)}
.ticks--light li{color:rgba(255,255,255,.76)}
.ticks--light li strong{color:#fff}
.ticks--x li::before{background:#C0C7CC}

/* ---------- Chips ---------- */
.chips{display:flex; flex-wrap:wrap; gap:9px}
.chip{
  font-size:.83rem; font-weight:500; padding:8px 15px; border-radius:100px;
  border:1px solid var(--line); background:var(--white); color:var(--grey-mid); white-space:nowrap;
}
.chip:hover{border-color:var(--teal-txt); color:var(--navy); background:#F4FAFB}
.chip--on{background:var(--navy); color:#fff; border-color:var(--navy)}
.chips--light .chip{background:rgba(255,255,255,.06); border-color:var(--line-dark); color:rgba(255,255,255,.8)}

/* ---------- Figure / product shots ---------- */
.figure{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; box-shadow:var(--shadow)}
.figure img{display:block; width:100%}
.figure figcaption{font-size:.84rem; color:var(--soft-txt); padding:12px 16px; border-top:1px solid var(--line); background:var(--paper)}
.figure--float{box-shadow:var(--shadow-lg)}
.shot-frame{position:relative; border-radius:6px; overflow:hidden; border:1px solid rgba(255,255,255,.14); box-shadow:var(--shadow-lg)}
.shot-frame .bar{display:flex; gap:6px; padding:10px 14px; background:#0B3446; border-bottom:1px solid rgba(255,255,255,.08)}
.shot-frame .bar i{width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.22); display:block}
.shot-frame img{display:block; width:100%}

/* ---------- Steps / rail ---------- */
.rail{display:grid; grid-template-columns:repeat(5,1fr); gap:0; margin-top:14px}
.rail .step{padding:22px 20px 24px; color:#fff; position:relative}
.rail .step:nth-child(1){background:#1B76A6}
.rail .step:nth-child(2){background:#17669A}
.rail .step:nth-child(3){background:#125C8D}
.rail .step:nth-child(4){background:#0D5079}
.rail .step:nth-child(5){background:#084067}
.band-navy .rail .step{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.rail .step .n{font-family:var(--display); font-weight:700; font-size:1.35rem; display:block; opacity:.85; line-height:1; margin-bottom:8px}
.rail .step h4{color:#fff; font-size:1.02rem; margin-bottom:.4rem}
.rail .step p{font-size:.86rem; color:rgba(255,255,255,.92); margin:0; line-height:1.5}

/* ---------- Accordion ---------- */
.acc{border-top:1px solid var(--line)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{
  list-style:none; cursor:pointer; padding:22px 44px 22px 0; position:relative;
  font-family:var(--display); font-weight:500; font-size:1.08rem; color:var(--navy); line-height:1.4; letter-spacing:-.01em;
}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{
  content:''; position:absolute; right:8px; top:31px; width:11px; height:11px;
  border-right:2px solid var(--teal); border-bottom:2px solid var(--teal);
  transform:rotate(45deg); transition:transform .18s ease;
}
.acc details[open] summary::after{transform:rotate(-135deg); top:35px}
.acc .acc-body{padding:0 8% 26px 0; color:var(--grey-mid); font-size:.98rem}
.acc summary:hover{color:var(--blue)}

/* ---------- Quote / pull ---------- */
.pull{
  font-family:var(--display); font-weight:700; letter-spacing:-.022em;
  font-size:clamp(1.35rem,2.2vw,1.85rem); line-height:1.32;
  color:var(--navy); margin:0; max-width:24ch;
}
.pull--light{color:#fff}

/* ---------- Logo strip / badge ---------- */
.badge-row{display:flex; align-items:center; gap:28px; flex-wrap:wrap}
.badge-row img{height:60px; width:auto; opacity:.9}

/* ---------- Footer ---------- */
.trust-strip{background:#021D2B; color:rgba(255,255,255,.62); font-size:.82rem; padding:15px 0; border-bottom:1px solid rgba(255,255,255,.07)}
.trust-strip .wrap{display:flex; flex-wrap:wrap; gap:8px 22px; align-items:center}
.trust-strip b{color:rgba(255,255,255,.85); font-weight:500}
.site-footer{background:var(--navy); color:rgba(255,255,255,.62); padding-block:clamp(52px,6vw,76px) 34px; font-size:.9rem}
.site-footer h5{font-family:var(--body); font-size:.71rem; font-weight:500; text-transform:uppercase; letter-spacing:.13em; color:rgba(255,255,255,.62); margin:0 0 16px}
.site-footer a{color:rgba(255,255,255,.72); text-decoration:none; display:block; margin-bottom:9px}
.site-footer a:hover{color:#fff; text-decoration:none}
.footer-grid{display:grid; grid-template-columns:2.2fr 1fr 1fr 1fr 1.3fr; gap:clamp(24px,3vw,44px)}
.footer-brand img{height:42px; margin-bottom:18px}
.footer-brand p{color:rgba(255,255,255,.6); font-size:.88rem; max-width:34ch}
.footer-bottom{border-top:1px solid var(--line-dark); margin-top:clamp(34px,4vw,52px); padding-top:24px;
  display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:space-between; font-size:.84rem; color:rgba(255,255,255,.62)}
.footer-bottom a{display:inline; margin:0 14px 0 0}

/* ---------- CTA band ---------- */
.cta-band{background:var(--navy); position:relative; overflow:hidden; isolation:isolate}
.cta-band::after{content:''; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(760px 380px at 82% 30%, rgba(8,156,162,.22), transparent 62%)}
.cta-band .wrap{padding-block:clamp(58px,6.5vw,88px); text-align:center}
.cta-band h2{color:#fff; max-width:20ch; margin-inline:auto}
.cta-band .lead{color:rgba(255,255,255,.78); max-width:62ch; margin:1rem auto 0}
.cta-band .btn-row{justify-content:center}

/* ---------- Forms ---------- */
.form-field{margin-bottom:22px}
.form-field label{display:block; font-size:.88rem; font-weight:500; color:var(--navy); margin-bottom:7px}
.form-field .hint{font-size:.84rem; color:var(--soft-txt); margin:-2px 0 7px}
.form-field input.form-field select.form-field textarea{
  width:100%; font-family:var(--body); font-size:.97rem; color:var(--charcoal);
  padding:12px 14px; border:1px solid #B9C2C8; border-radius:var(--radius); background:#fff;
}
.form-field textarea{min-height:150px; resize:vertical}
.form-field input:focus.form-field select:focus.form-field textarea:focus{
  outline:3px solid var(--blue-3); outline-offset:2px; border-color:var(--blue-3);
}
.form-consent{display:flex; gap:11px; align-items:flex-start; font-size:.9rem; color:var(--grey-mid)}
.form-consent input{width:17px; height:17px; margin-top:3px; flex:0 0 auto}
.req{color:var(--teal-txt)}

/* ---------- Utility ---------- */
.mt0{margin-top:0}.mt1{margin-top:14px}.mt2{margin-top:26px}.mt3{margin-top:40px}.mt4{margin-top:60px}
.mb0{margin-bottom:0}.mb2{margin-bottom:26px}.mb3{margin-bottom:40px}
.center{text-align:center}
.muted{color:var(--soft-txt)}
.divider{height:1px; background:var(--line); margin-block:clamp(40px,5vw,64px)}
.divider--light{background:var(--line-dark)}
.note{font-size:.85rem; color:var(--soft-txt); line-height:1.6}
.tag{display:inline-block; font-size:.68rem; font-weight:500; text-transform:uppercase; letter-spacing:.11em;
  padding:4px 10px; border-radius:3px; background:var(--grey-bg); color:var(--grey-mid)}
.tag--teal{background:#E4F3F4; color:var(--teal-txt); border:1px solid #C9E6E8}
.tag--blue{background:#E6EFF9; color:var(--blue-txt); border:1px solid #C9DCF1}
.tag--amber{background:#FFF4E0; color:#7A4F00; border:1px solid #F0DFBC}
.skip{position:absolute; left:-9999px}
.skip:focus{left:12px; top:12px; z-index:200; background:#fff; padding:12px 18px; border-radius:var(--radius); box-shadow:var(--shadow)}
:focus-visible{outline:3px solid var(--blue-3); outline-offset:2px}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .g-7-5.g-5-7{grid-template-columns:1fr}
  .g4{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr 1fr}
  .footer-brand{grid-column:1/-1}
  .rail{grid-template-columns:1fr}
}
@media(max-width:860px){
  .nav{
    position:fixed; inset:76px 0 auto 0; background:#fff; flex-direction:column;
    align-items:stretch; padding:14px var(--gut) 26px; border-bottom:1px solid var(--line);
    box-shadow:var(--shadow); display:none;
  }
  .nav.is-open{display:flex}
  .nav a{padding:13px 4px; border-bottom:1px solid var(--line)}
  .nav-cta{margin:14px 0 0; justify-content:center; text-align:center; border-bottom:0 !important}
  .nav-toggle{display:block}
  .g2.g3{grid-template-columns:1fr}
  .statrail{grid-template-columns:1fr; gap:24px}
  body{font-size:16px}
}
@media(max-width:560px){
  .g4{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
}
@media print{
  .site-header,.cta-band,.nav-toggle{display:none}
  body{font-size:11pt}
}

/* ==========================================================================
   COMPONENTS ADDED IN REVISION 2
   ========================================================================== */

/* ---------- Geographic APAC map ---------- */
.mapbox{background:#F5F9FB; border:1px solid var(--line); border-radius:var(--radius); padding:8px}
.apac{display:block; width:100%; height:auto}
.apac .land{fill:#DDE7EC; stroke:#C3D2DA; stroke-width:1; stroke-linejoin:round}
.apac .bord{fill:none; stroke:#CBD8DF; stroke-width:1}
.apac .mk{cursor:pointer}
.apac .mk .halo{fill:#089CA2; opacity:.14; transition:opacity .18s ease, r .18s ease}
.apac .mk .pin{fill:var(--blue); stroke:#fff; stroke-width:2.5; transition:fill .18s ease}
.apac .mk .lbl{font-family:var(--body); font-size:19px; font-weight:500; fill:#0B3446; paint-order:stroke;
  stroke:#F5F9FB; stroke-width:5px; stroke-linejoin:round}
.apac .mk:hover .halo.apac .mk.is-on .halo{opacity:.3}
.apac .mk:hover .pin.apac .mk.is-on .pin{fill:var(--teal)}
.apac .mk.is-on .pin{stroke-width:3.5}
.apac .mk:focus-visible{outline:none}
.apac .mk:focus-visible .halo{opacity:.42}
.apac .hub .pin{fill:var(--navy)}
.apac .link{stroke:#A9C0CC; stroke-width:1.6; stroke-dasharray:5 5; fill:none; opacity:.75}
.apac .sea-label{font-family:var(--body); font-size:17px; fill:#A9BAC4; letter-spacing:.14em}

/* ---------- Screenshot gallery ---------- */
.shotgrid{display:grid; gap:18px; grid-template-columns:repeat(2,1fr)}
.shotgrid .wide{grid-column:1/-1}
.shot{border-radius:6px; overflow:hidden; border:1px solid var(--line); background:#fff; box-shadow:var(--shadow)}
.shot .bar{display:flex; align-items:center; gap:6px; padding:9px 13px; background:#F7FAFB; border-bottom:1px solid var(--line)}
.shot .bar i{width:8px; height:8px; border-radius:50%; background:#CFD8DD; display:block}
.shot .bar span{margin-left:8px; font-size:.76rem; color:var(--soft-txt); letter-spacing:.04em}
.shot img{display:block; width:100%}
.band-navy .shot{border-color:rgba(255,255,255,.14); background:#0B3446}
.band-navy .shot .bar{background:#0B3446; border-bottom-color:rgba(255,255,255,.1)}
.band-navy .shot .bar i{background:rgba(255,255,255,.22)}
.band-navy .shot .bar span{color:rgba(255,255,255,.68)}

/* ---------- Equal-height route cards ---------- */
.routes{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,2.6vw,34px); align-items:stretch}
.route{display:flex; flex-direction:column; height:100%}
.route .route-body{flex:1 1 auto}
.route .route-foot{margin-top:22px; padding-top:20px; border-top:1px solid var(--line)}
.route .route-foot .btn{width:100%; justify-content:center}
.route dl{margin:0}
.route dt{font-size:.7rem; font-weight:500; text-transform:uppercase; letter-spacing:.12em; color:var(--soft-txt); margin-bottom:5px}
.route dd{margin:0 0 18px; color:var(--grey-mid); font-size:.96rem; min-height:3.1em}
.route dd:last-of-type{margin-bottom:0}

/* ---------- Illustrative tag (deliberately quiet) ---------- */
.tag--illus{background:#F4F6F7; color:#667077; font-weight:400; border:1px solid #E6EAEC}

/* ---------- Five levels ladder ---------- */
.levels{display:grid; gap:10px}
.level{display:grid; grid-template-columns:56px 1fr; align-items:stretch; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:#fff}
.level .lv{display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:1.05rem}
.level:nth-child(1) .lv{background:#17669A}
.level:nth-child(2) .lv{background:#0F6FC6}
.level:nth-child(3) .lv{background:#06797E}
.level:nth-child(4) .lv{background:#0A7256}
.level:nth-child(5) .lv{background:#032638}
.level .lv-body{padding:18px 22px}
.level h4{margin:0 0 5px}
.level p{margin:0; color:var(--grey-mid); font-size:.95rem}
.level .lv-meta{font-size:.8rem; color:var(--soft-txt); margin-top:8px}
.band-navy .level{background:rgba(255,255,255,.05); border-color:var(--line-dark)}
.band-navy .level p{color:rgba(255,255,255,.72)}
.band-navy .level .lv-meta{color:rgba(255,255,255,.6)}

/* ---------- Compliance chip row ---------- */
.compliance{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px}
.compliance span{font-size:.76rem; font-weight:500; letter-spacing:.06em; text-transform:uppercase;
  padding:9px 15px; border-radius:3px; border:1px solid var(--line-dark); color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.05)}
.compliance--light span{border-color:var(--line); color:var(--grey-mid); background:var(--white)}

/* ---------- Feature row with icon ---------- */
.feat{display:grid; grid-template-columns:52px 1fr; gap:18px; align-items:start; margin-bottom:26px}
.feat:last-child{margin-bottom:0}
.feat svg{width:52px; height:52px}
.feat h4{margin-bottom:4px}
.feat p{margin:0; color:var(--grey-mid); font-size:.96rem}
.band-navy .feat p{color:rgba(255,255,255,.72)}

/* ---------- Big number band ---------- */
.figrow{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,32px)}
.figrow .fig{border-left:2px solid var(--teal); padding-left:18px}
.figrow .fig b{display:block; font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:700; letter-spacing:-.03em; color:var(--navy); line-height:1.05}
.figrow .fig span{display:block; font-size:.88rem; color:var(--grey-mid); margin-top:7px}
.band-navy .figrow .fig b{color:#fff}
.band-navy .figrow .fig span{color:rgba(255,255,255,.7)}

@media(max-width:980px){
  .shotgrid{grid-template-columns:1fr}
  .routes{grid-template-columns:1fr}
  .figrow{grid-template-columns:repeat(2,1fr)}
  .route dd{min-height:0}
}
@media(max-width:560px){
  .figrow{grid-template-columns:1fr}
  .level{grid-template-columns:44px 1fr}
}

/* ==========================================================================
   V2 ADDITIONS
   ========================================================================== */

/* ---------- Section sub-navigation ---------- */
.subnav{background:var(--paper); border-bottom:1px solid var(--line)}
.subnav .wrap{display:flex; flex-wrap:wrap; align-items:center; gap:4px; padding-block:10px}
.subnav .sn-label{font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.13em;
  color:var(--teal-txt); margin-right:14px}
.subnav a{font-size:.9rem; font-weight:500; color:var(--grey-mid); padding:8px 14px;
  border-radius:100px; text-decoration:none; white-space:nowrap}
.subnav a:hover{background:var(--white); color:var(--navy); text-decoration:none; box-shadow:inset 0 0 0 1px var(--line)}
.subnav a.is-current{background:var(--navy); color:#fff}

/* ---------- Market panel ---------- */
.panel-sub{font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em;
  color:var(--soft-txt); margin:22px 0 10px}
.panel-dl{display:grid; grid-template-columns:auto 1fr; gap:8px 18px; margin:22px 0 0}
.panel-dl dt{font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
  color:var(--teal-txt); padding-top:2px}
.panel-dl dd{margin:0; font-size:.94rem; color:var(--grey-mid); line-height:1.5}

/* ---------- Market accordion: name and subtitle clearly distinct ---------- */
.acc summary .m-name{display:block; font-size:1.32rem; font-weight:700; color:var(--navy);
  letter-spacing:-.02em; line-height:1.2}
.acc summary .m-sub{display:block; font-size:.94rem; font-weight:400; color:var(--soft-txt);
  letter-spacing:0; line-height:1.45; margin-top:4px}
.acc summary .m-flag{display:inline-block; font-size:.68rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.12em; color:var(--teal-txt); background:#E4F3F4; border:1px solid #C9E6E8;
  border-radius:3px; padding:3px 9px; margin-bottom:8px}

/* ---------- Offering cards ---------- */
.lvcard{display:flex; flex-direction:column; height:100%}
.lv-badge{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  border-radius:50%; color:#fff; font-weight:700; font-size:1.1rem; flex:0 0 auto}
.lvcard .lv-badge{margin-bottom:16px}
.lvcard .lv-body{flex:1 1 auto}
.lvcard .lv-foot{margin-top:20px; padding-top:18px; border-top:1px solid var(--line)}
.lv1 .lv-badge{background:#17669A} .lv2 .lv-badge{background:#0F6FC6}
.lv3 .lv-badge{background:#06797E} .lv4 .lv-badge{background:#0A7256}
.lv5 .lv-badge{background:#032638}

/* ---------- Deliverable list ---------- */
.deliv{list-style:none; padding:0; margin:0}
.deliv li{position:relative; padding-left:34px; margin-bottom:14px; color:var(--grey-mid); font-size:.98rem}
.deliv li::before{content:''; position:absolute; left:0; top:.28em; width:20px; height:20px;
  border-radius:3px; background:#E4F3F4; border:1px solid #C9E6E8}
.deliv li::after{content:''; position:absolute; left:6px; top:.52em; width:7px; height:4px;
  border-left:2px solid var(--teal-txt); border-bottom:2px solid var(--teal-txt); transform:rotate(-45deg)}
.deliv li strong{color:var(--navy)}

/* ---------- Glossary / data type entries ---------- */
.gloss{border-top:1px solid var(--line)}
.gloss .g-item{padding:26px 0; border-bottom:1px solid var(--line)}
.gloss .g-head{display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:6px}
.gloss .g-num{font-size:.8rem; font-weight:700; color:var(--teal-txt); letter-spacing:.1em}
.gloss h3{margin:0}
.gloss .g-acr{font-size:.9rem; color:var(--soft-txt); font-style:italic}
.gloss .g-grid{display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:22px; margin-top:14px}
.gloss .g-grid h5{font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em;
  color:var(--soft-txt); margin:0 0 7px}
.gloss .g-grid p{font-size:.95rem; color:var(--grey-mid); margin:0; line-height:1.55}
@media(max-width:860px){.gloss .g-grid{grid-template-columns:1fr}}

/* ---------- Reference / citation block ---------- */
.ref{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 24px; margin-top:22px}
.ref p{font-size:.9rem; color:var(--soft-txt); margin:0 0 8px; line-height:1.55}
.ref p:last-child{margin-bottom:0}
.ref a{color:var(--blue-txt); word-break:break-word}

/* ---------- Timeline for the founder story ---------- */
.tl{position:relative; padding-left:34px}
.tl::before{content:''; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:var(--line)}
.tl .tl-item{position:relative; margin-bottom:34px}
.tl .tl-item:last-child{margin-bottom:0}
.tl .tl-item::before{content:''; position:absolute; left:-30px; top:6px; width:14px; height:14px;
  border-radius:50%; background:#fff; border:3px solid var(--teal-txt)}
.tl h4{margin:0 0 6px; font-size:1.12rem; font-weight:700; color:var(--navy)}
.tl .tl-when{display:block; font-size:.76rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.12em; color:var(--teal-txt); margin-bottom:5px}
.tl p{margin:0; color:var(--grey-mid); font-size:.99rem}

@media(max-width:980px){
  .subnav .wrap{gap:2px}
  .subnav .sn-label{width:100%; margin:0 0 4px}
}

/* ==========================================================================
   V2.1 FIXES
   ========================================================================== */

/* ---------- Emphasis on every dark ground ----------
   .hero is not .band-navy, so the earlier .band-navy strong rule never reached
   the hero lead and <strong> fell back to charcoal on navy. This covers every
   dark container on the site in one place. */
.hero strong,
.cta-band strong,
.rail .step strong,
.card--dark strong,
.callout--navy strong,
.site-footer strong,
.trust-strip strong,
.band-navy .card strong{ color:#FFFFFF; font-weight:700 }
.hero .lead strong{ color:#FFFFFF }
/* .callout p strong (0,1,2) outranked .callout--navy strong (0,1,1),
   which put navy text on a navy callout. Matched at equal weight. */
.callout--navy p strong{ color:#FFFFFF }
.hero em,.cta-band em{ color:var(--ice); font-style:normal; font-weight:700 }

/* ---------- Health Grid module colours, sampled from the live platform ---------- */
.mod{display:flex; flex-direction:column; height:100%; border-radius:var(--radius);
  border:1px solid var(--line); background:var(--white); overflow:hidden;
  transition:box-shadow .18s ease, border-color .18s ease}
.mod:hover{box-shadow:var(--shadow); border-color:#D5DBE0}
.mod .mod-top{display:flex; align-items:center; gap:12px; padding:16px 20px; color:#fff}
.mod .mod-n{display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px;
  border-radius:50%; background:rgba(0,0,0,.30); font-weight:700; font-size:.95rem; flex:0 0 auto}
.mod .mod-name{font-weight:700; font-size:1.06rem; letter-spacing:-.01em; line-height:1.25}
.mod .mod-body{padding:20px; flex:1 1 auto}
.mod .mod-claim{font-weight:700; color:var(--navy); font-size:.98rem; margin:0 0 10px; line-height:1.45}
.mod .mod-tabs{font-size:.9rem; color:var(--grey-mid); margin:0; line-height:1.55}
.mod .mod-foot{padding:0 20px 18px; font-size:.86rem; color:var(--soft-txt); line-height:1.5}
.mod-drug   .mod-top{background:#17406D}
.mod-serv   .mod-top{background:#047E83}
.mod-hosp   .mod-top{background:#02553E}
.mod-diag   .mod-top{background:#5C51D5}
.mod-expl   .mod-top{background:#0076A8}

/* ---------- Repository grid for the content hub ---------- */
.repo{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.repo .post{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  background:#fff; display:flex; flex-direction:column; transition:box-shadow .18s ease}
.repo .post:hover{box-shadow:var(--shadow)}
.repo .post img{width:100%; display:block; border-bottom:1px solid var(--line)}
.repo .post .p-meta{padding:12px 14px 14px}
.repo .p-kind{display:inline-block; font-size:.66rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.11em; padding:3px 8px; border-radius:3px; margin-bottom:7px}
.repo .p-kind.carousel{background:#E6EFF9; color:var(--blue-txt); border:1px solid #C9DCF1}
.repo .p-kind.single{background:#E4F3F4; color:var(--teal-txt); border:1px solid #C9E6E8}
.repo .p-title{font-size:.92rem; font-weight:700; color:var(--navy); line-height:1.35; margin:0 0 5px}
.repo .p-date{font-size:.78rem; color:var(--soft-txt)}
@media(max-width:980px){.repo{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.repo{grid-template-columns:1fr}}

/* ---------- Wide reference table ---------- */
table.tbl--wide{min-width:960px; font-size:.92rem}
table.tbl--wide td:first-child{width:16%}
table.tbl--wide thead th{font-size:.74rem; color:var(--soft-txt)}

/* ---------- Content Hub archive extras ----------
   Square thumbnails via the padding-box ratio rather than aspect-ratio, so the
   cards line up in every renderer. Singles are 1:1 and carousels are 4:5, and
   both are cropped from the top, which is where the headline sits. */
.repo .p-img{position:relative; height:0; padding-top:100%; overflow:hidden;
  border-bottom:1px solid var(--line); background:var(--navy)}
.repo .p-img img{position:absolute; top:0; left:0; width:100%; height:100%;
  object-fit:cover; object-position:top center; border-bottom:0}
.repo .post[hidden]{display:none}
.repo .post .p-meta{display:flex; flex-direction:column; flex:1 1 auto}
.repo .p-title{flex:1 1 auto}
.chips{align-items:flex-start}
.chip{flex:0 0 auto}
.chip span{display:inline-block; margin-left:6px; font-weight:700; color:var(--soft-txt); font-variant-numeric:tabular-nums}
.chip--on span{color:rgba(255,255,255,.85)}

/* ---------- Markets: map beside a market picker (v4) ----------
   The map now sits in a real two-column grid instead of running the full
   width of the wrap, which is what made it and its nodes read as oversized.
   The pill row makes the map's clickability explicit: pills and map nodes
   both carry data-market, so the existing handler wires them together and
   keeps is-on and aria-pressed in step across both. */
.mapgrid{display:grid; grid-template-columns:minmax(0,1fr) minmax(290px,380px);
  gap:clamp(22px,3vw,42px); align-items:start}
.mapgrid .mapbox{max-width:620px; margin-inline:auto}
.market-side{display:flex; flex-direction:column; gap:16px}

.mkpills{display:flex; flex-wrap:wrap; gap:8px}
.mkpill{
  font-family:var(--body); font-size:.83rem; font-weight:500; line-height:1;
  padding:9px 15px; border-radius:100px; cursor:pointer; white-space:nowrap;
  border:1px solid var(--line); background:var(--white); color:var(--grey-mid);
  transition:background .16s ease, border-color .16s ease, color .16s ease;
}
.mkpill:hover{border-color:var(--teal-txt); color:var(--navy); background:#F4FAFB}
.mkpill.is-on{background:var(--blue); border-color:var(--blue); color:var(--white)}
.mkpill.is-on:hover{background:var(--blue-txt); border-color:var(--blue-txt); color:var(--white)}

@media(max-width:980px){
  .mapgrid{grid-template-columns:1fr}
  .mapgrid .mapbox{max-width:560px}
}

/* ---------- Content Hub: cards open the source (v5) ----------
   Each card is now a link: carousels open their eight-panel PDF, single posts
   open the full image. The anchor carries the flex chain so the meta block
   still stretches, and the p-open cue exists because the previous build gave
   no signal that the cards were clickable at all. */
.repo .post .p-link{display:flex; flex-direction:column; flex:1 1 auto;
  color:inherit; text-decoration:none}
.repo .post{transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease}
.repo .post:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--teal-txt)}
.repo .post:focus-within{border-color:var(--blue); box-shadow:var(--shadow-lg)}
.repo .post .p-link:focus-visible{outline:none}
.repo .post:hover .p-title{text-decoration:underline; text-underline-offset:2px}
.repo .p-open{margin-top:9px; font-size:.79rem; font-weight:600; color:var(--teal-txt);
  display:inline-flex; align-items:center; gap:6px}
.repo .p-open .arw{transition:transform .16s ease}
.repo .post:hover .p-open .arw{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){
  .repo .post,.repo .p-open .arw{transition:none}
  .repo .post:hover{transform:none}
}