/* =============================================================
   A Safer Home Partnership
   Aging In The Comfort Of Home®  +  Haven Home Health & Hospice
   -------------------------------------------------------------
   styles.css — single-file design system for the partnership deck.
   Token-driven, mobile-first, print-friendly.
   ============================================================= */

/* -------------------------------------------------------------
   1. Design tokens
   ------------------------------------------------------------- */
:root {
  /* AITCOH brand palette */
  --trust-blue-dark: #1b477e;
  --trust-blue:      #255ea0;
  --trust-blue-soft: #d9ecff;
  --dealer-green-dark: #154440;
  --dealer-green:    #20605c;
  --dealer-green-soft: #dff7c1;
  --radiant-gold:    #fdd841;
  --radiant-gold-deep: #c9a300;
  --charcoal:        #333333;
  --slate:           #333333;
  --mute:            #333333;
  --line:            #e6e8ee;
  --linen:           #fffce5;
  --paper:           #fafbfd;
  --white:           #ffffff;

  /* Semantic */
  --bg:              #fafbfd;
  --bg-alt:          #ffffff;
  --bg-deep:         #0f2a4d;
  --text:            #333333;
  --text-mute:       #333333;
  --accent:          var(--trust-blue);
  --accent-deep:     var(--trust-blue-dark);

  /* Spacing */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;

  /* Radius */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;

  /* Shadow */
  --shadow-1: 0 1px 2px rgba(15,42,77,0.04), 0 2px 6px rgba(15,42,77,0.05);
  --shadow-2: 0 4px 10px rgba(15,42,77,0.06), 0 12px 28px rgba(15,42,77,0.08);
  --shadow-3: 0 10px 24px rgba(15,42,77,0.10), 0 28px 56px rgba(15,42,77,0.12);

  /* Type scale */
  --t-eyebrow: 0.78rem;
  --t-body:    1.0625rem;
  --t-lead:    1.25rem;
  --t-h6:      1.1rem;
  --t-h5:      1.35rem;
  --t-h4:      1.75rem;
  --t-h3:      2.25rem;
  --t-h2:      3rem;
  --t-h1:      4.25rem;

  --container: 1100px;          /* unified deck column width — every panel/takeaway/callout fills this */
  --container-narrow: 880px;    /* reserved for hero + closing dark section only */

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* -------------------------------------------------------------
   2. Base
   ------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Source Sans Pro", "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: var(--t-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;  /* belt-and-braces against rare nowrap overflow on small screens */
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 700;
  color: var(--charcoal);
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin: 0 0 var(--s-4);
}

h1 { font-size: clamp(2.6rem, 6vw, var(--t-h1)); letter-spacing: -0.025em; }
h2 { font-size: clamp(2rem, 4.5vw, var(--t-h2)); letter-spacing: -0.02em; }
h3 { font-size: clamp(1.6rem, 3vw, var(--t-h3)); }
h4 { font-size: var(--t-h4); }
h5 { font-size: var(--t-h5); }
h6 { font-size: var(--t-h6); }

p { margin: 0 0 var(--s-4); color: var(--text-mute); }
strong { color: var(--charcoal); }

a {
  color: var(--trust-blue);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
a:hover { color: var(--trust-blue-dark); border-bottom-color: var(--trust-blue); }

img, svg { max-width: 100%; display: block; }

/* Brand mark — italic + visually emphasized.
   We deliberately allow wrapping so the brand name never forces
   horizontal overflow on narrow viewports. */
.brand,
em.brand {
  font-style: italic;
  font-weight: 500;
  color: inherit;
}

/* Section primitives — tightened to executive rhythm (6rem desktop / 5rem for compact sections) */
section { padding: var(--s-9) var(--s-5); position: relative; }
section.ask-provide,
section.measure-section,
section.pilot-flow,
section.exec-summary { padding: 5rem var(--s-5); }
@media (max-width: 720px) { section { padding: var(--s-7) var(--s-4); } }

/* Scroll anchor offset so sticky nav doesn't cover landed-on headings */
[id] { scroll-margin-top: 96px; }

.container { max-width: var(--container); margin: 0 auto; }
.container-narrow { max-width: var(--container-narrow); margin: 0 auto; }

.eyebrow {
  font-family: "Montserrat", sans-serif;
  font-size: var(--t-eyebrow);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--trust-blue);
  margin: 0 0 var(--s-4);
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
}
.eyebrow::before {
  content: "";
  width: 28px;
  height: 2px;
  background: var(--radiant-gold);
  border-radius: 2px;
}

.lead {
  font-size: var(--t-lead);
  line-height: 1.55;
  color: var(--slate);
  /* width matches title / deck column for visual rhythm */
}

/* -------------------------------------------------------------
   3. Top navigation
   ------------------------------------------------------------- */
/* Frosted dark-navy sleek nav, cream text, gold pill CTA */
.topnav {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(15, 42, 77, 0.82);                                  /* frosted --ink */
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  border-bottom: 1px solid rgba(255, 252, 229, 0.10);
}
.topnav-inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 10px var(--s-5);
  display: flex;
  align-items: center;
  gap: var(--s-5);
}
.topnav-brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  border-bottom: 0;
  line-height: 0;       /* keep the row height driven by the logo image only */
}
.topnav-brand:hover { border-bottom: 0; opacity: 0.92; transition: opacity .2s var(--ease); }

/* AITCOH logo (products-light-new variant) — 2x baseline, frosted bar */
.topnav-logo {
  height: 64px;
  width: auto;
  display: block;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.18));
}

.topnav-links {
  display: flex; align-items: center;
  gap: var(--s-5);
  margin-left: auto;
  font-family: "Montserrat", sans-serif;
  font-size: 0.82rem;
  font-weight: 500;
}
.topnav-links a {
  color: rgba(255, 252, 229, 0.82);
  border-bottom: 2px solid transparent;
  padding: 6px 0;
  transition: color .2s var(--ease), border-color .2s var(--ease);
  text-decoration: none;
}
.topnav-links a:hover { color: #fffce5; border-bottom-color: rgba(255, 252, 229, 0.30); }
.topnav-links a.is-active { color: #fffce5; border-bottom-color: var(--energy-yellow); }

.topnav-cta {
  background: var(--energy-yellow);
  color: var(--ink);
  padding: 7px var(--s-4);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: 0;
  cursor: pointer;
  font-family: "Montserrat", sans-serif;
  box-shadow: 0 2px 10px rgba(253, 216, 65, 0.28);
  transition: background .2s var(--ease), box-shadow .2s var(--ease), transform .12s var(--ease);
}
.topnav-cta:hover {
  background: var(--energy-yellow-bright);
  color: var(--ink);
  box-shadow: 0 4px 16px rgba(253, 216, 65, 0.40);
  transform: translateY(-1px);
}

.topnav-toggle {
  display: none;
  background: transparent;
  border: 1px solid rgba(255, 252, 229, 0.30);
  color: #fffce5;
  border-radius: 8px;
  padding: 6px 10px;
  margin-left: auto;
  cursor: pointer;
  font-family: "Montserrat", sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
}
.topnav-toggle:hover { background: rgba(255, 252, 229, 0.06); }

@media (max-width: 960px) {
  .topnav-links { display: none; }
  .topnav-toggle { display: inline-block; }
  .topnav.is-open .topnav-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: absolute;
    top: 100%;
    left: 0; right: 0;
    background: rgba(15, 42, 77, 0.96);                                /* solid-ish dark navy for mobile menu */
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    padding: var(--s-4) var(--s-5) var(--s-5);
    gap: var(--s-3);
    border-bottom: 1px solid rgba(255, 252, 229, 0.12);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
  }
  .topnav.is-open .topnav-links a { color: rgba(255, 252, 229, 0.88); font-size: 0.95rem; }
  .topnav.is-open .topnav-links a.is-active { color: #fffce5; }
  .topnav.is-open .topnav-cta { align-self: stretch; text-align: center; }

  /* Logo step-down on tablets */
  .topnav-logo { height: 56px; }
}
@media (max-width: 420px) {
  /* Logo step-down on phones */
  .topnav-logo { height: 48px; }
}

/* -------------------------------------------------------------
   4. Hero
   ------------------------------------------------------------- */
.hero {
  padding: var(--s-10) var(--s-5) var(--s-9);
  background: var(--ink);    /* SOLID dark navy — matches gap/calc/closing family */
  overflow: hidden;
  position: relative;
}
@media (max-width: 720px) {
  .hero { padding: var(--s-5) var(--s-4) var(--s-7); }
}
.hero-grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: var(--s-8);
  align-items: center;
}
@media (max-width: 960px) { .hero-grid { grid-template-columns: 1fr; gap: var(--s-7); } }

.hero h1 .accent { color: var(--trust-blue); }
.hero h1 .accent-gold { color: var(--radiant-gold-deep); }

.hero-subtitle {
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  color: var(--slate);
  font-size: 1.15rem;
  margin: var(--s-2) 0 var(--s-5);
}
.hero-pillars {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2);
  margin: var(--s-5) 0 var(--s-6);
}
.pillar-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  background: var(--white);
  border: 1px solid var(--line);
  padding: 6px var(--s-3);
  border-radius: var(--r-md);
  font-size: 0.85rem;
  color: var(--slate);
  font-weight: 600;
}
.pillar-chip .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--trust-blue);
}
.pillar-chip.green .dot { background: var(--dealer-green); }
.pillar-chip.gold .dot { background: var(--radiant-gold-deep); }

.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-3) var(--s-5);
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: var(--r-md);
  border: 0;
  cursor: pointer;
  transition: transform .15s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
  text-decoration: none;
  border-bottom: 0;
}
.btn-primary {
  background: var(--charcoal);
  color: var(--white);
  box-shadow: var(--shadow-1);
}
.btn-primary:hover { background: var(--trust-blue-dark); color: var(--white); transform: translateY(-1px); box-shadow: var(--shadow-2); }
.btn-gold {
  background: var(--radiant-gold);
  color: var(--charcoal);
}
.btn-gold:hover { background: #ffe154; color: var(--charcoal); transform: translateY(-1px); box-shadow: var(--shadow-2); }
.btn-ghost {
  background: transparent;
  color: var(--charcoal);
  border: 1px solid var(--line);
}
.btn-ghost:hover { background: var(--white); border-color: var(--trust-blue); color: var(--trust-blue-dark); }

.hero-card-stack {
  position: relative;
  min-height: 420px;
}

/* =============================================================
   HERO IMAGE — production photograph
   ============================================================= */
.hero-image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 28px;
  display: block;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32),
              inset 0 1px 0 rgba(255, 255, 255, 0.10);
}
@media (max-width: 960px) {
  .hero-image { aspect-ratio: 16 / 10; }
}

