/* ── Design Tokens — ZapCover app palette ────────────── */
/*
 * Mirrors src/app/globals.css:
 *   Primary: oklch(0.6231 0.188 259.8145)
 *   Accent:  oklch(0.9514 0.025 236.8242)
 *   Border:  oklch(0.9276 0.0058 264.5313)
 *   Muted:   oklch(0.9846 0.0017 247.8389)
 */
:root {
  --app-primary:        oklch(0.6231 0.188 259.8145);
  --app-primary-hover:  oklch(0.5461 0.2152 262.8809);
  --app-primary-deep:   oklch(0.3791 0.1378 265.5222);
  --app-accent:         oklch(0.9514 0.025 236.8242);
  --app-accent-ink:     oklch(0.3791 0.1378 265.5222);

  --navy:        var(--app-primary);       /* App primary — CTAs, active states */
  --navy-deep:   var(--app-primary-hover); /* App hover blue */
  --blue-accent: var(--app-primary);       /* App primary — brand accent */
  --amber:       #C2850C;                  /* Warm gold — secondary accent */
  --forest:      #1A4D3C;                  /* Deep forest green — CTAs */
  --forest-deep: #123829;                  /* Forest hover */
  --cream:       #FFFFFF;   /* Pure white base */
  --cream-mid:   #F8FAFC;   /* Slate 50 — alt section bg */
  --cream-warm:  #F1F5F9;   /* Slate 100 — deeper section tint */
  --cream-light: #FAFCFF;
  --white:       #F8FAFC;
  --ink:         #0F172A;   /* Slate 900 — headlines */
  --body:        #475569;   /* Slate 600 — body text */
  --muted:       #64748B;   /* Slate 500 — muted text */
  --line:        oklch(0.9276 0.0058 264.5313); /* App border */
  --line-light:  #F1F5F9;   /* Slate 100 — subtle dividers */
  --dark-bg:     var(--app-primary-deep);  /* App deep blue — dark section bg */
  --max-w:       1100px;

  /* ── Radius system — collapsed to 3 values ──────────── */
  --radius-sm:   8px;    /* inputs, small chips, tags */
  --radius-md:   16px;   /* cards, panels */
  --radius-pill: 999px;  /* buttons, badges */
}

/* ── Reset ───────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 17px;
  font-weight: 400;
  color: var(--body);
  min-height: 100vh;
  background-color: var(--cream);
  background-image:
    linear-gradient(rgba(15,23,42,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.025) 1px, transparent 1px);
  background-size: 40px 40px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.7;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ── Fine grid background ────────────────────────────── */
/* Applied via pseudo-element on sections that need it */

/* ── Layout ──────────────────────────────────────────── */
.nav-inner,
.section-inner {
  width: min(var(--max-w), calc(100% - 48px));
  margin: 0 auto;
}

/* ── Typography ──────────────────────────────────────── */
h1, h2, h3, h4 {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--ink);
}

h1 {
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 600;
  line-height: 0.97;
  letter-spacing: -0.04em;
}
h2 {
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  font-weight: 700;
  line-height: 1.04;
  letter-spacing: -0.03em;
}
h3 {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

h1 em, h2 em {
  font-style: italic;
  font-weight: 300;
}

.kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.7rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin-bottom: 20px;
}
.kicker-light { color: rgba(255,255,255,0.72); }

.section-sub {
  font-size: 1.05rem;
  font-weight: 400;
  color: var(--muted);
  max-width: 58ch;
  margin-top: 16px;
  margin-bottom: 56px;
  line-height: 1.7;
}

/* ── Buttons ─────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 26px;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  border: none;
  border-radius: var(--radius-pill);
  cursor: pointer;
  transition: all 150ms ease;
  white-space: nowrap;
}
.btn-primary {
  background: var(--navy);
  color: var(--white);
  border: 1.5px solid var(--navy);
}
.btn-primary:hover { background: var(--navy-deep); border-color: var(--navy-deep); }

.btn-ghost {
  background: transparent;
  color: var(--navy);
  border: 1.5px solid var(--navy);
}
.btn-ghost:hover { background: var(--navy); color: var(--white); }

/* Light buttons for dark sections */
.btn-primary-light {
  background: var(--white);
  color: var(--navy);
  border: 1.5px solid var(--white);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  padding: 14px 26px;
  border-radius: var(--radius-pill);
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  transition: all 150ms ease;
}
.btn-primary-light:hover { background: var(--cream); border-color: var(--cream); }

.btn-full { width: 100%; justify-content: center; }

/* Text link (underlined with arrow) */
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
  margin-top: 24px;
  transition: opacity 130ms;
}
.text-link:hover { opacity: 0.7; }

/* ── NAV ─────────────────────────────────────────────── */
.nav-wrap {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(15,23,42,0.07);
}
.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 58px;
  gap: 24px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ink);
  flex-shrink: 0;
}
.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: var(--radius-sm);
  background: var(--navy);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  letter-spacing: -0.04em;
  flex-shrink: 0;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 32px;
  margin-left: auto;
}
.nav-links a {
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
  transition: color 140ms;
  position: relative;
}
.nav-links a:hover,
.nav-links a.active,
.nav-dropdown:hover .nav-dropdown-trigger { color: var(--blue-accent); }

/* Nav dropdown */
.nav-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.nav-dropdown-trigger {
  cursor: default;
}
.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 6px rgba(15,23,42,0.04), 0 12px 32px rgba(15,23,42,0.10);
  min-width: 168px;
  padding: 6px;
  z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu {
  display: block;
}
.nav-dropdown-menu a {
  display: block;
  padding: 9px 14px;
  border-radius: var(--radius-sm);
  font-size: 0.88rem;
  font-weight: 400;
  color: var(--ink);
  opacity: 0.8;
  white-space: nowrap;
  transition: background 120ms, opacity 120ms;
}
.nav-dropdown-menu a::after { display: none; }
.nav-dropdown-menu a:hover {
  background: rgba(37,99,235,0.05);
  opacity: 1;
}

/* Nav right-side actions */
.nav-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-shrink: 0;
}
.nav-signin {
  display: inline-block !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  color: var(--ink) !important;
  opacity: 0.95 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1 !important;
  padding: 0 0 3px !important;
  border-radius: 0 !important;
  border: none !important;
  position: relative !important;
  transition: opacity 140ms !important;
}
.nav-signin::after { display: none; }
.nav-signin:hover {
  opacity: 1 !important;
  background: transparent !important;
  color: var(--blue-accent) !important;
}
.nav-btn {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--navy) !important;
  color: #fff !important;
  opacity: 1 !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1 !important;
  padding: 9px 18px !important;
  border-radius: var(--radius-pill) !important;
  position: relative !important;
  transition: background 140ms !important;
}
.nav-btn::after { display: none !important; }
.nav-btn:hover {
  background: var(--navy-deep) !important;
  color: #fff !important;
  opacity: 1 !important;
}

/* ── Hero ticker (below hero, above offer section) ───── */
.hero-ticker {
  height: 42px;
  background-color: #fff;
  background-image:
    linear-gradient(rgba(15,23,42,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.025) 1px, transparent 1px);
  background-size: 40px 40px;
  border-top: 1px solid rgba(37,99,235,0.1);
  border-bottom: 1px solid rgba(37,99,235,0.1);
  overflow: hidden;
  position: relative;
}
/* Edge fade masks */
.hero-ticker::before,
.hero-ticker::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 100px;
  z-index: 2;
  pointer-events: none;
}
.hero-ticker::before {
  left: 0;
  background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,0) 100%);
}
.hero-ticker::after {
  right: 0;
  background: linear-gradient(270deg, #fff 0%, rgba(255,255,255,0) 100%);
}
.ticker-track {
  display: flex;
  align-items: center;
  white-space: nowrap;
  height: 100%;
  animation: ticker-scroll 50s linear infinite;
  will-change: transform;
}
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.ticker-track span {
  font-size: 0.66rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(15,23,42,0.5);
  white-space: nowrap;
  padding: 0 22px;
}
.ticker-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(37,99,235,0.8);
  flex-shrink: 0;
  padding: 0 !important;
}

/* ── Nav dropdown ────────────────────────────────────── */
.nav-dropdown {
  position: relative;
}
.nav-dropdown-trigger {
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.nav-dropdown-trigger svg { display: none !important; }
.nav-dropdown-trigger::after {
  content: '';
  width: 6px;
  height: 6px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  transition: transform 160ms ease;
  opacity: 0.65;
}
.nav-dropdown:hover .nav-dropdown-trigger::after {
  transform: rotate(225deg) translateY(-1px);
  opacity: 1;
}
.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 6px rgba(15,23,42,0.04), 0 12px 32px rgba(15,23,42,0.10);
  min-width: 190px;
  padding: 6px;
  z-index: 100;
}
.nav-dropdown-menu::before {
  content: '';
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  height: 10px;
}
.nav-dropdown-menu a {
  display: block;
  padding: 9px 12px;
  border-radius: var(--radius-sm);
  font-size: 0.86rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--body);
  opacity: 1;
  transition: background 120ms, color 120ms;
}
.nav-dropdown-menu a:hover { background: rgba(37,99,235,0.06); color: var(--blue-accent); }
.nav-dropdown-menu .dd-icon { display: none; }
.nav-dropdown.open .nav-dropdown-menu { display: block; }

/* ── HERO ────────────────────────────────────────────── */
.hero-wrap {
  position: relative;
  aspect-ratio: 1649 / 954;
  min-height: 440px;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  background-color: #ffffff;
}
.hero-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0.36) 0%,
      rgba(255,255,255,0.26) 32%,
      rgba(255,255,255,0.10) 54%,
      rgba(255,255,255,0) 76%
    );
}
.hero-bg-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) brightness(1.06) contrast(0.98);
  pointer-events: none;
  user-select: none;
}

.hero-inner { position: relative; z-index: 2; }
.hero-inner {
  width: min(var(--max-w), calc(100% - 48px));
  margin: 0 auto;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  justify-content: flex-start;
  padding-top: 72px;
}

/* Eyebrow with colored square */
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 22px;
}
.eyebrow-square {
  font-size: 0.6rem;
  color: var(--blue-accent);
  line-height: 1;
}

.hero-inner h1 {
  max-width: 820px;
  margin-bottom: 24px;
}
.hero-sub {
  font-size: 0.95rem;
  color: var(--ink);
  line-height: 1.76;
  max-width: 40ch;
  margin-bottom: 40px;
}
.hero-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start;
}
.hero-cta-row .btn-ghost {
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* ── HERO SIDE PANEL ─────────────────────────────────── */
.hero-side-panel {
  position: absolute;
  right: 48px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  z-index: 1;
}
.hero-panel-label {
  font-size: 0.58rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  writing-mode: vertical-lr;
  opacity: 0.5;
}
.hero-panel-line {
  width: 1px;
  height: 80px;
  background: var(--line);
}

/* ── STAT BAR ────────────────────────────────────────── */
.stat-bar-wrap {
  background: var(--cream);
  border-bottom: 1px solid var(--line);
}
.stat-bar {
  width: min(var(--max-w), calc(100% - 48px));
  margin: 0 auto;
  display: flex;
}
.stat-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 20px 24px;
  border-right: 1px solid var(--line);
  position: relative;
}
.stat-item:last-child { border-right: none; }
.stat-item:not(:last-child)::after {
  content: '+';
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translate(50%, -50%);
  font-size: 0.7rem;
  color: var(--line);
  font-weight: 300;
  pointer-events: none;
}
.stat-item strong {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 1.92rem;
  color: var(--blue-accent);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
}
.stat-item span {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.45;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ── Card SVG icon ───────────────────────────────────── */
.card-svg-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  margin-bottom: 4px;
}
.card-svg-icon-light { color: rgba(255,255,255,0.45); }

