/* Zoozah brand type — the ONLY two faces on the platform.
 *
 *   Erotique Text  display: headlines, wordmark, figures. Sentence case,
 *                  tight leading, 0 tracking, Stylistic Sets 1 + 2.
 *   Roobert        text: body, UI, labels, readouts. Subheads are ALL
 *                  CAPS with 45/1000 em tracking.
 *
 * Brand guide v3.0 pp.20–23. Every stylesheet on the platform links
 * this file first (partials/head.ejs for the staff app; the standalone
 * pages link it directly) and refers to the tokens below — nothing
 * else should name a font family.
 *
 * Served as .otf from /assets/fonts/, a directory the licence audit
 * walks (scripts/license_source_audit.js, LICENSE-ATTRIBUTIONS.md).
 * Do not convert to .woff2 in an unscanned directory — that is the
 * path around the licence gate. font-display:swap so a slow font never
 * blocks first paint; the fallbacks are metric-sane so reflow is small.
 */
@font-face {
  font-family: 'Erotique Text';
  src: url('/assets/fonts/Erotique-Text-Regular.otf') format('opentype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Roobert';
  src: url('/assets/fonts/Roobert-Regular.otf') format('opentype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Roobert';
  src: url('/assets/fonts/Roobert-RegularItalic.otf') format('opentype');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Roobert';
  src: url('/assets/fonts/Roobert-Medium.otf') format('opentype');
  font-weight: 500; font-style: normal; font-display: swap;
}
/* SemiBold covers 600–800 so `bold` / 700 resolves to the real face
 * instead of a synthesised (smeared) 600. */
@font-face {
  font-family: 'Roobert';
  src: url('/assets/fonts/Roobert-SemiBold.otf') format('opentype');
  font-weight: 600 800; font-style: normal; font-display: swap;
}

:root {
  --font-display: 'Erotique Text', Georgia, 'Times New Roman', serif;
  --font-body: 'Roobert', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  /* Two faces only: readouts (hashes, codes, ids) are Roobert with
   * tabular figures + slashed zero via .type-tabular / --font-mono-features.
   * Flip this ONE token to a monospace stack if that policy changes. */
  --font-mono: var(--font-body);
  --font-mono-features: "tnum" 1, "zero" 1;
  /* Erotique's interlocking ligatures live in Stylistic Sets 1 and 2
   * (brand guide p.20). Set with every --font-display use. */
  --font-display-features: "ss01" 1, "ss02" 1, "kern" 1;

  /* Leading, from the guide's size/leading pairs: 56/58, 43/47, 24/27,
   * 17.75/20 (caps subhead), 18/24 (body), 10/13 (small body). */
  --lh-display: 1.04;
  --lh-headline: 1.09;
  --lh-section: 1.125;
  --lh-subhead: 1.13;
  --lh-body: 1.35;
  /* 45/1000 em tracking on ALL-CAPS Roobert (subheads, eyebrows). */
  --track-caps: 0.045em;
}

/* ── Type roles ──────────────────────────────────────────────────────
 * Sizes clamp between the guide's print sizes and a phone-safe floor.
 * Spacing rhythm (guide p.23): headline→body 1× body leading,
 * body→subhead 1×, subhead→body 0.5×, paragraph→paragraph 0.75×,
 * section→section 2.5×. Margins are left to the page; these classes
 * only set the face, size, leading and tracking. */
.type-display {
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(34px, 5vw, 56px); line-height: var(--lh-display);
  letter-spacing: 0; font-feature-settings: var(--font-display-features);
}
.type-headline {
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(28px, 4vw, 43px); line-height: var(--lh-headline);
  letter-spacing: 0; font-feature-settings: var(--font-display-features);
}
.type-section {
  font-family: var(--font-display); font-weight: 400;
  font-size: 24px; line-height: var(--lh-section);
  letter-spacing: 0; font-feature-settings: var(--font-display-features);
}
.type-subhead {
  font-family: var(--font-body); font-weight: 400;
  font-size: 17px; line-height: var(--lh-subhead);
  letter-spacing: var(--track-caps); text-transform: uppercase;
}
.type-eyebrow {
  font-family: var(--font-body); font-weight: 500;
  font-size: 13px; line-height: 1.2;
  letter-spacing: var(--track-caps); text-transform: uppercase;
}
.type-body {
  font-family: var(--font-body); font-weight: 400;
  font-size: 16px; line-height: var(--lh-body); letter-spacing: 0;
}
.type-body-s { font-family: var(--font-body); font-size: 13px; line-height: 1.3; }
.type-tabular { font-variant-numeric: tabular-nums slashed-zero; font-feature-settings: var(--font-mono-features); }