/* ============================================================
   Total Lifetime Care Insurance Group, Ltd.
   Site stylesheet — rebuilt to match the HTML actually shipped
   (index, medicare-help, agents, agents-join, agents-training,
   agent-template, contact, legal) and the LOCKED color system
   from the project record:
     Navy #071A33      — authority bands
     Gold #C4922A       — brand frame ONLY (logo, chrome, eyebrows, rules)
                          NEVER an emphasis/CTA color
     Green #5BA567      — the ONLY clickable/CTA color
     Soft gold-white #FAF6ED — reading surfaces
     Body text #14233B
   Typography: Playfair Display (headings) + Outfit (body)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,900;1,400;1,600;1,700&family=Outfit:wght@300;400;500;600;700&family=Montserrat:wght@500;600;700&family=Source+Serif+4:wght@600;700&display=swap');

/* ── Skip link — hidden until keyboard-focused, jumps past the nav to <main> (punch list v3, item 10) ── */
.skip-link {
  position: absolute;
  top: -80px;
  left: 8px;
  z-index: 1000;
  background: var(--gold-bright);
  color: var(--navy);
  padding: 12px 20px;
  border-radius: 6px;
  font-weight: 700;
  text-decoration: none;
  transition: top 0.15s ease;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
}
.skip-link:focus {
  top: 8px;
}

:root {
  --navy:        #071A33;
  --navy-mid:    #0F2D52;
  --navy-deep:   #04101F;
  --gold:        #C4922A;
  --gold-bright: #D9AB4E;
  --gold-pale:   #F6ECD6;
  --gold-ink:    #7A5D1A; /* darkened gold for text-on-light-background use — #C4922A fails 4.5:1 on white/off-white at small sizes */
  --green:       #5BA567;
  --green-dark:  #468050;
  --green-darker:#345F3C;
  --off-white:   #FAF6ED;
  --white:       #FFFFFF;
  --text:        #14233B;
  --text-mid:    #4A5568;
  --text-light:  #76808F;
  --border:      #E3DECF;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Outfit', system-ui, sans-serif;
  --font-label:   'Montserrat', 'Outfit', system-ui, sans-serif;

  --radius:     8px;
  --radius-lg:  16px;

  --shadow:     0 8px 28px rgba(7,26,51,0.10);
  --shadow-lg:  0 20px 50px rgba(7,26,51,0.16);

  --max-w: 1200px;
  --section-pad: 88px 24px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; scroll-padding-top: 96px; }
body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--off-white);
  line-height: 1.65;
  font-size: 1.125rem; /* 18px base — ordinary reading copy target */
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  line-height: 1.15;
  color: var(--navy);
  font-weight: 700;
}
h1 { font-size: clamp(2.4rem, 5vw, 3.8rem); letter-spacing: -0.01em; }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); letter-spacing: -0.01em; }
h3 { font-size: clamp(1.25rem, 2.2vw, 1.5rem); }
h4 { font-size: 1.05rem; font-family: var(--font-body); font-weight: 600; }
p { color: var(--text-mid); line-height: 1.8; font-size: 1.125rem; } /* 18px — explicit rem so it isn't silently overridden by smaller rem utility classes */

.container { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; }
section { padding: var(--section-pad); }

/* ── Buttons — green is the only CTA color, gold stays frame/emphasis-only ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 30px;
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 1.125rem;  /* 18px — minimum button-text target */
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: all 0.2s ease;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
}
.btn-gold, .btn-gold:disabled, .btn-gold[aria-disabled="true"] {
  /* Despite the name (kept so existing HTML markup doesn't need renaming),
     this renders as the locked CTA green, not gold — gold is brand-frame only.
     Uses the darker green + white text: white on the brighter --green measures
     ~2.99:1 (fails AA); white on --green-dark clears 4.5:1. */
  background: var(--green-dark);
  color: var(--white);
  box-shadow: 0 4px 16px rgba(70,128,80,0.35);
}
.btn-gold:hover, .btn-gold:focus-visible { background: var(--green-darker); transform: translateY(-1px); }
.btn-gold:disabled, .btn-gold[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.btn-secondary {
  background: rgba(255,255,255,0.08);
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}
.btn-secondary:hover { background: rgba(255,255,255,0.16); }
.btn-outline {
  background: transparent;
  color: var(--navy);
  border: 1.5px solid var(--navy);
}
.btn-outline:hover { background: var(--navy); color: var(--white); }
.btn-outline-gold {
  /* Renders as the CTA green outline for the same reason as .btn-gold above. */
  background: transparent;
  color: var(--green-dark);
  border: 1.5px solid var(--green-dark);
}
.btn-outline-gold:hover, .btn-outline-gold:focus-visible { background: var(--green-dark); color: var(--white); }
.btn-sm { padding: 10px 20px; font-size: 1.125rem; }

/* ── Navigation ── */
.site-nav {
  position: sticky;
  top: 0;
  z-index: 200;
  background: var(--navy-deep, #04101F);
  border-bottom: 3px solid var(--gold);
  box-shadow: 0 6px 18px rgba(4,16,31,0.35);
}
.nav-inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 18px 24px;
  min-height: 128px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.nav-logo { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.nav-logo img { height: 64px; width: auto; object-fit: contain; }
.nav-logo-text { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; }
.nav-logo-main {
  font-family: var(--font-display);
  font-size: 1.85rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1.05;
}
.nav-logo-co {
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--white);
  line-height: 1.2;
}
.nav-logo-sub {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin-top: 3px;
}
.nav-links { display: flex; align-items: center; gap: 4px; list-style: none; flex-wrap: wrap; }
.nav-links a {
  font-size: 0.92rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  padding: 8px 14px;
  border-radius: var(--radius);
  transition: all 0.2s;
}
.nav-links a:hover { color: var(--white); background: rgba(255,255,255,0.08); }
/* Hover descriptions for nav items */
.nav-links > li { position: relative; }
.nav-links a[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  width: max-content;
  max-width: 230px;
  background: var(--navy-mid);
  color: var(--white);
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
  padding: 10px 14px;
  border-radius: var(--radius);
  border: 1px solid rgba(196,146,42,0.35);
  box-shadow: var(--shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s, transform 0.18s;
  z-index: 300;
}
.nav-links a[data-tip]:hover::after,
.nav-links a[data-tip]:focus-visible::after { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-links .nav-cta {
  background: var(--green-dark);
  color: var(--white) !important;
  font-weight: 600;
}
.nav-links .nav-cta:hover, .nav-links .nav-cta:focus-visible { background: var(--green-darker); }
.nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 4px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--white); }

/* ── Agents & Agencies nav dropdown (reveals "Why Total Lifetime?") ──
     Hover + keyboard focus on desktop; tap-to-toggle on touch/mobile via
     the .is-open class (added by the small inline script below). */
.has-sub { position: relative; }
.has-sub > a { display: flex; align-items: center; gap: 4px; }
.has-sub > a::after { content: '▾'; font-size: 0.7em; opacity: 0.7; }
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: var(--navy-mid);
  border: 1px solid rgba(196,146,42,0.3);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: 6px;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: all 0.15s ease;
  z-index: 50;
}
.has-sub:hover .nav-dropdown,
.has-sub:focus-within .nav-dropdown,
.has-sub.is-open .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.nav-dropdown li { list-style: none; }
.nav-dropdown a {
  display: block;
  padding: 10px 14px;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.85);
  border-radius: 6px;
  white-space: nowrap;
}
.nav-dropdown a:hover, .nav-dropdown a:focus { background: rgba(196,146,42,0.18); color: var(--white); }
@media (max-width: 980px) {
  /* Below ~980px the full menu no longer fits; collapse to the hamburger menu */
  .nav-inner { height: auto; min-height: 88px; padding-top: 8px; padding-bottom: 8px; }
  .nav-logo img { height: 52px; }
  .nav-logo-main { font-size: 1.6rem; }
  .nav-links { display: none; }
  .nav-toggle { display: flex; }
  .nav-links.open {
    display: flex; flex-direction: column; align-items: stretch;
    position: absolute; top: 88px; left: 0; right: 0; z-index: 250;
    background: var(--navy); padding: 16px 24px; gap: 2px;
    border-top: 1px solid rgba(255,255,255,0.12);
  }
  .nav-dropdown { position: static; opacity: 1; visibility: visible; transform: none; background: rgba(255,255,255,0.04); margin: 4px 0 4px 14px; box-shadow: none; border-radius: 6px; }
  .nav-links a[data-tip]::after { display: none; }
}
@media (max-width: 640px) {
  /* On mobile the full nav is already a visible vertical list when open —
     show "Why Total Lifetime?" as a plain nested item, no hover/tap-toggle needed. */
  .nav-dropdown { position: static; opacity: 1; visibility: visible; transform: none; background: rgba(255,255,255,0.04); margin: 4px 0 4px 14px; box-shadow: none; border-radius: 6px; }
}

