/* ============================================================
   Brilliancy Health — Wireframe Styles
   Palette:
   - #0f1115 very dark grey canvas (cool-tinted near-black)
   - #1a1a1f raised surfaces
   - #28138f / #3a2a8b deep violet shades for bands
   - #604395 BRAND PURPLE (signature Brilliancy Health)
   - #673ab7 secondary violet
   - #907cff bright/electric purple (accent)
   - #d1c4e9 light lavender (secondary)
   - #f4f6fc / #ffffff off-white
   ============================================================ */

:root {
  --bh-bg: #0f1115;            /* primary canvas — very dark grey with subtle cool tone */
  --bh-bg-2: #1a1a1f;          /* slightly raised surfaces */
  --bh-deep: #28138f;          /* deep violet for bands */
  --bh-deep-2: #3a2a8b;        /* mid violet */
  --bh-brand: #604395;         /* SIGNATURE Brilliancy Health brand purple */
  --bh-violet: #673ab7;        /* secondary violet */
  --bh-electric: #907cff;      /* electric accent */
  --bh-lavender: #d1c4e9;      /* light lavender — secondary */
  --bh-ink: #f4f6fc;           /* off-white text */
  --bh-mute: #b6b2d4;          /* muted lavender-gray text */
  --bh-line: rgba(209, 196, 233, 0.14);
  --bh-card: rgba(96, 67, 149, 0.08);
  --bh-brand-soft: rgba(96, 67, 149, 0.28);
  --bh-brand-glow: rgba(96, 67, 149, 0.45);
  --bh-violet-soft: rgba(103, 58, 183, 0.22);
  --bh-electric-soft: rgba(144, 124, 255, 0.22);
  --bh-lavender-soft: rgba(209, 196, 233, 0.16);
  --bh-radius: 10px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bh-bg);
  color: var(--bh-ink);
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--bh-electric); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Wireframe banner ---------- */
.wf-banner {
  background: var(--bh-brand);
  color: #fff;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  padding: 6px 12px;
  font-weight: 700;
}

/* ---------- Header / Nav ---------- */
.site-header {
  border-bottom: 1px solid var(--bh-line);
  background: var(--bh-bg);
  position: sticky; top: 0; z-index: 10;
}
.nav-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 28px;
  display: flex; align-items: center; justify-content: space-between;
}
.brand {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
}
.brand:hover { text-decoration: none; }

/* ---------- Brilliancy Health wordmark (text-based logo) ----------
   Two stacked lines: BRILLIANCY (large, weight 900) above a tight,
   letter-spaced HEALTH (smaller, weight 700). Uses Montserrat for a
   modern geometric sans close to the actual mark. */
.bh-logo {
  display: inline-flex;
  flex-direction: column;
  line-height: 1;
  font-family: "Montserrat", "Helvetica Neue", "Arial Black", Arial, sans-serif;
  text-decoration: none;
}
.bh-logo__main {
  font-weight: 900;
  font-size: 22px;
  letter-spacing: 0.01em;
  color: #ffffff;
}
.bh-logo__sub {
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.42em;
  color: #ffffff;
  margin-top: 4px;
  /* Visually center HEALTH under BRILLIANCY by nudging for letter-spacing */
  padding-left: 0.42em;
  align-self: center;
}

/* Footer scale-up */
.site-footer .bh-logo__main { font-size: 26px; }
.site-footer .bh-logo__sub  { font-size: 12px; margin-top: 5px; }

.nav-links {
  display: flex; gap: 10px;
  list-style: none; margin: 0; padding: 0;
  font-size: 13.5px;
}
.nav-links a {
  display: inline-block;
  color: var(--bh-ink);
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid var(--bh-line);
  background: transparent;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.nav-links a:hover {
  color: #fff;
  border-color: var(--bh-brand);
  background: var(--bh-brand-soft);
  text-decoration: none;
}
.nav-links a.active {
  color: #fff;
  border-color: var(--bh-brand);
  background: var(--bh-brand-soft);
}
/* ---------- Dropdown nav ---------- */
.nav-dropdown { position: relative; }
.nav-dropdown-toggle { cursor: pointer; }
.nav-dropdown-menu {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--bh-bg-2);
  border: 1px solid var(--bh-line);
  border-radius: var(--bh-radius);
  list-style: none;
  margin: 0;
  padding: 14px 0 6px;  /* top padding bridges the gap so mouse doesn't leave hover zone */
  min-width: 160px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  z-index: 100;
  transition: opacity .15s ease, visibility .15s ease;
}
.nav-dropdown:hover .nav-dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.nav-dropdown-menu li a {
  display: block;
  padding: 9px 18px;
  color: var(--bh-ink);
  font-size: 14px;
  white-space: nowrap;
}
.nav-dropdown-menu li a:hover {
  background: var(--bh-brand-soft);
  color: #fff;
  text-decoration: none;
}

