/* ============================================================
   THE SOURCE — Typography
   ------------------------------------------------------------
   Primary typeface : Ysans  (Bold Italic = decorative titles,
                              Regular Italic = headings,
                              Regular = body)
   Web-safe / fallback : Open Sans
   The brand voice is ENERGETIC and ITALIC — display type leans.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: ysans-std, 'Open Sans', system-ui, sans-serif;     /* titles & headings */
  --font-body:    ysans-std, 'Open Sans', system-ui, sans-serif;     /* long-form body */
  --font-ysans:   ysans-std, 'Open Sans', system-ui, sans-serif;
  --font-opensans:'Open Sans', system-ui, sans-serif;

  /* ---- Weights ---- */
  --weight-regular: 400;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ---- Type scale (1.250 major-third, 16px base) ---- */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-md:   1.125rem;  /* 18px */
  --text-lg:   1.25rem;   /* 20px */
  --text-xl:   1.5rem;    /* 24px */
  --text-2xl:  1.875rem;  /* 30px */
  --text-3xl:  2.25rem;   /* 36px */
  --text-4xl:  3rem;      /* 48px */
  --text-5xl:  3.75rem;   /* 60px */
  --text-6xl:  4.5rem;    /* 72px */

  /* ---- Line heights ---- */
  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ---- */
  --tracking-tight:  -0.01em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-wider:  0.12em;   /* ALL-CAPS labels & eyebrows */

  /* ============================================================
     SEMANTIC TYPE ROLES
     ============================================================ */

  /* Decorative title — Ysans Bold Italic (hero / display only) */
  --title-family: var(--font-display);
  --title-weight: var(--weight-bold);
  --title-style:  italic; /* @kind other */
  --title-size:   var(--text-5xl);
  --title-leading:var(--leading-tight);

  /* Heading — Ysans Regular Italic, UPPERCASE */
  --heading-family: var(--font-display);
  --heading-weight: var(--weight-regular);
  --heading-style:  italic; /* @kind other */
  --heading-transform: uppercase; /* @kind other */
  --heading-tracking: var(--tracking-wide);

  /* Body — Open Sans / Ysans Regular */
  --body-family: var(--font-body);
  --body-weight: var(--weight-regular);
  --body-size:   var(--text-base);
  --body-leading:var(--leading-relaxed);

  /* Eyebrow / label — all-caps, wide tracking */
  --eyebrow-family: var(--font-body);
  --eyebrow-weight: var(--weight-bold);
  --eyebrow-transform: uppercase; /* @kind other */
  --eyebrow-tracking: var(--tracking-wider);
  --eyebrow-size: var(--text-sm);
}