/* ============================================================
   Hola Books — Typography tokens
   Copied verbatim from the Hola Books design system.
   Web typeface: Poppins (self-hosted) — the font the live
   Shopify storefront renders.
   ============================================================ */

:root {
  /* Marketing stack: self-hosted Poppins (matches the live storefront), Jost as geometric fallback. */
  --font-sans: "Poppins", "Jost", "Questrial", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: var(--font-sans);
  --font-body: var(--font-sans);
  --font-mono: ui-monospace, Menlo, monospace;

  /* weights */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 800;

  /* type scale (rem, 1rem = 16px) — fluid display sizes */
  --fs-display: clamp(2.75rem, 1.6rem + 4.4vw, 4.25rem);
  --fs-h1: clamp(2.1rem, 1.4rem + 2.6vw, 3.125rem);
  --fs-h2: clamp(1.6rem, 1.2rem + 1.5vw, 2.25rem);
  --fs-h3: 1.5rem;
  --fs-h4: 1.25rem;
  --fs-lead: 1.375rem;
  --fs-body: 1.0625rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;

  /* UI scale — what the tools' controls, rows and chips use. The fluid
     marketing scale above is for pages people read, not screens they work in.
     Half-pixel sizes from the design files round UP to the nearest step. */
  --fs-ui-2xs: 0.625rem;    /* 10 — tiny caps badges              */
  --fs-ui-xs:  0.6875rem;   /* 11 — chips, meta, labels           */
  --fs-ui-sm:  0.75rem;     /* 12 — captions, secondary text      */
  --fs-ui-md:  0.8125rem;   /* 13 — table cells, small buttons    */
  --fs-ui:     0.875rem;    /* 14 — buttons, fields, row text     */
  --fs-ui-lg:  0.9375rem;   /* 15 — row titles                    */
  --fs-ui-xl:  1.0625rem;   /* 17 — panel titles                  */

  /* line-heights */
  --lh-tight: 1.1;
  --lh-snug: 1.25;
  --lh-body: 1.65;
  --lh-relaxed: 1.8;

  /* letter-spacing — the theme tracks eyebrows/nav slightly open */
  --ls-tight: -0.02em;
  --ls-normal: 0;
  --ls-eyebrow: 0.14em;
  --ls-nav: 0.01em;
}