/* /css/funnel.css — Direction A (2026 rebrand)
   Shared restyle for the funnel/apply/audit quiz pages + their thank-you pages.
   Linked just before </head> so it overrides each page's inline <style>.
   The template is token-driven, so retuning the design tokens flips most of
   the UI; component rules below finish the job and calm the red alarm.

   Palette: ink #0B1418 · deep teal #0F5F52 · paper #F6F5F1 · card #FFFFFF
   hairline #E0DCD2 · muted #5D6B67 · terracotta #A8641B (was alarm red)
   Type: Newsreader (display) · IBM Plex Sans (body) · IBM Plex Mono (labels)
   Square corners, 1px hairline borders, 2px radius on buttons only, no shadows. */

:root {
  --primary: #0F5F52 !important;
  --primary-dark: #0C4C42 !important;
  --accent: #0F5F52 !important;
  --accent-glow: rgba(15, 95, 82, 0.16) !important;
  --bg-dark: #F6F5F1 !important;
  --bg-card: #FFFFFF !important;
  --text: #26312E !important;
  --text-muted: #5D6B67 !important;
  --danger: #A8641B !important;   /* terracotta, not alarm red */
  --success: #0F5F52 !important;
  --warning: #A8641B !important;
}

body {
  background: #F6F5F1 !important;
  color: #26312E !important;
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif !important;
  /* thank-you pages centre content with a flex body, which turned the shared
     header/footer into side-by-side flex siblings; force normal stacking. */
  display: block !important;
}

h1, h2, h3,
.hero h1, .step-question, .success-box h2, .disqualified h2 {
  font-family: 'Newsreader', Georgia, serif !important;
  color: #0B1418 !important;
  font-weight: 600 !important;
}

/* No shadows / glows anywhere */
* { text-shadow: none !important; }
.hero, .funnel-card, .option-btn, .cta-btn, .stat-item, .success-box,
.urgency-banner, .proof-strip, .alt-offer, .disqualified, .hard-truth,
.trust-badge, .input-group input, .input-group select {
  box-shadow: none !important;
}
.hero { background: transparent !important; }

/* Announcement / urgency strip -> calm info, not red alarm */
.urgency-banner {
  background: #EEF2F0 !important;
  background-image: none !important;
  color: #0B1418 !important;
  border-bottom: 1px solid #D5DDDA !important;
  font-weight: 500 !important;
}

/* Hero + multi-colour emphasis spans -> ink / teal */
.hero h1 { color: #0B1418 !important; }
.hero h1 .highlight, .hero h1 .danger, .highlight, .danger {
  color: #0F5F52 !important;
  -webkit-text-fill-color: #0F5F52 !important;
  background: none !important;
  background-image: none !important;
}
.tagline, .step-subtext { color: #5D6B67 !important; }

/* Step eyebrow */
.step-badge {
  background: transparent !important;
  color: #0F5F52 !important;
  border: 1px solid #0F5F52 !important;
  border-radius: 2px !important;
  font-family: 'IBM Plex Mono', monospace !important;
  text-transform: none !important;
}

/* Stats */
.stats-bar, .stat-item { background: transparent !important; border-color: #E0DCD2 !important; }
.stat-number { color: #0F5F52 !important; font-family: 'Newsreader', Georgia, serif !important; }
.stat-label { color: #5D6B67 !important; }

/* Card + progress */
.funnel-card {
  background: #FFFFFF !important;
  border: 1px solid #E0DCD2 !important;
  border-radius: 0 !important;
}
.progress-container { background: #E0DCD2 !important; border-radius: 0 !important; }
.progress-bar { background: #0F5F52 !important; background-image: none !important; }
.progress-text { color: #5D6B67 !important; }

/* Quiz options (emoji icons removed) */
.option-btn {
  background: #FFFFFF !important;
  border: 1px solid #E0DCD2 !important;
  border-radius: 0 !important;
  color: #26312E !important;
}
.option-btn:hover, .option-btn.selected, .option-btn.active {
  border-color: #0F5F52 !important;
  background: #EEF2F0 !important;
}
.option-title { color: #0B1418 !important; }
.option-icon, .success-icon, .disqualified-icon { display: none !important; }

/* Inputs */
.input-group input, .input-group select, .input-group textarea {
  background: #FFFFFF !important;
  border: 1px solid #E0DCD2 !important;
  border-radius: 2px !important;
  color: #0B1418 !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
}
.input-group label { color: #26312E !important; }

/* Buttons — primary ink fill, secondary outline; 2px radius only here */
.cta-btn {
  background: #0B1418 !important;
  background-image: none !important;
  color: #F6F5F1 !important;
  border: 1px solid #0B1418 !important;
  border-radius: 2px !important;
  text-transform: none !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
}
.cta-btn:hover { background: #0F5F52 !important; border-color: #0F5F52 !important; }
.cta-btn.secondary {
  background: transparent !important;
  color: #0B1418 !important;
  border: 1px solid #0B1418 !important;
}
.cta-btn.secondary:hover { background: #0B1418 !important; color: #F6F5F1 !important; }

/* Result states -> Direction A cards */
.success-box, .success-screen {
  background: #EEF2F0 !important;
  border: 1px solid #D5DDDA !important;
  border-left: 2px solid #0F5F52 !important;
  border-radius: 0 !important;
  color: #26312E !important;
}
.alt-offer, .hard-truth, .qualification-badge {
  background: #EEF2F0 !important;
  border: 1px solid #D5DDDA !important;
  border-radius: 0 !important;
  color: #26312E !important;
}
.disqualified {
  background: #FBF3E9 !important;
  border: 1px solid #E8D9C2 !important;
  border-left: 2px solid #A8641B !important;
  border-radius: 0 !important;
  color: #26312E !important;
}
.success-box *, .alt-offer *, .hard-truth *, .disqualified * { color: inherit !important; }

/* No all-caps: the template's uppercase was the old neon styling; the
   underlying text is proper case, so switching it off reads correctly. */
.tagline, .stat-label,
.proof-strip, .proof-strip *,
.trust-section, .trust-section *,
.social-proof, .social-proof * {
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}

/* Redundant all-caps "STEP X OF 7" chip (the sentence-case "Step 1 of 7"
   indicator above the progress bar already shows this). */
.step-badge { display: none !important; }

/* Legacy cyan crown logo — the Direction A wordmark in the sticky header
   provides branding; hide rather than ship off-palette cyan artwork. */
.logo-image { display: none !important; }

/* Trust / proof */
.proof-strip, .trust-section, .social-proof { background: transparent !important; }
.trust-badge {
  background: #FFFFFF !important;
  border: 1px solid #E0DCD2 !important;
  border-radius: 2px !important;
  color: #26312E !important;
}
.proof-quote { color: #26312E !important; }

/* Square the thank-you pill buttons (Direction A: 2px radius on buttons) */
.book-btn, .social-link, .resource-buttons a { border-radius: 2px !important; }
.book-btn { background: #0F5F52 !important; background-image: none !important; color: #F6F5F1 !important; box-shadow: none !important; }
.social-link { background: #FFFFFF !important; border: 1px solid #E0DCD2 !important; color: #26312E !important; }