/* ── Hero ── */
.hero {
  background: linear-gradient(180deg, #0B2442 0%, var(--navy) 100%);
  padding: 80px 24px 72px;
}
/* Page-specific desktop hero padding, as classes instead of inline styles — an inline
   style has higher specificity than any class and silently blocked the mobile .hero
   padding rule below from ever applying (punch list v3, item 9). */
.hero-join { padding: 80px 24px 72px; }
.hero-training { padding: 80px 24px 72px; }
.hero-inner { max-width: 760px; margin: 0 auto; text-align: left; }
.hero-eyebrow {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}
.hero h1 { color: var(--white); margin-bottom: 20px; }
.hero h1 em {
  font-style: italic;
  color: var(--gold);
}
.hero-sub {
  font-size: 1.15rem;
  color: rgba(255,255,255,0.75);
  max-width: 600px;
  margin-bottom: 36px;
  line-height: 1.75;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 40px; }
.hero-trust {
  display: flex;
  gap: 0;
  padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,0.14);
}
.hero-trust-item {
  padding-right: 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: rgba(255,255,255,0.55);
  font-size: 0.85rem;
}
.hero-trust-item strong {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--gold);
  font-weight: 700;
}

/* ── Hero with photo (split layout) — text/buttons always stay on the solid navy panel, never over the image ── */
.hero-split {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items: stretch;
  padding: 0;
}
.hero-split .hero-inner { max-width: none; padding: 80px 56px 72px; }
.hero-split-media { position: relative; overflow: hidden; min-height: 440px; background: transparent; display: flex; align-items: center; justify-content: center; padding: 48px 56px 48px 24px; }
/* Photos sit in an inset 4:3 frame (not full-bleed) so faces read at a comfortable size */
.hero-photo-frame { position: relative; width: 100%; max-width: 560px; aspect-ratio: 4 / 3; border-radius: var(--radius-lg); overflow: hidden; border: 4px solid var(--gold); box-shadow: 0 10px 30px rgba(4,16,31,0.45); }
.hero-split-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Hero photo rotation — CSS crossfade with a JS pause control (added Oct 2, 2026,
   pause control added for punch list v3 item 8) ── Each <img> in .hero-split-media shares
   one 28s keyframe cycle, offset by a negative animation-delay so only one image is visible
   at a time: 6s on screen, ~1s crossfade, 21s hidden while the other three take their turn.
   First image stays static (opacity 1, no animation) as the no-JS/no-animation fallback and
   LCP element. The small inline script only toggles a .paused class / animation-play-state —
   nothing server-side, still a fully static Cloudflare Pages deploy. */
.hero-split-media img:first-child { opacity: 1; }
.hero-split-media img:not(:first-child) {
  opacity: 0;
  animation: heroRotate 28s infinite ease-in-out;
}
.hero-split-media img:nth-child(2) { animation-delay: -7s; }
.hero-split-media img:nth-child(3) { animation-delay: -14s; }
.hero-split-media img:nth-child(4) { animation-delay: -21s; }
@keyframes heroRotate {
  0%            { opacity: 0; }
  3.57%         { opacity: 1; }
  21.43%        { opacity: 1; }
  25%, 100%     { opacity: 0; }
}
.hero-split-media.paused img { animation-play-state: paused; }
.hero-rotation-toggle {
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: none;
  background: rgba(7,26,51,0.55);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.hero-rotation-toggle:hover,
.hero-rotation-toggle:focus-visible { background: rgba(7,26,51,0.8); }
.hero-rotation-toggle svg { width: 18px; height: 18px; }
@media (prefers-reduced-motion: reduce) {
  .hero-split-media img:not(:first-child) { animation: none; opacity: 0; }
  .hero-rotation-toggle { display: none; }
}

@media (max-width: 900px) {
  .hero-split { grid-template-columns: 1fr; }
  /* Headline, explanation and primary CTA come first on mobile — the photo
     follows the content instead of pushing it below the fold. */
  .hero-split-media { min-height: 0; order: 2; padding: 0 20px 32px; }
  .hero-photo-frame { max-width: none; }
  .hero-split .hero-inner { padding: 48px 24px 32px; }
}

/* ── Supporting photo blocks inside ordinary content sections ── */
.photo-support {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.photo-support img { width: 100%; height: 100%; max-height: 420px; object-fit: cover; border-radius: var(--radius-lg); display: block; border: 4px solid var(--gold); box-shadow: 0 8px 24px rgba(7,26,51,0.18); }
.photo-support.photo-right { grid-template-columns: 1fr 1fr; }
.photo-support.photo-left .photo-support-media { order: -1; }
@media (max-width: 800px) {
  /* .photo-support.photo-right has higher specificity (two classes) than the
     base .photo-support rule above, so it was still winning at this breakpoint
     and keeping a two-column layout on phones. Override it explicitly. */
  .photo-support, .photo-support.photo-right { grid-template-columns: 1fr; gap: 28px; }
  .photo-support img { max-height: 280px; }
  .photo-support.photo-left .photo-support-media { order: 0; }
}

/* ── Wide photo band (full-width, no cropped squeeze, no text overlay) ── */
.photo-wide { width: 100%; }
.photo-wide img { width: 100%; max-height: 480px; object-fit: cover; border-radius: var(--radius-lg); display: block; border: 4px solid var(--gold); box-shadow: 0 8px 24px rgba(7,26,51,0.18); }
@media (max-width: 800px) { .photo-wide img { max-height: 320px; } }

/* ── Section headers ── */
.section-header { max-width: 680px; margin: 0 auto 48px; text-align: center; }
.section-eyebrow {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold-ink); /* darkened gold — on light section backgrounds, needs 4.5:1 */
  margin-bottom: 12px;
}
.section-header h2 { margin-bottom: 14px; }

/* ── Grids ── */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

/* ── Cards ── */
.card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px 26px;
  transition: all 0.2s;
}
a.card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.card-icon {
  width: 48px;
  height: 48px;
  background: var(--gold-pale);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  margin-bottom: 16px;
}
.card h3 { font-size: 1.15rem; margin-bottom: 8px; }
.card p { font-size: 1.125rem; }

