/* ============================================================
   Liora Interior Studio  -  Typography tokens
   Manrope is the workhorse: body, UI, labels AND the large
   uppercase headings. Cormorant appears ONLY as a decorative
   accent for a handful of big display words.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-sans:   'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-accent: 'Cormorant', Georgia, 'Times New Roman', serif;  /* a few words only */
  --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 */

  /* ---- Heading scale (Manrope, uppercase, warm) ---- */
  --text-h1: clamp(1.9rem, 3.4vw, 3rem);     /* section heroes  */
  --text-h2: clamp(1.5rem, 2.4vw, 2.125rem); /* section heads   */
  --text-h3: clamp(1.15rem, 1.6vw, 1.4rem);  /* row / card head */

  /* ---- Decorative accent scale (Cormorant, big watermark words) ---- */
  --text-accent-xl: clamp(4rem, 12vw, 11rem); /* HARMONY DESIGN moment */
  --text-accent-l:  clamp(2.5rem, 6vw, 5rem);

  /* ---- Body / UI scale ---- */
  --text-stat: clamp(2.2rem, 4vw, 3.25rem);  /* big stat numerals */
  --text-xl:  1.5rem;     /* 24  -  leads      */
  --text-lg:  1.25rem;    /* 20              */
  --text-md:  1.0625rem;  /* 17  -  body       */
  --text-base:1rem;       /* 16              */
  --text-sm:  0.875rem;   /* 14  -  UI         */
  --text-xs:  0.75rem;    /* 12  -  labels     */
  --text-2xs: 0.6875rem;  /* 11  -  eyebrows   */

  /* ---- Line heights ---- */
  --lh-tight:   1.08; /* @kind other */
  --lh-snug:    1.18; /* @kind other */
  --lh-heading: 1.22; /* @kind other */
  --lh-normal:  1.55; /* @kind other */
  --lh-relaxed: 1.7;  /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-display:  0.01em;  /* @kind other */  /* uppercase Manrope headings */
  --ls-tight:   -0.01em;  /* @kind other */
  --ls-normal:   0;       /* @kind other */
  --ls-wide:     0.06em;  /* @kind other */
  --ls-eyebrow:  0.22em;  /* @kind other */  /* tiny tracked section labels */
  --ls-mark:     0.34em;  /* @kind other */
}