/* Legacy placeholder rules retained inert in case future drafts swap back */
.hero-image-placeholder {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 28px;
  background: rgba(255, 252, 229, 0.10);
  border: 2px dashed rgba(255, 252, 229, 0.42);
  display: grid;
  place-items: center;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22),
              inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.hero-image-placeholder .placeholder-frame {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-4);
  padding: var(--s-5);
  text-align: center;
}
.hero-image-placeholder .placeholder-icon {
  width: 80px;
  height: 80px;
  color: rgba(255, 252, 229, 0.62);
}
.hero-image-placeholder .placeholder-eyebrow {
  display: block;
  font-family: "Montserrat", sans-serif;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--energy-yellow);
  margin-bottom: 0.5rem;
}
.hero-image-placeholder .placeholder-text {
  display: block;
  font-family: "Source Sans Pro", "Source Sans 3", sans-serif;
  font-size: 0.95rem;
  color: rgba(255, 252, 229, 0.78);
  line-height: 1.4;
  max-width: 320px;
}
@media (max-width: 960px) {
  .hero-image-placeholder { aspect-ratio: 16 / 10; }
}
.hero-card {
  position: absolute;
  background: var(--white);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-3);
  padding: var(--s-5);
  width: 78%;
}
.hero-card .label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--mute);
  font-weight: 700;
  margin-bottom: var(--s-2);
}
.hero-card .title {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: var(--charcoal);
  font-size: 1.1rem;
  margin-bottom: var(--s-2);
}
.hero-card .desc { font-size: 0.95rem; color: var(--slate); margin: 0; }
.hero-card.haven { top: 0; left: 0; border-top: 4px solid var(--dealer-green); }
.hero-card.aitcoh { bottom: 0; right: 0; border-top: 4px solid var(--trust-blue); }
.hero-card .icon {
  display: inline-flex;
  width: 38px; height: 38px;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--s-3);
}
.hero-card.haven .icon { background: var(--dealer-green-soft); color: var(--dealer-green-dark); }
.hero-card.aitcoh .icon { background: var(--trust-blue-soft); color: var(--trust-blue-dark); }
.hero-card .icon svg { width: 20px; height: 20px; }
@media (max-width: 720px) {
  .hero-card-stack { min-height: 360px; }
  .hero-card { width: 88%; }
}

/* -------------------------------------------------------------
   5. Section headings + intro pattern
   ------------------------------------------------------------- */
.section-head {
  max-width: 720px;
  margin: 0 auto var(--s-7);
  text-align: center;
}
.section-head.left { text-align: left; margin-left: 0; margin-right: 0; }
.section-head .eyebrow { justify-content: center; }
.section-head.left .eyebrow { justify-content: flex-start; }

/* -------------------------------------------------------------
   6. Stat cards (Section 2)
   ------------------------------------------------------------- */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-5);
}
@media (max-width: 960px) { .stats-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .stats-grid { grid-template-columns: 1fr; } }

.stat-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: var(--s-6);
  box-shadow: var(--shadow-1);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
.stat-card .stat {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 2.1rem;                                                    /* smaller per spec */
  color: var(--trust-blue-dark);
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: var(--s-3);
}
.stat-card .stat .unit { font-size: 1rem; vertical-align: super; color: var(--radiant-gold-deep); margin-left: 2px; }
.stat-card .stat-label {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: var(--charcoal);
  margin-bottom: var(--s-2);
}
.stat-card .stat-source {
  font-size: 0.72rem;
  color: var(--mute);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* -------------------------------------------------------------
   7. Gap section (Section 3)
   ------------------------------------------------------------- */
.gap-section { background: var(--bg-deep); color: white; }
.gap-section h2,
.gap-section h3 { color: white; }
.gap-section .eyebrow { color: var(--radiant-gold); }
.gap-section .eyebrow::before { background: var(--radiant-gold); }
.gap-section p, .gap-section .lead { color: rgba(255,255,255,0.78); }

.gap-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-7);
  align-items: center;
}
@media (max-width: 880px) { .gap-grid { grid-template-columns: 1fr; gap: var(--s-6); } }

.gap-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.gap-list li {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) 0;
  border-bottom: 1px solid rgba(255,255,255,0.10);
  font-size: 1.05rem;
}
.gap-list li:last-child { border-bottom: 0; }
.gap-list .x {
  width: 28px; height: 28px; flex: 0 0 auto;
  border-radius: 50%;
  background: rgba(253,216,65,0.18);
  color: var(--radiant-gold);
  display: grid; place-items: center;
  font-weight: 700;
}
.gap-callout {
  background: linear-gradient(160deg, rgba(37,94,160,0.30) 0%, rgba(32,96,92,0.30) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--r-xl);
  padding: var(--s-6);
}
.gap-callout .big {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 1.8rem;
  color: white;
  margin-bottom: var(--s-3);
  line-height: 1.2;
}

/* -------------------------------------------------------------
   8. Why Haven Is A Strong Fit (Section 4)
   ------------------------------------------------------------- */
.fit-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--s-5);
}
@media (max-width: 720px) { .fit-grid { grid-template-columns: 1fr; } }

.fit-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: var(--s-6);
  display: block;
}
.fit-card .ico {
  width: 48px; height: 48px;
  border-radius: 12px;
  background: var(--dealer-green-soft);
  color: var(--dealer-green-dark);
  display: grid; place-items: center;
}
.fit-card .ico svg { width: 22px; height: 22px; }
.fit-card h5 { margin: 0 0 var(--s-2); }
.fit-card p { margin: 0; }

/* -------------------------------------------------------------
   9. Partnership model (Section 5)
   ------------------------------------------------------------- */
.partnership { background: linear-gradient(180deg, #ffffff 0%, #f4f8fd 100%); }
.partnership-headline {
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--charcoal);
  margin: 0 auto var(--s-7);
  max-width: 800px;
  line-height: 1.2;
}
.partnership-headline .blue { color: var(--trust-blue-dark); }
.partnership-headline .green { color: var(--dealer-green-dark); }

.pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-5);
  align-items: stretch;
}
@media (max-width: 880px) {
  .pair { grid-template-columns: 1fr; }
}

.pair-card {
  background: var(--white);
  border-radius: var(--r-xl);
  padding: var(--s-6);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-1);
  position: relative;
  overflow: hidden;
}
.pair-card .top {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  margin-bottom: var(--s-5);
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--line);
}
.pair-card .logo {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: grid; place-items: center;
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  color: white;
  font-size: 1.1rem;
}
.pair-card .name {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--charcoal);
}
.pair-card.haven { border-top: 5px solid var(--dealer-green); }
.pair-card.haven .logo { background: var(--dealer-green-dark); }
.pair-card.haven .role { color: var(--dealer-green-dark); }
.pair-card.aitcoh { border-top: 5px solid var(--trust-blue); }
.pair-card.aitcoh .logo { background: var(--trust-blue-dark); }
.pair-card.aitcoh .role { color: var(--trust-blue-dark); }
.pair-card .role {
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 2px;
}
.pair-card .pair-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.pair-card .pair-list li {
  padding: var(--s-3) 0;
  display: flex;
  align-items: center;
  gap: var(--s-3);
  border-bottom: 1px dashed var(--line);
  color: var(--charcoal);
  font-weight: 600;
}
.pair-card .pair-list li:last-child { border-bottom: 0; }
.pair-card .pair-list li svg {
  width: 18px; height: 18px;
  flex: 0 0 auto;
}
.pair-card.haven .pair-list li svg { color: var(--dealer-green); }
.pair-card.aitcoh .pair-list li svg { color: var(--trust-blue); }

.pair-link {
  align-self: center;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--radiant-gold);
  color: var(--charcoal);
  display: grid; place-items: center;
  font-weight: 800;
  box-shadow: var(--shadow-2);
  margin: 0 calc(-1 * var(--s-2));
  z-index: 2;
}

/* -------------------------------------------------------------
   10. C-Easy section (Section 6)
   ------------------------------------------------------------- */
.ceasy { background: var(--white); }
.ceasy-letters {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--s-4);
  margin-top: var(--s-6);
}
@media (max-width: 880px) { .ceasy-letters { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .ceasy-letters { grid-template-columns: 1fr; } }

.letter-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  text-align: center;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.letter-card:hover {
  transform: translateY(-3px);
  border-color: var(--trust-blue);
  box-shadow: var(--shadow-2);
}
.letter-card .letter {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 3rem;
  color: var(--trust-blue);
  line-height: 1;
  margin-bottom: var(--s-2);
}
.letter-card h6 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  margin: 0 0 var(--s-2);
  color: var(--charcoal);
}
.letter-card p { font-size: 0.95rem; margin: 0; color: var(--slate); }

.ceasy-summary {
  margin-top: var(--s-7);
  background: var(--trust-blue-soft);
  border-radius: var(--r-xl);
  padding: var(--s-6);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--s-5);
}
@media (max-width: 720px) { .ceasy-summary { grid-template-columns: 1fr; } }
.ceasy-summary h4 { margin: 0 0 var(--s-2); color: var(--trust-blue-dark); }
.ceasy-summary p { margin: 0; }

/* -------------------------------------------------------------
   11. Benefits (Section 7) and Revenue paths (Section 8)
   ------------------------------------------------------------- */
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-4);
}
@media (max-width: 880px) { .benefits-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .benefits-grid { grid-template-columns: 1fr; } }

.benefit-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--s-5);
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
}
.benefit-card .num {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 0.95rem;
  color: var(--radiant-gold-deep);
  letter-spacing: 0.05em;
}
.benefit-card h6 { margin: 0; color: var(--charcoal); }
.benefit-card p { margin: 0; font-size: 0.95rem; color: var(--slate); }

.revenue { background: linear-gradient(180deg, #f4f8fd 0%, #ffffff 100%); }
.revenue-callout {
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 4px solid var(--radiant-gold-deep);
  padding: var(--s-5);
  border-radius: var(--r-md);
  margin: 0 0 var(--s-7);
  width: 100%;                  /* fills the unified deck column */
}
.revenue-callout strong { color: var(--charcoal); }
.revenue-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-4);
}
@media (max-width: 960px) { .revenue-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .revenue-grid { grid-template-columns: 1fr; } }