/* ── Difference grid (agents.html) ── */
.diff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.diff-panel { padding: 36px 32px; }
.diff-panel.others { background: #EFECE3; }
.diff-panel.us { background: var(--navy); }
.diff-panel h4 { font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 20px; }
.diff-panel.others h4 { color: var(--text-light); }
.diff-panel.us h4 { color: var(--gold); }
.diff-item { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; font-size: 0.95rem; }
.diff-panel.others .diff-item { color: var(--text-mid); }
.diff-panel.us .diff-item { color: rgba(255,255,255,0.85); }
.diff-marker { flex-shrink: 0; font-weight: 700; margin-top: 1px; }
.diff-panel.others .diff-marker { color: #B5AE9C; }
.diff-panel.us .diff-marker { color: var(--gold); }

/* ── Process steps ── */
.process-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; text-align: center; }
.step-num {
  width: 56px; height: 56px;
  background: var(--navy);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  font-family: var(--font-display);
  font-size: 1.3rem; font-weight: 700;
  color: var(--gold);
}
.process-steps h3 { font-size: 1.1rem; margin-bottom: 8px; }

/* ── Resources ── */
.resource-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.resource-card {
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 26px 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--white);
  transition: all 0.2s;
}
.resource-card:hover { border-color: var(--gold); box-shadow: var(--shadow); }
.resource-card .icon { font-size: 1.6rem; }
.resource-card h4 { color: var(--navy); font-size: 1.05rem; }
.resource-card p { font-size: 1.125rem; flex: 1; }

/* ── Placeholder block ── */
.placeholder-block {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 48px 40px;
  text-align: center;
}
.placeholder-block .badge {
  display: inline-block;
  background: rgba(196,146,42,0.2);
  border: 1px solid rgba(196,146,42,0.4);
  color: var(--gold);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 100px;
  margin-bottom: 18px;
}
.placeholder-block h3 { color: var(--white); margin-bottom: 10px; }
.placeholder-block p { color: rgba(255,255,255,0.65); max-width: 460px; margin: 0 auto 24px; }

/* ── CTA band ── */
.cta-band {
  background: var(--navy);
  padding: var(--section-pad);
  text-align: center;
}
.cta-band h2 { color: var(--white); margin-bottom: 14px; }
.cta-band p { color: rgba(255,255,255,0.7); max-width: 540px; margin: 0 auto 32px; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

/* ── Compliance banner ── */
.compliance-banner {
  background: var(--gold-pale);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 16px 20px;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--text-mid);
}
.compliance-banner strong { color: var(--navy); }

/* ── Founder section ── */
.founder-section { background: var(--off-white); padding: var(--section-pad); }
.founder-inner { max-width: var(--max-w); margin: 0 auto; display: grid; grid-template-columns: 320px 1fr; gap: 56px; align-items: center; }
.founder-photo-wrap { position: relative; }
.founder-photo {
  width: 100%;
  aspect-ratio: 4/5;
  background: var(--navy-mid);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.3);
  overflow: hidden;
}
.founder-photo-accent {
  position: absolute;
  bottom: -18px; right: -18px;
  width: 92px; height: 92px;
  background: var(--gold);
  border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: var(--shadow);
}
.founder-photo-accent .years { font-family: var(--font-display); font-size: 1.7rem; font-weight: 700; color: var(--navy); line-height: 1; }
.founder-photo-accent .label { font-size: 0.6rem; font-weight: 700; text-align: center; color: var(--navy); letter-spacing: 0.04em; margin-top: 2px; }
.founder-content .eyebrow {
  font-size: 0.85rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); margin-bottom: 10px;
}
.founder-content .title { font-size: 1.05rem; color: var(--text-mid); margin-bottom: 18px; }
/* ── Typographic founder statement (no portrait) — punch list item 2 ── */
.founder-section.typographic .founder-inner { grid-template-columns: 1fr; max-width: 760px; }
.founder-section.typographic .founder-content { text-align: left; }
.founder-section.typographic blockquote {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  font-style: italic;
  color: var(--navy);
  line-height: 1.5;
  border-left: 3px solid var(--gold);
  padding-left: 28px;
  margin: 18px 0 22px;
}
.founder-section.typographic .founder-attribution { font-size: 1.05rem; color: var(--text-mid); font-weight: 600; }
.founder-section.typographic .founder-attribution span { display: block; font-size: 0.92rem; font-weight: 400; color: var(--text-light); margin-top: 2px; }
.founder-stats { display: flex; gap: 32px; margin: 26px 0; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.founder-stat .num { font-family: var(--font-display); font-size: 1.8rem; font-weight: 700; color: var(--navy); line-height: 1; }
.founder-stat .lbl { font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-light); margin-top: 4px; }

/* ── Contact ── */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.contact-info h2 { margin-bottom: 4px; }
.contact-item { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 20px; min-width: 0; }
.contact-item-text { min-width: 0; }
.contact-item-icon {
  width: 42px; height: 42px;
  background: var(--gold-pale);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-size: 1.1rem;
}
.contact-item-text strong { display: block; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-light); margin-bottom: 3px; }
.contact-item-text a, .contact-item-text span { font-size: 1.1rem; font-weight: 600; color: var(--navy); overflow-wrap: break-word; word-break: break-word; }
.contact-form-wrap { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 32px; }
.form-placeholder {
  border: 2px dashed var(--border);
  border-radius: var(--radius);
  padding: 40px 24px;
  text-align: center;
  background: var(--off-white);
}

/* ── Agent Site template ── */
.agent-hero-split { display: grid; grid-template-columns: 320px 1fr; min-height: 0; background: var(--navy); }
.agent-photo-panel { padding: 48px 32px; display: flex; align-items: center; justify-content: center; background: var(--navy-mid); }
.agent-photo-placeholder {
  width: 100%; aspect-ratio: 4/5;
  border: 2px dashed rgba(255,255,255,0.25);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  color: rgba(255,255,255,0.4); text-align: center; font-size: 0.85rem;
}
.agent-info-panel { padding: 56px 48px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.agent-name { font-family: var(--font-display); font-size: 2.2rem; font-weight: 700; color: var(--white); }
.agent-title { font-size: 0.95rem; color: rgba(255,255,255,0.65); margin-bottom: 4px; }
.agent-contact-row { display: flex; flex-wrap: wrap; gap: 20px; font-size: 1rem; }
.agent-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.agent-action-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 20px;
  border-radius: var(--radius);
  font-size: 1.125rem; font-weight: 600;
  white-space: normal;
  text-align: center;
}
.agent-action-btn.primary { background: var(--green-dark); color: var(--white); }
.agent-action-btn.primary:hover, .agent-action-btn.primary:focus-visible { background: var(--green-darker); }
.agent-action-btn.secondary { background: rgba(255,255,255,0.1); color: var(--white); border: 1px solid rgba(255,255,255,0.25); }
.agent-action-btn.secondary:hover { background: rgba(255,255,255,0.18); }

@media (max-width: 1024px) {
  .agent-hero-split { grid-template-columns: 1fr; }
}

/* ── Legal pages ── */
.legal-nav { background: var(--off-white); border-bottom: 1px solid var(--border); padding: 0 24px; }
.legal-nav-inner { max-width: var(--max-w); margin: 0 auto; display: flex; gap: 0; overflow-x: auto; }
.legal-nav-inner a { padding: 14px 20px; font-size: 0.85rem; font-weight: 500; color: var(--text-mid); white-space: nowrap; border-bottom: 2.5px solid transparent; text-decoration: none; }
.legal-nav-inner a:hover { color: var(--navy); border-bottom-color: var(--gold); }
.legal-section { max-width: 800px; margin: 0 auto; padding: 72px 24px; border-bottom: 1px solid var(--border); }
.legal-section:last-child { border-bottom: none; }
.legal-section h2 { font-size: 2rem; margin-bottom: 8px; padding-bottom: 16px; border-bottom: 2px solid var(--gold); }
.legal-date { font-size: 0.85rem; color: var(--text-light); margin-bottom: 28px; font-style: italic; }
.legal-section h3 { font-size: 1.2rem; margin: 28px 0 10px; color: var(--navy); }
.legal-section ul { margin: 10px 0 18px 20px; }
.legal-section li { font-size: 1.05rem; line-height: 1.75; color: var(--text-mid); margin-bottom: 6px; }
.legal-callout { background: var(--gold-pale); border-left: 4px solid var(--gold); padding: 16px 20px; border-radius: 0 var(--radius) var(--radius) 0; margin: 20px 0; }
.legal-callout p { margin: 0; font-size: 1.05rem; }

