/* ============================================================
   F3-Scaler — verbatim-inherited CSS from CLS 1_Audit_Funnel
   reference (Page_1_freeaudit.html). Color tokens swapped for
   MFP brand: orange → green, blue/navy → navy #000066, cream → gray.
   Structure, typography, sizing, spacing all preserved 1:1.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { margin: 0; padding: 0; }

:root {
  /* MFP brand (replaces CLS palette) */
  --cls-orange: #006900;
  --cls-blue: #000066;
  --cls-blue-on-dark: #6B6BCC;
  --cls-blue-soft: rgba(0, 0, 102, 0.10);
  --cls-blue-soft-text: #000066;
  --cls-orange-glow: rgba(0, 105, 0, 0.35);

  --cls-navy: #000066;
  --cls-body: #595959;
  --cls-slate: #737A89;
  --cls-cream: #F1F1F1;
  --cls-gray-50: #F5F5F5;
  --cls-white: #FFFFFF;
  --cls-black: #000000;
  --cls-rich-black: #1A1A1A;

  --font-display: 'Montserrat', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-italic: 'Playfair Display', Georgia, serif;
  --font-body: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --maxw: 1180px;
}

html { scroll-behavior: smooth; background: var(--cls-cream); }
body {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  color: var(--cls-body);
  background: var(--cls-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

.cls-page {
  max-width: 1180px;
  margin: 0 auto;
  background: var(--cls-white);
  box-shadow: 0 0 60px rgba(0,0,102,.06);
  position: relative;
  overflow: hidden;
}
@media (max-width: 1180px) {
  .cls-page { box-shadow: none; }
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -.015em;
  line-height: 1.08;
  color: var(--cls-navy);
}

p { margin-bottom: 14px; }
p:last-child { margin-bottom: 0; }

em.purple, .purple-italic {
  font-family: var(--font-italic);
  font-style: italic;
  font-weight: 800;
  color: var(--cls-blue);
}

.container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }

/* ============ TOP ANNOUNCEMENT BAR ============ */
.announce {
  background: var(--cls-navy);
  color: var(--cls-white);
  padding: 11px 16px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  font-family: var(--font-body);
}
.announce .live-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  margin-right: 10px;
  vertical-align: middle;
}
.announce .live-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--cls-orange);
  animation: pulse 1.5s ease-out infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,105,0,.7); }
  50% { box-shadow: 0 0 0 6px rgba(0,105,0,0); }
}

/* ============ LOGO LOCKUP ============ */
.logo-row {
  text-align: center;
  padding: 28px 0 6px;
}
.logo-row img.logo-mfp {
  display: inline-block;
  height: 64px;
  width: auto;
  margin: 0 auto;
}

/* ============ HERO ============ */
.hero {
  padding: 18px 0 56px;
  background: var(--cls-white);
}
.hero-headline {
  text-align: center;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(34px, 4.6vw, 56px);
  line-height: 1.1;
  max-width: 1000px;
  margin: 0 auto 8px;
  letter-spacing: -.02em;
  color: var(--cls-navy);
}
.hero-headline em.purple { line-height: 1; }
.hosted-by {
  text-align: center;
  font-family: var(--font-body);
  font-style: italic;
  font-weight: 500;
  color: var(--cls-body);
  font-size: 16px;
  margin: 0 auto 32px;
  max-width: 820px;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

.hero-image-wrap {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,102,.10);
  background: linear-gradient(135deg, var(--cls-navy) 0%, #4040AA 100%);
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-image-wrap img { width: 60%; max-width: 240px; height: auto; filter: brightness(0) invert(1); }

.event-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}
.event-pill {
  background: var(--cls-white);
  border: 1px solid var(--cls-slate);
  border-radius: 999px;
  padding: 8px 16px;
  font-weight: 600;
  font-size: 14px;
  color: var(--cls-navy);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
}

.hosts-label {
  margin: 28px 0 14px;
  text-align: center;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--cls-blue);
  text-transform: uppercase;
}
.host-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--cls-white);
  border: 1px solid var(--cls-gray-50);
  border-left: 3px solid var(--cls-blue);
  border-radius: 6px;
  padding: 14px 18px;
  margin-bottom: 12px;
  box-shadow: 0 2px 8px rgba(0,0,102,.04);
}
.host-card-img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  border: 2px solid var(--cls-blue);
  padding: 2px;
  background: var(--cls-navy);
  display: flex;
  align-items: center;
  justify-content: center;
}
.host-card-img img { width: 70%; height: auto; filter: brightness(0) invert(1); }
.host-card-meta { flex: 1; }
.host-card-tag {
  font-family: var(--font-body);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cls-blue);
  font-weight: 700;
  margin-bottom: 2px;
}
.host-card-name {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--cls-navy);
  margin-bottom: 2px;
}
.host-card-bio {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--cls-body);
  line-height: 1.4;
}

