/* ============================================================
   Trepa't — Typography tokens
   Manual (p.8): Montserrat. Medium = long text · Bold = headlines /
   short phrases · Light = very long body · Black = max emphasis.
   "Different weights and styles create dynamism and contrast."
   ============================================================ */

:root {
  /* Families */
  --font-sans:    "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --font-display: "Montserrat", "Helvetica Neue", Arial, sans-serif;     /* Black/ExtraBold caps for headlines */
  --font-alt:     "Montserrat Alternates", "Montserrat", sans-serif;     /* rounded display companion */
  --font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Weights (per manual usage) */
  --fw-light:     300; /* @kind font */
  --fw-regular:   400; /* @kind font */
  --fw-medium:    500; /* @kind font */ /* default body — "the most legible" */
  --fw-semibold:  600; /* @kind font */
  --fw-bold:      700; /* @kind font */ /* headlines & short phrases */
  --fw-extrabold: 800; /* @kind font */
  --fw-black:     900; /* @kind font */ /* maximum emphasis */

  /* Type scale (1.250 major-third, 16px base) */
  --text-2xs:     0.6875rem;  /* 11px */
  --text-xs:      0.75rem;    /* 12px */
  --text-sm:      0.875rem;   /* 14px */
  --text-base:    1rem;       /* 16px */
  --text-md:      1.125rem;   /* 18px */
  --text-lg:      1.375rem;   /* 22px */
  --text-xl:      1.75rem;    /* 28px */
  --text-2xl:     2.25rem;    /* 36px */
  --text-3xl:     3rem;       /* 48px */
  --text-4xl:     3.75rem;    /* 60px */
  --text-5xl:     5rem;       /* 80px */

  /* Line heights */
  --leading-tight:   1.05;   /* big display caps */
  --leading-snug:    1.2;    /* headlines */
  --leading-normal:  1.5;    /* body */
  --leading-relaxed: 1.65;   /* long-form light text */

  /* Letter spacing — the brand leans on tight, ALL-CAPS, tracked labels */
  --tracking-tight:   -0.02em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-wider:   0.08em;   /* eyebrow / button / badge labels */
  --tracking-widest:  0.14em;   /* circular-seal style labels */

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

  --eyebrow-weight:  var(--fw-bold);
  --eyebrow-spacing: var(--tracking-wider);

  --body-family:     var(--font-sans);
  --body-weight:     var(--fw-medium);
  --body-leading:    var(--leading-normal);
}