/* ── Footer ── */
.site-footer { background: var(--navy-deep); color: rgba(255,255,255,0.6); padding: 64px 24px 0; }
.footer-inner { max-width: var(--max-w); margin: 0 auto; }
.footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.footer-brand h3 { color: var(--white); font-size: 1.1rem; margin-bottom: 4px; }
.footer-brand .tagline { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-bright); margin-bottom: 14px; }
.footer-brand p { font-size: 0.98rem; color: rgba(255,255,255,0.78); }
.footer-col h4 { font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white); margin-bottom: 14px; }
.footer-col ul { list-style: none; }
.footer-col li { margin-bottom: 9px; }
.footer-col a { font-size: 0.96rem; color: rgba(255,255,255,0.78); }
.footer-col a:hover, .footer-col a:focus-visible { color: var(--gold-bright); }
.footer-bottom { padding: 22px 0; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
/* Low-opacity white-on-navy-deep failed contrast (as low as ~0.3 opacity);
   raised so fine print is comfortably readable, not just technically present. */
.footer-legal { font-size: 0.88rem; line-height: 1.75; color: rgba(255,255,255,0.72); max-width: 700px; }
.footer-links { display: flex; gap: 16px; flex-shrink: 0; }
.footer-links a { font-size: 0.88rem; color: rgba(255,255,255,0.72); }
.footer-links a:hover, .footer-links a:focus-visible { color: var(--gold-bright); }
.disclaimer-bar {
  background: rgba(0,0,0,0.25);
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 12px 24px;
  text-align: center;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.7);
}
.footer-disclaimer-bar {
  background: rgba(0,0,0,0.35);
  padding: 12px 24px;
  text-align: center;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.65);
}

/* ── Accessibility ── */
a:focus-visible, button:focus-visible, .btn:focus-visible {
  outline: 3px solid var(--green);
  outline-offset: 2px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .founder-inner { grid-template-columns: 1fr; }
  .founder-photo-wrap { max-width: 320px; margin: 0 auto; }
  .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  :root { --section-pad: 64px 20px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .diff-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; gap: 36px; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; }
  .process-steps { grid-template-columns: 1fr; }
  .resource-grid { grid-template-columns: 1fr; }
  h1 { font-size: 2.1rem; }
}
@media (max-width: 640px) {
  .nav-links { display: none; }
  .nav-toggle { display: flex; }
  .nav-links.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 68px; left: 0; right: 0;
    background: var(--navy);
    padding: 16px 24px;
    gap: 2px;
    border-top: 1px solid rgba(255,255,255,0.12);
  }
  /* .hero-split is excluded here — its own .hero-split .hero-inner rule (900px breakpoint)
     already sets mobile padding; without this exclusion both rules applied at once and
     the split hero (homepage) got double top/side padding on phones (punch list v3, item 9). */
  .hero:not(.hero-split) { padding: 72px 20px 56px; }
  .hero-trust { flex-wrap: wrap; row-gap: 16px; }
  /* Long button labels no longer force horizontal overflow on narrow screens. */
  .btn, .agent-action-btn { white-space: normal; text-align: center; }
  .hero-actions, .cta-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn, .cta-actions .btn { width: 100%; justify-content: center; }
  /* The tagline was only hidden below 380px, so at common phone widths (390px and
     up to 640px) it kept forcing the nav wider than the viewport, pushing the menu
     button off-screen and causing horizontal scroll on the whole page. Hidden here
     at the same breakpoint as the hamburger menu so the nav always fits. */
  .nav-logo-sub, .nav-logo-co { display: none; }
  .nav-inner { height: auto; min-height: 68px; padding-top: 6px; padding-bottom: 6px; }
  .nav-logo img { height: 40px; }
  .nav-logo-main { font-size: 1.1rem; }
  .nav-links a[data-tip]::after { display: none; }
}
@media (max-width: 380px) {
  /* Smallest phones (iPhone SE class, 320–375px) also need a smaller wordmark. */
  .nav-logo-main { font-size: 1rem; }
}
@media (max-width: 480px) {
  /* Medicare Stats Band (agents.html): 3 columns don't fit on the narrowest phones. */
  .stats-band { grid-template-columns: 1fr !important; }
}

/* ── Icon system — restrained line-SVG set (punch list v2 item 3) ──
   Replaces the mixed colorful emoji with a single stroke-based icon set,
   one color (--gold-ink), one weight, one size — no grayscale workaround. */
.card-icon, .resource-card .icon {
  color: var(--gold-ink);
}
.card-icon svg {
  width: 24px;
  height: 24px;
  display: block;
}
.resource-card .icon svg {
  width: 28px;
  height: 28px;
  display: block;
}

/* ── Contact page: handshake backdrop, headshot, larger contact info (Oct 8 review) ── */
.hero-handshake {
  background: linear-gradient(rgba(7,26,51,0.80), rgba(7,26,51,0.80)), url('images/handshake-closeup-alt-1400w.jpg') center 42% / cover no-repeat;
}
@media (min-width: 901px) { .contact-grid.contact-grid-wide { grid-template-columns: 1.1fr 0.9fr; } }
.contact-grid-wide .contact-info h2 { font-size: 2.3rem; }
.contact-grid-wide .contact-item-text strong { font-size: 1.1rem; }
.contact-grid-wide .contact-item-text a, .contact-grid-wide .contact-item-text span { font-size: 1.3rem; }
.contact-headshot { margin: 0 auto 24px; width: 260px; text-align: center; }
.contact-headshot img { width: 260px; height: 260px; object-fit: cover; object-position: center 20%; border-radius: var(--radius-lg); box-shadow: var(--shadow); display: block; }
.contact-headshot figcaption { margin-top: 10px; font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 1.15rem; line-height: 1.3; }
.contact-headshot figcaption span { display: block; font-family: var(--font-body); font-weight: 500; font-size: 1rem; color: var(--text-mid); }
/* Phone buttons: on a desktop mouse, tel: links open an "choose an app" prompt, so show the number as plain text there */
.tel-desktop { display: none; cursor: default; }
@media (hover: hover) and (pointer: fine) {
  .tel-touch { display: none; }
  .tel-desktop { display: inline-flex; }
}

/* Resource cards: never force the grid wider than the viewport */
.resource-grid > * { min-width: 0; }
.resource-card .btn { white-space: normal; text-align: center; }
.contact-grid > * { min-width: 0; }
.contact-item-text a, .contact-item-text span { overflow-wrap: anywhere; }


/* ── Oct 8 punch list v3: founder portrait, header/hero polish ── */
.founder-section.typographic.with-portrait .founder-inner { grid-template-columns: 300px 1fr; max-width: 980px; gap: 48px; align-items: center; }
.founder-portrait { margin: 0; }
.founder-portrait img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; object-position: center 18%; border-radius: var(--radius-lg); border: 4px solid var(--gold); box-shadow: 0 8px 24px rgba(7,26,51,0.18); display: block; }
@media (max-width: 800px) {
  .founder-section.typographic.with-portrait .founder-inner { grid-template-columns: 1fr; gap: 28px; }
  .founder-portrait { max-width: 260px; margin: 0 auto; }
}
/* Schedule Now tooltip sits at the right edge: anchor it to the right so it never clips */
.nav-links .nav-cta[data-tip]::after { left: auto; right: 0; transform: translateY(-4px); }
.nav-links .nav-cta[data-tip]:hover::after, .nav-links .nav-cta[data-tip]:focus-visible::after { transform: translateY(0); }
@media (max-width: 640px) { .hero-trust-item { padding-left: 0 !important; } }


