/* The public typography contract. These protected roles supersede the legacy
   component font declarations; layout, colours and interaction remain local.
   One heading family, one body family, two body sizes. */
:root {
  --font-heading: Newsreader, serif;
  --font-body: Arial, sans-serif;
  --text-body: 16px;
  --text-small: 14px;
  --heading-1: clamp(2rem, 3.4vw, 3rem);
  --heading-2: clamp(1.5rem, 2.5vw, 2rem);
  --heading-3: 1.5rem;
  --heading-4: 1.125rem;
}
/* Use one complete script-capable face per role on these localized pages.
   Newsreader's installed subset covers Latin, not Cyrillic or CJK. */
html:lang(ru), html:lang(zh), html:lang(ja), html:lang(ko) {
  --font-heading: serif;
}
html { font-size: 16px; }
body { font-family: var(--font-body); font-size: var(--text-body); line-height: 1.6; }
body :where(*) { font-family: inherit !important; font-size: inherit !important; }
body :is(h1,h2,h3,h4,h5,h6,.brand-title) {
  font-family: var(--font-heading) !important;
  font-style: normal !important;
  font-synthesis: weight;
  letter-spacing: -.02em !important;
  line-height: 1.2 !important;
  text-wrap: balance;
}
body h1 { font-size: var(--heading-1) !important; font-weight: 700 !important; }
body h2 { font-size: var(--heading-2) !important; font-weight: 400 !important; }
body h3 { font-size: var(--heading-3) !important; font-weight: 700 !important; }
body :is(h4,h5,h6) { font-size: var(--heading-4) !important; font-weight: 700 !important; }
body .brand-title { font-size: 20px !important; font-weight: 700 !important; }
body :is(button,input,select,textarea) { font-family: var(--font-body) !important; font-size: var(--text-small) !important; }
body :is(small,.entity-type,.card-overline,.card-address,.entity-reading small,
  .entity-references small,.theme-selection-hint,.results-head,.footer-inner,
  .brand-subtitle,.preference-note,.example-timeline-note,.example-timeline-context,
  .example-day-number,.trip-item-meta,.tram-proximity,.entity-map-section,
  .photo-credit,.trip-photo-credit,.maplibregl-ctrl-attrib) { font-size: var(--text-small) !important; }
/* Longer translated controls can wrap without squeezing their labels. */
body :is(button,input,select,textarea) { line-height: 1.4; }

/* A headline has one colour, including emphasized words and links. This final
   role also overrides older component-specific accent selectors. */
body :is(h1,h2,h3,h4,h5,h6) :where(*) { font-weight: inherit !important; font-style: normal !important; color: inherit !important; }

.privacy-page { max-width: 76ch; padding-block: 36px 72px; --heading-1:clamp(1.75rem,5vw,3rem); }
.privacy-page p { margin-block: 1.2em; }
.privacy-page h1 { max-width:100%; overflow-wrap:anywhere; }