.revenue-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--s-5);
  position: relative;
}
.revenue-card .ico {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: var(--trust-blue-soft);
  color: var(--trust-blue-dark);
  display: grid; place-items: center;
  margin-bottom: var(--s-3);
}
.revenue-card .ico svg { width: 20px; height: 20px; }
.revenue-card h6 { margin: 0 0 var(--s-2); }
.revenue-card p { margin: 0; font-size: 0.95rem; }

/* -------------------------------------------------------------
   12. Calculator (Section 9)
   ------------------------------------------------------------- */
.calc-section { background: var(--bg-deep); color: white; }
.calc-section h2 { color: white; }
.calc-section .eyebrow { color: var(--radiant-gold); }
.calc-section .eyebrow::before { background: var(--radiant-gold); }
.calc-section .lead, .calc-section p { color: rgba(255,255,255,0.78); }

.calc-shell {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--s-6);
}
@media (max-width: 1000px) { .calc-shell { grid-template-columns: 1fr; } }

.calc-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--r-xl);
  padding: var(--s-6);
}
.calc-card h4 { color: white; margin: 0 0 var(--s-5); font-size: 1.2rem; }

.slider-row { margin-bottom: var(--s-5); }
.slider-row:last-child { margin-bottom: 0; }
.slider-row .top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--s-3);
  margin-bottom: var(--s-2);
}
.slider-row .label {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 0.95rem;
  color: rgba(255,255,255,0.85);
}
.slider-row .value {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--radiant-gold);
}

input[type="range"].slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: rgba(255,255,255,0.14);
  border-radius: 999px;
  outline: none;
}
input[type="range"].slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--radiant-gold);
  border: 3px solid var(--white);
  box-shadow: var(--shadow-2);
  cursor: pointer;
  transition: transform .12s var(--ease);
}
input[type="range"].slider::-webkit-slider-thumb:hover { transform: scale(1.08); }
input[type="range"].slider::-moz-range-thumb {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--radiant-gold);
  border: 3px solid var(--white);
  cursor: pointer;
}

.outputs { display: flex; flex-direction: column; gap: var(--s-4); }
.output-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--r-lg);
  padding: var(--s-4) var(--s-5);
}
.output-card .label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgba(255,255,255,0.65);
  margin-bottom: var(--s-2);
  font-weight: 700;
}
.output-card .value {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 1.9rem;
  color: white;
  letter-spacing: -0.01em;
}
.output-card .sub { font-size: 0.85rem; color: rgba(255,255,255,0.62); margin-top: 2px; }
.output-card.total {
  background: linear-gradient(135deg, rgba(253,216,65,0.18) 0%, rgba(37,94,160,0.30) 100%);
  border-color: rgba(253,216,65,0.4);
}
.output-card.total .value { color: var(--radiant-gold); font-size: 2.4rem; }

.calc-reset {
  margin-top: var(--s-4);
  background: transparent;
  border: 1px solid rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.85);
  padding: var(--s-2) var(--s-4);
  border-radius: var(--r-sm);
  font-family: "Montserrat", sans-serif;
  font-size: 0.85rem;
  cursor: pointer;
}
.calc-reset:hover { background: rgba(255,255,255,0.08); }

.calc-disclaimer {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.55);
  margin: var(--s-5) auto 0;
  max-width: 760px;
  text-align: center;
}
.calc-footnote {
  font-size: 0.78rem;
  color: rgba(255, 252, 229, 0.62);
  margin: var(--s-3) auto 0;
  max-width: 880px;
  padding: var(--s-3) var(--s-4);
  border-top: 1px solid rgba(255, 252, 229, 0.10);
  line-height: 1.5;
}
.calc-footnote strong { display: inline; color: rgba(255, 252, 229, 0.92); }

/* Featured revenue callout (Account is the asset) */
.revenue-callout--asset {
  border-left-color: var(--haven-blue) !important;
  background: linear-gradient(90deg, rgba(4, 107, 210, 0.06) 0%, rgba(253, 216, 65, 0.04) 100%);
}
.revenue-callout--asset strong { color: var(--haven-blue-dark); }

/* Featured revenue card (Extended account duration) */
.revenue-card--feature {
  border-top: 4px solid var(--haven-blue);
  background: linear-gradient(180deg, rgba(4, 107, 210, 0.04) 0%, #ffffff 50%);
}
.revenue-card--feature h6 { color: var(--haven-blue-dark); }

/* -------------------------------------------------------------
   13. Industry chart (Section 10)
   ------------------------------------------------------------- */
.chart-section { background: var(--white); }
.chart-wrap {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-6);
}
.chart-wrap svg { width: 100%; height: auto; display: block; }
.chart-bar { fill: var(--trust-blue); transition: fill .2s var(--ease); }
.chart-bar.gold { fill: var(--radiant-gold-deep); }
.chart-bar:hover { fill: var(--trust-blue-dark); }
.chart-label {
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  fill: var(--slate);
  font-weight: 600;
}
.chart-value {
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  fill: var(--charcoal);
  font-weight: 700;
}
.chart-baseline { stroke: var(--line); stroke-width: 1; }
.chart-disclaimer {
  font-size: 0.85rem;
  color: var(--mute);
  margin-top: var(--s-3);
}

/* -------------------------------------------------------------
   14. 90-Day Pilot (Section 11)
   ------------------------------------------------------------- */
.pilot { background: linear-gradient(180deg, #f4f8fd 0%, #ffffff 100%); }
.pilot-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-5);
  position: relative;
}
@media (max-width: 880px) { .pilot-grid { grid-template-columns: 1fr; } }

.pilot-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: var(--s-6);
  position: relative;
}
.pilot-card .month {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  background: var(--trust-blue-soft);
  color: var(--trust-blue-dark);
  padding: 4px var(--s-3);
  border-radius: 999px;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  margin-bottom: var(--s-4);
}
.pilot-card h5 { margin: 0 0 var(--s-4); }
.pilot-card ul { list-style: none; padding: 0; margin: 0; }
.pilot-card ul li {
  padding: var(--s-2) 0;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: var(--s-3);
  color: var(--slate);
}
.pilot-card ul li:last-child { border-bottom: 0; }
.pilot-card ul li::before {
  content: "";
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--radiant-gold);
  flex: 0 0 auto;
}

/* -------------------------------------------------------------
   15. Compliance section (Section 12)
   ------------------------------------------------------------- */
.compliance { background: var(--white); }
.compliance-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--s-3) var(--s-5);
}
@media (max-width: 720px) { .compliance-grid { grid-template-columns: 1fr; } }

.compliance-item {
  display: flex;
  align-items: flex-start;
  gap: var(--s-3);
  padding: var(--s-4);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.compliance-item .check {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--dealer-green-soft);
  color: var(--dealer-green-dark);
  display: grid; place-items: center;
  flex: 0 0 auto;
}
.compliance-item .check svg { width: 14px; height: 14px; }
.compliance-item p { margin: 0; color: var(--charcoal); font-weight: 600; }

/* -------------------------------------------------------------
   16. Closing CTA (Section 13)
   ------------------------------------------------------------- */
.closing {
  background:
    radial-gradient(50% 80% at 50% 0%, rgba(253,216,65,0.18) 0%, transparent 60%),
    linear-gradient(180deg, #0f2a4d 0%, #07182e 100%);
  color: white;
  text-align: center;
}
.closing h2 { color: white; max-width: 900px; margin: 0 auto var(--s-4); }
.closing .lead { color: rgba(255,255,255,0.85); margin: 0 auto var(--s-6); max-width: 720px; }
.closing .actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  justify-content: center;
}
.closing .meta {
  margin-top: var(--s-6);
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
}

/* -------------------------------------------------------------
   17. Footer
   ------------------------------------------------------------- */
.footer {
  background: var(--ink-deep);                         /* matches closing slide so the deck ends on one continuous dark block */
  border-top: 1px solid rgba(255, 252, 229, 0.10);
  padding: var(--s-6) var(--s-5);
  text-align: center;
  font-size: 0.85rem;
  color: #fffce5;
}
.footer .footer-inner { max-width: var(--container); margin: 0 auto; color: #fffce5; }

/* Closing slide: don't pad with extra blank navy below the CTA. Size to content so
   the footer butts directly against the last visible content line. */
.closing.deck-slide { min-height: auto; padding-block: clamp(3.5rem, 5vw, 5rem); }

/* -------------------------------------------------------------
   18. Reveal animation
   ------------------------------------------------------------- */
.reveal { opacity: 1; transform: none; }
.js .reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.js .reveal.is-in { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* -------------------------------------------------------------
   19. Print — one-page summary
   ------------------------------------------------------------- */
.print-only { display: none; }

@media print {
  /* Hide everything except the print-only summary block */
  body { background: white; color: black; font-size: 11pt; }
  .topnav, .hero, section:not(#print-summary), .footer { display: none !important; }
  .print-only { display: block; }
  #print-summary {
    display: block !important;
    padding: 0;
    color: black;
  }
  #print-summary h1,
  #print-summary h2,
  #print-summary h3,
  #print-summary h4 { color: black; }
  #print-summary .ps-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12pt;
  }
  #print-summary .ps-card {
    border: 1px solid #ccc;
    padding: 8pt;
    border-radius: 4pt;
    background: white;
  }
  #print-summary .ps-card h4 { font-size: 11pt; margin: 0 0 4pt; }
  #print-summary .ps-card ul { margin: 0; padding-left: 14pt; font-size: 9.5pt; }
  #print-summary .ps-card p { font-size: 9.5pt; margin: 2pt 0; color: black; }
  #print-summary .ps-head { text-align: center; margin-bottom: 12pt; padding-bottom: 8pt; border-bottom: 1.5pt solid #1b477e; }
  #print-summary .ps-head h1 { font-size: 18pt; margin: 0 0 4pt; }
  #print-summary .ps-head p { font-size: 10pt; color: #444; margin: 0; }
  #print-summary .ps-cta {
    margin-top: 10pt;
    padding: 8pt;
    background: #fffce5;
    border: 1px solid #c9a300;
    border-radius: 4pt;
    text-align: center;
    font-weight: 700;
    color: #1b477e;
  }
  a, a:visited { color: black; text-decoration: none; border: 0; }
  @page { margin: 0.5in; }
}

