/* ===========================================================================
   JD Yuversity — Typography tokens
   Source: Brandbook JD Yuversity (Tipografía)
     · Red Hat Display  — "palo seco, bastones rectos, regulares y delgados…
        curvas abiertas nacidas de círculos." Black for titles, Light for body.
     · Arsenica (Trial) Medium Italic — elegant serif for italic accents /
        "resaltados" in titles & subtitles (never in body).
   Interletrado: títulos -25, cuerpos -25, resaltados -50  (Illustrator /1000em).

   SUBSTITUTION: Arsenica is a commercial trial font and is not web-available.
   It is substituted here with **Newsreader** (Google Fonts) — a refined
   literary serif with a close, calligraphic medium italic. Replace the
   @import + --font-serif declaration with the licensed Arsenica webfont
   when available.
   =========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&family=Newsreader:ital,opsz,wght@1,6..72,300..600&display=swap');

:root {
  /* --- Families ---------------------------------------------------------- */
  --font-sans:    'Red Hat Display', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: 'Red Hat Display', system-ui, sans-serif;
  --font-serif:   'Newsreader', Georgia, 'Times New Roman', serif; /* Arsenica substitute */

  /* --- Weights ----------------------------------------------------------- */
  --weight-light:   300;
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold:600;
  --weight-bold:    700;
  --weight-black:   900;

  /* --- Tracking (from brandbook) ---------------------------------------- */
  --tracking-tight:    -0.025em; /* títulos & cuerpos (-25) */
  --tracking-tighter:  -0.05em;  /* resaltados (-50) */
  --tracking-normal:    0;
  --tracking-wide:      0.04em;
  --tracking-eyebrow:   0.18em;  /* spaced-out labels (¿QUÉ SON?) */

  /* --- Type scale (rem, 16px base) -------------------------------------- */
  --text-display-xl: 5rem;     /* 80px hero */
  --text-display:    3.75rem;  /* 60px */
  --text-h1:         3rem;     /* 48px */
  --text-h2:         2.25rem;  /* 36px */
  --text-h3:         1.625rem; /* 26px */
  --text-h4:         1.25rem;  /* 20px */
  --text-lg:         1.125rem; /* 18px */
  --text-base:       1rem;     /* 16px */
  --text-sm:         0.875rem; /* 14px */
  --text-xs:         0.75rem;  /* 12px */

  /* --- Line heights ------------------------------------------------------ */
  --leading-tight:  1.05;
  --leading-snug:   1.18;
  --leading-normal: 1.4;
  --leading-relaxed:1.6;

  /* --- Semantic roles ---------------------------------------------------- */
  --title-family:    var(--font-display);
  --title-weight:    var(--weight-black);
  --title-tracking:  var(--tracking-tight);

  --body-family:     var(--font-sans);
  --body-weight:     var(--weight-light);
  --body-tracking:   var(--tracking-tight);

  --accent-family:   var(--font-serif); /* italic highlights */
  --eyebrow-family:  var(--font-sans);
}