/* ==========================================================================
   MOBILE TYPOGRAPHY OVERRIDES (≤768px)
   ========================================================================== */

@media (max-width: 768px) {
  :root,
  .ab-wrap,
  .pt-wrap {
    --fs-body: 1.125rem;       /* 18px */
    --fs-body-large: 1.25rem;  /* 20px */
  }

  :where(
    .hp-wrap,
    .ab-wrap,
    .bc-wrap,
    .bl-wrap,
    .cd-wrap,
    .ci-wrap,
    .cl-wrap,
    .dm-wrap,
    .oc-wrap,
    .pd-wrap,
    .pi-wrap,
    .pp-wrap,
    .pt-wrap,
    .sm-wrap
  ) :where(
    p,
    li,
    .detail-body-text,
    .tldr-summary,
    .hero-body,
    .hp-section-sub,
    .hp-step-desc,
    .hp-cond-desc,
    .hp-approach-desc,
    .hp-pathway-desc,
    .hp-testi-text,
    .hp-cta-sub,
    .ab-hero-sub,
    .ab-card-text,
    .bc-cta-sub,
    .bl-cta-sub,
    .cd-tldr-text,
    .cl-intro-text,
    .cl-cta-sub,
    .oc-sub,
    .pd-tldr-text,
    .pi-intro-text,
    .pi-cta-sub,
    .pt-hero-sub
  ) {
    font-size: var(--fs-body) !important;
    font-weight: 500 !important;
  }
}