/* Print-summary block hidden on screen, shown on print only */
#print-summary { display: none; }

/* -------------------------------------------------------------
   D. Refined topnav brand block (stacked "Prepared for" labels)
   ------------------------------------------------------------- */
.topnav-brand-stack {
  display: inline-flex;
  flex-direction: column;
  line-height: 1.1;
  min-width: 0;
}
.topnav-brand-eyebrow {
  font-family: "Montserrat", sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgba(255, 252, 229, 0.62);
}
.topnav-brand-name {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 0.92rem;
  color: #fffce5;
  letter-spacing: -0.01em;
}
/* Collapse the stacked labels on small screens — icon-only */
@media (max-width: 960px) {
  .topnav-brand-stack { display: none; }
}

/* -------------------------------------------------------------
   D. Hero "Prepared for / Presented by" line
   ------------------------------------------------------------- */
.hero-prepared {
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--mute);
  margin: 0 0 var(--s-4);
}
.hero-prepared em.brand {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  color: var(--trust-blue-dark);
}
.hero-prepared .sep {
  color: var(--line);
  margin: 0 var(--s-2);
}

/* -------------------------------------------------------------
   D. Pair-card logo placeholder slots (no letter badges)
   ------------------------------------------------------------- */
.pair-card .logo-slot {
  background: transparent !important;
  border: 1.5px dashed var(--line);
  color: transparent;
  width: 56px;
  height: 56px;
  border-radius: 12px;
}
.pair-card.haven .logo-slot { border-color: var(--dealer-green); }
.pair-card.aitcoh .logo-slot { border-color: var(--trust-blue); }
.pair-card .name {
  font-size: 1.2rem;
  letter-spacing: -0.01em;
}

/* -------------------------------------------------------------
   Sources block (discreet, beneath stats-grid in #why-now)
   ------------------------------------------------------------- */
.sources {
  margin-top: var(--s-6);
  padding-top: var(--s-5);
  border-top: 1px solid var(--line);
  color: var(--slate);
  font-size: 0.82rem;
  line-height: 1.55;
}
.sources .sources-title {
  margin: 0 0 var(--s-2);
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mute, var(--slate));
}
.sources .sources-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-2) var(--s-5);
}
@media (max-width: 720px) {
  .sources .sources-list { grid-template-columns: 1fr; }
}
.sources .sources-list li {
  position: relative;
  padding-left: 0.9rem;
}
.sources .sources-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--line);
}
.sources a {
  color: var(--slate);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
  transition: color 0.2s ease, border-color 0.2s ease;
}
.sources a:hover,
.sources a:focus {
  color: var(--trust-blue);
  border-bottom-color: var(--trust-blue);
}

/* -------------------------------------------------------------
   Drafter B — Paired Ask / Provide sections
   ------------------------------------------------------------- */
.ask-provide {
  padding: var(--s-9) 0;
}
.ask-provide + .ask-provide {
  padding-top: 0;
}
.ask-provide .section-head { margin-bottom: var(--s-7); }

/* Tint variants over the existing .compliance-item primitive */
.compliance-item.haven-tint {
  border-left: 4px solid var(--dealer-green);
}
.compliance-item.haven-tint .check {
  background: var(--dealer-green-soft);
  color: var(--dealer-green-dark);
}
.compliance-item.aitcoh-tint {
  border-left: 4px solid var(--trust-blue);
}
.compliance-item.aitcoh-tint .check {
  background: var(--trust-blue-soft);
  color: var(--trust-blue-dark);
}

/* -------------------------------------------------------------
   Drafter B — How the Pilot Works flow
   ------------------------------------------------------------- */
.pilot-flow {
  background:
    radial-gradient(60% 80% at 50% 0%, rgba(217,236,255,0.45) 0%, transparent 70%),
    var(--bg);
  padding: var(--s-9) 0;
}
.flow-steps {
  list-style: none;
  padding: 0;
  margin: var(--s-7) 0 0;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: var(--s-3);
  align-items: stretch;
  counter-reset: flow;
}
.flow-step {
  position: relative;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--s-5) var(--s-4) var(--s-4);
  box-shadow: var(--shadow-1);
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}
.flow-step .step-num {
  display: inline-grid;
  place-items: center;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--trust-blue);
  color: var(--white);
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 700;
  font-size: 1rem;
  flex: 0 0 auto;
}
.flow-step h6 {
  margin: 0;
  font-size: 0.98rem;
  color: var(--charcoal);
  line-height: 1.35;
}
.flow-step .step-icon {
  width: 26px; height: 26px;
  color: var(--trust-blue-dark);
}
.flow-step .step-icon svg { width: 100%; height: 100%; }

/* Step 7 (handback to Haven) takes Haven's green to signal the loop */
.flow-step.is-handback {
  background: var(--dealer-green-soft);
  border-color: var(--dealer-green);
}
.flow-step.is-handback .step-num { background: var(--dealer-green-dark); }
.flow-step.is-handback .step-icon { color: var(--dealer-green-dark); }

@media (max-width: 1100px) {
  .flow-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .flow-steps { grid-template-columns: 1fr; }
}

.flow-foot {
  margin: var(--s-6) auto 0;
  font-size: 0.92rem;
  color: var(--slate);
  text-align: center;
  max-width: 760px;
}

/* -------------------------------------------------------------
   Drafter B — What We Will Measure (KPI dashboard)
   ------------------------------------------------------------- */
.measure-section {
  background: var(--bg-alt);
  padding: var(--s-9) 0;
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--s-4);
  margin-top: var(--s-7);
}
@media (max-width: 1000px) { .kpi-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px)  { .kpi-grid { grid-template-columns: 1fr; } }

.kpi-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--s-5) var(--s-4);
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  min-height: 140px;
}
.kpi-card .kpi-value {
  font-family: "Montserrat", system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--trust-blue-dark);
  line-height: 1;
}
.kpi-card .kpi-label {
  font-size: 0.92rem;
  color: var(--charcoal);
  font-weight: 600;
  line-height: 1.35;
}
.kpi-card .kpi-sub {
  margin-top: auto;
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
  font-weight: 600;
}
.kpi-card.is-target {
  background: var(--dealer-green-soft);
  border-color: var(--dealer-green);
}
.kpi-card.is-target .kpi-value { color: var(--dealer-green-dark); }
.kpi-card.is-target .kpi-sub   { color: var(--dealer-green-dark); }

/* =============================================================
   Refinement-pass components
   ============================================================= */

/* -- Hero "Created for" credit — solid cream so the Haven logo (dark) reads cleanly -- */
.hero-prepared { margin: 0 0 var(--s-5); padding: 0; }
.hero-credit {
  display: inline-flex;
  align-items: center;
  gap: var(--s-4);
  padding: 10px 22px 10px 18px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: #fffce5;                                                /* solid cream */
  border-radius: 999px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}
.hero-credit-label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #333333;                                                     /* dark text */
}
.hero-credit-logo {
  height: 32px;
  width: auto;
  display: block;
}
@media (max-width: 560px) {
  .hero-credit-logo { height: 26px; }
  .hero-credit { padding: 8px 18px 8px 14px; gap: var(--s-3); }
  .hero-credit-label { font-size: 0.70rem; }
}

/* Legacy class kept inert so old refs (if any) don't break */
.proposal-badge { display: inline-flex; align-items: center; }

/* -- Executive Summary card ---------------------------------- */
.exec-summary { background: linear-gradient(180deg, #ffffff 0%, #f4f8fd 100%); }
.exec-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-7) var(--s-6);
  box-shadow: var(--shadow-2);
  position: relative;
  overflow: hidden;
}
.exec-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; height: 4px; width: 100%;
  background: linear-gradient(90deg, var(--trust-blue) 0%, var(--dealer-green) 50%, var(--radiant-gold-deep) 100%);
}
.exec-card .eyebrow { margin-bottom: var(--s-3); }
.exec-card h2 {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  letter-spacing: -0.01em;
  margin-bottom: var(--s-4);
}
.exec-lead {
  font-size: 1.1rem;
  color: var(--slate);
  line-height: 1.55;
  margin-bottom: var(--s-5);
}
.exec-points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-3) var(--s-5);
}
.exec-points li {
  display: flex;
  align-items: flex-start;
  gap: var(--s-3);
  color: var(--charcoal);
  font-weight: 600;
}
.exec-points .dot {
  width: 6px; height: 6px; flex: 0 0 auto;
  border-radius: 50%;
  background: var(--radiant-gold);
  margin-top: 9px;
}
.exec-counsel {
  margin: var(--s-5) 0 0;
  text-align: center;
  font-size: 0.95rem;
  color: var(--slate);
  font-weight: 500;
}
.exec-counsel em { font-style: italic; }
@media (max-width: 720px) {
  .exec-points { grid-template-columns: 1fr; }
  .exec-card { padding: var(--s-6) var(--s-5); }
}

/* -- Pair-card identity block (replaces dashed logo slots) ---- */
.pair-card .identity {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* -- Ask + Provides combined two-column section -------------- */
.ask-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-5);
}
@media (max-width: 880px) { .ask-grid { grid-template-columns: 1fr; gap: var(--s-4); } }

.ask-column {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-6);
  border-top: 5px solid var(--line);
  box-shadow: var(--shadow-1);
}
.ask-column.haven  { border-top-color: var(--dealer-green); }
.ask-column.aitcoh { border-top-color: var(--trust-blue); }

.ask-header {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  margin-bottom: var(--s-5);
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--line);
}
.ask-chip {
  display: inline-flex;
  align-items: center;
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
}
.ask-column.haven .ask-chip {
  background: var(--dealer-green-soft);
  color: var(--dealer-green-dark);
}
.ask-column.aitcoh .ask-chip {
  background: var(--trust-blue-soft);
  color: var(--trust-blue-dark);
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.72rem;
}
.ask-column.aitcoh .ask-chip em.brand { font-size: inherit; }
.ask-header h3 {
  font-size: 1.15rem;
  margin: 0;
  color: var(--charcoal);
  line-height: 1.25;
}
.ask-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.ask-list li {
  display: flex;
  align-items: flex-start;
  gap: var(--s-3);
  padding: var(--s-3) 0;
  border-bottom: 1px dashed var(--line);
  color: var(--charcoal);
  font-size: 0.98rem;
  line-height: 1.45;
}
.ask-list li:last-child { border-bottom: 0; }
.ask-list .tick {
  width: 22px; height: 22px;
  flex: 0 0 auto;
  border-radius: 50%;
  display: grid; place-items: center;
  margin-top: 1px;
}
.ask-list .tick svg { width: 12px; height: 12px; }
.ask-column.haven .tick {
  background: var(--dealer-green-soft);
  color: var(--dealer-green-dark);
}
.ask-column.aitcoh .tick {
  background: var(--trust-blue-soft);
  color: var(--trust-blue-dark);
}

