/* Apex Peptides — Typography tokens
 * Raleway for display/headings (600–800), Lato for body/UI (400/700).
 * Site headings are tight, semibold-to-extrabold; body is calm, readable.
 */
:root {
  --font-display: 'Raleway', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Lato', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

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

  /* Type scale (px) */
  --fs-display: 44px;  /* hero */
  --fs-h1:      34px;  /* product title */
  --fs-h2:      26px;  /* section heading */
  --fs-h3:      20px;
  --fs-lg:      18px;
  --fs-body:    16px;
  --fs-sm:      14px;
  --fs-xs:      13px;
  --fs-2xs:     11px;  /* micro / per-mg */

  /* Line heights */
  --lh-tight:   1.1;  /* @kind other */
  --lh-snug:    1.3;  /* @kind other */
  --lh-normal:  1.55; /* @kind other */

  /* Letter spacing */
  --ls-tight:  -0.01em; /* @kind other */
  --ls-normal: 0;       /* @kind other */
  --ls-wide:    0.06em; /* @kind other */
  --ls-wider:   0.14em; /* @kind other */
}