/*
 * Éclore Aesthetics — Self-Hosted Fonts (2026 Swiss redesign + editorial layer)
 * ─────────────────────────────────────────────────────────────────────────────
 * Seven @font-face declarations — three families:
 *   Familjen Grotesk 400, 500, 600, 700  (display, headings, AND caps labels/
 *                                         eyebrows/numbers/nav/CTA — uppercase tracked)
 *   Inter            400, 500            (body / UI / long-form)
 *   Fraunces         italic 400          (accent-word ONLY — the emotional word
 *                                         inside a heading; never body, never caps)
 *
 * woff2 only, font-display: swap on every face to prevent FOIT and protect CLS
 * (latin subset). Files live in: assets/fonts/google-fonts/ (paths relative here).
 */

/* ─── Familjen Grotesk — display / headings ──────────────────────────────────── */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style:  normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/google-fonts/familjen-grotesk-latin-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Familjen Grotesk';
  font-style:  normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/google-fonts/familjen-grotesk-latin-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Familjen Grotesk';
  font-style:  normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/google-fonts/familjen-grotesk-latin-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Familjen Grotesk';
  font-style:  normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/google-fonts/familjen-grotesk-latin-700.woff2') format('woff2');
}

/* ─── Inter — body / UI / long-form ──────────────────────────────────────────── */
@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/google-fonts/inter-latin-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/google-fonts/inter-latin-500.woff2') format('woff2');
}

/* ─── Fraunces — accent-word italic (editorial layer) ─────────────────────────────
 * The single serif in the system. Used ONLY for the emotional word inside a
 * heading (see the `h* em` rule in global.css). One italic cut; latin subset;
 * punctuation range added so an accent word's trailing period/comma renders in
 * the serif too. Never body copy, never caps labels.
 */
@font-face {
  font-family: 'Fraunces';
  font-style:  italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/google-fonts/fraunces-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+2010-2027, U+2032-2033;
}

/* Upright cut — added for the brand lockup, whose "Aesthetics" line is set
   straight (owner, 2026-07-22). Accent words inside headings stay italic. */
@font-face {
  font-family: 'Fraunces';
  font-style:  normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/google-fonts/fraunces-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+2010-2027, U+2032-2033;
}

/* ─── Hanken Grotesk — display (Claw: neutral grotesk closer to the reference) ───
 * Variable weight (400–700), one file. Set as --font-display in tokens.css. */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style:  normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/google-fonts/hanken-grotesk-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215, U+FEFF, U+FFFD;
}