/* -- Pilot flow 4+3 layout ----------------------------------- */
.flow-steps--4plus3 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--s-4);
}
.flow-steps--4plus3 .flow-step:nth-child(5),
.flow-steps--4plus3 .flow-step:nth-child(6),
.flow-steps--4plus3 .flow-step:nth-child(7) {
  /* row 2: 3 cards centered */
}
.flow-steps--4plus3 .flow-step:nth-child(5) { grid-column: 1 / span 1; }
@media (min-width: 881px) {
  .flow-steps--4plus3 .flow-step:nth-child(5) { grid-column-start: 1; }
  /* On the 4-col grid, items 5/6/7 fall into columns 1–3, leaving col 4 empty on row 2.
     Shift row 2 inward by one column for visual balance. */
  .flow-steps--4plus3 { grid-template-columns: repeat(12, 1fr); }
  .flow-steps--4plus3 .flow-step { grid-column: span 3; }
  .flow-steps--4plus3 .flow-step:nth-child(5) { grid-column: 2 / span 3; }
  .flow-steps--4plus3 .flow-step:nth-child(6) { grid-column: 5 / span 3; }
  .flow-steps--4plus3 .flow-step:nth-child(7) { grid-column: 8 / span 3; }
}
@media (max-width: 880px) { .flow-steps--4plus3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .flow-steps--4plus3 { grid-template-columns: 1fr; } }
@media (min-width: 881px) {
  /* Avoid an awkward orphan in 4-column layout when only one wide column remains */
  .flow-steps--4plus3 .flow-step { padding: var(--s-4); }
}

/* -- Calculator output grouping + Not-shared-revenue badge --- */
.output-group { display: flex; flex-direction: column; gap: var(--s-2); }
.output-group-label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgba(255,255,255,0.55);
  padding-left: var(--s-2);
}
.output-group-label em.brand { color: var(--radiant-gold); }
.output-group--total .output-group-label { color: var(--radiant-gold); }
.output-card { position: relative; }
.not-shared-badge {
  position: absolute;
  top: -10px;
  right: var(--s-3);
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--radiant-gold);
  color: var(--charcoal);
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: var(--shadow-1);
}

/* -- Ownership-split calculator layout (AITCOH | Haven side-by-side) -- */
.output-owner-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s-4);
  margin-top: var(--s-5);
}
@media (max-width: 720px) {
  .output-owner-grid { grid-template-columns: 1fr; }
}
.output-owner-label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: var(--s-2);
  padding-left: var(--s-2);
}
.output-owner--aitcoh .output-owner-label { color: var(--energy-yellow); }
.output-owner--haven  .output-owner-label { color: var(--haven-blue-mint); }
.output-owner .output-card { border-top: 4px solid transparent; }
.output-owner--aitcoh .output-card { border-top-color: var(--energy-yellow); }
.output-owner--haven  .output-card { border-top-color: var(--haven-blue); }
.output-owner .value { font-size: 1.9rem !important; color: #fffce5 !important; }
.output-owner--aitcoh .value { color: var(--energy-yellow) !important; }
.output-owner--haven  .value { color: var(--haven-blue-mint) !important; }
.sub-breakdown {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: var(--s-2);
  font-size: 0.82rem;
  color: rgba(255, 252, 229, 0.78);
}
.sub-breakdown strong { color: #fffce5; font-weight: 700; }

/* The 'combined' figure is intentionally de-emphasized — it's secondary
   to the per-owner subtotals above. */
.output-not-shared {
  margin: var(--s-5) 0 0;
  padding: var(--s-3) var(--s-4);
  border-left: 3px solid rgba(255, 252, 229, 0.30);
  background: rgba(255, 252, 229, 0.04);
  border-radius: var(--r-md);
  font-size: 0.85rem;
  color: rgba(255, 252, 229, 0.78);
  line-height: 1.5;
}
.output-blended-meta { display: block; margin-top: 4px; font-size: 0.78rem; color: rgba(255, 252, 229, 0.55); }
.output-blended-meta strong { color: rgba(255, 252, 229, 0.85); }

/* -- KPI dashboard tightening ------------------------------- */
.kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--s-3);
}
.kpi-card { padding: var(--s-4); }
.kpi-card .kpi-value { font-size: 1.65rem; line-height: 1.1; }
.kpi-card .kpi-label { font-size: 0.92rem; line-height: 1.35; margin-top: 2px; }
.kpi-card .kpi-sub   { font-size: 0.7rem; margin-top: var(--s-3); }

/* -- Industry chart premium callout -------------------------- */
.chart-callout {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  padding: var(--s-4) var(--s-5);
  margin-bottom: var(--s-5);
  background: linear-gradient(90deg, rgba(253,216,65,0.18) 0%, rgba(37,94,160,0.08) 100%);
  border: 1px solid var(--line);
  border-left: 4px solid var(--radiant-gold-deep);
  border-radius: var(--r-md);
}
.chart-callout-key {
  font-family: "Montserrat", sans-serif;
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--radiant-gold-deep);
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.chart-callout-text {
  color: var(--charcoal);
  font-size: 0.98rem;
  line-height: 1.45;
}
@media (max-width: 560px) {
  .chart-callout { flex-direction: column; align-items: flex-start; gap: var(--s-2); }
  .chart-callout-key { font-size: 1.4rem; }
}

/* -- Compliance counsel-review note ------------------------- */
.compliance-note {
  display: flex;
  align-items: flex-start;
  gap: var(--s-3);
  width: 100%;                  /* fills the unified deck column */
  margin: var(--s-6) 0 0;
  padding: var(--s-3) var(--s-4);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--slate);
  text-align: left;
}

/* Elevated regulatory banner — sits ABOVE the compliance grid as a prerequisite, not a footnote */
.compliance-banner {
  display: flex;
  align-items: flex-start;
  gap: var(--s-4);
  width: 100%;
  margin: 0 0 var(--s-5);
  padding: var(--s-5) var(--s-5);
  background: linear-gradient(90deg, rgba(37, 94, 160, 0.08) 0%, rgba(253, 216, 65, 0.10) 100%);
  border: 1px solid var(--aitcoh-blue-soft);
  border-left: 5px solid var(--aitcoh-blue);
  border-radius: var(--r-lg);
  font-size: 0.98rem;
  line-height: 1.55;
  color: var(--charcoal);
}
.compliance-banner-icon {
  flex: 0 0 auto;
  width: 28px; height: 28px;
  color: var(--aitcoh-blue);
  margin-top: 2px;
}
.compliance-banner-icon svg { width: 28px; height: 28px; }
.compliance-banner strong {
  display: block;
  font-family: "Montserrat", sans-serif;
  font-size: 1.02rem;
  margin-bottom: 4px;
  color: var(--aitcoh-blue-dark);
}
.compliance-note-icon {
  flex: 0 0 auto;
  width: 18px; height: 18px;
  color: var(--mute);
  margin-top: 2px;
}
.compliance-note-icon svg { width: 18px; height: 18px; }

/* =============================================================
   DECK SYSTEM — scrolling-slide framework
   -------------------------------------------------------------
   Converts existing sections into boardroom-rhythm slides with
   numbered kickers, brand-aware accent palettes, and a desktop
   progress rail. Preserves all blue/dark sections untouched.
   ============================================================= */

/* =============================================================
   UNIFIED PARTNERSHIP COLOR SYSTEM
   -------------------------------------------------------------
   Source of truth:
     • AITCOH (aitcoh.com) — Trust Blue + Radiant Gold per
       BRAND.md (corporate/Products division).
     • Haven Home Health & Hospice (havenhome.us) — vibrant blue
       (#046BD2 primary, #1c86c6 accent) extracted from live
       inline styles on the production site. Replaces the prior
       green placeholder.
     • Energy palette — deep navy + saturated yellow extends the
       closing slide's high-contrast presentation feel across the
       whole deck.

   Token usage:
     --ink-*        dark surfaces (closing, gap, calc, hero washes)
     --energy-*     yellow/gold hero accent — CTAs, slide chips,
                    pull-quotes, stat highlights, dividers
     --haven-*      Haven brand blue family
     --aitcoh-*     AITCOH brand navy-blue family
     --paper-*      light-surface variants
   ============================================================= */
:root {
  /* Deep navy / ink surface family (extends the closing-slide vibe) */
  --ink-deep:     #07182e;   /* deepest navy — bottom of closing gradient */
  --ink:          #0f2a4d;   /* base navy — gap/calc/closing top */
  --ink-soft:     #1a3a64;   /* nested glass panels on navy */
  --ink-line:     rgba(255,255,255,0.10);

  /* Energy palette — promoted radiant-gold for hero-accent role */
  --energy-yellow:        #fdd841;   /* core CTA / chip yellow */
  --energy-yellow-bright: #ffe25a;   /* hover state */
  --energy-yellow-deep:   #f5c500;   /* on-white text-on-yellow */
  --energy-amber:         #c9a300;   /* text on light backgrounds */
  --energy-glow:          rgba(253, 216, 65, 0.32); /* soft glow */

  /* Light surfaces */
  --paper-cool:  #fafbfd;          /* default light bg */
  --paper-warm:  #fffaf0;          /* gold-tinted light bg */
  --paper-blue:  #f4f8fd;          /* blue-tinted light bg */

  /* Haven brand — vibrant blue family (from live havenhome.us) */
  --haven-blue:        #046BD2;
  --haven-blue-dark:   #0353a3;
  --haven-blue-soft:   #e6f0fa;
  --haven-blue-mint:   #7acdee;    /* Haven sky accent for secondary highlights */

  /* AITCOH brand — Trust Blue family (from brand/BRAND.md) */
  --aitcoh-blue:       #255ea0;
  --aitcoh-blue-dark:  #1b477e;
  --aitcoh-blue-soft:  #d9ecff;
  --aitcoh-gold:       var(--energy-yellow);

  /* Brand aliases used by the slide system + utility classes.
     IMPORTANT: --haven-primary now points to Haven's actual blue.
     The legacy --dealer-green-* tokens stay declared so old rules
     don't break, but they're no longer the Haven channel. */
  --haven-primary: var(--haven-blue);
  --haven-dark:    var(--haven-blue-dark);
  --haven-soft:    var(--haven-blue-soft);
  --haven-accent:  var(--haven-blue-mint);

  --aitcoh-primary: var(--aitcoh-blue);
  --aitcoh-dark:    var(--aitcoh-blue-dark);
  --aitcoh-soft:    var(--aitcoh-blue-soft);
  --aitcoh-accent:  var(--energy-yellow);
}

