/* ============================================================
   NIGHT + DAY — Typography
   Four voices: Display (FBS Doms), Mono (Simon Mono),
   Script (Redondo Ave), Body (Aeonik).
   Editorial, confident, timeless. Tight display, airy mono.
   ============================================================ */

:root {
  /* ---- FAMILIES --------------------------------------------------- */
  --font-display: "FBS Doms", "Arial Narrow", system-ui, sans-serif;
  --font-mono:    "Simon Mono", "IBM Plex Mono", ui-monospace, monospace;
  --font-script:  "Redondo Ave", "Brush Script MT", cursive;
  --font-body:    "Aeonik", system-ui, -apple-system, "Helvetica Neue", sans-serif;

  /* ---- TYPE SCALE (px on a 16px base) ----------------------------- */
  --fs-display-xl: 120px;   /* hero wordmark / cover           */
  --fs-display-lg: 80px;
  --fs-display-md: 56px;
  --fs-display-sm: 40px;
  --fs-h1: 32px;
  --fs-h2: 24px;
  --fs-h3: 20px;
  --fs-body-lg: 18px;
  --fs-body: 16px;
  --fs-body-sm: 14px;
  --fs-caption: 13px;
  --fs-eyebrow: 12px;       /* mono tags, set in caps + tracked */
  --fs-micro: 11px;

  /* ---- WEIGHTS ---------------------------------------------------- */
  --fw-regular: 400; /* @kind other */
  --fw-bold: 700; /* @kind other */

  /* ---- LINE HEIGHT ------------------------------------------------ */
  --lh-tight: 0.92;     /* @kind other */
  --lh-snug: 1.08;      /* @kind other */
  --lh-heading: 1.15;   /* @kind other */
  --lh-body: 1.55;      /* @kind other */
  --lh-relaxed: 1.7;    /* @kind other */

  /* ---- TRACKING --------------------------------------------------- */
  --ls-display: -0.02em;  /* @kind other */
  --ls-tight: -0.01em;    /* @kind other */
  --ls-normal: 0;         /* @kind other */
  --ls-eyebrow: 0.18em;   /* @kind other */
  --ls-mono: 0.04em;      /* @kind other */

  /* ---- SEMANTIC TYPE TOKENS --------------------------------------- */
  --text-wordmark:   var(--fw-regular) var(--fs-display-lg)/var(--lh-tight) var(--font-display);
  --text-display:    var(--fw-regular) var(--fs-display-md)/var(--lh-tight) var(--font-display);
  --text-eyebrow:    var(--fw-regular) var(--fs-eyebrow)/1.2 var(--font-mono);
  --text-body-base:  var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-body);
}

/* ---- UTILITY CLASSES — optional, opt-in ------------------------- */
.nd-wordmark {
  font-family: var(--font-display);
  font-size: var(--fs-display-lg);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
  color: var(--text-primary);
}
.nd-display {
  font-family: var(--font-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
}
.nd-eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--text-secondary);
}
.nd-mono {
  font-family: var(--font-mono);
  letter-spacing: var(--ls-mono);
}
.nd-script {
  font-family: var(--font-script);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-normal);
  text-transform: none;
}
.nd-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-primary);
  text-wrap: pretty;
}