/* tokens.css — DESIGN TOKENS: the single source of truth for the brand.
   A "token" is a named value stored as a CSS custom property (--name).
   Everywhere else we reference it with var(--name). Change the brand here
   once, and it updates across the entire site. */

:root {
  /* --- Brand colors --- */
  --color-black: #000000; /* authority: type, rules, structure (~70% of the page) */
  --color-white: #ffffff; /* paper white; whitespace is part of the brand (~25%) */
  --color-gold:  #c5a572; /* antique gold: the earned accent (~5%) — never a background, never body text */

  /* --- Semantic aliases: name by ROLE, not by color, so intent stays clear --- */
  --color-text:        var(--color-black);
  --color-bg:          var(--color-white);
  --color-accent:      var(--color-gold);
  --color-text-invert: var(--color-white); /* text on dark surfaces */
  --color-bg-invert:   var(--color-black);

  /* --- Type families (brand fonts first, safe fallbacks after) --- */
  --font-headline: "Source Serif Pro", Georgia, serif;
  --font-body:     "Inter", Helvetica, Arial, sans-serif;

  /* --- Font weights --- */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  /* --- Type scale (responsive rem). clamp(min, preferred, max) grows the
         size with the viewport but never below min or above max. --- */
  --text-h1:      clamp(2rem, 1.4rem + 3vw, 2.75rem);    /* ~32px phone -> ~44px desktop */
  --text-h2:      clamp(1.25rem, 1.05rem + 1vw, 1.5rem); /* ~20px -> ~24px */
  --text-body:    1.0625rem;  /* ~17px. Print spec was 10-11pt; bumped for on-screen legibility (a11y). */
  --text-caption: 0.8125rem;  /* ~13px */

  /* --- Line heights --- */
  --leading-tight: 1.15; /* headlines */
  --leading-body:  1.5;  /* body copy */

  /* --- Letter spacing --- */
  --tracking-caption: 0.04em; /* design spec "tracking +40" = 40/1000 em */

  /* --- Spacing scale (whitespace is part of the brand — be generous) --- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;

  /* --- Layout --- */
  --measure: 70ch; /* max readable line length for body text */
}