/* ---- Slide framing --------------------------------------- */
.deck-slide {
  min-height: 82vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-block: clamp(5rem, 8vw, 8rem);
  position: relative;
}
.deck-slide > .container,
.deck-slide > .container-narrow {
  width: 100%;
}
.slide-frame { width: 100%; }

/* ---- Slide label (kicker with numbered chip) --------------
   data-slide attribute supplies the slide number — set it on the
   element in HTML, e.g. data-slide="04". */
.slide-label {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  font-family: "Montserrat", sans-serif;
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-weight: 800;
  color: var(--slate);
  margin: 0 0 var(--s-4);
}
.slide-label::before {
  content: attr(data-slide);
  display: inline-grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  background: var(--aitcoh-soft);
  color: var(--aitcoh-dark);
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}
.slide-label .slash { color: var(--mute); font-weight: 600; }

/* Centered variant for sections with .section-head.center */
.deck-slide .section-head .slide-label,
.section-head .slide-label { justify-content: flex-start; }
.section-head { text-align: left; }

/* ---- Slide label on dark backgrounds (gap/calc/closing) -- */
.slide-label--on-dark {
  color: rgba(255,255,255,0.78);
}
.slide-label--on-dark::before {
  background: rgba(253, 216, 65, 0.18);
  color: var(--radiant-gold);
}
.slide-label--on-dark .slash { color: rgba(255,255,255,0.45); }

/* ---- Brand-aware accent classes -------------------------- */
.brand-haven  { color: var(--haven-dark); }
.brand-aitcoh { color: var(--aitcoh-dark); }
.label-haven  { color: var(--haven-dark); }
.label-aitcoh { color: var(--aitcoh-dark); }

.card-haven { border-top: 5px solid var(--haven-primary); }
.card-aitcoh { border-top: 5px solid var(--aitcoh-primary); }

.icon-haven {
  background: var(--haven-soft);
  color: var(--haven-dark);
}
.icon-aitcoh {
  background: var(--aitcoh-soft);
  color: var(--aitcoh-dark);
}

/* ---- Section overrides: Haven Benefits → Haven palette ---
   Scoped so it doesn't bleed into anything else. */
#haven-benefits .eyebrow { color: var(--haven-dark); }
#haven-benefits .eyebrow::before { background: var(--haven-primary); }
#haven-benefits .benefit-card { border-top: 3px solid var(--haven-soft); }
#haven-benefits .benefit-card .num { color: var(--haven-primary); }
#haven-benefits .slide-label::before {
  background: var(--haven-soft);
  color: var(--haven-dark);
}

/* ---- AITCOH-led: C-Easy summary → gold accent ----------- */
#c-easy .ceasy-summary { border-left: 4px solid var(--aitcoh-accent); }

/* ---- Ask + Provides: stretch the two columns; no central pill ---- */
.ask-grid {
  position: relative;
  align-items: stretch;
}

/* ---- Partnership model: ensure 50/50 visual weight ------ */
.pair { align-items: stretch; }
.pair-card { display: flex; flex-direction: column; }
.pair-card .pair-list { flex: 1; }

/* ---- Right-side progress rail --------------------------- */
.deck-rail {
  position: fixed;
  top: 50%;
  right: 18px;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: var(--s-3) 6px;
  background: rgba(255,255,255,0.65);
  backdrop-filter: saturate(160%) blur(10px);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: var(--shadow-1);
  z-index: 40;
}
.deck-rail-dot {
  display: block;
  width: 18px;
  height: 14px;
  position: relative;
  border-bottom: 0;
}
.deck-rail-dot::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--line);
  transition: background .2s var(--ease), width .2s var(--ease), height .2s var(--ease);
}
.deck-rail-dot:hover::after,
.deck-rail-dot:focus::after { background: var(--mute); }
.deck-rail-dot.is-active::after {
  background: var(--aitcoh-primary);
  width: 8px; height: 8px;
}
.deck-rail-dot.is-active[data-brand="haven"]::after { background: var(--haven-primary); }
.deck-rail-dot.is-active[data-brand="joint"]::after { background: var(--radiant-gold-deep); }
.deck-rail-dot .tip {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--charcoal);
  color: var(--white);
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 6px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s var(--ease);
}
.deck-rail-dot:hover .tip,
.deck-rail-dot:focus .tip { opacity: 1; }

@media (max-width: 1080px) {
  .deck-rail { display: none; }
}

/* ---- Brand-aware active nav underline (optional) -------- */
.topnav-links a.is-active[data-brand="haven"]  { border-bottom-color: var(--haven-primary); }
.topnav-links a.is-active[data-brand="aitcoh"] { border-bottom-color: var(--aitcoh-primary); }
.topnav-links a.is-active[data-brand="joint"]  { border-bottom-color: var(--radiant-gold); }

/* ---- Mobile fallback: don't force tall slides on phones - */
@media (max-width: 760px) {
  .deck-slide {
    min-height: auto;
    padding-block: 4rem;
  }
  /* Ask-grid divider becomes inline on stacked layout */
  .ask-grid::before { display: none; }
}

/* =============================================================
   VIBRANCY LAYER
   -------------------------------------------------------------
   Injects the reference image's navy + saturated-yellow energy
   across every slide without modifying the calculator section or
   the existing dark sections' background treatments.
   ============================================================= */

/* ---- Bolder slide-label chips with filled yellow on light bg
   The default .slide-label chip used a soft blue ::before. On the
   reference image, the "16" chip is filled yellow on dark. We
   make light-slide chips read as filled yellow too — a strong
   recurring visual signature throughout the deck. */
.deck-slide:not(.calc-section):not(.gap-section):not(.closing) .slide-label::before {
  background: var(--energy-yellow);
  color: var(--ink);
  font-weight: 800;
  box-shadow: 0 4px 12px var(--energy-glow);
}

/* On-dark variant: keep the gold rim but use translucent fill for
   the existing dark sections so they still match their original
   visual treatment. */
.slide-label--on-dark::before {
  background: rgba(253, 216, 65, 0.16) !important;
  color: var(--energy-yellow) !important;
  box-shadow: inset 0 0 0 1px rgba(253, 216, 65, 0.42),
              0 4px 12px var(--energy-glow);
}

/* ---- UNIFIED LIGHT-SLIDE BACKGROUND + TOP STRIPE ----
   One background + one top accent stripe for EVERY non-dark slide,
   so the deck reads as a single design system rather than a series
   of color-blocked landing-page sections. Brand color lives in
   accents (icons, chips, card top-borders), never in full-section
   washes. Dark sections (.gap-section, .calc-section, .closing)
   keep their existing visual treatment per the hard rule. */
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) {
  background:
    radial-gradient(circle at 12% 8%, rgba(37, 94, 160, 0.06), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f6f9fc 100%) !important;
  position: relative;
}
.deck-slide:not(.gap-section):not(.calc-section):not(.closing)::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--aitcoh-blue), var(--energy-yellow));
  pointer-events: none;
  z-index: 1;
}

/* ---- Glow-button polish: brighter primary CTA on dark slides --- */
.closing .btn-gold {
  background: var(--energy-yellow);
  box-shadow: 0 6px 24px var(--energy-glow), 0 2px 4px rgba(0,0,0,0.18);
}
.closing .btn-gold:hover {
  background: var(--energy-yellow-bright);
  box-shadow: 0 10px 30px var(--energy-glow), 0 4px 8px rgba(0,0,0,0.22);
}

/* ---- Stat-card top accent — alternating brand stripe.
   Hooks into the existing .stats-grid in #why-now. nth-of-type to
   rotate Haven blue → AITCOH navy → Gold across the 6 stat cards. */
#why-now .stat-card {
  border-top: 3px solid transparent;
  position: relative;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
#why-now .stat-card:nth-of-type(3n+1) { border-top-color: var(--haven-blue); }
#why-now .stat-card:nth-of-type(3n+2) { border-top-color: var(--aitcoh-blue-dark); }
#why-now .stat-card:nth-of-type(3n+3) { border-top-color: var(--energy-yellow-deep); }
#why-now .stat-card:nth-of-type(3n+1) .stat { color: var(--haven-blue-dark); }
#why-now .stat-card:nth-of-type(3n+3) .stat { color: var(--energy-amber); }

/* ---- Hero — brighter CTA + yellow glow on the proposal badge --- */
.hero .proposal-badge {
  background: var(--energy-yellow);
  color: var(--ink);
  border-color: var(--energy-yellow-deep);
  box-shadow: 0 4px 14px var(--energy-glow);
}
.hero .btn-primary {
  background: var(--ink);
  box-shadow: 0 6px 20px rgba(15, 42, 77, 0.25);
}
.hero .btn-primary:hover { background: var(--ink-deep); }

/* ---- The Gap (already dark) — yellow inline accents --- */
.gap-section .gap-callout {
  border-color: rgba(253, 216, 65, 0.18);
  box-shadow: 0 0 0 1px rgba(253, 216, 65, 0.10) inset,
              0 8px 32px rgba(0,0,0,0.20);
}
.gap-section .gap-callout .big { color: var(--energy-yellow-bright); }
.gap-section .gap-list .x {
  background: rgba(253, 216, 65, 0.20);
  color: var(--energy-yellow-bright);
  border: 1px solid rgba(253, 216, 65, 0.30);
}

/* ---- Why Haven & Haven Benefits — vibrant Haven blue accents --- */
#haven-fit .fit-card .ico,
#haven-benefits .icon-haven {
  background: var(--haven-blue-soft);
  color: var(--haven-blue);
}
#haven-fit .fit-card { border-top: 3px solid var(--haven-blue-soft); }
#haven-fit .fit-card:hover { border-top-color: var(--haven-blue); }

