/* ==========================================================================
   typography.css — @font-face (self-hosted WOFF2) + font roles + heading scale
   (PLAN §6.1 step 3, §6.3)

   FONT STRATEGY (PLAN §6.3 / handoff note):
   Preferred = self-hosted WOFF2 in assets/fonts/. The @font-face rules below
   point at those files. They are NOT shipped here (cannot be downloaded in this
   environment) — see src/assets/fonts/README.md for the exact files to drop in.
   Until they exist, every role has a robust system-serif fallback (see tokens
   --font-*), so the site renders correctly with ZERO font files. A commented
   Google Fonts CSS2 <link> is provided in index.template.html as the documented
   alternative. font-display: swap everywhere.
   ========================================================================== */

/* ---------------------------------------------------------------------------
   SELF-HOST @font-face (commented out by default).

   The working default loads the fonts via the Google Fonts <link> in
   index.html, so these local rules are disabled to avoid 404s on the (not
   bundled) WOFF2 files. To SELF-HOST for production (recommended — privacy +
   no third-party render-blocking): drop the files listed in
   src/assets/fonts/README.md into that folder, comment the Google Fonts
   <link> in index.html (and the template), then UN-COMMENT the block below.
   font-display: swap; system-serif fallbacks live in tokens (--font-*).
   ---------------------------------------------------------------------------

@font-face {
  font-family: "Great Vibes";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("../assets/fonts/great-vibes-v400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2018-201E, U+2020-2022, U+2026;
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal; font-weight: 500; font-display: swap;
  src: url("../assets/fonts/cormorant-garamond-v500-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal; font-weight: 600; font-display: swap;
  src: url("../assets/fonts/cormorant-garamond-v600-latin.woff2") format("woff2");
}
@font-face {
  font-family: "EB Garamond";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("../assets/fonts/eb-garamond-v400-latin.woff2") format("woff2");
}
@font-face {
  font-family: "EB Garamond";
  font-style: italic; font-weight: 400; font-display: swap;
  src: url("../assets/fonts/eb-garamond-italic-v400-latin.woff2") format("woff2");
}
@font-face {
  font-family: "EB Garamond";
  font-style: normal; font-weight: 600; font-display: swap;
  src: url("../assets/fonts/eb-garamond-v600-latin.woff2") format("woff2");
}
*/

/* --- Font roles ----------------------------------------------------------- */
body { font-family: var(--font-body); }

/* Headings: classic serif, letter-spaced small-caps to echo the card
   (BRIEF §4). The hero name (h1) opts OUT of small-caps via .wf-hero rules. */
h1, h2, h3, h4 {
  font-family: var(--font-serif);
  color: var(--c-burgundy);
  line-height: 1.15;
  font-weight: 600;
}

/* Section titles read as letter-spaced small-caps (e.g. KINDLY, GETTING THERE). */
h2 {
  font-size: var(--step-2);
  font-variant-caps: small-caps;
  letter-spacing: 0.08em;
  font-weight: 600;
}
h3 {
  font-size: var(--step-1);
  letter-spacing: 0.02em;
}
h1 { font-size: var(--step-3); }

/* Script role — decorative ONLY (couple names, flourish words). */
.u-script {
  font-family: var(--font-script);
  font-weight: 400;
  color: var(--c-burgundy);
  line-height: 1.1;
}

/* Small-caps label helper (e.g. "RSVP", eyebrow labels) — never script. */
.u-label {
  font-family: var(--font-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: 0.12em;
  font-size: var(--step--1);
  color: var(--c-sepia-soft);
}

p { font-size: var(--step-0); }
small, .u-small { font-size: var(--step--1); color: var(--c-sepia-soft); }

strong, b { font-weight: 600; }