/* ── Oct 8 punch list v4: CMO changes ── */
/* Labels use Montserrat caps (matches the signage style Rich liked) */
.hero-eyebrow, .section-eyebrow, .founder-content .eyebrow, .nav-logo-sub, .footer-brand .tagline,
.placeholder-block .badge, .hero-trust-item span, .founder-stat .lbl, .proof-item span, .ladder-badge {
  font-family: var(--font-label);
}
.nav-links a { font-family: var(--font-label); font-weight: 500; font-size: 0.86rem; letter-spacing: 0.01em; }
.nav-links .nav-cta { font-weight: 600; }

/* Proof strip under the home hero */
.proof-strip { background: var(--white); border-bottom: 1px solid var(--border); padding: 0 24px; }
.proof-strip-inner { max-width: var(--max-w); margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); }
.proof-item { text-align: center; padding: 26px 12px; border-left: 1px solid var(--border); }
.proof-item:first-child { border-left: 0; }
.proof-item strong { display: block; font-family: var(--font-display); font-size: 1.7rem; font-weight: 700; color: var(--navy); line-height: 1.1; }
.proof-item span { display: block; margin-top: 6px; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-ink); }
@media (max-width: 700px) {
  .proof-strip-inner { grid-template-columns: repeat(2, 1fr); }
  .proof-item:nth-child(3) { border-left: 0; }
  .proof-item:nth-child(n+3) { border-top: 1px solid var(--border); }
}

/* Four-up cards collapse gracefully */
.agent-points .card h3 { font-size: 1.15rem; }
@media (max-width: 1000px) { .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .grid-4 { grid-template-columns: 1fr; } }

/* Call-to-action ladder (agents page) */
.ladder { align-items: stretch; }
.ladder-card { background: var(--off-white); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 32px 28px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.ladder-card p { color: var(--text-mid); margin: 0; }
.ladder-card .btn { margin-top: auto; }
.ladder-live { background: var(--white); border: 2px solid var(--gold); box-shadow: 0 8px 24px rgba(7,26,51,0.10); }
.ladder-badge { display: inline-block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 12px; border-radius: 100px; background: rgba(196,146,42,0.14); border: 1px solid rgba(196,146,42,0.4); color: var(--gold-ink); }
.ladder-badge-live { background: var(--green-dark); border-color: var(--green-dark); color: var(--white); }

/* Header shrinks once the visitor scrolls (keeps the generous header at the top of every page) */
.site-nav, .nav-inner, .nav-logo img, .nav-logo-main { transition: all 0.22s ease; }
@media (min-width: 981px) {
  .site-nav.is-scrolled .nav-inner { min-height: 80px; padding-top: 8px; padding-bottom: 8px; }
  .site-nav.is-scrolled .nav-logo img { height: 46px; }
  .site-nav.is-scrolled .nav-logo-main { font-size: 1.45rem; }
  .site-nav.is-scrolled .nav-logo-co { font-size: 0.9rem; }
  .site-nav.is-scrolled .nav-logo-sub { display: none; }
}

/* Laptop widths (981-1280px): keep the full menu visible, with the brand block scaled to fit */
@media (min-width: 981px) and (max-width: 1280px) {
  .nav-inner { padding-left: 20px; padding-right: 20px; gap: 14px; }
  .nav-logo { gap: 12px; }
  .nav-logo img { height: 54px; }
  .nav-logo-main { font-size: 1.5rem; }
  .nav-logo-co { font-size: 0.95rem; }
  .nav-logo-sub { font-size: 0.7rem; letter-spacing: 0.12em; }
  .nav-links { gap: 0; flex-wrap: nowrap; }
  .nav-links a { padding: 8px 9px; font-size: 0.8rem; white-space: nowrap; }
}


/* ════════ v6: modern full-bleed photo heroes, aligned left edge, collapsible FAQ ════════
   Text sits on a deep-navy gradient that fades to the photo, so contrast stays high (WCAG AA)
   while the picture runs edge to edge. */
.hero { position: relative; overflow: hidden; display: flex; align-items: center; min-height: 500px; padding: 88px 24px 80px; }
.hero .hero-inner { position: relative; z-index: 2; width: 100%; max-width: 680px; margin: 0 0 0 max(0px, calc((100% - var(--max-w)) / 2)); padding: 0; }
.hero-split { display: flex; grid-template-columns: none; padding: 88px 24px 80px; }
.hero-split .hero-inner { padding: 0; max-width: 680px; }
.hero-split-media { position: absolute; top: 0; right: 0; bottom: 0; left: auto; width: 62%; min-height: 0; padding: 0; background: var(--navy); display: block; }
.hero-photo-frame { position: absolute; inset: 0; width: auto; max-width: none; aspect-ratio: auto; border: 0; border-radius: 0; box-shadow: none; }
.hero-photo, .hero-handshake { background: var(--navy); }
.hero-handshake { --hero-img: url('images/handshake-closeup-alt-1400w.jpg'); --hero-pos: center 42%; }
.hero-photo::before, .hero-handshake::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 62%; background: var(--hero-img) var(--hero-pos, center 35%) / cover no-repeat; }
.hero-split::after, .hero-photo::after, .hero-handshake::after {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(7,26,51,1) 0%, rgba(7,26,51,1) 38%, rgba(7,26,51,0.62) 53%, rgba(7,26,51,0.14) 78%, rgba(7,26,51,0.04) 100%);
}
.hero-rotation-toggle { z-index: 3; }
@media (max-width: 900px) {
  .hero-split-media, .hero-photo::before, .hero-handshake::before { width: 100%; }
  .hero, .hero-split { min-height: 0; padding: 64px 20px 56px; }
  .hero .hero-inner { margin: 0; max-width: none; }
  .hero-split::after, .hero-photo::after, .hero-handshake::after { background: linear-gradient(180deg, rgba(4,16,31,0.90) 0%, rgba(7,26,51,0.80) 100%); }
}
@media (max-width: 640px) { .hero:not(.hero-split) { padding: 64px 20px 56px; } }

/* Collapsible FAQ (agents page) */
.faq-master { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: 0 6px 20px rgba(7,26,51,0.08); }
.faq-master > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 28px; font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; color: var(--navy); }
.faq-master > summary::-webkit-details-marker { display: none; }
.faq-master > summary::after { content: ''; width: 12px; height: 12px; border-right: 3px solid var(--gold); border-bottom: 3px solid var(--gold); transform: rotate(45deg); transition: transform .2s; margin: -6px 4px 0 0; flex-shrink: 0; }
.faq-master[open] > summary::after { transform: rotate(-135deg); margin-top: 4px; }
.faq-master-hint { margin-left: auto; font-family: var(--font-label); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-ink); }
.faq-master[open] .faq-master-hint { display: none; }
.faq-master > .faq-list { padding: 4px 20px 24px; }

/* Header: more room around the brand block */
.nav-inner { padding-top: 22px; padding-bottom: 22px; }
.nav-logo { gap: 20px; }
.nav-logo-text { gap: 5px; }
@media (max-width: 980px) { .nav-inner { padding-top: 8px; padding-bottom: 8px; } .nav-logo { gap: 14px; } }
@media (max-width: 640px) { .nav-inner { padding-top: 6px; padding-bottom: 6px; } .nav-logo { gap: 10px; } }

/* v6: hidden tooltip pseudo-elements must not create page scroll */
html,body{overflow-x:clip}