/* Stronger Haven Benefits accent (overrides earlier rule with new blue) */
#haven-benefits .eyebrow { color: var(--haven-blue-dark); }
#haven-benefits .eyebrow::before { background: var(--haven-blue); }
#haven-benefits .benefit-card { border-top: 3px solid var(--haven-blue-soft); transition: border-color .2s var(--ease), transform .2s var(--ease); }
#haven-benefits .benefit-card:hover { border-top-color: var(--haven-blue); transform: translateY(-2px); }
#haven-benefits .benefit-card .num { color: var(--haven-blue); }
#haven-benefits .slide-label::before {
  background: var(--haven-blue);
  color: #fff;
  box-shadow: 0 4px 14px rgba(4, 107, 210, 0.30);
}

/* ---- Partnership pair-cards — distinct Haven blue vs AITCOH navy
   Re-skin from the legacy green/blue treatment. */
.pair-card.haven { border-top-color: var(--haven-blue); }
.pair-card.haven .role { color: var(--haven-blue-dark); }
.pair-card.haven .pair-list li svg { color: var(--haven-blue); }
.pair-card.aitcoh { border-top-color: var(--aitcoh-blue); }
.pair-card.aitcoh .role { color: var(--aitcoh-blue-dark); }
.pair-card.aitcoh .pair-list li svg { color: var(--aitcoh-blue); }
.pair-link {
  background: var(--energy-yellow);
  box-shadow: 0 8px 24px var(--energy-glow), 0 2px 4px rgba(0,0,0,0.10);
}

/* ---- Ask + Provides — Haven blue vs AITCOH navy treatment --- */
.ask-column.haven { border-top-color: var(--haven-blue); }
.ask-column.haven .ask-chip { background: var(--haven-blue-soft); color: var(--haven-blue-dark); }
.ask-column.haven .tick { background: var(--haven-blue-soft); color: var(--haven-blue); }
.ask-column.aitcoh { border-top-color: var(--aitcoh-blue); }
.ask-column.aitcoh .ask-chip { background: var(--aitcoh-blue-soft); color: var(--aitcoh-blue-dark); }
.ask-column.aitcoh .tick { background: var(--aitcoh-blue-soft); color: var(--aitcoh-blue); }
/* Slide 08 central connector removed per spec */

/* ---- C-Easy letter cards — AITCOH blue + gold accent on summary --- */
#c-easy .letter-card .letter { color: var(--aitcoh-blue); }
#c-easy .letter-card:hover { border-color: var(--aitcoh-blue); }
#c-easy .letter-card:hover .letter { color: var(--energy-amber); }
#c-easy .ceasy-summary {
  background: linear-gradient(135deg, var(--aitcoh-blue-soft) 0%, var(--paper-warm) 100%);
  border-left: 6px solid var(--energy-yellow);
  border-radius: var(--r-xl);
  box-shadow: 0 10px 28px rgba(37, 94, 160, 0.10);
}

/* ---- Program Sustainability — gold horizontal stripe + warm bg already set
   Revenue cards gain a gold left edge accent. */
#revenue .revenue-card {
  border-left: 3px solid transparent;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
#revenue .revenue-card:hover { border-left-color: var(--energy-yellow); transform: translateY(-2px); }
#revenue .revenue-card .ico {
  background: var(--aitcoh-blue-soft);
  color: var(--aitcoh-blue-dark);
}
#revenue .revenue-callout { border-left-color: var(--energy-yellow-deep); }

/* ---- Industry chart — gold-tinted callout, brighter chart bars --- */
.chart-callout {
  background: linear-gradient(90deg, rgba(253, 216, 65, 0.20) 0%, rgba(37, 94, 160, 0.08) 100%);
  border-left-color: var(--energy-yellow);
  box-shadow: 0 4px 18px rgba(253, 216, 65, 0.18);
}
.chart-callout-key { color: var(--energy-amber); }
.chart-bar { fill: var(--aitcoh-blue); }
.chart-bar:hover { fill: var(--aitcoh-blue-dark); }
.chart-bar.gold { fill: var(--energy-yellow-deep); }

/* ---- Pilot Flow — gold step-numbers, navy text --- */
#pilot-flow .step-num {
  background: var(--energy-yellow);
  color: var(--ink);
  box-shadow: 0 4px 12px var(--energy-glow);
}
#pilot-flow .step-icon {
  background: var(--aitcoh-blue-soft);
  color: var(--aitcoh-blue);
}
#pilot-flow .flow-step.is-handback .step-num {
  background: var(--haven-blue);
  color: #fff;
  box-shadow: 0 4px 12px rgba(4, 107, 210, 0.30);
}
#pilot-flow .flow-step.is-handback .step-icon {
  background: var(--haven-blue-soft);
  color: var(--haven-blue);
}

/* ---- 90-Day Pilot — gold month chips, alternating card top stripe --- */
#pilot .pilot-card .month {
  background: var(--energy-yellow);
  color: var(--ink);
  font-weight: 800;
}
#pilot .pilot-card { border-top: 3px solid var(--haven-blue-soft); }
#pilot .pilot-card:nth-of-type(2) { border-top-color: var(--energy-yellow); }
#pilot .pilot-card:nth-of-type(3) { border-top-color: var(--aitcoh-blue); }
#pilot .pilot-card ul li::before { background: var(--energy-yellow-deep); }

/* ---- Measure / KPI dashboard — bolder colored sub-labels --- */
.kpi-card .kpi-sub {
  color: var(--haven-blue);
  font-weight: 700;
}
.kpi-card:nth-of-type(3n+2) .kpi-sub { color: var(--aitcoh-blue); }
.kpi-card:nth-of-type(3n+3) .kpi-sub { color: var(--energy-amber); }
.kpi-card { border-top: 3px solid transparent; }
.kpi-card:nth-of-type(3n+1) { border-top-color: var(--haven-blue-soft); }
.kpi-card:nth-of-type(3n+2) { border-top-color: var(--aitcoh-blue-soft); }
.kpi-card:nth-of-type(3n+3) { border-top-color: rgba(253, 216, 65, 0.5); }
.kpi-card.is-target { border-top: 3px solid var(--haven-blue) !important; }
.kpi-card.is-target .kpi-value { color: var(--haven-blue-dark); }
.kpi-card.is-target .kpi-sub { color: var(--haven-blue-dark); }