/* ── Dark section variants ───────────────────────────── */
.section-dark {
  background-color: var(--dark-bg) !important;
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
}
.section-dark h2 { color: var(--white); }
.section-dark .section-sub { color: rgba(255,255,255,0.72); }
.section-dark .kicker { color: rgba(255,255,255,0.72); }

/* Layer stack on dark bg */
.section-dark .layer-stack { border-color: rgba(255,255,255,0.1); }
.section-dark .layer-row {
  background: rgba(255,255,255,0.03);
  border-bottom-color: rgba(255,255,255,0.08);
}
.section-dark .layer-row:hover { background: rgba(255,255,255,0.06); }
.section-dark .layer-num { color: rgba(255,255,255,0.58); }
.section-dark .layer-content strong { color: var(--white); }
.section-dark .layer-content span { color: rgba(255,255,255,0.68); }
.section-dark .layer-companies { color: rgba(255,255,255,0.58); }

/* ── SIGNAL / QUOTE CARD ─────────────────────────────── */
.signal-section {
  position: relative;
  padding: 72px 0;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  background-color: var(--cream);
}
.signal-dark {
  background-color: var(--dark-bg);
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 40px 40px;
  border-bottom-color: rgba(255,255,255,0.08);
}
.signal-dark .signal-label { color: rgba(255,255,255,0.72); }
.signal-dark .signal-quote { color: var(--white); }
.signal-dark .signal-sub { color: rgba(255,255,255,0.72); }
.signal-card {
  max-width: 720px;
  text-align: left;
  border-left: 3px solid rgba(210,155,70,0.5);
  padding-left: 32px;
}
.signal-label {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 18px;
}
.signal-quote {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem);
  color: var(--ink);
  line-height: 1.4;
  margin-bottom: 18px;
}
.signal-sub {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.7;
  max-width: 54ch;
}
.signal-attr {
  font-size: 0.78rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--muted);
  opacity: 0.8;
  margin-top: 16px;
  line-height: 1.5;
}

/* ── SECTION WRAP (shared) ───────────────────────────── */
.section-wrap {
  padding: 96px 0;
  background: var(--cream);
  border-bottom: 1px solid var(--line);
}
/* Gap comparison — slightly darker cream */
#why { background: var(--cream-mid); }
/* How it works — slightly darker cream */
.steps-section { background: var(--cream-mid); }
/* Harper alternating section backgrounds */
.cov-intro-section { background: var(--cream-mid) !important; }
.layers-wrap { background: var(--cream) !important; }
.who-section { background: var(--cream-mid) !important; }
.monitor-section { background: var(--cream) !important; }
.steps-section { background: var(--cream-mid) !important; }
.proof-section { background: var(--cream) !important; }
.faq-section { background: var(--cream-mid) !important; }
.intake-wrap { background: #162535 !important; }
.section-wrap .section-inner > h2,
.section-wrap .section-inner > p.kicker,
.section-wrap .section-inner > p.section-sub {
  text-align: left;
}

/* ── COMPARISON GRID ─────────────────────────────────── */
.compare-label-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: -1px; /* overlap with grid border */
  padding: 0 1px;
}
.compare-label-left,
.compare-label-right {
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  padding-bottom: 10px;
}

.compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid var(--line);
}
.compare-card {
  background: var(--cream-light);
  padding: 32px 28px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 10px;
  align-content: start;
  position: relative;
}
.compare-card:nth-child(2n) { border-right: none; }
.compare-card:nth-child(3),
.compare-card:nth-child(4) { border-bottom: none; }

.compare-card-highlight {
  background: var(--dark-bg);
}
.compare-card-highlight h3 { color: var(--white); }
.compare-card-highlight p { color: rgba(255,255,255,0.6); }

.compare-tag {
  font-size: 0.63rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
}
.compare-tag-light { color: rgba(255,255,255,0.72); }

.this-is-us {
  position: absolute;
  top: -1px;
  right: -1px;
  background: var(--blue-accent);
  color: var(--white);
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 10px;
}

/* ── LAYER STACK ─────────────────────────────────────── */
/* background set by alternating section rule above */
.layer-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.layer-row {
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 24px 28px 24px 24px;
  border-left: 3px solid transparent;
  background: var(--cream);
  position: relative;
  transition: background 140ms, border-left-color 140ms, box-shadow 140ms;
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 8px rgba(15,23,42,0.04), 0 0 0 1px rgba(15,23,42,0.05);
}
.layer-row:hover {
  background: var(--cream-light);
  border-left-color: var(--blue-accent);
  box-shadow: 0 4px 16px rgba(15,23,42,0.08), 0 0 0 1px rgba(15,23,42,0.06);
}

.layer-row-highlight {
  background: var(--dark-bg) !important;
  border-left-color: var(--blue-accent) !important;
  box-shadow: 0 4px 20px rgba(15,23,42,0.18), 0 0 0 1px rgba(15,23,42,0.12) !important;
}
.layer-row-highlight:hover { background: var(--dark-bg) !important; }

.layer-num {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  min-width: 72px;
  flex-shrink: 0;
}
.layer-num-light { color: rgba(255,255,255,0.58); }

.layer-content {
  flex: 1;
  display: flex;
  align-items: baseline;
  gap: 20px;
}
.layer-content strong {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--ink);
  min-width: 200px;
}
.layer-row-highlight .layer-content strong { color: var(--white); }
.layer-content span {
  font-size: 0.85rem;
  color: var(--muted);
}
.layer-row-highlight .layer-content span { color: rgba(255,255,255,0.72); }

.layer-companies {
  font-size: 0.72rem;
  color: var(--muted);
  text-align: right;
  flex-shrink: 0;
}
.layer-companies-light { color: rgba(255,255,255,0.68); }

.this-is-now {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--blue-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  writing-mode: vertical-lr;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--white);
  overflow: hidden;
  width: auto;
  padding: 4px 8px;
}

/* ── COVERAGE ────────────────────────────────────────── */
.coverage-section { background: var(--cream-warm); }
.cov-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--line);
}
.cov-card {
  padding: 32px 28px;
  border-right: 1px solid var(--line);
  border-top: 2px solid transparent;
  display: grid;
  gap: 12px;
  align-content: start;
  background: var(--cream);
  transition: background 150ms, border-top-color 150ms;
  position: relative;
  overflow: visible;
}
.cov-card:last-child { border-right: none; }
.cov-card:hover {
  background: var(--cream-light);
  border-top-color: var(--blue-accent);
}
.cov-card::before,
.cov-card::after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  border-color: var(--blue-accent);
  border-style: solid;
  opacity: 0.3;
  transition: opacity 150ms;
  pointer-events: none;
}
.cov-card::before { top: 10px; left: 10px; border-width: 1.5px 0 0 1.5px; }
.cov-card::after  { bottom: 10px; right: 10px; border-width: 0 1.5px 1.5px 0; }
.cov-card:hover::before,
.cov-card:hover::after { opacity: 0.65; }

.cov-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border: 1px solid var(--blue-accent);
  color: var(--blue-accent);
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  width: fit-content;
}
.cov-card h3 { font-size: 0.98rem; }
.cov-card p {
  font-size: 0.87rem;
  color: var(--muted);
  line-height: 1.68;
}
.cov-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
}
.cov-footer span {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--muted);
  background: var(--cream);
  padding: 3px 8px;
  border: 1px solid var(--line);
}

/* ── TWO-COLUMN SPLIT ────────────────────────────────── */
.split-section {
  background: var(--cream);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.split-inner {
  width: min(var(--max-w), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}
.split-left {
  padding: 72px 48px 72px 40px;
  border-right: 1px solid var(--line);
}
.split-right {
  padding: 72px 40px 72px 48px;
}
.split-left h2,
.split-right h2 {
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  margin-bottom: 18px;
}
.split-left p,
.split-right p {
  font-size: 0.95rem;
  color: var(--muted);
  line-height: 1.72;
  max-width: 44ch;
}

/* Arrow list (↓ prefix, blue) */
.arrow-list {
  display: grid;
  gap: 10px;
  margin-top: 24px;
}
.arrow-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.88rem;
  color: var(--body);
  line-height: 1.55;
}
.arrow-list li::before {
  content: "↓";
  font-size: 0.78rem;
  color: var(--blue-accent);
  flex-shrink: 0;
  margin-top: 1px;
  font-family: monospace;
}

/* Dark split section */
.split-section-dark {
  background: var(--dark-bg);
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 40px 40px;
}
.split-section-dark .split-inner { border-color: rgba(255,255,255,0.08); }
.split-section-dark .split-left { border-right-color: rgba(255,255,255,0.08); border-bottom-color: rgba(255,255,255,0.08); }
.split-section-dark h2 { color: var(--white); }
.split-section-dark p { color: rgba(255,255,255,0.72); }

.arrow-list-light li { color: rgba(255,255,255,0.7); }
.arrow-list-light li::before { color: rgba(255,255,255,0.3); }

.text-link-light {
  color: rgba(255,255,255,0.72);
  text-decoration-color: rgba(255,255,255,0.2);
}
.text-link-light:hover { color: var(--white); opacity: 1; }

/* Dark proof cards */
.proof-card-dark {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.proof-card-dark:hover { background: rgba(255,255,255,0.07) !important; }
.proof-card-dark p { color: rgba(255,255,255,0.8) !important; font-style: italic; }
.proof-card-dark .proof-attr { border-top-color: rgba(255,255,255,0.08); }
.proof-card-dark strong { color: var(--white) !important; }
.proof-card-dark span { color: rgba(255,255,255,0.68) !important; }
.proof-card-dark .avatar { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.78); }
.proof-note-dark { color: rgba(255,255,255,0.62) !important; }

/* ── STEPS ───────────────────────────────────────────── */
.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid var(--line);
}
.step-card {
  padding: 32px 24px;
  border-right: 1px solid var(--line);
  border-top: 2px solid transparent;
  display: grid;
  gap: 12px;
  align-content: start;
  background: var(--cream-light);
  transition: background 150ms, border-top-color 150ms;
}
.step-card:last-child { border-right: none; }
.step-card:hover {
  background: var(--white);
  border-top-color: var(--blue-accent);
}

.step-num {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--muted);
  display: block;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.step-card h3 { font-size: 0.96rem; }
.step-card p {
  font-size: 0.86rem;
  color: var(--muted);
  line-height: 1.65;
}

