/* ============================================================
   tokens.css — Monday Co Dago v0 preview
   Aesthetic: industrial-warm-tropical (tropical courtyard brutalism)
   Locked 2026-05-02. Do NOT modify after this point per spec.
   ============================================================ */

:root {
  /* ---- Primitives (refined from observed IG palette for AA contrast) ---- */
  /* Original brief swatches: #C1440E #E8D4B8 #2B2B2B #8B6F47 #5A9B8F */

  /* Warm cream — wall plaster / window light */
  --primitive-cream-50:  #F4E8D6;   /* lightest tint, page bg */
  --primitive-cream-100: #E8D4B8;   /* observed IG cream */
  --primitive-cream-200: #D9C09A;   /* deeper cream */

  /* Rust red — chair upholstery / signature accent */
  --primitive-rust-500:  #C1440E;   /* observed IG rust (display/large only) */
  --primitive-rust-600:  #A33A0C;   /* AA-large + eyebrow on cream */
  --primitive-rust-700:  #8A310A;   /* AA-body when used as bg */
  --primitive-rust-800:  #6E2A0A;   /* darkest, decorative stripe */

  /* Charcoal — concrete / steel / navy upholstery shadow */
  --primitive-charcoal-900: #1A1A1A;  /* near-black brick shadow */
  --primitive-charcoal-800: #2B2B2B;  /* observed IG charcoal */
  --primitive-charcoal-700: #3D3D3D;
  --primitive-charcoal-500: #6B6B6B;  /* decorative only */
  --primitive-charcoal-400: #8C8C8C;  /* AA-body on charcoal-900 */

  /* Walnut — warm wood touches */
  --primitive-walnut-600: #8B6F47;    /* observed IG walnut */
  --primitive-walnut-700: #6E5638;    /* deeper, AA on cream */
  --primitive-walnut-800: #4F3E27;

  /* Sage — flowering plant / patina copper accent */
  --primitive-sage-500: #5A9B8F;      /* observed IG sage */
  --primitive-sage-600: #467C71;      /* AA-large on cream */
  --primitive-sage-700: #3D6F65;      /* AA-body when used as bg */

  /* ---- Semantic tokens ---- */
  /* Surface / background */
  --bg-page:        var(--primitive-cream-50);   /* warm off-white plaster */
  --bg-elevated:    var(--primitive-cream-100);  /* card / tile bg */
  --bg-deep:        var(--primitive-charcoal-900); /* hero / footer */
  --bg-rust:        var(--primitive-rust-500);   /* large-text panel only */
  --bg-rust-deep:   var(--primitive-rust-700);   /* body-text panel — AA safe */
  --bg-walnut:      var(--primitive-walnut-700); /* secondary accent (AA body) */
  --bg-sage:        var(--primitive-sage-700);   /* tertiary accent (AA body) */

  /* Foreground / text */
  --fg-primary:     var(--primitive-charcoal-900); /* body on cream */
  --fg-secondary:   var(--primitive-charcoal-700);
  --fg-muted:       var(--primitive-charcoal-500);
  --fg-on-deep:     var(--primitive-cream-50);   /* text on dark hero */
  --fg-on-rust:     var(--primitive-cream-50);   /* text on rust */
  --fg-accent-rust: var(--primitive-rust-600);   /* AA on cream */
  --fg-accent-sage: var(--primitive-sage-600);

  /* Borders / lines */
  --border-hairline: var(--primitive-charcoal-900);
  --border-warm:     var(--primitive-walnut-700);

  /* ---- Typography ---- */
  /* Body: grotesk-minimal — Inter (variable, system-friendly fallback) */
  /* Display: editorial grotesk — Archivo (heavy, brutalist condensed) */
  /* Signage warmth: Caveat for menu-header handwritten only */
  --font-body:    'Inter', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Archivo', 'Inter', ui-sans-serif, sans-serif;
  --font-signage: 'Caveat', 'Inter', cursive;
  --font-mono:    ui-monospace, 'SF Mono', 'JetBrains Mono', monospace;

  /* Type scale — editorial brutalist (massive hero, tight body) */
  --fs-hero:    clamp(3.5rem, 12vw, 11rem);   /* 56px → 176px */
  --fs-display: clamp(2.5rem, 7vw, 5.5rem);   /* 40px → 88px */
  --fs-h2:      clamp(1.75rem, 4vw, 3rem);    /* 28px → 48px */
  --fs-h3:      clamp(1.25rem, 2.5vw, 1.75rem); /* 20px → 28px */
  --fs-body:    1rem;                         /* 16px — well above 14px floor */
  --fs-small:   0.875rem;                     /* 14px — exactly at floor */
  --fs-watermark: 0.6875rem;                  /* 11px — spec-locked, watermark ONLY */

  --lh-tight:   0.9;
  --lh-display: 1.05;
  --lh-body:    1.55;
  --lh-loose:   1.7;

  --ls-hero:    -0.04em;
  --ls-display: -0.025em;
  --ls-body:    0;
  --ls-eyebrow: 0.18em;

  /* Weights — Archivo & Inter both support full range */
  --fw-body:    400;
  --fw-medium:  500;
  --fw-bold:    700;
  --fw-display: 900;

  /* ---- Spacing ---- */
  --space-1:  0.25rem;   /* 4 */
  --space-2:  0.5rem;    /* 8 */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-6:  1.5rem;    /* 24 */
  --space-8:  2rem;      /* 32 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */
  --space-20: 5rem;      /* 80 */
  --space-24: 6rem;      /* 96 */
  --space-32: 8rem;      /* 128 */
  --space-40: 10rem;     /* 160 */

  /* Section padding */
  --pad-section-y: clamp(4rem, 10vw, 8rem);
  --pad-section-x: clamp(1.25rem, 5vw, 4rem);

  /* ---- Layout ---- */
  --container-max: 1280px;
  --container-narrow: 920px;

  /* ---- Touch targets (44px floor — hard rule) ---- */
  --touch-min: 2.75rem;

  /* ---- Radii — brutalist = sharp; small detail radius only on chips ---- */
  --radius-none: 0;
  --radius-sm:   2px;
  --radius-pill: 999px;

  /* ---- Borders ---- */
  --border-1: 1px solid var(--border-hairline);
  --border-2: 2px solid var(--border-hairline);
  --border-thick: 4px solid var(--border-hairline);

  /* ---- Motion (light budget — viewport reveals only) ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast:   180ms;
  --dur-normal: 360ms;
  --dur-slow:   620ms;
}

/* Reduced motion — kill animations entirely */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast:   0ms;
    --dur-normal: 0ms;
    --dur-slow:   0ms;
  }
}