/* ============ QUIZ PANEL ============ */
.quiz-panel {
  background: var(--cls-white);
  border-radius: 12px;
  padding: 24px 24px 22px;
  box-shadow: 0 4px 16px rgba(0,0,102,.06), 0 0 0 4px rgba(0,0,102,0.08);
  border: 2px solid var(--cls-blue);
  position: relative;
}
.quiz-panel h3 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 30px;
  text-align: center;
  margin-bottom: 6px;
  letter-spacing: -.015em;
  line-height: 1.1;
  color: var(--cls-navy);
}
.quiz-panel-sub {
  text-align: center;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--cls-body);
  margin-bottom: 20px;
}
.quiz-list { list-style: none; }
.quiz-option {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 8px 4px;
  border: none;
  border-radius: 0;
  margin-bottom: 4px;
  cursor: pointer;
  transition: opacity .15s;
  background: transparent;
  width: 100%;
  text-align: left;
}
.quiz-option:hover { opacity: .85; }
.quiz-radio {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1.5px solid var(--cls-blue);
  flex-shrink: 0;
  margin-top: 4px;
  position: relative;
  background: var(--cls-white);
}
.quiz-option.selected .quiz-radio::after {
  content: "";
  position: absolute;
  inset: 2.5px;
  border-radius: 50%;
  background: var(--cls-blue);
}
.quiz-option-body { flex: 1; }
.quiz-option-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 15px;
  color: var(--cls-navy);
  margin-bottom: 3px;
  line-height: 1.3;
  display: block;
}
.quiz-option-desc {
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--cls-body);
  line-height: 1.45;
  display: block;
}

/* ============ HIGH-DEMAND PILL ============ */
.demand-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 6px 14px;
  background: var(--cls-gray-50);
  border: 1px solid var(--cls-gray-50);
  border-radius: 999px;
  font-size: 12px;
  font-family: var(--font-body);
}
.demand-pill .dot {
  width: 7px; height: 7px;
  background: var(--cls-blue);
  border-radius: 50%;
}
.demand-pill .high {
  color: var(--cls-navy);
  font-weight: 700;
  letter-spacing: .08em;
  font-size: 11px;
  text-transform: uppercase;
}
.demand-pill .meta { color: var(--cls-body); }
.demand-pill .meta strong { color: var(--cls-navy); font-weight: 700; }

/* ============ PRIMARY CTA ============ */
.btn-primary {
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  background: var(--cls-orange);
  color: var(--cls-white);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: .015em;
  text-transform: none;
  padding: 16px 28px;
  border-radius: 8px;
  margin-top: 14px;
  box-shadow: 0 0 24px var(--cls-orange-glow);
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 30px rgba(0,105,0,.5), 0 6px 16px rgba(0,105,0,.2);
  filter: brightness(1.04);
}
.btn-primary:disabled {
  opacity: .65;
  cursor: not-allowed;
  transform: none;
  filter: none;
}
.btn-primary .btn-line-1 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.btn-primary .arrow { font-size: 18px; line-height: 1; }
.btn-primary .btn-sub-inline {
  display: block;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  opacity: .85;
  letter-spacing: 0;
  text-transform: none;
  color: var(--cls-white);
}
.btn-sub {
  display: block;
  text-align: center;
  margin-top: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--cls-body);
  font-weight: 600;
}

/* ============ TRUST MICRO-LINE ============ */
.micro-line {
  text-align: center;
  font-family: var(--font-body);
  font-size: 11px;
  color: var(--cls-body);
  margin-top: 10px;
  letter-spacing: .04em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
}
.micro-line .ring-check { flex-shrink: 0; vertical-align: -2px; }

