/* ============================================================
   Dreamfinder Solutions — Typography tokens
   Display: Cinzel (Trajan-style Roman caps, matches wordmark)
   UI / Body: Manrope
   ============================================================ */
:root {
  /* Families */
  --font-display: 'Cinzel', 'Trajan Pro', 'Times New Roman', serif;
  --font-sans:    'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    var(--font-sans);
  --font-eyebrow: var(--font-sans);

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

  /* Fluid display scale (Cinzel) — bold, motivational headlines */
  --text-display-2xl: clamp(3rem, 6vw, 5rem);     /* hero */
  --text-display-xl:  clamp(2.5rem, 4.5vw, 3.75rem);
  --text-display-lg:  clamp(2rem, 3.4vw, 2.75rem);
  --text-display-md:  clamp(1.6rem, 2.6vw, 2.1rem);
  --text-display-sm:  1.4rem;

  /* Body / UI scale (Manrope) */
  --text-xl:   1.375rem;  /* 22 — lead paragraphs */
  --text-lg:   1.125rem;  /* 18 */
  --text-base: 1rem;      /* 16 — default body */
  --text-sm:   0.875rem;  /* 14 */
  --text-xs:   0.75rem;   /* 12 — captions */
  --text-eyebrow: 0.8125rem; /* 13 — letterspaced labels */

  /* Line heights */
  --leading-tight:   1.1; /* @kind other */
  --leading-snug:    1.25; /* @kind other */
  --leading-normal:  1.5; /* @kind other */
  --leading-relaxed: 1.7; /* @kind other */

  /* Letter spacing */
  --tracking-display: 0.02em;   /* Cinzel caps breathe slightly */
  --tracking-tight:   -0.01em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-eyebrow: 0.22em;   /* "SOLUTIONS"-style spaced caps */

  /* Semantic roles */
  --text-hero:    var(--text-display-2xl);
  --text-h1:      var(--text-display-xl);
  --text-h2:      var(--text-display-lg);
  --text-h3:      var(--text-display-md);
  --text-lead:    var(--text-xl);
}
