/*
 * D-038: one vertical rhythm for the older page templates (website pages only; the API journey pages keep theirs).
 * Section top/bottom padding = --cy-section-y (64 / 56 / 48px), heading block to content = --cy-section-head
 * (40 / 36 / 28px), as on the PI, Claims, Contact, About, Reviews and hospital pages.
 * The templates' own rules live in style.css and in each page's inline <style>, so every selector here starts with
 * `body` to win over them without !important (Bootstrap's py-5 is the one exception).
 */

/* ---------- Shared blocks: calculators strip and FAQ (Home, product pages, calculators, checklists) ---------- */
body .doctor-calculators-section,
body .doctor-faq-section {
  padding-top: var(--cy-section-y);
  padding-bottom: var(--cy-section-y);
}
body .doctor-calculators-section .compare-heading,
body .doctor-faq-section .compare-heading { margin-bottom: var(--cy-section-head); }

/* ---------- Calculator template (19 calculators, .term-calculator-page) ---------- */
body .term-calculator-page .section-padding,
body .term-calculator-page .term-calc-faq,
body .term-calculator-page .term-calc-faq.doctor-faq-section {
  padding-top: var(--cy-section-y);
  padding-bottom: var(--cy-section-y);
}
/* the hero keeps its short top so the calculator sits high on the screen */
body .term-calculator-page .term-calc-hero.section-padding { padding-top: 40px; padding-bottom: var(--cy-section-y); }
body .term-calculator-page .compare-heading,
body .term-calculator-page .term-calc-faq .compare-heading { margin-bottom: var(--cy-section-head); }
body .term-calculator-page .compare-heading + * { margin-top: 0; }

/* ---------- Checklists (6 pages, .pi-checklist-page) ---------- */
body .pi-checklist-page .section-padding,
body .pi-checklist-page .pi-checklist-faq {
  padding-top: var(--cy-section-y);
  padding-bottom: var(--cy-section-y);
}
/* Feature blocks: the spacing sits on the inner shell; two blocks in a row read as one section, one heading gap
   apart. */
body .pi-checklist-page .pi-checklist-features { padding-top: 0; padding-bottom: 0; }
body .pi-checklist-page .pi-checklist-features .pi-checklist-features-shell { padding-top: var(--cy-section-y); padding-bottom: var(--cy-section-y); }
body .pi-checklist-page .pi-checklist-features:has(+ .pi-checklist-features) .pi-checklist-features-shell { padding-bottom: calc(var(--cy-section-head) / 2); }
body .pi-checklist-page .pi-checklist-features + .pi-checklist-features .pi-checklist-features-shell { padding-top: calc(var(--cy-section-head) / 2); }
body .pi-checklist-page .compare-heading { margin-bottom: var(--cy-section-head); }
body .pi-checklist-page .compare-heading + * { margin-top: 0; }

/* ---------- Product template (Term, Investment, Home, Cyber) ---------- */
body .what-is-section,
body .why-essential-section,
body .how-it-works-section,
body .benefits-section,
body .key-features-section {
  padding-top: var(--cy-section-y);
  padding-bottom: var(--cy-section-y);
}
body .faq-legacy.py-5 {
  padding-top: var(--cy-section-y) !important;
  padding-bottom: var(--cy-section-y) !important;
}
body .what-is-title-wrapper,
body .why-essential-title-wrapper,
body .how-it-works-title-wrapper,
body .benefits-title-wrapper,
body .key-features-title-wrapper { margin-bottom: var(--cy-section-head); }
/* Why: the title and text sit in a flex column with its own 20px gap */
body .why-essential-content { gap: var(--cy-section-head); }
body .why-essential-content .why-essential-title-wrapper { margin-bottom: 0; }
body .what-is-title-wrapper + *,
body .why-essential-title-wrapper + *,
body .how-it-works-title-wrapper + *,
body .benefits-title-wrapper + *,
body .key-features-title-wrapper + * { margin-top: 0; }
/* D-063: the "Why" block is laid out like the PI page's (pi-landing.css .pl-why): text up to 625px on the left,
   the photo 432x306 (cover, 12px corners) at the column's right edge; 768-1199px two columns with the photo
   scaling at 432:306; phones stacked with a full-width photo of the same shape. */
body .why-essential-container { justify-content: space-between; }
body .why-essential-content { flex: 0 1 625px; min-width: 0; }
body .why-essential-image-wrapper { flex: 0 0 432px; width: 432px; max-width: 100%; height: 306px; border-radius: 12px; overflow: hidden; }
body .why-essential-image { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 768px) and (max-width: 1199px) {
  body .why-essential-container { flex-direction: row; text-align: left; }
  body .why-essential-content { flex: 1 1 0; align-items: stretch; text-align: left; }
  body .why-essential-image-wrapper { flex: 0.8 1 0; width: auto; height: auto; aspect-ratio: 432 / 306; }
}
@media (max-width: 767px) {
  body .why-essential-image-wrapper { flex: none; width: 100%; height: auto; aspect-ratio: 432 / 306; }
}

/* ---------- Home sections ---------- */
body .homepage-figma-bg .doctor-trust-section,
body .homepage-figma-bg .fraud-alert-section,
body .homepage-figma-bg .protection-decisions-section,
body .homepage-figma-bg .insurance-partners-section,
body .homepage-figma-bg .voices-trust-section {
  padding-top: var(--cy-section-y);
  padding-bottom: var(--cy-section-y);
}
body .homepage-figma-bg .advantage-compare-section { padding-top: var(--cy-section-y); }
body .homepage-figma-bg .doctor-ecosystem-cta { padding-bottom: var(--cy-section-y); }
body .homepage-figma-bg .compare-heading,
body .homepage-figma-bg .trust-heading { margin-bottom: var(--cy-section-head); }