/* ============ ROTATING HEADLINE — typewriter ============ */
.rotating-headline {
  text-align: center;
  padding: 22px 24px 28px;
}
.rotating-headline-pre {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(28px, 3.4vw, 38px);
  color: var(--cls-navy);
  letter-spacing: -.015em;
  margin-bottom: 4px;
  line-height: 1.1;
}
.rotating-headline-rotator {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(40px, 5.6vw, 70px);
  color: var(--cls-navy);
  letter-spacing: -.02em;
  line-height: 1.08;
  min-height: 1.08em;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0;
}
.rot-plain { white-space: pre; }
.rot-italic {
  font-family: var(--font-display);
  font-weight: 700;
  font-style: italic;
  color: var(--cls-blue);
  white-space: pre;
}
.rot-cursor {
  display: inline-block;
  width: 3px;
  background: var(--cls-navy);
  margin-left: 4px;
  align-self: stretch;
  animation: cursor-blink 1s step-end infinite;
}
@keyframes cursor-blink {
  0%, 50% { opacity: 1; }
  50.01%, 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .rot-cursor { animation: none; opacity: 0; }
}

/* ============ CURRICULUM INTRO ============ */
.curriculum-intro {
  padding: 40px 0 30px;
  text-align: center;
  border-top: 1px solid var(--cls-blue);
  margin-top: 30px;
}
.curriculum-intro .pre {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 16px;
  color: var(--cls-body);
  margin-bottom: 12px;
}
.curriculum-intro h2 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(32px, 4.6vw, 54px);
  line-height: 1.1;
  max-width: 1100px;
  margin: 0 auto;
  letter-spacing: -.02em;
  color: var(--cls-navy);
}

/* ============ DAY/LAYER ROWS ============ */
.curriculum {
  padding: 0 0 30px;
}
.curriculum > .container { max-width: 1000px; }
.day {
  padding: 32px 0;
  border-top: 1px solid var(--cls-gray-50);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.day-content { order: 1; }
.day-image { order: 2; }
@media (min-width: 901px) {
  .curriculum .day:nth-child(even) .day-content { order: 2; }
  .curriculum .day:nth-child(even) .day-image   { order: 1; }
}
.day-image {
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,102,.10);
  background: linear-gradient(135deg, var(--cls-navy) 0%, #4040AA 100%);
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.day-image img {
  width: 50%;
  max-width: 180px;
  height: auto;
  filter: brightness(0) invert(1);
}
.day-label {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 12px;
}
.day-headline {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(30px, 3.6vw, 42px);
  line-height: 1.1;
  margin-bottom: 8px;
  letter-spacing: -.02em;
  color: var(--cls-navy);
}
.day-sub {
  font-family: var(--font-body);
  font-size: 17px;
  color: var(--cls-body);
  margin-bottom: 18px;
  font-weight: 400;
}
.day-content p {
  font-family: var(--font-body);
  color: var(--cls-body);
  font-size: 17px;
  line-height: 1.65;
  margin-bottom: 14px;
}
.day-content strong { color: var(--cls-navy); font-weight: 700; }
.day-content u {
  text-decoration: underline;
  text-decoration-color: var(--cls-blue);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.curriculum .day:nth-child(2),
.curriculum .day:nth-child(4) {
  background: var(--cls-cream);
  border-radius: 8px;
  padding: 48px 24px;
  margin: 16px 0;
  border-top: none;
}

.lavender-quote {
  margin-top: 22px;
  background: var(--cls-blue-soft);
  padding: 16px 20px;
  border-radius: 6px;
  font-family: var(--font-body);
  font-style: italic;
  font-weight: 400;
  color: var(--cls-navy);
  font-size: 17px;
  line-height: 1.5;
}
.lavender-quote em.purple {
  font-family: var(--font-display);
  font-weight: 700;
  font-style: italic;
  color: var(--cls-blue-soft-text);
}

/* ============ BOTTOM HOSTS ============ */
.bottom-hosts {
  padding: 48px 0 40px;
  text-align: center;
  background: var(--cls-gray-50);
  border-top: 1px solid var(--cls-gray-50);
}
.bottom-hosts-eyebrow {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 8px;
}
.bottom-hosts-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(36px, 4.6vw, 60px);
  line-height: 1.05;
  margin-bottom: 28px;
  letter-spacing: -.02em;
  color: var(--cls-navy);
}
.hosts-row {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 32px;
  align-items: center;
  text-align: left;
  max-width: 820px;
  margin: 0 auto;
}
.host-col-left { text-align: right; }
.host-col-right { text-align: left; }
.host-name-line {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 22px;
  margin-bottom: 6px;
  color: var(--cls-navy);
  letter-spacing: -.01em;
}
.host-col-left .host-name-line { flex-direction: row-reverse; }
.verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px; height: 18px;
  background: var(--cls-blue);
  color: var(--cls-white);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
}
.host-tag {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 14px;
  line-height: 1.5;
}
.host-bio {
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--cls-body);
  line-height: 1.6;
}
.host-combined {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,102,.10);
  background: linear-gradient(135deg, var(--cls-navy) 0%, #4040AA 100%);
  aspect-ratio: 1 / 1;
  max-width: 320px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.host-combined img {
  width: 60%;
  max-width: 180px;
  height: auto;
  filter: brightness(0) invert(1);
}

.bottom-hosts-cta {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.bottom-hosts-cta .btn-primary { max-width: 420px; margin-top: 0; }
.bottom-hosts-credit {
  margin-top: 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--cls-body);
  font-style: italic;
}

/* ============ FINAL RECAP ============ */
.final-recap-wrap { padding: 0; }
.final-recap {
  margin: 60px 24px 40px;
  background: linear-gradient(180deg, var(--cls-black) 0%, var(--cls-rich-black) 100%);
  border: 1px solid rgba(0,0,102,.3);
  border-radius: 16px;
  padding: 80px 28px;
  text-align: center;
  color: var(--cls-white);
  position: relative;
  overflow: hidden;
}
.final-recap > * { position: relative; z-index: 1; }
.final-recap h2 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(34px, 4.8vw, 56px);
  line-height: 1.08;
  color: var(--cls-white);
  max-width: 960px;
  margin: 0 auto 22px;
  letter-spacing: -.02em;
}
.final-recap h2 em.purple {
  color: var(--cls-blue-on-dark);
  font-size: inherit;
  font-family: var(--font-italic);
  font-weight: 800;
  font-style: italic;
}
.final-recap-sub {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 17px;
  margin-bottom: 28px;
  opacity: .92;
  color: var(--cls-white);
}
.final-recap-cta { max-width: 460px; margin: 0 auto; }
.final-recap-cta .btn-primary {
  width: 100%;
  box-shadow: 0 0 32px var(--cls-orange-glow), 0 8px 24px rgba(0,105,0,.18);
}
.final-recap-micro {
  margin-top: 20px;
  font-family: var(--font-body);
  font-size: 13px;
  color: rgba(255,255,255,.6);
  letter-spacing: .04em;
}

