/* Site-wide heading scale. These rules intentionally override page-specific
   display sizes so every heading level stays consistent across all pages. */
:root {
  --heading-h1: 36px;
  --heading-h2: 30px;
  --heading-h3: 24px;
  --heading-h4: 20px;
  --heading-h5: 18px;
  --heading-h6: 16px;
}

body h1 { font-size: var(--heading-h1) !important; }
body h2 { font-size: var(--heading-h2) !important; }
body h3 { font-size: var(--heading-h3) !important; }
body h4 { font-size: var(--heading-h4) !important; }
body h5 { font-size: var(--heading-h5) !important; }
body h6 { font-size: var(--heading-h6) !important; }

body :is(h1, h2, h3, h4, h5, h6) {
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  overflow-wrap: break-word;
  text-wrap: balance;
  word-break: normal;
  hyphenate-limit-chars: 8 4 4;
  -webkit-hyphens: auto;
  hyphens: auto;
}

body :is(h1, h2, h3, h4, h5, h6) :is(span, strong, em, a) {
  font-size: inherit !important;
  line-height: inherit !important;
}

@media (max-width: 48rem) {
  :root {
    --heading-h1: 28px;
    --heading-h2: 24px;
    --heading-h3: 20px;
    --heading-h4: 18px;
    --heading-h5: 16px;
    --heading-h6: 16px;
  }
}