/* v7: centered last row for card grids with orphans */
.grid-center{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.grid-center>*{flex:0 1 calc((100% - 48px)/3);min-width:260px}
@media (max-width:640px){.grid-center>*{flex-basis:100%}}

/* v7: Agent Insider signup band */
.insider-band{background:var(--gold-pale);border-top:3px solid var(--gold);padding:var(--section-pad)}
.insider-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center}
.insider-copy h2{margin-bottom:12px}
.insider-form{background:var(--white);border:1px solid var(--border);border-top:4px solid var(--gold);border-radius:12px;padding:28px;display:grid;gap:14px;box-shadow:0 8px 24px rgba(7,26,51,.08)}
.insider-form label{display:grid;gap:5px;font-family:var(--font-label);font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}
.insider-form input[type=text],.insider-form input[type=email]{font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;padding:12px 14px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);color:var(--navy)}
.insider-form input:focus{outline:3px solid rgba(196,146,42,.35);border-color:var(--gold)}
.insider-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.insider-form .insider-consent{display:flex;gap:10px;align-items:flex-start;font-family:var(--font-body,inherit);font-size:.85rem;font-weight:400;letter-spacing:0;text-transform:none;color:var(--text-mid)}
.insider-consent input{margin-top:3px;width:18px;height:18px;flex:none}
.insider-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.insider-msg{margin:0;font-size:.95rem;min-height:1.2em}
.insider-msg.ok{color:var(--green-darker);font-weight:600}.insider-msg.err{color:#9B2C2C}
@media (max-width:900px){.insider-grid{grid-template-columns:1fr;gap:28px}}
@media (max-width:560px){.insider-row{grid-template-columns:1fr}.insider-form{padding:22px 18px}}

.insider-form input[type=tel]{font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;padding:12px 14px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);color:var(--navy)}
.insider-form input[type=tel]:focus{outline:3px solid rgba(196,146,42,.35);border-color:var(--gold)}
.insider-consent a{color:var(--gold-ink);text-decoration:underline}

/* v7: compact hero for document pages (legal) */
.hero.hero-compact{min-height:0;padding-top:64px;padding-bottom:56px}

/* v13: uniform one-line nav hover tips */
.nav-links a[data-tip]::after{white-space:nowrap;max-width:none;font-size:.9rem;padding:8px 14px}

/* v15: training "also covered" strip */
.also-covered{max-width:900px;margin:36px auto 0;padding:20px 26px;background:var(--gold-pale);border:1px solid rgba(196,146,42,.35);border-radius:var(--radius-lg);text-align:center}
.also-covered strong{display:block;font-family:var(--font-label);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:10px}
.also-covered ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px}
.also-covered li{font-size:1.05rem;color:var(--navy)}
.also-covered li::before{content:"\2713\00a0";color:var(--green-dark);font-weight:700}
.grid-2.cap{max-width:900px;margin:0 auto}

/* v17: contact page tidy-up */
.path-card{display:flex;flex-direction:column}
.path-eyebrow{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;font-weight:600}
.path-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.path-fine{font-size:.95rem;line-height:1.6;margin-top:18px;color:var(--text-light)}
@media (min-width:901px){.contact-grid.contact-grid-wide{align-items:center}}
.contact-side .contact-headshot{margin:0 auto;width:min(340px,100%)}
.contact-side .contact-headshot img{width:100%;height:auto;aspect-ratio:1/1}
.notes-row{max-width:1000px;display:grid;grid-template-columns:1fr 1.4fr;gap:24px;align-items:stretch}
.notes-row>div{margin:0 !important}
@media (max-width:900px){.notes-row{grid-template-columns:1fr}}