/* ============ FOOTER ============ */
footer.mfp-footer {
  background: var(--cls-black);
  color: rgba(255,255,255,.75);
  padding: 60px 24px 44px;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
}
footer.mfp-footer .mfp-footer-logo {
  display: block;
  width: 80px;
  margin: 0 auto 18px;
  filter: brightness(0) invert(1);
}
footer.mfp-footer .partnership {
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.6);
  margin: 14px 0 6px;
  font-weight: 600;
}
footer.mfp-footer .mfp-wordmark {
  display: inline-block;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .26em;
  color: var(--cls-white);
  text-transform: uppercase;
  margin-bottom: 22px;
  padding: 4px 12px;
  opacity: .8;
}
footer.mfp-footer .company-line {
  margin: 12px 0 6px;
  color: rgba(255,255,255,.75);
  font-weight: 400;
  font-size: 14px;
}
footer.mfp-footer .footer-links {
  margin: 14px 0 14px;
  font-weight: 600;
  font-size: 14px;
}
footer.mfp-footer .footer-links a {
  color: rgba(255,255,255,.85);
  margin: 0 6px;
  transition: color .15s;
}
footer.mfp-footer .footer-links a:hover { color: var(--cls-blue-on-dark); }
footer.mfp-footer .disclaimer {
  max-width: 700px;
  margin: 24px auto 0;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.1);
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 1.6;
  color: rgba(255,255,255,.5);
  font-weight: 400;
}