/* ── TIMELINE ────────────────────────────────────────── */
.timeline-wrap {
  position: relative;
  margin-top: 56px;
}
.timeline-line-wrap {
  position: absolute;
  top: 28px;
  left: 0;
  right: 0;
  pointer-events: none;
  z-index: 0;
}
.timeline-line-svg {
  width: 100%;
  height: 60px;
  overflow: visible;
}
.timeline-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  position: relative;
  z-index: 1;
}
.timeline-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 12px;
}
.tl-node {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1.5px solid var(--line);
  background: var(--cream);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  position: relative;
  z-index: 2;
}
.tl-node-active {
  border-color: var(--navy);
  background: var(--navy);
}
.tl-node-active .tl-num { color: #fff; }
.tl-node-highlight {
  border-color: var(--blue-accent);
  background: rgba(37,99,235,0.08);
}
.tl-node-highlight .tl-num { color: var(--blue-accent); }
.tl-node-loop {
  border-color: var(--blue-accent);
  color: var(--blue-accent);
  background: rgba(37,99,235,0.05);
}
.tl-num {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.tl-label {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.58rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.6;
  margin-bottom: 8px;
}
.tl-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 8px;
  line-height: 1.3;
}
.tl-node-highlight ~ .tl-label { opacity: 0.8; }
.tl-node-highlight ~ .tl-title { color: var(--blue-accent); }
.tl-body {
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.6;
}
.timeline-loop-label {
  text-align: center;
  margin-top: 20px;
}
.timeline-loop-label span {
  font-size: 0.65rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.5;
}

@media (max-width: 860px) {
  .timeline-steps { grid-template-columns: 1fr 1fr; gap: 32px; }
  .timeline-line-wrap { display: none; }
}
@media (max-width: 480px) {
  .timeline-steps { grid-template-columns: 1fr; }
}

/* ── PROOF ───────────────────────────────────────────── */
.proof-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.proof-card {
  padding: 32px 28px;
  display: grid;
  gap: 16px;
  align-content: start;
  background: var(--cream);
  transition: background 150ms, transform 150ms, box-shadow 150ms;
  position: relative;
  overflow: visible;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 16px rgba(15,23,42,0.06), 0 0 0 1px rgba(15,23,42,0.05);
}
.proof-card:hover {
  background: var(--cream);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(15,23,42,0.10), 0 0 0 1px rgba(15,23,42,0.06);
}

.stars {
  color: #9A8250;
  font-size: 0.9rem;
  letter-spacing: 2px;
}
.proof-card p {
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--body);
}
.proof-attr {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.avatar {
  width: 32px;
  height: 32px;
  background: var(--navy);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  font-weight: 700;
  flex-shrink: 0;
}
.proof-attr strong {
  display: block;
  font-size: 0.82rem;
  color: var(--ink);
  font-weight: 600;
}
.proof-attr span { font-size: 0.74rem; color: var(--muted); }

/* Category cards */
.proof-cat-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.07);
  display: flex;
  align-items: center;
  justify-content: center;
}
.proof-cat-title {
  display: block;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
  letter-spacing: -0.01em;
}
.proof-cat-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid var(--line-light);
}
.proof-cat-tags span {
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--muted);
  background: var(--cream-mid);
  padding: 3px 8px;
  border-radius: var(--radius-sm);
}
.proof-note {
  margin-top: 20px;
  font-size: 0.74rem;
  color: var(--muted);
  font-style: italic;
}

/* ── FAQ ─────────────────────────────────────────────── */
/* background set by alternating section rule above */

.faq-grid {
  margin-top: 48px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.faq-item {
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 6px rgba(15,23,42,0.04), 0 0 0 1px rgba(15,23,42,0.05);
  background: var(--cream);
  overflow: hidden;
}

.faq-q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--ink);
  text-align: left;
  line-height: 1.45;
}

.faq-q:hover { color: var(--blue-accent); }

.faq-chevron {
  flex-shrink: 0;
  color: var(--muted);
  transition: transform 0.22s ease;
}

.faq-item.faq-open .faq-chevron {
  transform: rotate(180deg);
}

.faq-item.faq-open .faq-q { color: var(--blue-accent); }

.faq-a {
  display: none;
  padding: 0 24px 24px;
  font-size: 0.88rem;
  color: var(--body);
  line-height: 1.7;
  max-width: 720px;
}

.faq-item.faq-open .faq-a { display: block; }

/* ── DARK CTA BAND ───────────────────────────────────── */
.dark-cta-band {
  padding: 112px 0;
  position: relative;
  overflow: hidden;
  background-color: var(--dark-bg);
  background-image:
    radial-gradient(ellipse 800px 600px at 0% 50%, rgba(37,99,235,0.35) 0%, transparent 60%),
    radial-gradient(ellipse 600px 500px at 100% 20%, rgba(108,99,255,0.20) 0%, transparent 55%),
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: auto, auto, 40px 40px, 40px 40px;
}
.dark-cta-band .section-inner { position: relative; z-index: 1; }
.dark-headline {
  color: var(--white);
  font-size: clamp(2.8rem, 6vw, 5rem);
  margin-bottom: 22px;
  max-width: 600px;
}
.dark-sub {
  font-size: 1rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.72;
  max-width: 48ch;
  margin-bottom: 36px;
}

/* ── INTAKE ──────────────────────────────────────────── */
.intake-wrap {
  background: #162535;
  padding: 96px 0;
}
.intake-inner {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 80px;
  align-items: start;
}

/* Left column — white text on dark */
.intake-text .kicker { color: rgba(147,168,255,0.8); }
.intake-text h2 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  margin-bottom: 16px;
  color: #fff;
}
.intake-text > p {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.72;
  margin-bottom: 28px;
}
.trust-list { display: grid; gap: 10px; }
.trust-list li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 0.86rem;
  color: rgba(255,255,255,0.68);
  line-height: 1.5;
}
.trust-list li::before {
  content: "→";
  font-family: monospace;
  color: rgba(37,99,235,0.8);
  flex-shrink: 0;
}

/* Form — sits directly on dark bg, no card */
.intake-form {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  display: grid;
  gap: 18px;
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.form-field { display: grid; gap: 8px; }
.form-field label,
.field-label {
  font-size: 0.88rem;
  font-weight: 500;
  letter-spacing: 0;
  color: rgba(255,255,255,0.85);
  text-transform: none;
}
.field-label { margin: 0; }

/* Pill text/email/tel inputs */
.intake-form input[type="text"],
.intake-form input[type="email"],
.intake-form input[type="tel"] {
  width: 100%;
  height: 54px;
  padding: 0 22px;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.95rem;
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--radius-md);
  outline: none;
  transition: background 130ms, border-color 130ms;
  -webkit-appearance: none;
  appearance: none;
}
.intake-form input[type="text"]:focus,
.intake-form input[type="email"]:focus,
.intake-form input[type="tel"]:focus {
  background: rgba(255,255,255,0.13);
  border-color: rgba(37,99,235,0.55);
}
.intake-form input.invalid {
  border-color: rgba(239,68,68,0.7) !important;
}
.intake-form input::placeholder {
  color: rgba(255,255,255,0.28);
}

/* Pill select wrapper */
.harper-select {
  position: relative;
}
.harper-select select {
  width: 100%;
  height: 54px;
  padding: 0 44px 0 22px;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.95rem;
  color: rgba(255,255,255,0.75);
  background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--radius-md);
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background 130ms, border-color 130ms;
}
.harper-select select:focus {
  background: rgba(255,255,255,0.13);
  border-color: rgba(37,99,235,0.55);
}
.harper-select select.invalid {
  border-color: rgba(239,68,68,0.7) !important;
}
.harper-select select option {
  background: #1e3448;
  color: #fff;
}
.harper-chevron {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,0.45);
  pointer-events: none;
}

/* Business description with search icon */
.harper-input-icon {
  position: relative;
}
.harper-input-icon input {
  padding-right: 50px !important;
}
.harper-search {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,0.3);
  pointer-events: none;
}

/* Consent row */
.consent-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
}
.consent-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 3px;
  accent-color: var(--blue-accent);
  background: transparent;
  border: 1px solid rgba(255,255,255,0.3);
  padding: 0;
  border-radius: var(--radius-sm);
}
.consent-row span {
  font-size: 0.74rem;
  color: rgba(255,255,255,0.68);
  line-height: 1.6;
}

/* Submit button */
.harper-submit {
  width: 100%;
  height: 54px;
  border-radius: var(--radius-md);
  background: var(--blue-accent);
  color: #fff;
  border: none;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 160ms, transform 120ms;
  -webkit-appearance: none;
}
.harper-submit:hover {
  background: #1d4ed8;
  transform: translateY(-1px);
}
.harper-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* Form note */
.form-note {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.3);
  line-height: 1.6;
  text-align: center;
}
.form-note[data-success="true"] {
  background: rgba(34,197,94,0.1);
  border: 1px solid rgba(34,197,94,0.25);
  color: #4ade80;
  font-weight: 600;
  padding: 14px 18px;
  text-align: left;
  border-radius: var(--radius-md);
}

/* Field errors */
.req { color: rgba(239,68,68,0.8); }
.field-error {
  font-size: 0.74rem;
  color: rgba(239,68,68,0.85);
  display: none;
  margin-top: 2px;
  padding-left: 4px;
}

.check-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.check-opt {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid var(--line);
  background: var(--cream);
  cursor: pointer;
  font-size: 0.84rem;
  font-weight: 500;
  color: var(--body);
  transition: border-color 120ms, background 120ms;
}
.check-opt:hover { border-color: var(--navy); background: var(--white); }
.check-opt input[type="checkbox"] {
  width: 14px; height: 14px;
  padding: 0; flex-shrink: 0;
  accent-color: var(--navy);
  border-radius: 0;
}
.form-note {
  font-size: 0.76rem;
  color: var(--muted);
  line-height: 1.6;
  text-align: center;
}
.form-note[data-success="true"] {
  background: rgba(34,197,94,0.07);
  border: 1px solid rgba(34,197,94,0.2);
  color: #16653A;
  font-weight: 600;
  padding: 14px 18px;
  text-align: left;
}

/* ── Intake form extras ──────────────────────────────── */
.req { color: #c0392b; }
.field-hint {
  font-size: 0.72rem;
  font-weight: 400;
  color: var(--muted);
  margin-left: 6px;
  letter-spacing: 0;
  text-transform: none;
}
.field-hint-block {
  font-size: 0.76rem;
  color: var(--muted);
  line-height: 1.55;
  margin-top: 5px;
}
.field-error {
  font-size: 0.74rem;
  color: #c0392b;
  display: none;
  margin-top: 2px;
}
.intake-form input.invalid,
.intake-form select.invalid,
.intake-form textarea.invalid {
  border-color: #c0392b !important;
}

/* Type / revenue radio pill row */
.intake-type-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.type-opt { cursor: pointer; }
.type-opt input[type="radio"] { display: none; }
.type-opt-inner {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--muted);
  background: var(--cream-mid);
  transition: border-color 140ms, color 140ms, background 140ms;
  white-space: nowrap;
}
.type-opt input:checked + .type-opt-inner {
  border-color: var(--navy);
  color: var(--navy);
  background: rgba(15,23,42,0.04);
  font-weight: 600;
}
.type-opt:hover .type-opt-inner { border-color: var(--muted); color: var(--ink); }

