/**
 * Global typography — single source of truth.
 *
 * Change --vgt-font to switch the whole site.
 * For a page/section that needs another face, either:
 *   1. Override tokens on a scope:  .my-page { --vgt-font: var(--vgt-font-sans); --vgt-ui: var(--vgt-font-sans); }
 *   2. Or set the class utility:    .vgt-font-sans / .vgt-font-display
 */

:root {
  --vgt-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --vgt-font-sans: "Figtree", "Segoe UI", sans-serif;

  /* Primary site font */
  --vgt-font: var(--vgt-font-sans);

  /* Alias used by nav, ticker, forms, etc. — defaults to primary */
  --vgt-ui: var(--vgt-font);
}

body {
  font-family: var(--vgt-font);
}

button,
input,
select,
textarea,
summary {
  font-family: inherit;
}

.vgt-font-display {
  font-family: var(--vgt-font-display);
}

.vgt-font-sans {
  font-family: var(--vgt-font-sans);
}