/* ============ FORM MODAL ============ */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(10, 15, 31, 0);
  backdrop-filter: blur(0px);
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease, background .3s ease, backdrop-filter .3s ease;
}
.modal-overlay.open {
  opacity: 1;
  pointer-events: auto;
  background: rgba(10, 15, 31, 0.65);
  backdrop-filter: blur(4px);
}
.modal-shell {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  pointer-events: none;
}
.modal-card {
  position: relative;
  background: var(--cls-white);
  border-radius: 16px;
  width: 100%;
  max-width: 520px;
  max-height: calc(100vh - 48px);
  box-shadow: 0 30px 80px rgba(0,0,0,.4), 0 0 0 1px rgba(0,0,102,.15);
  opacity: 0;
  transform: translateY(24px) scale(.96);
  transition: opacity .35s ease, transform .35s cubic-bezier(.2, .85, .35, 1);
  pointer-events: none;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.modal-overlay.open ~ .modal-shell .modal-card {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--cls-gray-50);
  color: var(--cls-navy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  line-height: 1;
  border: none;
  cursor: pointer;
  z-index: 2;
  transition: background .15s, transform .15s;
}
.modal-close:hover {
  background: var(--cls-blue);
  color: var(--cls-white);
  transform: rotate(90deg);
}
.modal-header {
  padding: 28px 28px 12px;
  text-align: center;
}
.modal-header .eyebrow {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 6px;
}
.modal-header h3 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 26px;
  letter-spacing: -.015em;
  line-height: 1.1;
  color: var(--cls-navy);
  margin-bottom: 4px;
}
.modal-header h3 em.purple {
  font-family: var(--font-italic);
  font-style: italic;
  font-weight: 800;
  color: var(--cls-blue);
}
.modal-header p {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--cls-body);
  margin: 0;
}
.modal-form-wrap {
  padding: 14px 28px 28px;
}
.modal-form-wrap .form-group { margin-bottom: 12px; }
.modal-form-wrap label {
  display: block;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--cls-navy);
  margin-bottom: 6px;
}
.modal-form-wrap input[type="text"],
.modal-form-wrap input[type="email"] {
  width: 100%;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 16px;
  border: 1px solid var(--cls-slate);
  border-radius: 8px;
  background: var(--cls-white);
  color: var(--cls-navy);
  min-height: 48px;
  transition: border-color .15s, box-shadow .15s;
}
.modal-form-wrap input:focus {
  outline: none;
  border-color: var(--cls-orange);
  box-shadow: 0 0 0 3px rgba(0,105,0,.18);
}
.modal-form-wrap .honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.modal-form-wrap .form-error {
  display: none;
  color: #c63;
  font-family: var(--font-body);
  font-size: 13px;
  background: #fef0e6;
  padding: 8px 12px;
  border-radius: 6px;
  margin-bottom: 10px;
}
.modal-form-wrap .form-error.visible { display: block; }
.modal-form-wrap .btn-microcopy {
  text-align: center;
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--cls-body);
  margin-top: 12px;
  letter-spacing: .02em;
}
body.modal-open { overflow: hidden; }

/* ============ STICKY BOTTOM CTA ============ */
.sticky-cta {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  opacity: 0;
  pointer-events: none;
  width: calc(100% - 32px);
  max-width: 520px;
  z-index: 90;
  transition: opacity .25s ease, transform .25s ease;
}
.sticky-cta.visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.sticky-cta .btn-primary { margin-top: 0; }

