/* =====================================================================
   Affiliate / Partner Program page — styles
   Native Divi modules (Heading / Text / Blurb / Button / Accordion) in the
   Momentus purple system, CONSISTENT with the homepage, calculator and About
   pages (same hero glow, eyebrows, cards, numbered steps, FAQ, buttons).
   Scoped under body.vp-dark; all colours from vp.css tokens. No row-width caps.
   ===================================================================== */

/* Section padding (two-class rules out-specify Divi's .et_pb_section default). */
body.vp-dark .aff-hero.et_pb_section { padding: 6rem 2rem 4.5rem; position: relative; overflow: hidden; background: var(--vp-black); }
body.vp-dark .aff-how.et_pb_section { padding: 5rem 2rem; background: var(--vp-dark); border-top: 1px solid var(--vp-line); }
body.vp-dark .aff-join.et_pb_section { padding: 5rem 2rem; background: var(--vp-dark-2); border-top: 1px solid var(--vp-line); }
body.vp-dark .aff-faq.et_pb_section { padding: 5rem 2rem; background: var(--vp-dark); border-top: 1px solid var(--vp-line); }

/* Neutralise Divi's default row padding; keep the site content width. */
body.vp-dark .aff-hero .et_pb_row,
body.vp-dark .aff-how .et_pb_row,
body.vp-dark .aff-join .et_pb_row,
body.vp-dark .aff-faq .et_pb_row { padding-top: 0; padding-bottom: 0; }

/* ── HERO ─────────────────────────────────────────────────────────── */
body.vp-dark .aff-hero.et_pb_section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(var(--vp-primary-rgb), 0.12) 0%, transparent 70%);
  pointer-events: none;
}
body.vp-dark .aff-hero .et_pb_row { position: relative; z-index: 1; }
body.vp-dark .aff-hero-inner .et_pb_column { text-align: center; }

/* Shared eyebrow. */
body.vp-dark .aff-eyebrow.et_pb_text,
body.vp-dark .aff-eyebrow.et_pb_text p {
  font-family: var(--vp-font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--vp-primary-light);
}
/* Hero heading (Text module holding <h1><span>). Typography lives on the module
   for native responsive control; only the gradient accent span is here. */
body.vp-dark .aff-hero h1 span {
  background: var(--vp-grad-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
body.vp-dark .aff-hero-sub.et_pb_text,
body.vp-dark .aff-hero-sub.et_pb_text p {
  font-family: var(--vp-font-sans);
  font-size: 1rem;
  color: var(--vp-body);
  line-height: 1.75;
  max-width: 560px;
  margin: 0 auto;
}

/* Hero stat pair — two inline blocks, centred. */
body.vp-dark .aff-stat.et_pb_blurb {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  padding: 0 1.75rem;
  margin: 1.75rem 0 0.5rem;
}
body.vp-dark .aff-stat .et_pb_main_blurb_image { display: none; }
body.vp-dark .aff-stat .et_pb_blurb_content { max-width: 100%; padding: 0; }
body.vp-dark .aff-stat .et_pb_module_header {
  font-family: var(--vp-font-display);
  font-size: 2rem;
  font-weight: 800;
  color: var(--vp-primary-light);
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: 0.3rem;
}
body.vp-dark .aff-stat .et_pb_blurb_description,
body.vp-dark .aff-stat .et_pb_blurb_description p {
  font-family: var(--vp-font-display);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--vp-gray-500);
}

/* Hero button — identical to the homepage/calc CTA (styled on the module). */
body.vp-dark .aff-hero-cta { margin-top: 2rem; }
body.vp-dark .aff-hero-cta .et_pb_button_module_wrapper { text-align: center; }

/* ── HOW IT WORKS ─────────────────────────────────────────────────── */
body.vp-dark .aff-how-header { margin-bottom: 2.5rem; }
body.vp-dark .aff-how-header .aff-eyebrow.et_pb_text p { text-align: left; }
body.vp-dark .aff-how-sub.et_pb_text,
body.vp-dark .aff-how-sub.et_pb_text p {
  font-family: var(--vp-font-sans);
  color: var(--vp-body);
  line-height: 1.7;
}

/* Numbered step cards — centred content, purple number badge on top. */
body.vp-dark .aff-how-card.et_pb_blurb {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  padding: 2rem 1.5rem;
  height: 100%;
  text-align: center;
  transition: border-color var(--vp-transition), transform var(--vp-transition);
}
body.vp-dark .aff-how-card.et_pb_blurb:hover {
  border-color: rgba(var(--vp-primary-rgb), 0.32);
  transform: translateY(-2px);
}
body.vp-dark .aff-how-card .et_pb_main_blurb_image { display: block; text-align: center; margin: 0 auto 1.1rem; line-height: 0; }
body.vp-dark .aff-how-card .et_pb_main_blurb_image .et_pb_image_wrap,
body.vp-dark .aff-how-card .et_pb_main_blurb_image img { width: 40px; height: 40px; display: inline-block; }
body.vp-dark .aff-how-card .et_pb_blurb_content { max-width: 100%; padding: 0; }
body.vp-dark .aff-how-card .et_pb_module_header {
  font-family: var(--vp-font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--vp-white);
  margin-bottom: 0.6rem;
  letter-spacing: -0.01em;
}
body.vp-dark .aff-how-card .et_pb_blurb_description,
body.vp-dark .aff-how-card .et_pb_blurb_description p {
  font-size: 0.84rem;
  color: var(--vp-body);
  line-height: 1.7;
}
body.vp-dark .aff-how-grid .et_pb_column { display: flex; }
body.vp-dark .aff-how-grid .et_pb_column > .et_pb_blurb { width: 100%; }

/* ── JOIN THE PROGRAM (header + placeholder; form deferred) ───────── */
body.vp-dark .aff-join-header { text-align: center; margin-bottom: 2.5rem; }
body.vp-dark .aff-join-sub.et_pb_text,
body.vp-dark .aff-join-sub.et_pb_text p {
  font-family: var(--vp-font-sans);
  color: var(--vp-body);
  line-height: 1.7;
  text-align: center;
}
body.vp-dark .aff-join-placeholder.et_pb_text {
  max-width: 480px;
  margin: 0 auto;
  padding: 2.75rem 2rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px dashed var(--vp-line-2);
  border-radius: var(--vp-radius-lg);
  text-align: center;
}
body.vp-dark .aff-join-placeholder.et_pb_text p {
  font-family: var(--vp-font-display);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--vp-gray-500);
  margin: 0;
}

/* ── FAQ (native accordion, reference styling) ────────────────────── */
body.vp-dark .aff-faq-header { text-align: center; margin-bottom: 2rem; }

/* ── RESPONSIVE ───────────────────────────────────────────────────── */
@media (max-width: 767px) {
  body.vp-dark .aff-hero.et_pb_section { padding: 5rem 1.25rem 3.5rem; }
  body.vp-dark .aff-how.et_pb_section,
  body.vp-dark .aff-join.et_pb_section,
  body.vp-dark .aff-faq.et_pb_section { padding: 3.5rem 1.25rem; }
  body.vp-dark .aff-stat.et_pb_blurb { padding: 0 1.1rem; }
  body.vp-dark .aff-stat .et_pb_module_header { font-size: 1.7rem; }
}