/* AI use-case checkbox grid */
.ai-uses-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 4px;
}
.ai-uses-grid .check-opt {
  border-radius: var(--radius-sm);
  padding: 10px 13px;
  gap: 10px;
  align-items: center;
}
/* Hide native checkbox, replace with custom box */
.ai-uses-grid .check-opt input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 17px;
  height: 17px;
  min-width: 17px;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  cursor: pointer;
  position: relative;
  transition: border-color 120ms, background 120ms;
}
.ai-uses-grid .check-opt input[type="checkbox"]:checked {
  background: var(--navy);
  border-color: var(--navy);
}
.ai-uses-grid .check-opt input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}
.ai-uses-grid .check-opt:has(input:checked) {
  border-color: var(--navy);
  background: rgba(15,23,42,0.04);
  color: var(--ink);
  font-weight: 600;
}

/* Multi-select dropdown */
.multi-select-wrap { position: relative; }
.multi-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--cream-mid);
  font-size: 0.88rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
  transition: border-color 140ms;
}
.multi-select-trigger:focus { outline: none; border-color: var(--blue-accent); }
.multi-select-trigger.has-value { color: var(--ink); }
.multi-select-trigger.open { border-color: var(--blue-accent); }
.multi-select-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: 0 8px 24px rgba(15,23,42,0.1);
  z-index: 50;
  max-height: 260px;
  overflow-y: auto;
  padding: 6px 0;
}
.multi-select-wrap.open .multi-select-dropdown { display: block; }
.ms-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  font-size: 0.86rem;
  color: var(--body);
  cursor: pointer;
  transition: background 100ms;
}
.ms-opt:hover { background: var(--cream-mid); }
.ms-opt input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--navy);
  flex-shrink: 0;
  cursor: pointer;
}
.ms-opt input:checked + span { color: var(--ink); font-weight: 500; }

/* ── FOOTER ──────────────────────────────────────────── */
.footer-wrap {
  background: var(--cream);
  border-top: 1px solid var(--line);
}
.footer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 28px 0 18px;
  text-align: center;
}
.footer-link-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  color: var(--ink);
  font-size: 0.86rem;
  line-height: 1.5;
}
.footer-link-row span:first-child {
  font-weight: 500;
}
.footer-link-row a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color 120ms;
}
.footer-link-row a:hover {
  color: var(--blue-accent);
}
.footer-bottom {
  border-top: 1px solid var(--line-light);
}
.footer-bottom-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px 0 24px;
  text-align: center;
}
.footer-legal {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.55;
  max-width: 72ch;
  margin: 0;
}
.footer-copy {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
}

/* ── Article / guide CTA cards ───────────────────────── */
.article-body .cta-box,
.guide-body .cta-box {
  background:
    linear-gradient(90deg, #06142D 0%, rgba(6,20,45,0.97) 40%, rgba(6,20,45,0.68) 68%, rgba(6,20,45,0.28) 100%),
    #06142D url('/assets/heroes/blog-guide-card-dark.png') right center / auto 155% no-repeat !important;
  color: #fff !important;
  padding: 40px 44px !important;
  margin: 48px 0 0 !important;
  border-radius: var(--radius-sm) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 18px 42px rgba(15,23,42,0.16) !important;
}
.article-body .cta-box h2,
.guide-body .cta-box h2 {
  color: #fff !important;
  font-size: clamp(1.65rem, 2.4vw, 2rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 14px !important;
  max-width: 18ch !important;
}
.article-body .cta-box p,
.guide-body .cta-box p {
  color: rgba(255,255,255,0.72) !important;
  font-size: 0.98rem !important;
  line-height: 1.68 !important;
  margin: 0 0 24px !important;
  max-width: 62ch !important;
}
.article-body .cta-box .btn-primary-light,
.guide-body .cta-box .btn-primary-light {
  min-height: 44px !important;
  padding: 0 24px !important;
  border-radius: var(--radius-pill) !important;
  background: #fff !important;
  border-color: #fff !important;
  color: var(--app-primary) !important;
  font-size: 0.74rem !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

@media (max-width: 640px) {
  .article-body .cta-box,
  .guide-body .cta-box {
    background:
      linear-gradient(90deg, #06142D 0%, rgba(6,20,45,0.98) 64%, rgba(6,20,45,0.78) 100%),
      #06142D url('/assets/heroes/blog-guide-card-dark.png') 72% center / auto 140% no-repeat !important;
    padding: 28px 24px !important;
    margin-top: 40px !important;
  }
  .article-body .cta-box h2,
  .guide-body .cta-box h2 {
    font-size: 1.45rem !important;
  }
  .article-body .cta-box .btn-primary-light,
  .guide-body .cta-box .btn-primary-light {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ── DECORATIVE SVG ELEMENTS ─────────────────────────── */
.deco {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}
/* Hero blobs + accents */
.hero-wrap { position: relative; overflow: hidden; }
.deco-hero-blob-l {
  width: 600px; height: 600px;
  top: -120px; left: -140px;
  opacity: 1;
}
.deco-hero-blob-r {
  width: 480px; height: 480px;
  top: -60px; right: -100px;
  opacity: 1;
}
.deco-hero-dots {
  width: 340px; height: 340px;
  top: 20px; right: 40px;
  opacity: 0.6;
}

/* Quote mark */
.signal-section { position: relative; overflow: hidden; }
.deco-quote-mark {
  width: 160px; height: 120px;
  top: -10px; left: -10px;
  opacity: 1;
}

/* Coverage diagonal lines */
.coverage-section { position: relative; overflow: hidden; }
.deco-cov-lines {
  width: 360px; height: 360px;
  bottom: 0; right: 0;
  opacity: 0.6;
}

/* Split section dots + arc */
.split-section { position: relative; overflow: hidden; }
.deco-split-dots {
  width: 320px; height: 400px;
  top: 50%; left: -20px;
  transform: translateY(-50%);
  opacity: 0.5;
}
.deco-split-arc {
  width: 500px; height: 250px;
  bottom: -60px; right: -60px;
  opacity: 1;
}

/* Steps connector line */
.steps-section { position: relative; overflow: hidden; }
.deco-steps-line {
  width: 100%; height: 20px;
  top: 258px; left: 0;
  opacity: 1;
}

/* Intake blob */
.intake-wrap { position: relative; overflow: hidden; }
.deco-intake-blob {
  width: 500px; height: 400px;
  top: 50%; right: -80px;
  transform: translateY(-50%);
  opacity: 1;
}

/* ── Hero geometric decorations ─────────────────────── */
.deco-hero-bracket {
  position: absolute;
  top: 48px;
  right: 48px;
  width: 120px;
  height: 120px;
  pointer-events: none;
  z-index: 0;
}

.deco-hero-diag {
  position: absolute;
  bottom: 64px;
  left: 0;
  width: 200px;
  height: 120px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.6;
}

/* Section dividers — removed; spacing handled by section padding */
.section-divider { display: none; }

/* CTA band decorative elements */
.deco-cta-lines {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 300px;
  height: 200px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.12;
}

.deco-cta-target {
  position: absolute;
  top: 32px;
  right: 80px;
  width: 100px;
  height: 100px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.15;
}

/* ── RESPONSIVE ──────────────────────────────────────── */
@media (max-width: 1024px) {
  .intake-inner { grid-template-columns: 1fr; gap: 40px; }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
  .layer-content { flex-direction: column; gap: 4px; }
  .split-inner { grid-template-columns: 1fr; }
  .split-left { border-right: none; border-bottom: 1px solid var(--line); padding: 56px 32px; }
  .split-right { padding: 56px 32px; }
}

@media (max-width: 768px) {
  h1 { font-size: 2.35rem; }
  h2 { font-size: 2rem; }
  .hero-wrap {
    aspect-ratio: auto;
    min-height: 680px;
    padding: 0;
  }
  .hero-wrap::after {
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0.94) 0%,
      rgba(255,255,255,0.88) 43%,
      rgba(255,255,255,0.28) 62%,
      rgba(255,255,255,0) 100%
    );
  }
  .hero-bg-image {
    height: 50%;
    top: auto;
    bottom: 0;
    object-position: 68% 100%;
  }
  .hero-inner {
    min-height: auto;
    height: auto;
    padding-top: 78px;
    padding-bottom: 32px;
  }
  .hero-inner h1 {
    max-width: 11ch;
    margin-bottom: 18px;
  }
  .hero-sub {
    max-width: 32ch;
    margin-bottom: 24px;
    line-height: 1.55;
  }
  .hero-cta-row {
    width: 100%;
    gap: 10px;
  }
  .hero-cta-row .btn {
    width: 100%;
    min-height: 48px;
    white-space: normal;
    text-align: center;
  }
  .hero-ticker {
    height: auto;
    min-height: 42px;
  }
  .section-wrap,
  .split-section,
  .intake-wrap,
  .dark-cta-band { padding: 64px 0; }
  .nav-inner { height: 54px; }
  .nav-links a:not(.nav-btn) { display: none; }
  .cov-grid { grid-template-columns: repeat(2, 1fr); }
  .cov-card { border-bottom: 1px solid var(--line); }
  .cov-card:nth-child(odd) { border-right: 1px solid var(--line); }
  .cov-card:nth-child(even) { border-right: none; }
  .cov-card:last-child { border-bottom: none; }
  .proof-grid { grid-template-columns: repeat(2, 1fr); }
  .steps-grid { grid-template-columns: 1fr; }
  .step-card { border-right: none; border-bottom: 1px solid var(--line); }
  .step-card:last-child { border-bottom: none; }
  .compare-grid { grid-template-columns: 1fr; }
  .compare-card { border-right: none; }
  .form-row { grid-template-columns: 1fr; }
  .check-grid { grid-template-columns: 1fr; }
  .intake-form { padding: 24px 20px; }
  .stat-bar { flex-direction: column; }
  .stat-item { border-right: none; border-bottom: 1px solid var(--line); }
  .stat-item:last-child { border-bottom: none; }
  .footer-link-row { gap: 12px 16px; }
  .hero-cta-row { flex-direction: column; align-items: flex-start; }
  .layer-content { flex-direction: column; gap: 4px; }
  .layer-companies { display: none; }
  .who-grid { grid-template-columns: 1fr; }
}

/* ── CONTINUOUS MONITORING ───────────────────────────── */
/* background set by alternating section rule above */

.framework-bar {
  text-align: center;
  margin-bottom: 64px;
}
.framework-bar-label {
  display: block;
  font-size: 0.65rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 24px;
}
.framework-logos {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}
.framework-badge {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: var(--cream);
  border-radius: var(--radius-md);
  box-shadow: 0 1px 8px rgba(15,23,42,0.05), 0 0 0 1px rgba(15,23,42,0.05);
  padding: 16px 24px;
  min-width: 120px;
}
.framework-badge strong {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--ink);
}
.framework-badge span {
  font-size: 0.62rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: 2px;
}

.monitor-hero-row {
  display: grid;
  grid-template-columns: minmax(0, 280px) 1fr;
  gap: 64px;
  align-items: start;
  margin-bottom: 56px;
}
.monitor-score-label {
  font-size: 0.62rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 20px;
}
.score-square { font-size: 0.5rem; color: var(--navy); }
.monitor-score-ring {
  position: relative;
  width: 120px;
  margin-bottom: 16px;
}
.score-value {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.score-value span {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1;
}
.score-value em {
  font-style: normal;
  font-size: 0.7rem;
  color: var(--muted);
  margin-top: 2px;
}
.monitor-score-desc {
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.6;
  max-width: 200px;
}
.monitor-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 32px;
}
.monitor-stat {
  background: var(--cream);
  border-radius: var(--radius-sm);
  box-shadow: 0 2px 12px rgba(15,23,42,0.06), 0 0 0 1px rgba(15,23,42,0.05);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
}
.monitor-stat strong {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1;
  margin-bottom: 6px;
  letter-spacing: -0.02em;
}
.mstat-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 2px;
}
.mstat-sub {
  font-size: 0.72rem;
  color: var(--muted);
  line-height: 1.4;
}

/* Accordion */
.monitor-accordion {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.macc-item {
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 6px rgba(15,23,42,0.04), 0 0 0 1px rgba(15,23,42,0.05);
  background: var(--cream);
  overflow: hidden;
}
.macc-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 24px;
  cursor: pointer;
  user-select: none;
}
.macc-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-accent);
  flex-shrink: 0;
  background: var(--cream-warm);
}
.macc-title-group {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.macc-title {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: var(--ink);
}
.macc-tagline {
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.4;
}
.macc-chevron {
  color: var(--muted);
  transition: transform 200ms;
  flex-shrink: 0;
}
.macc-open .macc-chevron { transform: rotate(180deg); }
.macc-body {
  display: none;
  padding: 0 24px 24px 74px;
}
.macc-open .macc-body { display: block; }
.macc-body > p {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 16px;
}
.macc-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.macc-list li {
  font-size: 0.875rem;
  color: var(--body);
  padding-left: 18px;
  position: relative;
  line-height: 1.5;
}
.macc-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--blue-accent);
  font-size: 1rem;
  line-height: 1.4;
}
.macc-sub-label {
  font-size: 0.6rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.6;
}