.grid-3.cap-3{max-width:1100px;margin:0 auto}
@media (max-width:900px){.grid-3.cap-3{grid-template-columns:1fr}}
.footer-address{color:inherit;text-decoration:underline;text-decoration-color:rgba(196,146,42,.6);text-underline-offset:3px}
.footer-address:hover{color:var(--gold-bright,#E0B24A)}
.notes-card{padding:24px 26px;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg)}

/* v18: agent site hero — photo framed (not cropped tight), breathing room, fills the width */
.agent-hero-split{grid-template-columns:minmax(280px,360px) 1fr;gap:64px;align-items:center;padding:64px max(24px,calc((100% - 1200px)/2))}
.agent-photo-panel{padding:0;background:none;display:block}
.agent-photo-panel img{width:100% !important;height:auto !important;aspect-ratio:1/1;object-fit:cover !important;border-radius:var(--radius-lg) !important;border:4px solid var(--gold);box-shadow:0 10px 30px rgba(4,16,31,.45);display:block}
.agent-info-panel{padding:0}
.agent-info-panel > p{max-width:680px !important}
.agent-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:680px}
.agent-actions .agent-action-btn{justify-content:center}
@media (max-width:1024px){.agent-hero-split{grid-template-columns:1fr;gap:32px;padding:40px 24px}.agent-photo-panel img{max-width:340px;margin:0 auto}}
@media (max-width:560px){.agent-actions{grid-template-columns:1fr}}
.agent-contact-item{color:rgba(255,255,255,.88) !important}
.agent-contact-item a{color:inherit}
.agent-contact-item svg{color:var(--gold-bright,#E0B24A);opacity:1}

/* v19: agent photo fallback = agency logo (used when an agent has no photo) */
.agent-photo-panel .agent-photo-logo{width:100%;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--navy-mid);border:4px solid var(--gold);border-radius:var(--radius-lg);box-shadow:0 10px 30px rgba(4,16,31,.45)}
.agent-photo-panel .agent-photo-logo img{width:62% !important;height:auto !important;aspect-ratio:auto !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;object-fit:contain !important}
.agent-photo-logo span{font-family:var(--font-label);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

/* v20: three-tier CTA system. ORANGE = call now (immediate human). GREEN = take a step. CLEAR = explore. */
:root{--hot:#C74E08;--hot-dark:#A93F05}
.btn-hot{background:var(--hot);color:#fff !important;border:2px solid var(--hot);font-weight:700;box-shadow:0 6px 18px rgba(199,78,8,.38)}
.btn-hot:hover,.btn-hot:focus-visible{background:var(--hot-dark);border-color:var(--hot-dark);color:#fff !important;transform:translateY(-1px)}
.action-wrap{display:block}
.action-stack{display:inline-flex;flex-direction:column;align-items:center;gap:16px;max-width:100%}
.action-stack .stack-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.cta-band .action-stack{display:flex}
@media (max-width:640px){.action-stack{display:flex;width:100%}.action-stack .btn{width:100%;justify-content:center}.action-stack .stack-row{flex-direction:column;width:100%}}
/* odd last card centered */
.grid-2.odd-center>.card:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 14px);justify-self:center}
@media (max-width:900px){.grid-2.odd-center>.card:last-child:nth-child(odd){width:auto}}
/* roadmap link: real button, with air around it */
.next-link-wrap{text-align:center;margin:56px 0 8px}
.next-link{font-size:1.2rem;padding:16px 34px;border-width:2px;font-weight:700}
/* headline stays clear of the faces in the photo */
.hero-split .h1-narrow{max-width:520px}

/* v21: mid-page CTAs, funnel, pull quote, spacing */
section.tight-bottom{padding-bottom:36px}
section.tight-top{padding-top:40px}
.next-link-wrap.section-end{margin:36px 0 0}
.next-link:hover,.next-link:focus-visible{background:var(--navy);color:#fff;border-color:var(--navy)}
.next-link-wrap-dark .btn-secondary.next-link{font-size:1.2rem;padding:16px 34px;border-width:2px;font-weight:700}
/* three-up grids: when they drop to two columns, the orphan card centers instead of hanging left */
@media (min-width:769px) and (max-width:1024px){.grid-3>:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 12px);justify-self:center}}
.pull-quote{margin:64px auto 0;max-width:940px;text-wrap:balance;text-align:center;font-family:var(--font-display,'Playfair Display',serif);font-style:italic;font-weight:600;font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.35;color:var(--navy);padding:28px 24px 0;border:0;border-top:4px solid var(--gold);background:none}
.pull-quote::before,.pull-quote::after{content:none}
.funnel{max-width:900px;margin:0 auto}
.funnel-top{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.funnel-arrows{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin:14px 0}
.funnel-arrows svg{width:38px;height:38px;color:var(--gold-bright,#E0B24A);justify-self:center}
.funnel-bottom{max-width:440px;margin:0 auto}
.funnel-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-lg);padding:28px;text-align:center;height:100%}
@media (max-width:760px){.funnel-top,.funnel-arrows{grid-template-columns:1fr}.funnel-arrows svg:nth-child(2){display:none}.funnel-top{gap:16px}}

/* v22: header wordmark = Option 2A (Source Serif name, spaced-caps company line, gold tagline, left-aligned, more air) */
.nav-inner{padding:26px 24px;min-height:142px}
.nav-logo{gap:18px}
.nav-logo-text{align-items:flex-start;text-align:left;gap:0}
.nav-logo-main{font-family:'Source Serif 4',Georgia,serif;font-weight:600;font-size:1.9rem;line-height:1.1;letter-spacing:0}
.nav-logo-co{font-family:var(--font-label);font-weight:500;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-top:7px;line-height:1.2}
.nav-logo-sub{font-family:var(--font-label);font-weight:600;font-size:.72rem;letter-spacing:.2em;margin-top:8px;line-height:1.2}
.site-nav.is-scrolled .nav-inner{min-height:92px;padding-top:14px;padding-bottom:14px}
.site-nav.is-scrolled .nav-logo-main{font-size:1.5rem}
.site-nav.is-scrolled .nav-logo-co{font-size:.66rem;margin-top:5px}
@media (max-width:1100px){.nav-logo-main{font-size:1.6rem}.nav-logo-co{font-size:.64rem}.nav-logo-sub{font-size:.62rem}}
@media (max-width:900px){.nav-inner{min-height:84px;padding:14px 20px}.site-nav.is-scrolled .nav-inner{min-height:72px}}

/* ===== v24: hover/tap reveals, gold bar, bigger next button, bands ===== */
.pull-quote-note{max-width:720px;margin:18px auto 0;text-align:center;font-size:1.125rem;line-height:1.6;color:var(--text-mid)}
.gold-bar{height:4px;max-width:940px;margin:0 auto 40px;background:var(--gold);border-radius:2px}
.next-link-lg{font-size:1.2rem !important;padding:20px 44px !important;min-height:64px}
.next-link-wrap.next-big{margin-top:44px}
#difference.tight-bottom{padding-bottom:28px}
.who-band{background:var(--gold-pale,#FBF3DF);border-top:4px solid var(--gold);border-bottom:4px solid var(--gold)}
.who-band.tight-top{padding-top:56px}

/* reveal: a short title that opens a short explanation on hover, focus or tap */
.reveal{position:relative}
.reveal>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600}
.reveal>summary::-webkit-details-marker{display:none}
.reveal>summary::after{content:"+";flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold-ink,#7A5D1A);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1.05rem;line-height:1;transition:transform .2s,background .2s}
.reveal[open]>summary::after{content:"\2212";background:var(--gold);color:var(--navy)}
.reveal>summary h3,.reveal>summary h4{margin:0}
.reveal-body{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);background:var(--white);color:var(--text,#1c2433);border:1px solid var(--border);border-top:3px solid var(--gold);border-radius:10px;box-shadow:0 14px 34px rgba(7,26,51,.18);padding:16px 18px;animation:revealIn .16s ease-out}
.reveal-body p{margin:0;font-size:1.05rem;line-height:1.6;color:inherit}
@keyframes revealIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.reveal-card{padding:0}
.card .reveal>summary{padding:4px 0}
.card .reveal>summary h3{font-size:1.2rem}
.reveal-wrap{margin-bottom:22px}
.reveal-bar{border-left:3px solid var(--gold);padding-left:20px}
.reveal-bar summary h4{font-size:1.15rem}
.reveal-dark>summary{color:var(--white)}
.reveal-dark>summary::after{border-color:var(--gold);color:var(--gold)}
.reveal-dark[open]>summary::after{background:var(--gold);color:var(--navy)}
.reveal-dark .reveal-body{background:var(--navy-mid,#0E2848);color:rgba(255,255,255,.92);border-color:rgba(255,255,255,.18);border-top-color:var(--gold)}
.reveal-wrap .reveal-dark>summary,.reveal-wrap>.reveal-dark>summary h4{color:var(--white)}
@media (prefers-reduced-motion:reduce){.reveal-body{animation:none}}
.reveal-wrap:has(.reveal-dark){margin-bottom:0}

/* ===== v25: audit fixes ===== */
.insider-form label{font-size:.9rem}
.insider-form .insider-consent{font-size:1rem}
.proof-item span{font-size:.85rem}
.reveal>summary{min-height:48px}
.card .reveal>summary{padding:6px 0}
.btn-hot{white-space:nowrap}
@media (max-width:420px){.btn-hot{font-size:1rem;padding-left:16px;padding-right:16px;letter-spacing:0}}

/* ===== v26: two doors ===== */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch;max-width:1100px;margin:0 auto}
.door{background:var(--white);border:1px solid var(--border);border-top:5px solid var(--gold);border-radius:var(--radius-lg);padding:34px 32px 30px;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(7,26,51,.08)}
.door-agent{border-top-color:var(--navy)}
.door-eyebrow{font-family:var(--font-label);font-size:.85rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink,#7A5D1A);margin-bottom:10px}
.door-agent .door-eyebrow{color:var(--navy)}
.door h3{font-size:clamp(1.5rem,2.4vw,1.9rem);line-height:1.2;margin:0 0 10px}
.door-lead{font-size:1.125rem;color:var(--text-mid);margin:0 0 18px}
.door-points{list-style:none;margin:0 0 26px;padding:0;display:block}
.door-points li{margin:0}
.door-points .reveal>summary{padding:13px 0;border-bottom:1px solid var(--border);font-size:1.15rem;font-weight:600;color:var(--navy);gap:14px}
.door-points .reveal>summary::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--gold);flex-shrink:0}
.door-points .reveal>summary .rt{flex:1}
.door-points .reveal-body{top:calc(100% - 2px)}
.door-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:12px}
.door-actions .btn{flex:1 1 220px;text-align:center}
.door-call{text-align:center;margin-top:34px}
.door-call p{margin:0 0 12px;font-size:1.125rem;color:var(--text-mid)}
.commit-points{margin-top:18px;margin-bottom:0}
@media (max-width:900px){.doors{grid-template-columns:1fr}.door{padding:26px 22px 24px}}
.photo-support h2,.section-header h2{text-wrap:balance}

/* ===== v27: reveals become in-flow, tap-only accordions (no hover popovers) ===== */
.reveal-body{position:static;margin:0 0 10px;box-shadow:none;animation:none;border:1px solid var(--border);border-left:3px solid var(--gold);border-top:1px solid var(--border);border-radius:8px;padding:14px 16px;background:var(--off-white,#FAF6ED)}
.reveal-dark .reveal-body{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);border-left-color:var(--gold)}
.door-points .reveal-body{top:auto}
.reveal>summary::after{border-color:var(--gold-ink,#7A5D1A);border-width:2px;width:30px;height:30px}
.reveal-dark>summary::after{border-color:var(--gold)}
.reveal>summary:focus-visible{outline:3px solid var(--navy);outline-offset:3px;border-radius:6px}
.reveal-dark>summary:focus-visible{outline-color:var(--gold)}
.reveal>summary{cursor:pointer}
.reveal-wrap:has(.reveal-dark){margin-bottom:12px}
:root{--text-light:#5A6472}

/* ---- client-only homepage ---- */
.hero-trust-line{margin:18px 0 0;font-size:1.05rem;color:rgba(255,255,255,.82)}
.because{background:var(--white);padding:84px 0 40px}
.because-h{font-size:clamp(2rem,4.2vw,3rem);text-align:center;max-width:900px;margin:0 auto 44px;line-height:1.15}
.because-h em,.because-row em{color:var(--gold-ink,#7A5D1A);font-style:italic}
.because-list{max-width:980px;margin:0 auto}
.because-row{display:grid;grid-template-columns:5fr 7fr;gap:36px;padding:26px 0;border-top:1px solid var(--border);align-items:baseline}
.because-row:last-child{border-bottom:1px solid var(--border)}
.because-row .q{font-family:var(--font-display,'Playfair Display',serif);font-size:1.5rem;font-weight:700;color:var(--navy);line-height:1.25}
.because-row .a{font-family:'Source Serif 4',Georgia,serif;font-size:1.3rem;line-height:1.55;color:var(--text,#1c2433)}



.steps{background:var(--off-white);padding:84px 0}
.steps-h{text-align:center;font-size:clamp(2rem,4vw,2.8rem);margin:0 0 40px}
.steps-list{list-style:none;margin:0 auto;padding:0;max-width:900px}
.steps-list li{display:flex;gap:28px;align-items:flex-start;padding:22px 0}
.steps-list .n{font-family:var(--font-display,'Playfair Display',serif);font-size:4rem;line-height:1;color:var(--gold);font-weight:700;min-width:64px;text-align:center}
.steps-list h3{font-size:1.6rem;margin:0 0 6px}
.steps-list p{font-size:1.2rem;line-height:1.55;margin:0;color:var(--text-mid)}
.steps-cta{text-align:center;margin:30px 0 0}
.about-band{background:var(--white);padding:84px 0;text-align:center}
.about-band h2{font-size:clamp(1.8rem,3.6vw,2.6rem);max-width:820px;margin:0 auto 16px}
.about-band p{max-width:720px;margin:0 auto 14px;font-size:1.25rem;line-height:1.6}
.about-band .tools-line{font-size:1.1rem;color:var(--text-mid)}
.about-band .tools-line a{color:var(--navy);font-weight:600;text-decoration:underline}
.voices{background:var(--gold-pale,#F6ECD6);padding:80px 0}
.voices .container{display:grid;grid-template-columns:1fr 1fr;gap:56px;max-width:1040px}
.voices blockquote{margin:0;border-left:4px solid var(--gold);padding-left:26px}
.voices blockquote p{font-family:'Source Serif 4',Georgia,serif;font-size:1.4rem;line-height:1.55;font-style:italic;margin:0 0 14px;color:var(--navy)}
.voices cite{font-style:normal;font-weight:600;color:var(--gold-ink,#7A5D1A);font-size:1.1rem}
@media(max-width:800px){.because-row{grid-template-columns:1fr;gap:8px;padding:22px 0}.voices .container{grid-template-columns:1fr;gap:34px}.steps-list li{gap:18px}.steps-list .n{font-size:3rem;min-width:44px}}

.fineprint{font-size:.85rem;line-height:1.5;color:var(--text-light,#5A6472);margin:14px auto 0;max-width:640px}
.cta-band .fineprint,.about-band .fineprint{color:rgba(255,255,255,.72)}
.voices .fineprint{grid-column:1/-1;margin:0;text-align:center;max-width:none}

/* ---- v31: taller header, "since 2011" line, centered hero, phone photo-on-top ---- */
.nav-inner{padding-top:30px!important;padding-bottom:30px!important}
.nav-logo-since{display:block;color:#fff;font-style:italic;font-family:"Source Serif 4",Georgia,serif;font-size:.95rem;margin-top:14px;letter-spacing:.01em}
.hero-split{min-height:560px}
.hero-split .hero-inner{text-align:center!important}
.hero-split .hero-sub{max-width:none;margin-left:auto;margin-right:auto}
.hero-split .hero-actions,.hero-split .stack-row,.hero-split .action-stack{justify-content:center;align-items:center}
.hero-split .hero-trust{justify-content:center}
.hero-text-link{display:block;margin-top:14px;color:rgba(255,255,255,.85);font-size:.95rem;text-decoration:underline;text-underline-offset:3px}
.hero-text-link:hover{color:#fff}
@media(max-width:900px){
  .hero-split{display:flex!important;flex-direction:column;min-height:0!important;padding:0 20px 36px!important;background:#071A33}
  .hero-split::after{display:none!important}
  .hero-split-media{order:-1;position:relative!important;width:calc(100% + 40px)!important;height:330px;margin:0 -20px;top:auto;right:auto;bottom:auto;left:auto;overflow:hidden}
  .hero-split-media::after{content:"";position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(180deg,rgba(7,26,51,0) 0%,#071A33 100%);z-index:3}
  .hero-photo-frame{position:absolute!important;inset:0}
  .hero-photo-frame img{object-position:center 30%}
  .hero-split-media img:not(:first-child){display:none!important}
  .hero-split-media img:first-child{animation:none!important;opacity:1!important}
  .hero-rotation-toggle{display:none!important}
  .hero-split .hero-inner{margin:-34px auto 0!important;max-width:none!important;position:relative;z-index:4}
  .nav-inner{padding-top:12px!important;padding-bottom:12px!important}
  .nav-logo-since{display:block!important;font-size:.72rem;margin-top:8px}
  .nav-logo-sub{display:block!important;font-size:.6rem}
}

/* ---- v32: gap-free 4-photo rotator + self-serve band ---- */
.hero-photo-frame>img:first-child:nth-last-child(4),
.hero-photo-frame>img:first-child:nth-last-child(4)~img{opacity:0;animation:heroRotate4 28s infinite linear}
.hero-photo-frame>img:first-child:nth-last-child(4){animation-delay:-1s}
.hero-photo-frame>img:first-child:nth-last-child(4)~img:nth-child(2){animation-delay:-22s}
.hero-photo-frame>img:first-child:nth-last-child(4)~img:nth-child(3){animation-delay:-15s}
.hero-photo-frame>img:first-child:nth-last-child(4)~img:nth-child(4){animation-delay:-8s}
@keyframes heroRotate4{0%{opacity:0}3.57%{opacity:1}25%{opacity:1}28.57%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion: reduce){
  .hero-photo-frame>img:first-child:nth-last-child(4){animation:none;opacity:1}
  .hero-photo-frame>img:first-child:nth-last-child(4)~img{animation:none;opacity:0}
}
.diy{background:var(--off-white,#F8F6F1);padding:72px 0;text-align:center}
.diy .container{max-width:720px}
.diy h2{margin-bottom:12px}
.diy p{color:var(--text-mid,#3d4756)}
.diy-cta{margin:26px 0 0}

/* ---- v33: declarative strip across the bottom of the hero ---- */
.hero-strip{position:absolute;left:0;right:0;bottom:0;z-index:5;background:rgba(4,16,31,.84);border-top:1px solid rgba(196,146,42,.55);color:#fff;text-align:center;padding:16px 24px;font-size:1rem;letter-spacing:.05em}
.hero-split:has(.hero-strip){padding-bottom:120px!important}
@media(max-width:900px){
  .hero-split:has(.hero-strip){padding-bottom:0!important}
  .hero-strip{position:static;margin:26px -20px 0;font-size:.9rem;padding:14px 16px;line-height:1.5}
}

.hero-diy{margin:18px 0 0;font-size:1.02rem;color:rgba(255,255,255,.88);text-align:center}
.hero-diy a{color:#e8c36a;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.hero-diy a:hover{color:#fff}
@media(max-width:900px){.hero-diy{margin-top:16px}}