/* ---- Compliance grid — subtle navy tint + gold-ringed checks --- */
.compliance .compliance-item {
  background: linear-gradient(180deg, #ffffff 0%, var(--paper-cool) 100%);
}
.compliance .compliance-item .check {
  background: var(--aitcoh-blue-soft);
  color: var(--aitcoh-blue);
  box-shadow: inset 0 0 0 2px rgba(253, 216, 65, 0.18);
}
.compliance-note {
  border-left: 3px solid var(--energy-yellow-deep);
  background: linear-gradient(90deg, var(--paper-warm) 0%, #ffffff 100%);
}

/* ---- Calculator (.calc-section) — UNTOUCHED visually.
   Only the slide-label--on-dark chip inherits the new energy glow,
   nothing else changes. Re-asserted here so a later utility class
   can't bleed into the calculator surface. */

/* ---- Closing — already the reference benchmark. Strengthen the
   gold glow on the primary CTA so the deck closes on a bright note. */
.closing .btn-ghost { border-color: rgba(253, 216, 65, 0.55); color: #fff; }
.closing .btn-ghost:hover { border-color: var(--energy-yellow); background: rgba(253, 216, 65, 0.10); color: #fff; }

/* ---- Progress rail — preserved per user instruction; only the
   active dot picks up the new energy palette for joint slides. */
.deck-rail-dot.is-active::after { background: var(--aitcoh-blue); }
.deck-rail-dot.is-active[data-brand="haven"]::after { background: var(--haven-blue); }
.deck-rail-dot.is-active[data-brand="aitcoh"]::after { background: var(--aitcoh-blue); }
.deck-rail-dot.is-active[data-brand="joint"]::after { background: var(--energy-yellow-deep); }

/* ---- Topnav — gold underline for the active link by default,
   per-brand override remains in place. */
.topnav-links a.is-active { border-bottom-color: var(--energy-yellow); }

/* ---- Pillar chips in hero — punchier dot colors --- */
.pillar-chip .dot { background: var(--aitcoh-blue); }
.pillar-chip.haven .dot,
.pillar-chip.green .dot { background: var(--haven-blue); }
.pillar-chip.gold .dot { background: var(--energy-yellow-deep); }

/* ---- Legacy hero-card.haven still references --dealer-green;
   re-skin so it tracks Haven's actual brand color. */
.hero-card.haven { border-top: 4px solid var(--haven-blue); }
.hero-card.haven .icon {
  background: var(--haven-blue-soft);
  color: var(--haven-blue);
}

/* ---- partnership-headline .green color update for Haven blue --- */
.partnership-headline .haven,
.partnership-headline .green { color: var(--haven-blue-dark); }

/* Topnav partner text — now cream for the dark-frosted navbar (see canonical rule above) */

/* =============================================================
   TAKEAWAY STRIP
   -------------------------------------------------------------
   Consistent slim payoff bar at the bottom of major light slides
   (skips .gap-section, .calc-section, .closing per hard rule).
   ============================================================= */
.takeaway {
  margin: var(--s-7) 0 0;
  padding: var(--s-3) var(--s-5);
  background: linear-gradient(90deg, var(--energy-yellow) 0%, rgba(253, 216, 65, 0.22) 50%, transparent 100%);
  border-left: 4px solid var(--energy-yellow-deep);
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  gap: var(--s-4);
  width: 100%;                  /* fills the unified deck column */
  box-shadow: 0 4px 14px var(--energy-glow);
}
.takeaway-label {
  font-family: "Montserrat", sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
  flex-shrink: 0;
}
.takeaway-text {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4;
  color: var(--charcoal);
  font-weight: 500;
}
@media (max-width: 560px) {
  .takeaway { flex-direction: column; align-items: flex-start; gap: var(--s-2); }
}

/* =============================================================
   PILOT consolidation subhead
   ============================================================= */
.subhead-block {
  font-family: "Montserrat", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--ink);
  margin: var(--s-7) 0 var(--s-5);
  padding-left: var(--s-3);
  border-left: 3px solid var(--energy-yellow);
}
.subhead-block:first-of-type { margin-top: var(--s-6); }

/* =============================================================
   UNIFIED DECK SYSTEM — slide-panel + universal card language
   -------------------------------------------------------------
   Goal: every light slide reads as part of the same deck. No
   per-section brand washes. Each light slide places its grid
   inside a .slide-panel; every card class shares one base style.
   Brand color lives in small accents (top borders, icons, chips).
   Dark sections (.gap-section, .calc-section, .closing) are
   excluded from these rules so their treatments stay intact.
   ============================================================= */

/* The single content panel inside every light slide */
.slide-panel {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(15, 42, 77, 0.10);
  border-radius: 28px;
  box-shadow: 0 18px 48px rgba(15, 42, 77, 0.08);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}
.slide-panel + .slide-panel { margin-top: var(--s-5); }

/* ---- One universal card style ----
   Applies to every card class across the deck. Later in the
   stylesheet, so it overrides the legacy per-card declarations
   without us having to delete them. */
.stat-card,
.fit-card,
.benefit-card,
.revenue-card,
.pilot-card,
.kpi-card,
.compliance-item,
.letter-card,
.pair-card {
  background: #ffffff;
  border: 1px solid rgba(15, 42, 77, 0.10);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(15, 42, 77, 0.055);
  padding: 1.35rem;
}

/* Same hover everywhere */
.stat-card:hover,
.fit-card:hover,
.benefit-card:hover,
.revenue-card:hover,
.pilot-card:hover,
.kpi-card:hover,
.compliance-item:hover,
.letter-card:hover,
.pair-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(15, 42, 77, 0.09);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}

/* Consistent card title typography */
.stat-card h5,
.fit-card h5,
.benefit-card h6,
.revenue-card h6,
.pilot-card h5,
.kpi-card .kpi-label,
.compliance-item h6,
.letter-card h6,
.pair-card .name {
  font-size: 1rem;
  line-height: 1.25;
  margin-bottom: 0.4rem;
}

/* Consistent card body typography */
.stat-card .stat-label,
.stat-card .stat-source,
.fit-card p,
.benefit-card p,
.revenue-card p,
.pilot-card li,
.compliance-item p,
.letter-card p {
  font-size: 0.95rem;
  line-height: 1.42;
}

/* ---- Section-specific accents stay as ACCENTS, not full washes
   Brand color is allowed on:
     - card top borders (small visual cue)
     - icon backgrounds
     - chip pills
   …but never as a full-section background wash. */

/* Why Now: keep alternating top-border color on stat cards (already in place) */
/* Why Haven cards — Haven-blue top border on hover only */
#haven-fit .fit-card { border-top: 3px solid transparent; }
#haven-fit .fit-card:hover { border-top-color: var(--haven-blue); }

/* Haven Benefits cards — Haven-blue numbering, soft-blue top border */
#haven-benefits .benefit-card { border-top: 3px solid var(--haven-blue-soft); }
#haven-benefits .benefit-card:hover { border-top-color: var(--haven-blue); }
#haven-benefits .benefit-card .num { color: var(--haven-blue); }

/* C-Easy letter cards — AITCOH-blue letter color */
#c-easy .letter-card { border-top: 3px solid transparent; }
#c-easy .letter-card:hover { border-top-color: var(--aitcoh-blue); }

/* Revenue cards — gold left accent on hover */
#revenue .revenue-card { border-left: 3px solid transparent; padding-left: 1.35rem; }
#revenue .revenue-card:hover { border-left-color: var(--energy-yellow); }

/* KPI cards — rotating brand stripe stays for color rhythm */

/* Pair-cards keep their distinct top-border (Haven blue / AITCOH navy) */
.pair-card.haven  { border-top: 5px solid var(--haven-blue); }
.pair-card.aitcoh { border-top: 5px solid var(--aitcoh-blue); }

/* Compliance items keep a single check icon, no per-card bg variation */
.compliance .compliance-item { background: #ffffff; }

/* Ensure the section content sits above the top accent stripe */
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) > .container,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) > .container-narrow {
  position: relative;
  z-index: 2;
}

/* =============================================================
   UNIFIED TEXT COLOR RULE
   -------------------------------------------------------------
   Per direction: every text element resolves to one of two
   values — #333333 on light surfaces, #fffce5 on dark surfaces.
   No opacity-based hierarchy.
   ============================================================= */

/* Light surfaces — force all body, heading, and card text to #333333 */
.deck-slide:not(.gap-section):not(.calc-section):not(.closing),
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h1,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h2,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h3,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h4,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h5,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) h6,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) p,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) li,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .lead,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .stat-label,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .stat-source,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .kpi-label,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .kpi-sub {
  color: #333333;
}

/* Stat numbers + KPI values + card numbering also normalize to #333333
   per "all text" unification. Decorative accent comes from card top
   borders, icons, and chips, not from text color. !important
   defeats the brand-color vibrancy-layer overrides on .stat / .num /
   .letter that previously rotated through the Haven/AITCOH palette. */
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .stat,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .stat .unit,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .benefit-card .num,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .kpi-value,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .letter,
.deck-slide:not(.gap-section):not(.calc-section):not(.closing) .num {
  color: #333333 !important;
}

/* Hero (solid Haven-blue surface) — text + accents tuned for high-contrast vibrance */
.hero,
.hero h1,
.hero h2,
.hero p,
.hero .lead,
.hero .hero-subtitle,
.hero .eyebrow { color: #fffce5 !important; }
.hero .eyebrow::before { background: var(--energy-yellow); }
.hero h1 .accent { color: #fffce5; }
.hero h1 .accent-gold { color: var(--energy-yellow); }
.hero .hero-subtitle { color: rgba(255, 252, 229, 0.88) !important; }
.hero .lead { color: rgba(255, 252, 229, 0.92) !important; }
.hero em.brand { color: #fffce5 !important; }

/* Proposal badge — bright gold pop on the Haven-blue field */
.hero .proposal-badge {
  background: var(--energy-yellow);
  color: var(--ink);
  border: 1px solid var(--energy-yellow-deep);
  box-shadow: 0 6px 20px rgba(253, 216, 65, 0.40),
              0 2px 4px rgba(0, 0, 0, 0.15);
}

/* Pillar chips on dark bg — translucent white with bright dots */
.hero .pillar-chip {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.28);
  color: #fffce5 !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.hero .pillar-chip .dot { background: var(--energy-yellow); }
.hero .pillar-chip.haven .dot { background: #ffffff; }
.hero .pillar-chip.gold .dot { background: var(--energy-yellow); }

/* CTAs on dark hero */
.hero .btn-primary {
  background: var(--energy-yellow);
  color: var(--ink);
  box-shadow: 0 6px 20px rgba(253, 216, 65, 0.32);
}
.hero .btn-primary:hover {
  background: var(--energy-yellow-bright);
  color: var(--ink);
  box-shadow: 0 10px 28px rgba(253, 216, 65, 0.42);
}
.hero .btn-ghost {
  background: transparent;
  color: #fffce5;
  border: 1px solid rgba(255, 255, 255, 0.50);
}
.hero .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fffce5;
  border-color: rgba(255, 255, 255, 0.80);
}

/* Dark surfaces — every text element is #fffce5 linen */
.gap-section,
.gap-section h2, .gap-section h3, .gap-section h4, .gap-section h5, .gap-section h6,
.gap-section p, .gap-section li, .gap-section .lead, .gap-section .big,
.calc-section,
.calc-section h2, .calc-section h3, .calc-section h4, .calc-section h5, .calc-section h6,
.calc-section p, .calc-section li, .calc-section .lead,
.calc-section .label, .calc-section .value, .calc-section .sub,
.calc-section .output-group-label, .calc-section .output-card .label,
.calc-section .output-card .value, .calc-section .output-card .sub,
.closing,
.closing h2, .closing p, .closing .lead, .closing .meta,
.closing strong, .closing em,
.footer, .footer .footer-inner, .footer strong {
  color: #fffce5;
}

/* Calculator slider-row labels and value chips */
.calc-section .slider-row .label,
.calc-section .slider-row .value { color: #fffce5; }
.calc-section .slider-row .value { color: var(--energy-yellow); } /* gold value chip stays as the accent */

/* Calculator total card label/value/sub stay readable in #fffce5 */
.calc-section .output-card.total .value { color: var(--energy-yellow); } /* gold total stays */
.calc-section .calc-disclaimer { color: #fffce5; }
.calc-section .calc-reset { color: #fffce5; }

/* Slide-label kicker text on dark slides */
.slide-label--on-dark { color: #fffce5; }
.slide-label--on-dark .slash { color: #fffce5; }

/* =============================================================
   PARTNERSHIP PAIR-CARDS — bolder brand identity per side
   ============================================================= */
.pair-card.haven {
  border-top: 6px solid var(--haven-blue);
  background:
    linear-gradient(180deg, rgba(4, 107, 210, 0.04) 0%, #ffffff 40%);
}
.pair-card.haven .top {
  background: var(--haven-blue-soft);
  margin: calc(-1 * var(--s-6)) calc(-1 * var(--s-6)) var(--s-5);
  padding: var(--s-4) var(--s-6);
  border-bottom: 1px solid rgba(4, 107, 210, 0.18);
}
.pair-card.haven .role {
  color: var(--haven-blue-dark);
  font-weight: 800;
  letter-spacing: 0.18em;
}
.pair-card.haven .name { color: var(--haven-blue-dark); font-size: 1.15rem; }

.pair-card.aitcoh {
  border-top: 6px solid var(--aitcoh-blue);
  background:
    linear-gradient(180deg, rgba(37, 94, 160, 0.04) 0%, #ffffff 40%);
  position: relative;
}
.pair-card.aitcoh::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: var(--energy-yellow);
}
.pair-card.aitcoh .top {
  background: var(--aitcoh-blue-soft);
  margin: calc(-1 * var(--s-6)) calc(-1 * var(--s-6)) var(--s-5);
  padding: var(--s-4) var(--s-6);
  border-bottom: 1px solid rgba(37, 94, 160, 0.18);
}
.pair-card.aitcoh .role {
  color: var(--aitcoh-blue-dark);
  font-weight: 800;
  letter-spacing: 0.18em;
}
.pair-card.aitcoh .name { color: var(--aitcoh-blue-dark); font-size: 1.15rem; }