@media (max-width: 768px) {
  .monitor-hero-row { grid-template-columns: 1fr; gap: 40px; }
  .monitor-stats-grid { grid-template-columns: 1fr 1fr; }
  .framework-logos { gap: 10px; }
  .framework-badge { min-width: 100px; padding: 12px 16px; }
  .macc-body { padding-left: 24px; }
}

/* ── WHO WE COVER ────────────────────────────────────── */
/* background set by alternating section rule above */
.who-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.who-col {
  padding: 0;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 16px rgba(15,23,42,0.05), 0 0 0 1px rgba(15,23,42,0.05);
  display: flex;
  flex-direction: column;
  background: var(--cream);
  overflow: hidden;
}
.who-col-mid { background: var(--cream); }
.who-header {
  background: var(--navy);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-align: center;
  padding: 14px 20px;
}
.who-col-mid .who-header { background: var(--navy-deep); }
.who-type {
  font-size: 0.95rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  color: var(--ink);
  text-align: center;
  padding: 24px 28px 0;
}
.who-icon {
  display: flex;
  justify-content: center;
  padding: 20px 28px;
  color: var(--blue-accent);
  opacity: 0.6;
}
.who-risk-label {
  font-size: 0.7rem;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 20px 28px 10px;
  border-top: 1px solid var(--line);
}
.who-risk-body {
  padding: 0 28px 32px;
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--body);
  flex: 1;
}
.who-list {
  list-style: none;
  margin-top: 10px;
  padding: 0;
}
.who-list li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 4px;
  font-size: 0.85rem;
  color: var(--body);
}
.who-list li::before {
  content: "–";
  position: absolute;
  left: 0;
  color: var(--muted);
}

/* ══════════════════════════════════════════════════════════
   HEDGE-INSPIRED SYSTEM
   Original colour scheme kept. Zero gradients.
   ══════════════════════════════════════════════════════════ */

/* ── Grid overlay vars ────────────────────────────────── */
:root {
  --line-grid: rgba(15,23,42,0.018); /* very reduced — half of Hedge's 0.045 */
}

/* ── 1. Fixed 12-column structural grid ───────────────── */
.gridlines {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 10;
  display: flex;
  justify-content: center;
}
.gridlines > div {
  max-width: calc(var(--max-w) + 48px);
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  padding: 0 24px;
}
.gridlines span { border-right: 1px solid var(--line-grid); }
.gridlines span:first-child { border-left: 1px solid var(--line-grid); }

/* ── 2. Hero ─ unchanged from hosted version ──────────── */

/* ── 3. Buttons ─ pill shape, solid, no gradients ─────── */
.btn,
.btn-ghost,
.btn-primary-light {
  border-radius: var(--radius-pill) !important;
  transition: background 0.18s, color 0.18s, border-color 0.18s !important;
  box-shadow: none !important;
}
.btn-primary {
  background: var(--navy) !important;
  border-color: var(--navy) !important;
}
.btn-primary:hover {
  background: var(--navy-deep) !important;
  border-color: var(--navy-deep) !important;
}
.btn-ghost:hover {
  background: var(--navy) !important;
  color: var(--white) !important;
  border-color: var(--navy) !important;
}
/* ── 4. Nav ─ shrink + hide on scroll ─────────────────── */
.nav-wrap {
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1), background 0.3s;
  will-change: transform;
}
.nav-wrap.nav-scrolled { background: rgba(255,255,255,0.95); }
.nav-wrap.nav-hidden   { transform: translateY(-100%); }
.nav-inner             { transition: height 0.3s ease; }
.nav-wrap.nav-scrolled .nav-inner { height: 56px; }

/* ── 5. Section spacing ─ generous ────────────────────── */
.section-wrap { padding: 112px 0 !important; }
@media (max-width: 768px) {
  .section-wrap { padding: 64px 0 !important; }
}

/* ── 6. Cards ─ rounded, shadow-based depth (Harper style) */
.compare-card:not(.compare-card-highlight) {
  transition: background 0.18s;
}
.compare-card:not(.compare-card-highlight):hover {
  background: var(--cream-warm);
  transform: none;
  box-shadow: none;
}
.proof-card { transition: background 0.18s, transform 0.18s, box-shadow 0.18s; }

.framework-badge { transition: background 0.18s, border-color 0.18s; }
.framework-badge:hover { background: var(--cream-warm); border-color: rgba(15,23,42,0.2); transform: none; }

.monitor-stat { transition: background 0.18s, box-shadow 0.18s; }
.monitor-stat:hover { background: var(--cream-light); transform: none; }

.who-col { transition: background 0.18s, box-shadow 0.18s; }

/* Layer rows */
.layer-row { border-left-width: 2px; transition: border-left-color 0.18s, background 0.18s; }
.layer-row:hover { border-left-color: var(--blue-accent); }

/* Timeline */
.tl-node {
  transition: background 0.18s, border-color 0.18s, box-shadow 0.18s;
  box-shadow: 0 1px 8px rgba(15,23,42,0.06);
}
.tl-node:hover { border-color: var(--navy); background: var(--cream-warm); transform: none; }
.tl-node-active {
  border-color: var(--navy);
  background: var(--navy);
  box-shadow: 0 2px 12px rgba(15,23,42,0.2);
}
.tl-node-highlight {
  box-shadow: 0 2px 12px rgba(37,99,235,0.15), 0 0 0 3px rgba(15,23,42,0.08);
}

/* ── 7. Dark CTA band ─ clean, no gradients ───────────── */
.dark-cta-band {
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px) !important;
  background-size: 48px 48px !important;
}

/* ── 8. Trust bar ─────────────────────────────────────── */
.trust-bar-wrap {
  background: var(--cream-mid);
  border-bottom: 1px solid var(--line);
}
.trust-bar {
  width: min(var(--max-w), calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 16px 0;
}
.trust-bar-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}
.trust-bar-item svg { flex-shrink: 0; color: var(--blue-accent); }

/* ── 9. Coverage intro section ────────────────────────── */
/* background set by alternating section rule above */
.cov-intro-headline { max-width: 680px; }
.cov-illo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 56px;
}
.cov-illo-card {
  background: var(--cream);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 20px rgba(15,23,42,0.06), 0 0 0 1px rgba(15,23,42,0.05);
  transition: background 0.18s, transform 0.18s, box-shadow 0.18s;
}
.cov-illo-card:hover {
  background: var(--cream-light);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(15,23,42,0.09), 0 0 0 1px rgba(15,23,42,0.06);
}
.cov-illo-art {
  width: 100%;
  aspect-ratio: 4/3;
  background: var(--cream-mid);
  border: 1px solid var(--line-light);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}
.cov-illo-art svg { width: 100%; height: 100%; }
.cov-illo-tag {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blue-accent);
}
.cov-illo-card h3 { font-size: 1.05rem; font-weight: 600; color: var(--ink); line-height: 1.35; letter-spacing: -0.01em; }
.cov-illo-card p  { font-size: 0.88rem; color: var(--body); line-height: 1.6; }

@media (max-width: 960px) {
  .cov-illo-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .cov-illo-grid { grid-template-columns: 1fr; }
}

/* ── 10. Score ring reveal ────────────────────────────── */
@keyframes scoreReveal {
  from { stroke-dashoffset: 283; }
  to   { stroke-dashoffset: 37;  }
}
.monitor-score-ring svg circle:nth-child(2) {
  animation: scoreReveal 1.4s cubic-bezier(0.4,0,0.2,1) 0.4s both;
}

/* ── 11. Scroll reveal ────────────────────────────────── */
.fade-up {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.fade-up.is-visible { opacity: 1; transform: translateY(0); }
.fade-delay-1 { transition-delay: 0.08s !important; }
.fade-delay-2 { transition-delay: 0.16s !important; }
.fade-delay-3 { transition-delay: 0.24s !important; }

/* ── 12. Hero mobile fixes ────────────────────────────── */
@media (max-width: 860px) {
  /* Hide the vertical side panel early — too compressed at tablet widths */
  .hero-side-panel { display: none; }
}

@media (max-width: 860px) {
  /* Trust bar: scroll horizontally at tablet widths to avoid nowrap layout issues */
  .trust-bar {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 28px;
    padding-bottom: 4px;
    flex-wrap: nowrap;
  }
  .trust-bar-item {
    white-space: nowrap;
    scroll-snap-align: start;
    flex-shrink: 0;
  }
}

@media (max-width: 768px) {
  /* CTA row: full-width stacked buttons on mobile */
  .hero-cta-row .btn { width: 100%; justify-content: center; }

  /* Trust bar already handled at 860px above */

  /* Coverage card grid already handles 1-col */
}

@media (max-width: 480px) {
  /* A touch more breathing room on the hero text */
  .hero-inner { padding-bottom: 8px; }
  .hero-sub { font-size: 0.9rem; }
}

/* ── Hamburger / Mobile nav ───────────────────────────── */
.nav-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  position: relative;
  z-index: 1001;
  flex-shrink: 0;
}
.nav-burger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--ink);
  border-radius: 1px;
  transition: transform 0.25s ease, opacity 0.2s ease;
}

