/* ============================================================
   AmbuNet public website — light "clinical" theme
   Loaded AFTER site.css. Re-points the shared tokens to a white,
   navy-text palette and overrides the handful of rules in site.css
   that hard-code dark colours. The footer, CTA band and control-room
   demo stay dark by redefining the tokens locally (see "dark islands").
   All accent colours meet WCAG AA (4.5:1) as text on white.
   ============================================================ */

:root {
  --bg1: #ffffff;
  --bg2: #f4f8fa;
  --panel: #ffffff;
  --card: #ffffff;
  --card-strong: #f7fafb;
  --card-border: #e1e8ed;
  --teal: #17767e;
  --teal-deep: #135f66;
  --gold: #9a6400;
  --green: #1e7f4f;
  --red: #c62f3a;
  --text: #13294b;   /* navy, not black */
  --muted: #4b5d7a;
  --faint: #5f7190;
  --navy: #13294b;
  --line: #e6edf1;
  --ring-track: #e6edf1;
  --shadow-sm: 0 1px 2px rgba(15, 34, 48, 0.05), 0 4px 14px rgba(15, 34, 48, 0.05);
  --shadow-lg: 0 1px 2px rgba(15, 34, 48, 0.05), 0 18px 48px rgba(15, 34, 48, 0.10);
}

/* plain white canvas — no dot grid */
body::before { background: var(--bg1); }

/* ---------- header / nav ---------- */
.site-header {
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--line);
}
.nav-links a.navlink:hover, .nav-links button.navlink:hover,
.nav-links a.navlink.active { background: rgba(15, 34, 48, 0.05); }
.dropdown {
  background: #fff;
  box-shadow: 0 20px 50px rgba(15, 34, 48, 0.14);
}
.dropdown a:hover { background: rgba(23, 118, 126, 0.07); }

