/* RESPIRA — Typography tokens
   Per brand guidelines (IDML):
   - Section titles (Titulars secció): Zalando Sans Expanded, Medium (500)
   - Highlighted text / pull-quotes (Frases destacades): Zalando Sans Expanded, Medium (500)
   - Article body (Text articles): Zalando Sans SemiExpanded, Light (300)
   - Body bold: Zalando Sans SemiExpanded, Semibold (600)
   - Body italic: Zalando Sans SemiExpanded, Light Italic
   Other weights of Zalando Sans SemiExpanded may be used as needed. */

:root {
  /* Families */
  --font-display: "Zalando Sans Expanded", system-ui, sans-serif;   /* headings, section titles, UI labels */
  --font-body: "Zalando Sans SemiExpanded", system-ui, sans-serif;  /* long-form reading */

  /* 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 */

  /* Type scale (digital / web) */
  --fs-display: 4rem;      /* 64px — cover / hero titles */
  --fs-h1: 3rem;           /* 48px */
  --fs-h2: 2.25rem;        /* 36px — section titles */
  --fs-h3: 1.5rem;         /* 24px */
  --fs-h4: 1.25rem;        /* 20px */
  --fs-lead: 1.375rem;     /* 22px — standfirst / pull-quotes */
  --fs-body: 1.125rem;     /* 18px — article body */
  --fs-small: 1rem;        /* 16px */
  --fs-caption: 0.8125rem; /* 13px — captions, credits */
  --fs-eyebrow: 0.75rem;   /* 12px — kickers / section kickers */

  /* Line heights */
  --lh-tight: 1.05; /* @kind font */
  --lh-heading: 1.15; /* @kind font */
  --lh-snug: 1.35; /* @kind font */
  --lh-body: 1.65; /* @kind font */

  /* Letter spacing */
  --ls-eyebrow: 0.16em; /* @kind font */
  --ls-heading: -0.01em; /* @kind font */
  --ls-normal: 0; /* @kind font */
}