@media (max-width: 768px) {
  .nav-burger { display: flex; }

  /* Full-screen mobile menu panel */
  .nav-links {
    position: fixed !important;
    top: 54px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    height: calc(100dvh - 54px) !important;
    min-height: calc(100vh - 54px) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    background: var(--cream) !important;
    padding: 24px 20px 48px !important;
    gap: 0 !important;
    overflow-y: auto !important;
    z-index: 998 !important;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    border-top: 1px solid rgba(15,23,42,0.1) !important;
  }
  /* Show all links in the mobile panel */
  .nav-links a,
  .nav-links a:not(.nav-btn) {
    display: block !important;
    font-size: 1.05rem !important;
    padding: 15px 0 !important;
    border-bottom: 1px solid rgba(15,23,42,0.07) !important;
    color: var(--ink) !important;
    letter-spacing: 0 !important;
  }
  .nav-links a.nav-btn {
    margin-top: 20px !important;
    border-bottom: none !important;
    text-align: center !important;
    padding: 14px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
  }
  /* Dropdown: render inline, not floating */
  .nav-links .nav-dropdown {
    display: block !important;
    position: static !important;
  }
  .nav-links .nav-dropdown-trigger::after,
  .nav-links .nav-dropdown-trigger svg { display: none !important; }
  .nav-links .nav-dropdown-menu {
    display: block !important;
    position: static !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    box-shadow: none !important;
    background: none !important;
    border: none !important;
    padding: 0 0 0 16px !important;
    min-width: 0 !important;
  }
  .nav-links .nav-dropdown-menu a {
    font-size: 0.95rem !important;
    padding: 11px 0 !important;
    border-bottom: 1px solid rgba(15,23,42,0.05) !important;
    color: var(--muted) !important;
  }

  /* Open state: show panel */
  .nav-wrap.nav-open .nav-links {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* Burger → X */
  .nav-wrap.nav-open .nav-burger span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .nav-wrap.nav-open .nav-burger span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
  }
  .nav-wrap.nav-open .nav-burger span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  /* Prevent body scroll when menu open */
  body.nav-open { overflow: hidden; }

  /* Auth actions: hidden in the top bar, revealed at the bottom of the open menu */
  /* Drop transform/will-change/backdrop-filter so position:fixed children anchor to the viewport */
  .nav-wrap.nav-open {
    transform: none !important;
    will-change: auto !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .nav-actions { display: none !important; }
  .nav-wrap.nav-open .nav-actions {
    display: flex !important;
    flex-direction: column;
    gap: 10px;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: var(--cream);
    padding: 16px 20px calc(16px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(15,23,42,0.08);
  }
  .nav-wrap.nav-open .nav-actions .nav-signin {
    display: block !important;
    text-align: center;
    padding: 12px !important;
    max-width: none !important;
  }
  .nav-wrap.nav-open .nav-actions .nav-btn {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    text-align: center;
    padding: 14px !important;
    font-size: 0.95rem !important;
    border-radius: var(--radius-sm) !important;
  }
}

/* ── Mobile UI/UX overrides ───────────────────────────── */

/* Form inputs: 44px touch target + prevent iOS auto-zoom */
@media (max-width: 768px) {
  input, textarea, select {
    padding: 14px 16px;
    font-size: 16px;
    min-height: 44px;
  }
  .form-field label, .field-label { font-size: 0.88rem; }
  .btn { padding: 16px 28px; min-height: 44px; }
  .kicker { line-height: 1.4; }
  .section-sub { line-height: 1.6; }
  .deco { display: none; }
  .deco-hero-bracket,
  .deco-hero-diag,
  .deco-cta-lines,
  .deco-cta-target,
  .section-divider { display: none; }
  .broker-form input, .broker-form select, .broker-form textarea {
    padding: 12px 14px;
    font-size: 16px;
    min-height: 44px;
  }
}

/* Typography scale for small phones */
@media (max-width: 480px) {
  h1 { font-size: clamp(2.05rem, 10vw, 2.55rem); }
  h2 { font-size: clamp(1.7rem, 7vw, 2.1rem); }
  .nav-signin { display: none !important; }
  .nav-actions .nav-btn {
    max-width: 178px;
    padding: 8px 12px !important;
    font-size: 0.78rem !important;
    white-space: normal;
    text-align: center;
    line-height: 1.15;
  }
  .kicker { font-size: 0.75rem; }
  .stat-item { padding: 16px 18px; }
  .stat-item strong { font-size: 1.4rem; }
  .cov-grid, .proof-grid { grid-template-columns: 1fr; }
  .cov-card { border-right: none; border-bottom: 1px solid var(--line); }
  .cov-card:nth-child(odd),
  .cov-card:nth-child(even) { border-right: none; }
  .proof-grid { grid-template-columns: 1fr; }
  .check-grid { grid-template-columns: 1fr; }
  .ai-uses-grid { grid-template-columns: 1fr; }
  .section-inner, .nav-inner { width: calc(100% - 32px); }
}

/* ── Reduce motion ────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .fade-up { opacity: 1; transform: none; transition: none; }
  .nav-wrap { transition: none; }
  .monitor-score-ring svg circle:nth-child(2) { animation: none; }
}

/* ══════════════════════════════════════════════════════════
   NEW HARPER-MIRRORED SECTIONS
   ══════════════════════════════════════════════════════════ */

/* ── Base .section wrapper ────────────────────────────── */
.section {
  padding: 96px 0;
  border-bottom: 1px solid var(--line);
}

/* ── OFFER SECTION ───────────────────────────────────── */
.offer-section { background: var(--cream-mid); }
.offer-section h2 { margin-bottom: 12px; }
.offer-section .section-sub { margin-bottom: 32px; }

.offer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.offer-card h3 {
  font-size: 0.97rem;
  font-weight: 600;
  color: var(--ink);
  margin: 0;
}

.offer-card p {
  font-size: 0.84rem;
  color: var(--body);
  line-height: 1.6;
  margin: 0;
}

/* ── INDUSTRIES SECTION ───────────────────────────────── */
.industries-section { background: #FFFFFF; }
.industries-section h2 { margin-bottom: 12px; }
.industries-section .section-sub { margin-bottom: 32px; max-width: 600px; }

.industries-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.industry-card h3 {
  font-size: 0.93rem;
  font-weight: 600;
  color: var(--ink);
  margin: 0;
}

.industry-card p {
  font-size: 0.82rem;
  color: var(--body);
  line-height: 1.6;
  margin: 0;
}

/* ── DATA SECTION ─────────────────────────────────────── */
.data-section { background: var(--cream-mid); }
.data-section h2 { margin-bottom: 12px; }
.data-section .section-sub { margin-bottom: 32px; }

.data-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.data-metric {
  background: var(--cream);
  border-radius: var(--radius-md);
  box-shadow: 0 2px 14px rgba(15,23,42,0.06);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.data-metric strong {
  font-size: 2rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.03em;
  line-height: 1;
}

.data-metric p {
  font-size: 0.84rem;
  color: var(--body);
  line-height: 1.6;
  margin: 0;
}

/* ── TRUST BAND ───────────────────────────────────────── */
.trust-band { background: var(--cream); }

.trust-band-inner {
  display: grid;
  grid-template-columns: 180px 1px 1fr 180px;
  gap: 48px;
  align-items: center;
}

.trust-band-stat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: center;
}

.trust-band-stat strong {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--blue-accent);
  letter-spacing: -0.01em;
  line-height: 1.1;
}

.trust-band-stat span {
  font-size: 0.78rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.trust-band-divider {
  width: 1px;
  height: 80px;
  background: var(--line);
}

.trust-band-copy h2 {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  margin-bottom: 12px;
}

.trust-band-copy p {
  color: var(--body);
  margin-bottom: 24px;
  font-size: 0.95rem;
  max-width: 440px;
}

/* ── PARTNERS SECTION ─────────────────────────────────── */
.partners-section { background: var(--cream-mid); padding: 64px 0; }

.partners-logos {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.partner-logo {
  background: var(--cream);
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 8px rgba(15,23,42,0.06);
  padding: 14px 24px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.02em;
}

/* ── DARK CTA SECTION ─────────────────────────────────── */
.section-cta-dark {
  background: var(--navy-deep);
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  border-bottom: none;
}

/* ── RESPONSIVE: offer/industries/data grids ──────────── */
@media (max-width: 1024px) {
  .offer-grid,
  .industries-grid { grid-template-columns: repeat(2, 1fr); }
  .data-metrics { grid-template-columns: repeat(2, 1fr); }
  .trust-band-inner {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
  .trust-band-divider { display: none; }
  .trust-band-stat:last-child { display: flex; }
}

@media (max-width: 768px) {
  .section { padding: 64px 0; }
  .offer-grid,
  .industries-grid,
  .data-metrics { grid-template-columns: 1fr; }
  .trust-band-inner { grid-template-columns: 1fr; gap: 24px; }
  .trust-band-divider { display: none; }
  .trust-band-stat { text-align: left; }
}

/* ══════════════════════════════════════════════════════════
   PREMIUM VISUAL DESIGN PASS — Linear × Intercom
   ══════════════════════════════════════════════════════════ */

/* ── OFFER CARDS ─────────────────────────────────────────── */
.offer-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 28px 24px 24px;
  border-radius: var(--radius-md);
  background:
    radial-gradient(ellipse 58% 48% at 0% 0%, rgba(37,99,235,0.10) 0%, transparent 64%),
    radial-gradient(ellipse 46% 50% at 100% 100%, rgba(37,99,235,0.07) 0%, transparent 60%),
    #FFFFFF;
  border: 1px solid rgba(15,23,42,0.07);
  position: relative;
  overflow: hidden;
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 1px 2px rgba(15,23,42,0.04),
    0 4px 8px rgba(15,23,42,0.04),
    0 12px 24px rgba(15,23,42,0.05),
    0 32px 56px rgba(15,23,42,0.06);
  transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}
/* Subtle top edge glow */
.offer-card::before {
  content: '';
  position: absolute;
  top: 0; left: 24px;
  width: 28px;
  height: 2px;
  border-radius: 2px;
  background: var(--blue-accent);
}
/* Corner geometric accent — removed for the cleaner mobility card */
.offer-card::after {
  display: none;
}
/* Card 1: large rotated square, top-right */
.offer-card:nth-child(1)::after {
  top: -28px; right: -28px;
  width: 90px; height: 90px;
  border-radius: var(--radius-md);
  background: rgba(37,99,235,0.04);
  transform: rotate(18deg);
}
/* Card 2: circle, top-left */
.offer-card:nth-child(2)::after {
  top: 12px; left: 12px; right: auto;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: rgba(37,99,235,0.05);
  transform: none;
}
/* Card 3: tall rectangle, bottom-right */
.offer-card:nth-child(3)::after {
  bottom: -20px; right: -16px; top: auto;
  width: 48px; height: 88px;
  border-radius: var(--radius-md);
  background: rgba(15,23,42,0.04);
  transform: rotate(-12deg);
}
/* Card 4: small diamond (square rotated 45°), top-right */
.offer-card:nth-child(4)::after {
  top: 16px; right: 16px;
  width: 40px; height: 40px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.06);
  transform: rotate(45deg);
}
/* Card 5: wide rectangle, top-right */
.offer-card:nth-child(5)::after {
  top: -20px; right: -24px;
  width: 100px; height: 50px;
  border-radius: var(--radius-md);
  background: rgba(37,99,235,0.04);
  transform: rotate(10deg);
}
/* Card 6: circle, bottom-left */
.offer-card:nth-child(6)::after {
  bottom: 16px; left: 16px; top: auto; right: auto;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: rgba(15,23,42,0.04);
  transform: none;
}
/* Card 7: rotated square, mid-right edge */
.offer-card:nth-child(7)::after {
  top: 50%; right: -22px;
  transform: translateY(-50%) rotate(30deg);
  width: 70px; height: 70px;
  border-radius: var(--radius-md);
  background: rgba(37,99,235,0.05);
}
/* Card 8: tall thin rectangle, top-left */
.offer-card:nth-child(8)::after {
  top: -18px; left: 24px; right: auto;
  width: 36px; height: 80px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.04);
  transform: rotate(-8deg);
}
.offer-card:hover {
  border-color: rgba(37,99,235,0.34);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.9) inset,
    0 0 0 3px rgba(37,99,235,0.09),
    0 8px 28px rgba(15,23,42,0.1),
    0 28px 60px rgba(15,23,42,0.12);
  transform: translateY(-4px);
}

.offer-card-accent {
  background:
    radial-gradient(ellipse 65% 55% at 15% 10%, rgba(37,99,235,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 50% 55% at 90% 90%, rgba(37,99,235,0.05) 0%, transparent 60%),
    #F8FAFF;
  border: 1px solid rgba(37,99,235,0.22);
  box-shadow:
    0 2px 8px rgba(37,99,235,0.08),
    0 8px 28px rgba(37,99,235,0.10);
}
.offer-card-accent::before {
  background: linear-gradient(90deg, transparent, rgba(37,99,235,0.5), transparent);
}
.offer-card-accent::after {
  background: rgba(37,99,235,0.07);
}
.offer-card-accent:hover {
  border-color: rgba(37,99,235,0.42);
  box-shadow:
    0 0 0 3px rgba(37,99,235,0.1),
    0 8px 32px rgba(37,99,235,0.16);
}
.offer-card-accent .offer-icon {
  background: rgba(255,255,255,0.85);
  border-color: rgba(37,99,235,0.18);
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(37,99,235,0.08),
    0 4px 14px rgba(37,99,235,0.14);
}

.offer-icon {
  --navy: var(--app-primary-deep);
  --blue-accent: var(--app-primary);
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: #EFF4FF;
  border: 1px solid rgba(37,99,235,0.18);
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 3px 10px rgba(37,99,235,0.12);
  transition: box-shadow 220ms ease, background 220ms ease;
}
.offer-card:hover .offer-icon {
  background: #E0EAFF;
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(37,99,235,0.16),
    0 6px 18px rgba(37,99,235,0.18);
}

/* ── EMBEDDED WORKFLOW INSURANCE ───────────────────────── */
.workflow-insurance-section {
  padding: 96px 0;
  background:
    linear-gradient(rgba(255,255,255,0.78), rgba(255,255,255,0.78)),
    url("./assets/heroes/card-bg-1.png") center / cover no-repeat;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.workflow-insurance-header {
  max-width: 820px;
  display: grid;
  gap: 18px;
}

.workflow-insurance-header h2 {
  max-width: 780px;
}

.workflow-insurance-header .section-sub {
  max-width: 780px;
}

.workflow-insurance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 44px;
}

.workflow-insurance-card {
  --navy: var(--app-primary-deep);
  --blue-accent: var(--app-primary);
  position: relative;
  overflow: hidden;
  min-height: 260px;
  display: grid;
  align-content: start;
  gap: 16px;
  padding: 30px 26px 28px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(15,23,42,0.08);
  background:
    radial-gradient(ellipse 60% 55% at 12% 0%, rgba(37,99,235,0.07) 0%, transparent 60%),
    #FFFFFF;
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 1px 2px rgba(15,23,42,0.04),
    0 12px 28px rgba(15,23,42,0.06);
}

.workflow-insurance-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(37,99,235,0.32), transparent);
}