/* ============ RESPONSIVE ============ */
@media (max-width: 900px) {
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .day {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 48px 0;
  }
  .day-content { order: 1; }
  .day-image { order: 2; }
  .hosts-row {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .host-col-left, .host-col-right { text-align: center; }
  .host-col-right .host-name-line { flex-direction: row; }
  .quiz-panel { padding: 22px 18px; }
  .final-recap { padding: 60px 22px; margin: 40px 16px 30px; }
}

/* Mobile (≤770px): hide image placeholder cards.
   On desktop these slots hold real photos (per CLS reference design); on our
   F3-Scaler build they're navy-gradient placeholders with just a small MFP
   logo. On mobile these placeholders waste ~1400px of vertical space across
   the squeeze page and ~1100px on delivery, pushing real content below the
   fold and hurting paid-traffic engagement. Hide them on mobile until real
   Jimmy photos replace the placeholders. Desktop layout unchanged. */
@media (max-width: 770px) {
  .hero-image-wrap,
  .day-image,
  .host-combined {
    display: none !important;
  }
}
@media (max-width: 480px) {
  input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
  input[type="password"], input[type="search"], input[type="url"], textarea, select {
    font-size: 16px !important;
  }
  body { font-size: 18px; }
  .hero-headline { font-size: clamp(28px, 6vw, 32px); }

  /* MEDIUM polish (rev 33) — fluid headline sizing on small phones.
     Reduces clamp() floor so headlines breathe at 320-414px instead of
     cramping. Desktop unaffected (>480px). */
  .bottom-hosts-title { font-size: clamp(28px, 7vw, 36px); }
  .day-headline { font-size: clamp(22px, 6vw, 30px); }
  .rotating-headline-rotator { font-size: clamp(28px, 7vw, 40px); }

  .announce {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    padding: 14px 16px !important;
    letter-spacing: .005em !important;
  }
  .announce .live-pill {
    font-size: 12px !important;
    padding: 3px 11px !important;
  }
  .final-recap h2 {
    font-size: clamp(28px, 8vw, 38px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.01em !important;
    margin-bottom: 18px !important;
  }
  .final-recap-sub {
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    opacity: 1 !important;
    margin-bottom: 24px !important;
  }
  .final-recap-micro {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: rgba(255,255,255,.85) !important;
    margin-top: 18px !important;
  }
  footer.mfp-footer {
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: rgba(255,255,255,.88) !important;
  }
  footer.mfp-footer .partnership { font-size: 13px !important; color: rgba(255,255,255,.75) !important; }
  footer.mfp-footer .company-line { font-size: 14px !important; color: rgba(255,255,255,.85) !important; }
  footer.mfp-footer .footer-links { font-size: 14px !important; }
  footer.mfp-footer .footer-links a { color: rgba(255,255,255,.95) !important; }
}

/* ============ START.HTML SUPPORT (questions page) ============ */
.audit-hero { padding: 22px 0 28px; text-align: center; }
.audit-hero h1 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(34px, 4.6vw, 56px);
  letter-spacing: -.02em;
  color: var(--cls-navy);
  margin-bottom: 8px;
}
.audit-hero p {
  font-family: var(--font-body);
  font-style: italic;
  font-size: 16px;
  color: var(--cls-body);
  max-width: 720px;
  margin: 0 auto;
}
.audit-progress {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--cls-white);
  border-bottom: 1px solid var(--cls-gray-50);
  padding: 12px 24px;
  text-align: center;
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--cls-body);
  font-weight: 600;
  letter-spacing: .04em;
}
.audit-progress strong { color: var(--cls-navy); }
.audit-progress .bar {
  display: block;
  margin: 8px auto 0;
  max-width: 480px;
  height: 4px;
  background: var(--cls-gray-50);
  border-radius: 999px;
  overflow: hidden;
}
.audit-progress .bar-fill {
  display: block;
  height: 100%;
  background: var(--cls-orange);
  width: 0%;
  transition: width .25s ease;
}
.audit-form { max-width: 720px; margin: 0 auto; padding: 0 24px 60px; }
.audit-question {
  background: var(--cls-white);
  border: 1px solid var(--cls-gray-50);
  border-left: 3px solid var(--cls-blue);
  border-radius: 8px;
  padding: 22px 22px 18px;
  margin-bottom: 18px;
  box-shadow: 0 2px 8px rgba(0,0,102,.04);
  transition: border-left-color .15s, box-shadow .15s;
}
.audit-question.answered { border-left-color: var(--cls-orange); }
.audit-question.error { border-left-color: #c63; box-shadow: 0 0 0 2px rgba(204,102,51,.15); }
.audit-question .q-label {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 6px;
}
.audit-question .q-text {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 19px;
  line-height: 1.35;
  color: var(--cls-navy);
  margin-bottom: 14px;
}
.audit-question .q-options { list-style: none; padding: 0; margin: 0; }
.audit-question .q-option {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 12px;
  border-radius: 6px;
  cursor: pointer;
  transition: background .15s;
  position: relative;
}
.audit-question .q-option:hover { background: var(--cls-gray-50); }
.audit-question .q-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.audit-question .q-radio {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1.5px solid var(--cls-blue);
  flex-shrink: 0;
  margin-top: 3px;
  position: relative;
  background: var(--cls-white);
}
.audit-question .q-option input:checked ~ .q-radio::after {
  content: "";
  position: absolute;
  inset: 2.5px;
  border-radius: 50%;
  background: var(--cls-orange);
}
.audit-question .q-option input:checked ~ .q-radio { border-color: var(--cls-orange); }
.audit-question .q-option-label {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  color: var(--cls-navy);
  font-weight: 500;
}

.oto-block {
  margin: 36px 0 28px;
  background: linear-gradient(180deg, var(--cls-black) 0%, var(--cls-rich-black) 100%);
  border: 1px solid rgba(0,0,102,.3);
  border-radius: 12px;
  padding: 36px 28px;
  color: var(--cls-white);
  text-align: center;
}
.oto-block .oto-eyebrow {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--cls-blue-on-dark);
  margin-bottom: 8px;
}
.oto-block h3 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(24px, 3.4vw, 34px);
  color: var(--cls-white);
  margin-bottom: 10px;
  letter-spacing: -.015em;
  line-height: 1.15;
}
.oto-block h3 em.purple { color: var(--cls-blue-on-dark); font-family: var(--font-italic); }
.oto-block .oto-sub {
  font-family: var(--font-body);
  font-size: 15px;
  color: rgba(255,255,255,.85);
  max-width: 520px;
  margin: 0 auto 18px;
  line-height: 1.55;
}
.oto-block .oto-pricing {
  font-family: var(--font-body);
  font-size: 14px;
  color: rgba(255,255,255,.7);
  margin-bottom: 14px;
}
.oto-block .oto-pricing s { opacity: .6; }
.oto-checkbox {
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  padding: 14px 18px;
  cursor: pointer;
  max-width: 420px;
  text-align: left;
  transition: background .15s, border-color .15s;
}
.oto-checkbox:hover { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.28); }
.oto-checkbox.checked { background: rgba(0,105,0,.18); border-color: var(--cls-orange); }
.oto-checkbox input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; }
.oto-checkbox .check-box {
  width: 20px;
  height: 20px;
  border: 1.5px solid rgba(255,255,255,.55);
  border-radius: 4px;
  flex-shrink: 0;
  margin-top: 1px;
  position: relative;
  background: transparent;
}
.oto-checkbox.checked .check-box {
  background: var(--cls-orange);
  border-color: var(--cls-orange);
}
.oto-checkbox.checked .check-box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 6px;
  height: 11px;
  border-right: 2px solid var(--cls-white);
  border-bottom: 2px solid var(--cls-white);
  transform: rotate(45deg);
}
.oto-checkbox .oto-check-label {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--cls-white);
  line-height: 1.5;
}
.oto-checkbox .oto-check-label strong { font-weight: 700; }