.nav-cta {
  background: var(--bh-brand);
  border: 1px solid var(--bh-brand);
  color: #fff;
  padding: 8px 16px;
  border-radius: var(--bh-radius);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 0 0 0 var(--bh-brand-glow);
  transition: box-shadow .2s ease, background .2s ease;
}
.nav-cta:hover {
  background: #6f4eaa;
  text-decoration: none;
  box-shadow: 0 0 18px 0 var(--bh-brand-glow);
}

/* ---------- Layout ---------- */
.container {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 28px;
}

.section {
  padding: 80px 0;
  border-bottom: 1px dashed var(--bh-line);
}
.section:last-of-type { border-bottom: 0; }

.eyebrow {
  color: var(--bh-lavender);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 14px;
  padding-left: 12px;
  border-left: 2px solid var(--bh-brand);
}

h1, h2, h3 {
  font-family: "Montserrat", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  color: #fff;
  margin: 0 0 18px;
  text-wrap: balance;
}
h1 {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
h2 { font-size: 32px; line-height: 1.12; letter-spacing: -0.015em; }
h3 { font-size: 18px; letter-spacing: -0.005em; }

p { color: var(--bh-mute); margin: 0 0 14px; max-width: 72ch; text-wrap: pretty; }
p.lede { color: var(--bh-ink); font-size: 18px; max-width: 72ch; text-wrap: pretty; }
p.p-wide { max-width: none; }

/* ---------- Hero ---------- */
.hero {
  padding: 96px 0 80px;
  background:
    radial-gradient(ellipse at 80% -10%, var(--bh-brand-soft), transparent 55%),
    radial-gradient(ellipse at -10% 110%, var(--bh-brand-glow), transparent 55%),
    radial-gradient(ellipse at 50% 50%, var(--bh-violet-soft), transparent 65%),
    var(--bh-bg);
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: center;
}
.hero-actions { display: flex; gap: 14px; margin-top: 26px; }
.btn {
  display: inline-block;
  padding: 12px 22px;
  border-radius: var(--bh-radius);
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
}
.btn-primary {
  background: var(--bh-brand);
  color: #fff;
  box-shadow: 0 0 0 0 var(--bh-brand-glow);
  transition: box-shadow .2s ease, background .2s ease;
}
.btn-primary:hover {
  text-decoration: none;
  background: #6f4eaa;
  box-shadow: 0 0 22px 0 var(--bh-brand-glow);
}
.btn-ghost {
  border: 1px solid var(--bh-brand);
  color: var(--bh-ink);
}
.btn-ghost:hover {
  border-color: var(--bh-electric);
  background: var(--bh-brand-soft);
  text-decoration: none;
}

.hero-visual {
  aspect-ratio: 16 / 10;
  width: 100%;
  border: 1px dashed var(--bh-line);
  border-radius: var(--bh-radius);
  background: var(--bh-card);
  position: relative;
  display: grid; place-items: center;
  color: var(--bh-mute);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  overflow: hidden;
}
.hero-visual::before {
  display: none;
}
.hero-visual span { position: relative; z-index: 1; }

/* ---------- Hero: product art (icon + floating data chips) ---------- */
.hero-visual--art {
  border-style: solid;
  display: block;
  padding: 0;
}
.hero-art-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--bh-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--bh-line) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(ellipse at center, black 40%, transparent 78%);
          mask-image: radial-gradient(ellipse at center, black 40%, transparent 78%);
}
.hero-art-icon-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 104px;
  height: 104px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  z-index: 1;
}
.hero-art-icon-wrap svg { width: 56px; height: 56px; position: relative; z-index: 2; }
.hero-chip {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(15, 17, 21, 0.78);
  border: 1px solid var(--bh-line);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--bh-ink);
  white-space: nowrap;
  box-shadow: 0 10px 26px rgba(0,0,0,0.35);
}
.hero-chip .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: none;
}