.workflow-insurance-icon {
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: #EFF4FF;
  border: 1px solid rgba(37,99,235,0.16);
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 3px 10px rgba(37,99,235,0.1);
}

.workflow-insurance-card h3 {
  font-size: 1rem;
  letter-spacing: -0.01em;
}

.workflow-insurance-card p {
  font-size: 0.88rem;
  line-height: 1.68;
  color: var(--muted);
}

@media (max-width: 980px) {
  .workflow-insurance-grid {
    grid-template-columns: 1fr;
  }
  .workflow-insurance-card {
    min-height: 0;
  }
}

@media (max-width: 768px) {
  .workflow-insurance-section {
    padding: 72px 0;
  }
}

/* ── INDUSTRY CARDS ──────────────────────────────────────── */
.industry-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 28px 24px 24px;
  border-radius: var(--radius-md);
  background:
    radial-gradient(ellipse 50% 45% at 100% 0%, rgba(99,102,241,0.04) 0%, transparent 60%),
    radial-gradient(ellipse 40% 40% at 0% 100%, rgba(37,99,235,0.03) 0%, transparent 55%),
    #FFFFFF;
  border: 1px solid rgba(15,23,42,0.07);
  position: relative;
  overflow: hidden;
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 1px 2px rgba(15,23,42,0.04),
    0 4px 8px rgba(15,23,42,0.04),
    0 12px 24px rgba(15,23,42,0.05),
    0 28px 48px rgba(15,23,42,0.05);
  transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}
.industry-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(37,99,235,0.3), transparent);
}
.industry-card::after {
  content: '';
  position: absolute;
  pointer-events: none;
}
/* Industry card 1: rotated square, top-right */
.industry-card:nth-child(1)::after {
  top: -22px; right: -22px;
  width: 76px; height: 76px;
  border-radius: var(--radius-md);
  background: rgba(37,99,235,0.04);
  transform: rotate(15deg);
}
/* Industry card 2: circle, top-left */
.industry-card:nth-child(2)::after {
  top: 14px; left: 14px; right: auto;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: rgba(37,99,235,0.05);
  transform: none;
}
/* Industry card 3: tall rect, bottom-right */
.industry-card:nth-child(3)::after {
  bottom: -16px; right: -14px; top: auto;
  width: 40px; height: 72px;
  border-radius: var(--radius-sm);
  background: rgba(15,23,42,0.04);
  transform: rotate(-10deg);
}
/* Industry card 4: diamond, top-right */
.industry-card:nth-child(4)::after {
  top: 18px; right: 18px;
  width: 34px; height: 34px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.06);
  transform: rotate(45deg);
}
/* Industry card 5: wide rect, top */
.industry-card:nth-child(5)::after {
  top: -18px; right: -20px;
  width: 86px; height: 42px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.04);
  transform: rotate(8deg);
}
/* Industry card 6: circle, bottom-left */
.industry-card:nth-child(6)::after {
  bottom: 14px; left: 14px; top: auto; right: auto;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: rgba(15,23,42,0.04);
  transform: none;
}
/* Industry card 7: rotated square, center-right */
.industry-card:nth-child(7)::after {
  top: 50%; right: -18px;
  transform: translateY(-50%) rotate(28deg);
  width: 60px; height: 60px;
  border-radius: var(--radius-md);
  background: rgba(37,99,235,0.05);
}
/* Industry card 8: tall thin rect, top-left */
.industry-card:nth-child(8)::after {
  top: -16px; left: 20px; right: auto;
  width: 30px; height: 66px;
  border-radius: var(--radius-sm);
  background: rgba(37,99,235,0.04);
  transform: rotate(-7deg);
}
.industry-card:hover {
  border-color: rgba(37,99,235,0.24);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.9) inset,
    0 0 0 3px rgba(37,99,235,0.07),
    0 8px 24px rgba(15,23,42,0.09),
    0 22px 52px rgba(15,23,42,0.11);
  transform: translateY(-4px);
}
.industry-icon {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(15,23,42,0.07);
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(37,99,235,0.05),
    0 3px 10px rgba(37,99,235,0.09);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: box-shadow 220ms ease, background 220ms ease;
}
.industry-card:hover .industry-icon {
  background: rgba(255,255,255,1);
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(37,99,235,0.1),
    0 6px 18px rgba(37,99,235,0.15);
}

/* ── AUDIENCE LANES ─────────────────────────────────────── */
.audience-lanes {
  display: grid;
  gap: 0;
  margin-top: 44px;
  border-top: 1px solid rgba(15,23,42,0.08);
}

.industries-section > .section-inner > h2,
.industries-section > .section-inner > .section-sub {
  opacity: 1 !important;
  transform: none !important;
}

.audience-lane {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr) minmax(280px, 360px);
  gap: 36px;
  align-items: center;
  min-height: 178px;
  padding: 28px 0;
  border-bottom: 1px solid rgba(15,23,42,0.08);
}

.audience-lane-label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: var(--blue-accent);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.audience-lane-label span {
  color: rgba(15,23,42,0.56);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}

.audience-lane-copy h3 {
  font-size: clamp(1.45rem, 2.4vw, 2.1rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
  margin: 0 0 12px;
}

.audience-lane-copy p {
  max-width: 58ch;
  margin: 0;
  color: var(--body);
  font-size: 0.96rem;
  line-height: 1.65;
}

.audience-lane-side {
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
}

.audience-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.audience-chip-row span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(37,99,235,0.12);
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,0.72);
  color: var(--body);
  font-size: 0.73rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.audience-lane-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--blue-accent);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.audience-lane-link::after {
  content: '->';
  letter-spacing: 0;
}

@media (max-width: 980px) {
  .audience-lane {
    grid-template-columns: 120px minmax(0, 1fr);
  }
  .audience-lane-side {
    grid-column: 2;
  }
}

@media (max-width: 640px) {
  .audience-lanes {
    margin-top: 32px;
  }
  .audience-lane {
    grid-template-columns: 1fr;
    gap: 16px;
    min-height: 0;
    padding: 24px 0;
  }
  .audience-lane-side {
    grid-column: auto;
  }
  .audience-lane-copy h3 {
    font-size: 1.35rem;
  }
}

/* ── DATA SECTION: light tint band (alternation, not a second dark section) ── */
.data-section {
  background: var(--cream-mid) !important;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  position: relative;
  overflow: hidden;
}
.data-section::before {
  display: none;
}
.data-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(15,23,42,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.025) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
  z-index: 0;
}
.data-section .section-inner { position: relative; z-index: 1; }

