/* ============================================================
   BLUE SALON — TYPOGRAPHY TOKENS
   Display: Bodoni Moda  (editorial, high-contrast, fashion)
   UI/Body: Jost         (geometric grotesque, clean, luxury)
   ============================================================ */
:root {
  /* ---- Families ---- */
  /* "Qatar" is the brand typeface, used for both display and UI. */
  --font-display: "Qatar", "Helvetica Neue", Arial, sans-serif;
  --font-sans:    "Qatar", "Helvetica Neue", Arial, sans-serif;
  --font-body:    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 */

  /* ---- Fluid display scale (Bodoni Moda) ---- */
  --text-display-xl: 72px;   /* hero editorial            */
  --text-display-l:  54px;
  --text-display-m:  40px;
  --text-display-s:  30px;

  /* ---- Heading & body scale (Jost) ---- */
  --text-h1: 32px;
  --text-h2: 24px;
  --text-h3: 19px;
  --text-lg: 18px;
  --text-md: 16px;   /* base body */
  --text-sm: 14px;
  --text-xs: 12px;
  --text-2xs: 11px;  /* eyebrow / labels */

  /* ---- Line heights ---- */
  --lh-tight:   1.05; /* @kind other */
  --lh-snug:    1.2; /* @kind other */
  --lh-normal:  1.5; /* @kind other */
  --lh-relaxed: 1.65; /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-tightest: -0.02em; /* @kind font */
  --ls-tight:   -0.01em; /* @kind font */
  --ls-normal:   0em; /* @kind font */
  --ls-wide:     0.04em; /* @kind font */
  --ls-wider:    0.12em; /* @kind font */
  --ls-widest:   0.22em; /* @kind font */
}
