/* Typography per spec §8.3.
   Khmer requires high line-height for readability (subscripts/superscripts).
   Webfonts now load from Google Fonts via the <link> in base.njk — local
   subset .woff2 files were never shipped. */

h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: var(--line-display);
  margin: var(--space-5) 0 var(--space-3);
}
h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
h2 { font-size: clamp(1.4rem, 3vw, 1.875rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.375rem); }

p { margin: 0 0 var(--space-3); }
.lede { font-size: 1.125rem; color: var(--color-text-muted); margin-bottom: var(--space-4); }

.kicker {
  font-family: var(--font-display);
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-accent);
  margin-bottom: var(--space-2);
}

/* Article reading-column cap — scoped to /article/.../body, NOT the global
   <article> tag. The homepage's home-latest__lead and home-section__lead
   are also <article> elements, but they need to fill their wider containers
   (home-latest = full main; home-section = grid column or full main). The
   previous global `article { max-width }` made the new home-latest hero
   appear centered + narrower than the cambodia/world section leads beneath
   it — visual inconsistency operator flagged 2026-05-04. */
.article { max-width: var(--max-content); margin: 0 auto; }
.article p { line-height: 1.85; }   /* extra breathing room for Khmer */