/* ---------- Hero: full-bleed video variant (home page) ----------
   Video fills the entire hero section as a background; text content
   sits over it via z-index. A gradient overlay darkens the lower
   portion so the section fades cleanly into the next section,
   matching the brilliancydeeptech.com treatment. */
.hero.hero--full {
  position: relative;
  min-height: 72vh;
  padding: 0;
  overflow: hidden;
  display: grid;
  align-items: center;
  background: var(--bh-bg); /* fallback while video loads */
}
.hero--full .hero-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.50;
  z-index: 0;
}
.hero--full .hero-bg-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 70% 25%, var(--bh-brand-glow), transparent 55%),
    radial-gradient(ellipse at 20% 80%, var(--bh-brand-soft), transparent 60%),
    linear-gradient(180deg, rgba(15,17,21,0.35) 0%, rgba(96,67,149,0.45) 55%, var(--bh-bg) 100%);
}
.hero--full .hero-content {
  position: relative;
  z-index: 3;
  padding: 80px 28px 70px;
  width: 100%;
}
.hero--full h1 {
  font-size: 58px;
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.025em;
  max-width: 22ch;
  text-shadow: 0 2px 30px rgba(15, 17, 21, 0.55);
}
.hero--full p.lede {
  max-width: 58ch;
  text-shadow: 0 1px 20px rgba(15, 17, 21, 0.55);
}
.hero--full .eyebrow { color: var(--bh-lavender); }

@media (max-width: 880px) {
  .hero.hero--full { min-height: 60vh; }
  .hero--full h1 { font-size: 36px; }
  .hero--full .hero-content { padding: 60px 24px 50px; }
}

/* ---------- Heartbeat overlay video ----------
   A second video layered on top of the doctor footage in the hero.
   It sits anchored on the right side of the hero and is recolored
   to the Brilliancy brand purple via a two-step filter pipeline
   (desaturate the original red/pink → sepia → hue-rotate into
   the violet range). */
.hero--full .hero-heartbeat-video {
  position: absolute;
  top: 50%;
  right: 0;
  width: 45%;
  height: 70%;
  object-fit: contain;
  z-index: 2;
  opacity: 0.9;
  pointer-events: none;
  transform: translateY(-50%);
  mix-blend-mode: screen;
  /* Recolor pipeline: knock out the original hue, sepia gives a
     warm monotone, then hue-rotate carries everything into the
     brand-purple range. Drop-shadow adds a soft violet glow. */
  filter:
    grayscale(1)
    sepia(1)
    hue-rotate(220deg)
    saturate(3)
    brightness(1.05)
    drop-shadow(0 0 14px var(--bh-brand-glow));
}

@media (max-width: 880px) {
  .hero--full .hero-heartbeat-video {
    width: 70%;
    height: 40%;
  }
}

