/* ============================================================
   VIVIDISTA — TYPOGRAPHY TOKENS
   Display: Syne (800 for headlines). Body: DM Sans.
   ============================================================ */
:root {
  /* ---- Families ------------------------------------------- */
  --font-display: 'Syne', 'Syne Fallback', system-ui, sans-serif;
  --font-body:    'DM Sans', 'DM Sans Fallback', system-ui, -apple-system, sans-serif;
  --font-mono:    'SFMono-Regular', ui-monospace, 'Menlo', monospace;

  /* ---- Weights -------------------------------------------- */
  --fw-regular:   400; /* @kind font */
  --fw-medium:    500; /* @kind font */
  --fw-semibold:  600; /* @kind font */
  --fw-bold:      700; /* @kind font */
  --fw-black:     800; /* @kind font */

  /* ---- Fluid type scale (clamp min → max) ----------------- */
  --fs-display:  clamp(3rem, 6vw, 5.5rem);      /* @kind font */
  --fs-h1:       clamp(2.25rem, 4vw, 3.5rem);   /* @kind font */
  --fs-h2:       clamp(1.75rem, 3vw, 2.5rem);   /* @kind font */
  --fs-h3:       clamp(1.375rem, 2vw, 1.75rem); /* @kind font */
  --fs-h4:       1.25rem;   /* @kind font */
  --fs-lead:     1.25rem;   /* @kind font */
  --fs-body:     1rem;      /* @kind font */
  --fs-sm:       0.875rem;  /* @kind font */
  --fs-xs:       0.75rem;   /* @kind font */

  /* ---- Line heights --------------------------------------- */
  --lh-tight:    1.02;  /* @kind font */
  --lh-snug:     1.15;  /* @kind font */
  --lh-normal:   1.55;  /* @kind font */
  --lh-relaxed:  1.7;   /* @kind font */

  /* ---- Letter spacing ------------------------------------- */
  --ls-tight:    -0.03em;  /* @kind font */
  --ls-snug:     -0.015em; /* @kind font */
  --ls-normal:   0;        /* @kind font */
  --ls-eyebrow:  0.18em;   /* @kind font */
  --ls-wide:     0.06em;   /* @kind font */

  /* ---- Semantic roles ------------------------------------- */
  --text-display-family: var(--font-display);
  --text-display-weight: var(--fw-black); /* @kind font */
  --text-heading-family: var(--font-display);
  --text-body-family:    var(--font-body);
}