.submit-block { text-align: center; padding-top: 12px; }
.submit-block .btn-primary { max-width: 460px; margin: 0 auto 8px; }

/* ============ THANKS.HTML SUPPORT ============ */
.thanks-hero {
  padding: 80px 24px 80px;
  text-align: center;
}
.thanks-hero h1 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(36px, 5vw, 56px);
  letter-spacing: -.02em;
  color: var(--cls-navy);
  max-width: 780px;
  margin: 0 auto 16px;
  line-height: 1.12;
}
.thanks-hero h1 em.purple { font-family: var(--font-italic); }
.thanks-hero p.lede {
  font-family: var(--font-body);
  font-size: 18px;
  color: var(--cls-body);
  max-width: 620px;
  margin: 0 auto 32px;
  line-height: 1.6;
}
.thanks-checkmark {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--cls-orange);
  margin: 0 auto 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 32px var(--cls-orange-glow);
}
.thanks-checkmark svg { width: 38px; height: 38px; stroke: var(--cls-white); }

/* ============ DELIVERY.HTML SUPPORT ============ */
.score-header {
  padding: 56px 24px 36px;
  text-align: center;
  background: var(--cls-white);
  border-bottom: 1px solid var(--cls-gray-50);
}
.score-header .eyebrow {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--cls-blue);
  margin-bottom: 8px;
}
.score-header h1 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(28px, 4vw, 42px);
  color: var(--cls-navy);
  margin-bottom: 18px;
  letter-spacing: -.015em;
}
.score-display {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(72px, 12vw, 144px);
  line-height: 1;
  color: var(--cls-orange);
  letter-spacing: -.04em;
  margin: 12px 0;
}
.score-display .score-denom { color: var(--cls-navy); opacity: .35; font-size: .5em; }
.score-caption {
  font-family: var(--font-body);
  font-style: italic;
  font-size: 16px;
  color: var(--cls-body);
  margin-top: 8px;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}