/* ============================================================
   CAIRN · TYPOGRAPHY
   Two faces. Plex Sans carries UI + prose. Plex Mono carries
   anything machine-derived: hashes, metrics, labels, code.
   Mono microlabels are uppercase + tracked — the "coordinate"
   voice that runs through the whole product.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SF Mono', 'JetBrains Mono', ui-monospace, monospace;

  /* ---- Weights ---- */
  --w-light:    300; /* @kind other */
  --w-regular:  400; /* @kind other */
  --w-medium:   500; /* @kind other */
  --w-semibold: 600; /* @kind other */
  --w-bold:     700; /* @kind other */

  /* ---- Type scale (px, 1.250 major-third-ish, tuned) ---- */
  --fs-display: 56px;  /* marketing hero */
  --fs-h1:      40px;
  --fs-h2:      30px;
  --fs-h3:      22px;
  --fs-h4:      18px;
  --fs-body-lg: 16px;
  --fs-body:    14px;  /* app default */
  --fs-sm:      13px;
  --fs-meta:    12px;
  --fs-micro:   11px;  /* mono microlabels */

  /* ---- Line heights ---- */
  --lh-tight:   1.05; /* @kind other */
  --lh-snug:    1.25; /* @kind other */
  --lh-normal:  1.5; /* @kind other */
  --lh-relaxed: 1.65; /* @kind other */

  /* ---- Tracking ---- */
  --track-display: -0.02em; /* @kind other */
  --track-tight:   -0.01em; /* @kind other */
  --track-normal:  0; /* @kind other */
  --track-label:   0.08em;   /* @kind other */
  --track-caps:    0.12em;   /* @kind other */

  /* ---- Semantic roles ---- */
  --text-display-font: var(--font-sans);
  --text-mono-font:    var(--font-mono);
}

/* Convenience role classes — optional helpers consumers may use directly. */
.cn-eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  font-weight: var(--w-medium);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}
.cn-mono-label {
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  font-weight: var(--w-medium);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--text-muted);
}
.cn-hash {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  letter-spacing: 0;
  color: var(--text-body);
}