/* ---------- buttons ---------- */
.btn-primary {
  background: var(--teal);
  color: #fff;
  box-shadow: 0 6px 18px rgba(23, 118, 126, 0.22);
}
.btn-primary:hover { filter: none; background: var(--teal-deep); }
.btn-ghost { background: #fff; box-shadow: 0 1px 2px rgba(15, 34, 48, 0.04); }
.btn-ghost:hover { background: var(--card-strong); border-color: #cbd7de; }

/* ---------- type: calmer, less "console" ---------- */
h1, h2.sect, .split h3.big, .ctaband h2 { font-weight: 700; letter-spacing: -0.015em; }
.badge {
  letter-spacing: 0.02em; text-transform: none;
  font-size: 13.5px; font-weight: 600;
  background: #e8f4f5; border-color: #bfdfe2;
}
.badge.gold { background: #fbf2de; border-color: #ecd49d; }
.kicker { letter-spacing: 0.12em; }
.mock .mtitle { letter-spacing: 0.08em; color: var(--faint); }

/* ---------- hero: soft clinical tint instead of a glow ---------- */
.hero, .fhero {
  background:
    radial-gradient(900px 420px at 88% -10%, #dff0f2 0%, rgba(223, 240, 242, 0) 70%),
    linear-gradient(180deg, #f3f8fa 0%, #ffffff 100%);
  border-bottom: 1px solid var(--line);
}

/* ---------- surfaces ---------- */
section.band.alt { background: var(--bg2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.card, .stat, .tier, .chips span, .ministat { box-shadow: var(--shadow-sm); }
.card:hover { border-color: #9fcfd3; box-shadow: var(--shadow-lg); }
.card .icon { background: #e8f4f5; border-color: #c6e3e5; }

.mock { background: #fff; box-shadow: var(--shadow-lg); }
.mrow { background: #f6f9fb; border-color: var(--line); }

.pillmini.green { background: #e7f4ec; border-color: #b7dcc6; }
.pillmini.amber { background: #fbf2de; border-color: #ecd49d; }
.pillmini.red   { background: #fbe8e9; border-color: #efbcc0; }
.pillmini.teal  { background: #e6f3f4; border-color: #b6dbde; }
ul.checks li::before { background: #e7f4ec; border-color: #b7dcc6; }

.ring { background: conic-gradient(var(--teal) 0 313deg, var(--ring-track) 313deg 360deg); }
.kq .bar { background: var(--ring-track); }

.trow .tt { background: #e8f4f5; border-color: #bfdfe2; }
.trow .tt.gold { background: #fbf2de; border-color: #ecd49d; }

.tier.popular { border-color: #8cc6cb; background: #f3fafa; }
.tier .poptag { background: var(--teal); color: #fff; }

.videowrap { border-color: var(--line); box-shadow: 0 20px 50px rgba(15, 34, 48, 0.16); }

/* customer logos: dark silhouettes on white (multiply instead of screen) */
.logowall img { filter: brightness(0); opacity: 0.5; }
.logowall img.blend { filter: invert(1) grayscale(1); mix-blend-mode: multiply; }
.logowall img.blend-inv { filter: grayscale(1) contrast(1.2); mix-blend-mode: multiply; }
.logowall img:hover { opacity: 0.8; }

/* tables / legal / modal */
.cmp th, .cmp td { border-bottom-color: var(--line); }
.cmp thead th { background: var(--bg2); }
.cmp tr.cat td { background: #eaf5f6; }
.cmp .dash { color: #c3cdd4; }
.legal strong { color: var(--text); }
.legal hr, .legal-versions { border-top-color: var(--line); }
.region-overlay { background: rgba(15, 34, 48, 0.45); }
.region-modal { background: #fff; box-shadow: 0 30px 80px rgba(15, 34, 48, 0.25); }

@media (max-width: 980px) {
  .nav-links { background: #fff; box-shadow: 0 18px 40px rgba(15, 34, 48, 0.12); }
  .dropdown { background: var(--bg2); }
}

/* ============================================================
   Dark islands — navy anchors that keep the original palette
   ============================================================ */
.ctaband, .site-footer, .ccdemo, .tierplus {
  --text: #f4f7f9;
  --muted: #b9c6cd;
  --faint: #8fa1ac;
  --teal: #35c2c5;
  --gold: #e8b94d;
  --green: #57d38c;
  --red: #f06262;
  --panel: #0e1e28;
  --card: rgba(255, 255, 255, 0.06);
  --card-strong: rgba(255, 255, 255, 0.10);
  --card-border: rgba(255, 255, 255, 0.14);
  --ring-track: rgba(255, 255, 255, 0.09);
  color: var(--text);
}
.ctaband .btn-primary, .site-footer .btn-primary, .ccdemo .btn-primary {
  background: linear-gradient(135deg, #2fb7ba, #23989c); color: #06222a;
  box-shadow: 0 8px 26px rgba(47, 183, 186, 0.3);
}
.ctaband .btn-ghost, .site-footer .btn-ghost { background: var(--card); box-shadow: none; }
.ctaband .btn-ghost:hover, .site-footer .btn-ghost:hover { background: var(--card-strong); border-color: var(--card-border); }

.ctaband {
  background:
    radial-gradient(700px 300px at 85% 0%, rgba(53, 194, 197, 0.18), rgba(53, 194, 197, 0) 70%),
    var(--navy);
  border: none;
}
.site-footer { background: var(--navy); border-top: none; }
.tierplus { background: var(--navy); border: none; box-shadow: var(--shadow-lg); }
.tierplus .btn-primary { background: linear-gradient(135deg, #2fb7ba, #23989c); color: #06222a; box-shadow: none; }

/* control-room demo: the map is the product's dark ops view — keep it dark */
.ccdemo .mock, .ccdemo .stat { background: var(--navy); box-shadow: var(--shadow-lg); }
.ccdemo .mrow { background: var(--card); border-color: var(--card-border); }