/* ==========================================================================
   Site-wide FONT SYSTEM — approved rollout (client sign-off 2026-08-02).

   Families only (no size/colour/spacing), so every page and region keeps its
   own look and only the typeface changes. Loads on EVERY page, INCLUDING the
   Talks pages — they skip the content spec (css/typography.css) but must
   still share the one typographic system.

   SOURCE OF TRUTH: preview-typography/_fonts-only.css. Change it there,
   re-verify in the sandbox, then regenerate — never hand-edit only this copy.
   ========================================================================== */

/* ==========================================================================
   Site-wide single font system (family only) — loads on EVERY preview page,
   including the Talks pages that skip the full _talks-spec.css.

   Client wants one typographic system across the entire site, matching the
   Raghavan talk pages (JP email 2026-07-26): every heading and all reading
   text → Palatino Linotype (the rni-talk transcript face); small UI accents
   → Open Sans. Family ONLY — no color/size/spacing — so each page and
   region keeps its own look; only the typeface changes.

   Palatino Linotype / Palatino are system fonts (Windows / macOS), so no
   webfont download is needed; Georgia is the metric-similar fallback.
   ========================================================================== */

:root {
  --pf-all:   "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --lora-all: "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --ui-all:   "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body, body * {
  font-family: var(--lora-all) !important;
}

h1, h2, h3, h4, h5, h6,
.post-title, .rt-hero h1, .rt-section-hd, .rt-title, .rt-modal-head h3,
.home-welcome__title, .faq-section-title, .widget-title, .panel-title,
.articleChar, .articleYear, .tta__title, .tts__title, .rt-empty h3 {
  font-family: var(--pf-all) !important;
}

/* Small uppercase UI accents (eyebrows, meta, buttons, badges, pills) read
   better in a sans — keep them there so the pairing stays intentional. */
.rt-meta, .rt-about-name, .rt-band strong, .rt-series, .rt-dur,
.home-welcome__eyebrow, .tts__org, .rt-readmore,
.rt-btn-read, .rt-btn-pdf, .rt-modal-foot a, .rt-modal-sub,
button, input, select, textarea, .btn {
  font-family: var(--ui-all) !important;
}

/* ── Talk transcripts → 17px, matching the site-wide body scale ──
   rni-talk.php styles its own transcript at `font-size:18px !important`
   (rni-talk.php:230). This rule lives HERE rather than in _talks-spec.css
   because the Talks wrappers set TT_TYPO_SKIP_SPEC, so that sheet never loads
   on a transcript page and the same rule there is inert. _fonts-only.css loads
   on every page, and the extra `.rr-transcript` ancestor outranks the page's
   own single-class rule.
   Excludes the footnote paragraphs, which stay small by design. */
.rr-transcript p:not(.MsoFootnoteText) {
  font-size: 17px !important;
}

/* ── "‹ Back to Raghavan Talks" → bold and highlighted ──
   rni-talk.php:147 styles this at 12px in a muted #5a6e88, so on the white
   header it read as faint grey micro-text and was easy to miss. Promote it to
   a navy outlined pill that mirrors the .rr-group-chip sitting opposite it in
   the same .rr-toprow, so the row reads as a deliberate pair. Same reason as
   above for living in this file: Talks pages skip _talks-spec.css. */
.rr-toprow .rr-back,
a.rr-back {
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #003366 !important;
  background: #eef2f8;
  border: 1px solid #c3d0e4;
  border-radius: 20px;
  padding: 6px 14px;
  letter-spacing: .02em;
  text-decoration: none;
  transition: background .15s, color .15s, border-color .15s;
}
.rr-toprow .rr-back:hover,
a.rr-back:hover,
.rr-toprow .rr-back:focus,
a.rr-back:focus {
  background: #003366;
  border-color: #003366;
  color: #fff !important;
  text-decoration: none;
}