/* ============================================================
   Thiago Liguori — Typography tokens
   Editorial pairing: heavy Hanken Grotesk for display & UI,
   Lora serif for descriptive / editorial body copy.
   ============================================================ */

:root {
  /* Families */
  --font-display: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-sans:    'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-serif:   'Lora', Georgia, 'Times New Roman', serif;

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

  /* Fluid display sizes (hero → section heads) */
  --fs-display-2xl: clamp(3rem, 1.6rem + 5.6vw, 5rem);    /* @kind other */
  --fs-display-xl:  clamp(2.5rem, 1.6rem + 3.6vw, 4rem);  /* @kind other */
  --fs-display-lg:  clamp(2rem, 1.4rem + 2.4vw, 3.25rem); /* @kind other */
  --fs-display-md:  clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); /* @kind other */

  /* Headings */
  --fs-h1: 2.25rem;  /* 36  @kind font */
  --fs-h2: 1.875rem; /* 30  @kind font */
  --fs-h3: 1.5rem;   /* 24  @kind font */
  --fs-h4: 1.25rem;  /* 20  @kind font */

  /* Body / UI */
  --fs-body-lg: 1.25rem;   /* 20  @kind font */
  --fs-body:    1.0625rem; /* 17  @kind font */
  --fs-body-sm: 0.9375rem; /* 15  @kind font */
  --fs-label:   0.9375rem; /* 15  @kind font */
  --fs-caption: 0.8125rem; /* 13  @kind font */
  --fs-overline:0.75rem;   /* 12  @kind font */

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

  /* Letter spacing */
  --ls-tighter: -0.03em;  /* big display  @kind font */
  --ls-tight:   -0.02em;  /* headings  @kind font */
  --ls-normal:  0em;      /* @kind font */
  --ls-wide:    0.04em;   /* @kind font */
  --ls-overline:0.16em;   /* wordmark / labels  @kind font */

  /* ---------- Semantic roles ---------- */
  --text-display:  var(--fw-extrabold) var(--fs-display-2xl)/var(--lh-tight) var(--font-display); /* @kind font */
  --text-heading:  var(--fw-bold) var(--fs-h2)/var(--lh-snug) var(--font-display); /* @kind font */
  --text-eyebrow:  var(--fw-bold) var(--fs-overline)/1 var(--font-display); /* @kind font */
}