/* ═══════════════════════════════════════════════════════════
   Template: Pensions Matter — Page-level layout only
   ───────────────────────────────────────────────────────────
   This page is built from design-system components:
     • Sections .......... Layout (.caat-section / --grey / --brand)
     • Headings .......... Text/Title (.caat-title, .caat-title__subtitle)
     • Comparison stats .. Stat (.caat-stat, .caat-stat-card)
     • Feature cards ..... Card (.caat-card + .icon-token)
     • Video ............. Image/Embed (.caat-embed)
     • Call-to-action .... CTA (.caat-cta)
     • Hero / strip ...... Feature Hero, Stat strip
     • Footer ............ Footer (.caat-footer)
   What remains below is genuinely page-specific layout that no
   single component owns — placement, measure, and one bespoke
   two-column video row. No component styles are re-implemented here.
   ═══════════════════════════════════════════════════════════ */

/* ── Hero: keep content above the full-bleed background image ── */
.pm-hero__content { z-index: 2; }

/* ── Stat strip docks under the hero, so round only its bottom ── */
.pm-stat-strip--rounded {
  border-radius: 0 0 var(--caat-radius-lg) var(--caat-radius-lg);
}

/* ── Centered, readable measure for intro/lede paragraphs ──────
   (Section headers get their measure from .caat-section__header;
   this is for body paragraphs that sit outside the header.) */
.pm-lede {
  max-width: 44rem;
  margin-left: auto;
  margin-right: auto;
}

/* ── Narrower card grid for the 6-up "why" benefits ── */
.pm-grid--narrow {
  max-width: 56rem;
  margin-left: auto;
  margin-right: auto;
}

/* ── Pull-quotes sit at a comfortable reading width ── */
.pm-testimonial-wrapper {
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
}

/* ── Video row: embed beside a short caption/CTA ──────────────
   Composes the Image/Embed component; this only lays the two
   columns out and lifts the embed with the standard shadow. */
.pm-video-row {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 2rem;
  align-items: center;
}
.pm-video-row .caat-embed__wrapper {
  box-shadow: var(--caat-shadow);
}

/* ── Footnotes / sources ── */
.pm-footnotes {
  border-top: 1px solid var(--caat-color-border);
  padding-top: 1.5rem;
  margin-top: 3rem;
}
.pm-footnotes ol {
  padding-left: 1.25rem;
  font-size: var(--caat-font-size-2xs);
  color: var(--caat-color-text-muted);
  line-height: 1.6;
}

/* ── Responsive ── */
@media (max-width: 991.98px) {
  .pm-video-row { grid-template-columns: 1fr; }
}