/* ============================================================
   Sona — Typography tokens
   The deck sets everything in Arial (headlines, body) with
   Courier New for eyebrow labels ("HEADVENTURES · 2026",
   "THE OPPORTUNITY"). Both are system fonts — no webfont files
   ship with this system.
   ============================================================ */

:root {
  --font-display: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --font-body:    Arial, "Helvetica Neue", Helvetica, sans-serif;
  --font-mono:    "Courier New", Courier, monospace;

  /* Scale (deck-derived: 148pt wordmark, 66–80pt statements,
     44–48pt slide titles, 15pt kickers, 12pt mono labels) */
  --text-display-xl: 120px;  /* wordmark-scale */
  --text-display:    72px;   /* big statements */
  --text-h1:         48px;   /* slide titles */
  --text-h2:         32px;
  --text-h3:         22px;
  --text-body-lg:    18px;
  --text-body-size:  15px;
  --text-small:      13px;
  --text-eyebrow:    12px;

  --leading-display: 0.98;
  --leading-tight:   1.1;
  --leading-body:    1.5;

  --tracking-display: -0.02em;
  --tracking-eyebrow: 0.22em;  /* mono labels are widely spaced */
  --tracking-caps:    0.08em;  /* Arial all-caps kickers */

  --weight-regular: 400;
  --weight-bold:    700;      /* deck uses only regular + bold */
}

/* Ready-made text styles */
.sona-eyebrow {
  font-family: var(--font-mono);
  font-size: var(--text-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--text-muted);
}
.sona-eyebrow--accent { color: var(--text-accent); }

.sona-kicker {
  font-family: var(--font-body);
  font-weight: var(--weight-bold);
  font-size: var(--text-small);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-accent);
}

.sona-display {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-display);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
  color: var(--text-heading);
}

.sona-h1 {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-h1);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-display);
  color: var(--text-heading);
}

.sona-body {
  font-family: var(--font-body);
  font-size: var(--text-body-size);
  line-height: var(--leading-body);
  color: var(--text-body);
}