/* ---------- Contact page ---------- */
.contact-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 48px;
  margin-top: 32px;
  align-items: start;
}
.contact-form {
  display: grid;
  gap: 16px;
  padding: 28px;
  border: 1px solid var(--bh-line);
  background: var(--bh-card);
  border-radius: var(--bh-radius);
}
.contact-form label {
  display: grid;
  gap: 6px;
}
.contact-form label > span {
  color: var(--bh-lavender);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  padding: 12px 14px;
  background: var(--bh-bg);
  color: var(--bh-ink);
  border: 1px solid var(--bh-line);
  border-radius: var(--bh-radius);
  font-family: inherit;
  font-size: 14px;
  line-height: 1.4;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: var(--bh-brand);
  box-shadow: 0 0 0 3px var(--bh-brand-soft);
}
.contact-form textarea {
  resize: vertical;
  min-height: 120px;
}
.contact-form .btn {
  justify-self: start;
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

.contact-aside {
  padding: 28px;
  border: 1px solid var(--bh-line);
  background: var(--bh-card);
  border-radius: var(--bh-radius);
}
.contact-aside h3 { margin-bottom: 16px; }
.contact-list {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
}
.contact-list li {
  display: grid;
  gap: 2px;
  padding: 12px 0;
  border-top: 1px solid var(--bh-line);
}
.contact-list li:first-child { border-top: 0; }
.contact-list b {
  color: var(--bh-lavender);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
}
.contact-list a {
  color: var(--bh-ink);
  font-size: 15px;
}
.contact-meta {
  margin: 0;
  color: var(--bh-mute);
  font-size: 13px;
}

@media (max-width: 880px) {
  .contact-grid { grid-template-columns: 1fr; gap: 24px; }
}

/* ---------- Partnership logo block ----------
   Replaces the dashed placeholder box used elsewhere on the page
   with a clean container that displays the Medivra brand mark. */
.partnership-logo {
  display: grid;
  place-items: center;
  min-height: 220px;
  padding: 24px;
  border-radius: var(--bh-radius);
  background: var(--bh-card);
  border: 1px solid var(--bh-line);
}
.partnership-logo img {
  max-width: 100%;
  max-height: 160px;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* ---------- Partnership 3-column trio ---------- */
.partnership-trio {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 2fr minmax(180px, 1fr);
  gap: 36px;
  align-items: center;
}
.partnership-trio .partnership-copy {
  align-self: center;
  text-align: center;
}
.partnership-trio .partnership-logo {
  min-height: 200px;
}
.bh-logo--xl .bh-logo__main { font-size: 36px; }
.bh-logo--xl .bh-logo__sub  { font-size: 14px; letter-spacing: 0.44em; padding-left: 0.44em; margin-top: 6px; }

@media (max-width: 900px) {
  .partnership-trio {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .partnership-trio .partnership-copy { order: -1; }
}

/* ---------- Hero video variant (legacy / module pages) ----------
   Drops in for the placeholder box. Video is set to low opacity
   and blended with the violet background via mix-blend-mode +
   a soft inner gradient overlay so it reads as ambient motion
   rather than a hard rectangle. */
.hero-visual--video { padding: 0; }
.hero-visual--video::before { display: none; }
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.50;
  mix-blend-mode: screen;
  filter: saturate(1.1);
}
.hero-visual--video::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at center, transparent 35%, var(--bh-bg) 100%),
    linear-gradient(180deg, rgba(15,17,21,0.15), rgba(15,17,21,0.45));
  pointer-events: none;
  z-index: 1;
}

/* ---------- Module grid ---------- */
.module-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  margin-top: 32px;
}
.module-card {
  border: 1px solid var(--bh-line);
  background: var(--bh-card);
  border-radius: var(--bh-radius);
  padding: 26px 26px 22px;
  display: flex; flex-direction: column;
  min-height: 220px;
  position: relative;
  overflow: hidden;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.module-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: 3px;
  background: var(--bh-brand);
  opacity: 0.7;
}
a.module-card:hover {
  border-color: var(--bh-brand);
  background: var(--bh-brand-soft);
  text-decoration: none;
  transform: translateY(-2px);
}
a.module-card:hover::before { opacity: 1; width: 4px; }
.module-card .tag {
  align-self: flex-start;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fff;
  background: var(--bh-brand);
  border: 1px solid var(--bh-brand);
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 14px;
}
.module-card h3 { color: #fff; }
.module-card p { flex: 1; }
.module-card .more {
  font-size: 13px;
  color: var(--bh-electric);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-top: 10px;
}

/* ---------- Feature rows ---------- */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
}
.placeholder-box {
  border: 1px dashed var(--bh-line);
  border-radius: var(--bh-radius);
  background: var(--bh-card);
  min-height: 280px;
  display: grid; place-items: center;
  color: var(--bh-mute);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 24px;
  text-align: center;
}
.feature-list {
  list-style: none; padding: 0; margin: 18px 0 0;
}
.feature-list li {
  padding: 14px 0;
  border-top: 1px solid var(--bh-line);
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  color: var(--bh-ink);
}
.feature-list li:first-child { border-top: 0; }
.feature-list .bullet {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--bh-brand);
  margin-top: 8px;
  box-shadow: 0 0 12px var(--bh-brand-glow);
}