.data-section .kicker { opacity: 1 !important; transform: none !important; }
.data-section h2 { color: var(--ink); opacity: 1 !important; transform: none !important; }
.data-section .section-sub { color: var(--muted); opacity: 1 !important; transform: none !important; }

.data-metric {
  background: var(--cream) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 14px rgba(15,23,42,0.06) !important;
  transition: background 220ms, border-color 220ms, transform 220ms cubic-bezier(0.22,1,0.36,1);
}
.data-metric:hover {
  background: var(--cream-light) !important;
  border-color: rgba(37,99,235,0.24) !important;
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(15,23,42,0.08) !important;
}
.data-metric strong {
  background: none;
  color: var(--ink);
  -webkit-background-clip: initial;
  -webkit-text-fill-color: initial;
  background-clip: initial;
}
.data-metric p { color: var(--body) !important; }

/* ── TRUST BAND ──────────────────────────────────────────── */
.trust-band {
  background: #F5F5F7 !important;
  position: relative;
  overflow: hidden;
}
.trust-band::before {
  content: '';
  position: absolute;
  bottom: -50%;
  right: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(37,99,235,0.06) 0%, transparent 65%);
  pointer-events: none;
}
.trust-band .section-inner { position: relative; z-index: 1; }

.trust-band-stat strong {
  font-size: 3rem !important;
  color: var(--blue-accent) !important;
  background: none !important;
  -webkit-text-fill-color: var(--blue-accent) !important;
  background-clip: initial !important;
}
/* Retention stat keeps the brand accent */
.trust-band-stat:last-child strong {
  color: var(--blue-accent) !important;
  -webkit-text-fill-color: var(--blue-accent) !important;
}
.trust-band-copy h2 {
  font-size: clamp(1.6rem, 2.8vw, 2.2rem) !important;
}

/* ── OFFER SECTION ───────────────────────────────────────── */
.offer-section {
  background: #F5F5F7 !important;
  position: relative;
  overflow: visible;
}
.offer-section::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -5%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(37,99,235,0.05) 0%, transparent 65%);
  pointer-events: none;
}
.offer-section .section-inner { position: relative; z-index: 1; }

/* ── INDUSTRIES SECTION ──────────────────────────────────── */
.industries-section {
  position: relative;
  overflow: hidden;
}
.industries-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(15,23,42,0.045) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
}
.industries-section .section-inner { position: relative; z-index: 1; }

/* ── PARTNER LOGOS ───────────────────────────────────────── */
.partners-section {
  background: #FAFAFA !important;
}
.partner-logo {
  background: rgba(255,255,255,0.85) !important;
  border: 1px solid rgba(226,232,240,0.7) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.95) inset, 0 1px 4px rgba(15,23,42,0.06), 0 4px 12px rgba(15,23,42,0.04) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: all 200ms cubic-bezier(0.22,1,0.36,1) !important;
  cursor: default;
}
.partner-logo:hover {
  background: #ffffff !important;
  border-color: rgba(37,99,235,0.18) !important;
  transform: translateY(-2px);
  box-shadow: 0 1px 0 rgba(255,255,255,0.95) inset, 0 4px 16px rgba(15,23,42,0.10) !important;
}

/* Keep homepage light sections on the same white grid base. */
.offer-section,
.industries-section,
.trust-band,
.partners-section {
  background-color: #fff !important;
  background-image:
    linear-gradient(rgba(15,23,42,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.025) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
}

.offer-section::before,
.industries-section::before,
.trust-band::before {
  display: none !important;
}

/* ── DARK CTA BAND ───────────────────────────────────────── */
.section-cta-dark {
  min-height: 420px;
  background-color: #06142D !important;
  background-image:
    linear-gradient(90deg, rgba(6,20,45,0.98) 0%, rgba(6,20,45,0.9) 34%, rgba(6,20,45,0.48) 62%, rgba(6,20,45,0.16) 100%),
    url("./assets/heroes/cta-band.png") !important;
  background-size: cover !important;
  background-position: center right !important;
  background-repeat: no-repeat !important;
  position: relative;
  overflow: hidden;
}

.cta-dark-inner {
  position: relative;
  z-index: 1;
  text-align: left;
}
/* Force dark section text visible regardless of animation state */
.section-cta-dark h2,
.section-cta-dark p {
  opacity: 1 !important;
  transform: none !important;
}
.section-cta-dark h2 {
  font-size: clamp(2.25rem, 4.8vw, 4.2rem) !important;
  line-height: 1.02;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.section-cta-dark p {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.section-cta-dark::before {
  display: none;
}
.section-cta-dark .deco-cta-geo {
  display: none;
}

@media (max-width: 720px) {
  .section-cta-dark {
    min-height: 520px;
    background-image:
      linear-gradient(180deg, rgba(6,20,45,0.98) 0%, rgba(6,20,45,0.92) 48%, rgba(6,20,45,0.48) 100%),
      url("./assets/heroes/cta-band.png") !important;
    background-size: auto 100%, auto 56% !important;
    background-position: center, 72% bottom !important;
  }
  .section-cta-dark h2 {
    font-size: 2rem !important;
    max-width: 10ch !important;
  }
}

/* ── BLUEPRINT IMAGE DETAILS ─────────────────────────────── */
.offer-section::after,
.industries-section::after,
.trust-band::after,
.partners-section::before,
.intake-wrap::after,
.footer-wrap::before,
.section-cta-dark::after {
  content: '';
  position: absolute;
  pointer-events: none;
  background-image: var(--blueprint-art);
  background-repeat: no-repeat;
  background-size: cover;
}

.offer-section {
  overflow: hidden;
}
.offer-section::after {
  right: -120px;
  bottom: -96px;
  width: min(52vw, 620px);
  aspect-ratio: 1649 / 954;
  opacity: 0.16;
  filter: saturate(1.2);
  background-position: right bottom;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 82%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 82%, transparent 100%);
  z-index: 0;
}

.industries-section::after {
  top: 56px;
  right: -220px;
  width: min(48vw, 560px);
  aspect-ratio: 1649 / 954;
  opacity: 0.11;
  background-position: 82% 46%;
  transform: scaleX(-1);
  z-index: 0;
}

.trust-band::after {
  left: -160px;
  bottom: -120px;
  width: min(46vw, 520px);
  aspect-ratio: 1649 / 954;
  opacity: 0.12;
  background-position: left bottom;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 55%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 0%, #000 55%, transparent 100%);
  z-index: 0;
}

.partners-section {
  position: relative;
  overflow: hidden;
}
.partners-section::before {
  right: -80px;
  top: 50%;
  width: min(34vw, 360px);
  aspect-ratio: 1649 / 954;
  opacity: 0.1;
  background-position: right center;
  transform: translateY(-50%);
  z-index: 0;
}
.partners-section .section-inner {
  position: relative;
  z-index: 1;
}

.section-cta-dark::after {
  display: none;
}

.intake-wrap::after {
  top: 44px;
  right: -180px;
  width: min(52vw, 600px);
  aspect-ratio: 1649 / 954;
  opacity: 0.16;
  mix-blend-mode: screen;
  background-position: right center;
  filter: brightness(1.35) saturate(0.8);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, #000 48%, transparent 76%);
  mask-image: radial-gradient(ellipse at center, #000 0%, #000 48%, transparent 76%);
  z-index: 0;
}
.intake-inner {
  position: relative;
  z-index: 1;
}

.footer-wrap {
  position: relative;
  overflow: hidden;
}
.footer-wrap::before {
  right: -140px;
  top: -72px;
  width: min(44vw, 520px);
  aspect-ratio: 1649 / 954;
  opacity: 0.1;
  background-position: right top;
  z-index: 0;
}
.footer-inner {
  position: relative;
  z-index: 1;
}

.data-section .data-metric {
  position: relative;
  overflow: hidden;
}
.data-section .data-metric::after {
  display: none;
}
.data-section .data-metric > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 900px) {
  .offer-section::after,
  .industries-section::after,
  .trust-band::after,
  .partners-section::before,
  .section-cta-dark::after,
  .intake-wrap::after,
  .footer-wrap::before {
    opacity: 0.08;
    width: 420px;
  }
  .offer-section::after,
  .trust-band::after,
  .footer-wrap::before {
    right: -240px;
  }
  .industries-section::after,
  .partners-section::before,
  .intake-wrap::after {
    right: -280px;
  }
}

@media (max-width: 640px) {
  .offer-section::after,
  .industries-section::after,
  .trust-band::after,
  .partners-section::before,
  .section-cta-dark::after,
  .intake-wrap::after,
  .footer-wrap::before,
  .data-section .data-metric::after {
    display: none;
  }
}

/* ── BUTTON SHIMMER ──────────────────────────────────────── */
.btn-primary {
  position: relative;
  overflow: hidden;
}
.btn-primary::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,0.12) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform 0.55s ease;
  pointer-events: none;
}
.btn-primary:hover::before { transform: translateX(120%); }

.btn-primary-light {
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.3), 0 4px 20px rgba(0,0,0,0.2);
  transition: box-shadow 200ms, transform 200ms !important;
}
.btn-primary-light:hover {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.5), 0 8px 32px rgba(0,0,0,0.3) !important;
  transform: translateY(-1px);
}

/* ── KICKER REFINEMENT ───────────────────────────────────── */
.kicker::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--blue-accent);
  flex-shrink: 0;
  opacity: 0.7;
}
.section-cta-dark .kicker::before {
  background: rgba(255,255,255,0.55);
}

/* ── GRADIENT TEXT ───────────────────────────────────────── */
.grad {
  background: linear-gradient(135deg, var(--blue-accent) 0%, var(--navy-deep) 100%);
  color: var(--blue-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── STAGGER DELAYS ──────────────────────────────────────── */
.fade-delay-4 { transition-delay: 0.32s; }
.fade-delay-5 { transition-delay: 0.40s; }
.fade-delay-6 { transition-delay: 0.48s; }
.fade-delay-7 { transition-delay: 0.56s; }

/* ── GEOMETRIC DECORATIVE ELEMENTS ──────────────────────── */
.deco-hero-geo {
  position: absolute;
  top: 50%;
  right: -60px;
  transform: translateY(-50%);
  width: 420px;
  height: 420px;
  pointer-events: none;
  z-index: 0;
}

.deco-section-geo {
  position: absolute;
  top: -20px;
  right: -30px;
  width: 200px;
  height: 200px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.9;
}

.deco-section-geo--left {
  right: auto;
  left: -40px;
  top: 40px;
  width: 180px;
  height: 260px;
}

/* CTA dark section floating squares */
.deco-cta-geo {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 260px;
  height: 320px;
  pointer-events: none;
  z-index: 0;
}
.deco-cta-geo--left  { left: 0; }
.deco-cta-geo--right { right: 0; }

@media (max-width: 900px) {
  .deco-hero-geo,
  .deco-section-geo,
  .deco-cta-geo { display: none; }
}
.fade-delay-8 { transition-delay: 0.64s; }