/* TCGC Design Tokens — Warm Community direction */

:root {
  /* Palette — ported from designer's warm.jsx */
  --crimson:       #B8341B;
  --crimson-deep:  #8A1F0E;
  --gold:          #D9A441;
  --gold-light:    #EDC56A;
  --forest:        #2D6B4F;
  --sand:          #F5EDDD;
  --sand-deep:     #EBDDC0;
  --cream:         #FBF6EC;
  --ink:           #2A1810;
  --muted:         #7a6353;
  --white:         #ffffff;
  --black:         #14110d;

  /* Type */
  --font-serif: "Fraunces", Georgia, "Times New Roman", serif;
  --font-sans:  "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --fs-hero:     clamp(44px, 8vw, 92px);
  --fs-display:  clamp(32px, 5vw, 56px);
  --fs-h2:       clamp(26px, 3.5vw, 40px);
  --fs-h3:       clamp(20px, 2.5vw, 28px);
  --fs-body:     16px;
  --fs-lede:     clamp(15px, 1.5vw, 20px);
  --fs-small:    13px;
  --fs-micro:    11px;

  --lh-tight:  1.02;
  --lh-normal: 1.6;
  --lh-loose:  1.7;

  /* Space */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* Radius */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 24px;
  --r-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.04);
  --shadow-md: 0 6px 18px -8px rgba(184,52,27,0.22);
  --shadow-lg: 0 18px 40px -20px rgba(20,17,13,0.25);

  /* Container */
  --container: 1320px;
  --container-pad: clamp(20px, 4vw, 48px);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.6, 0.2, 1);
  --dur: 0.18s;
}

/* ReduceMotion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