/* ---------- Pressure / feature cards (bulleted-list replacement) ---------- */
.pressure-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 32px;
}
@media (max-width: 640px) {
  .pressure-grid { grid-template-columns: 1fr; }
}
.pressure-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) {
  .pressure-grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .pressure-grid--3 { grid-template-columns: 1fr; }
}
.pressure-card {
  position: relative;
  border: 1px solid rgba(209, 196, 233, 0.22);
  background: rgba(96, 67, 149, 0.16);
  border-radius: var(--bh-radius);
  padding: 26px 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.pressure-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--bh-brand);
  opacity: 0.75;
}
.pressure-card:hover {
  border-color: var(--bh-brand);
  background: var(--bh-brand-soft);
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(0,0,0,0.35), 0 0 0 1px var(--bh-brand);
}
.pressure-card:hover::before { opacity: 1; height: 4px; }
.pressure-card .ico {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--bh-brand-soft); border: 1px solid var(--bh-brand);
  display: grid; place-items: center; flex: none;
  box-shadow: 0 0 14px var(--bh-brand-glow);
}
.pressure-card .ico svg { width: 20px; height: 20px; }
.pressure-card h3 {
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  margin: 0;
  max-width: none;
}
.pressure-card p {
  color: var(--bh-mute);
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
  max-width: none;
}

/* ---------- Stat band ---------- */
.stat-band {
  max-width: 1180px;
  margin: 40px auto 0;
  border-radius: var(--bh-radius);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 50%, var(--bh-brand-soft), transparent 70%),
    linear-gradient(180deg, var(--bh-bg-2), var(--bh-brand) 50%, var(--bh-deep) 100%);
  border: 1px solid var(--bh-brand);
}
@media (max-width: 1180px) {
  .stat-band { margin-left: 28px; margin-right: 28px; }
}
.stat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  padding: 56px 0;
}
.stat-grid .stat .num {
  font-family: "Montserrat", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 44px;
  color: #fff;
  line-height: 1.05;
  letter-spacing: -0.02em;
  text-shadow: 0 0 24px var(--bh-brand-glow);
}
.stat-grid .stat .lbl {
  color: var(--bh-mute);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-family: "Montserrat", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 12px;
  margin-top: 6px;
}

/* ---------- Compliance / partner strip ---------- */
.strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 28px;
}
.strip .chip {
  border: 1px solid var(--bh-brand);
  border-radius: var(--bh-radius);
  padding: 18px;
  text-align: center;
  color: var(--bh-mute);
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--bh-card);
  transition: background .2s ease, transform .2s ease;
}
.strip .chip:hover {
  background: var(--bh-brand-soft);
  transform: translateY(-2px);
}
.strip .chip b {
  color: #fff;
  display: block;
  margin-bottom: 6px;
  letter-spacing: -0.005em;
  text-transform: none;
  font-size: 15px;
  font-weight: 700;
  font-family: "Montserrat", "Inter", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- CTA band ---------- */
.cta-band {
  background:
    radial-gradient(ellipse at 50% 0%, var(--bh-brand-glow), transparent 60%),
    radial-gradient(ellipse at 20% 100%, var(--bh-brand-soft), transparent 55%),
    linear-gradient(180deg, var(--bh-brand) 0%, var(--bh-deep) 60%, var(--bh-bg-2) 100%);
  text-align: center;
  padding: 80px 28px;
  border-top: 1px solid var(--bh-brand);
}
.cta-band h2 {
  max-width: 44ch;
  margin: 0 auto 18px;
  text-wrap: balance;
}
.cta-band p {
  color: var(--bh-mute);
  margin: 0 auto 28px;
  max-width: 60ch;
  text-wrap: pretty;
}

/* ---------- Footer ---------- */
.site-footer {
  background: #08080c;
  padding: 48px 0 32px;
  color: var(--bh-mute);
  font-size: 13px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 36px;
}
.footer-grid h4 {
  color: var(--bh-brand);
  font-size: 13px;
  letter-spacing: 0.12em; text-transform: uppercase;
  margin: 0 0 14px; font-family: "Inter", sans-serif;
}
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li { padding: 4px 0; }
.footer-grid a { color: var(--bh-mute); }
.footer-grid a:hover { color: var(--bh-lavender); }
.footer-meta {
  border-top: 1px solid var(--bh-line);
  margin-top: 36px; padding-top: 18px;
  display: flex; justify-content: space-between;
  font-size: 12px; color: var(--bh-mute);
}

/* ---------- Responsive ---------- */
@media (max-width: 880px) {
  .hero-grid, .split, .stat-grid, .module-grid, .strip, .footer-grid {
    grid-template-columns: 1fr;
  }
  h1 { font-size: 34px; }
  .nav-links { display: none; }
  .bh-logo__main { font-size: 19px; }
  .bh-logo__sub  { font-size: 9px; letter-spacing: 0.38em; padding-left: 0.38em; }
}