/* ============================================
   CHAAT.CA — Design Tokens
   Dark, warm, editorial. Not generic.
   ============================================ */

:root {
  /* ---- Palette: Warm Dark ---- */
  --bg-deep:       #080604;
  --bg-primary:    #0F0B08;
  --bg-surface:    #1A1511;
  --bg-elevated:   #241F19;
  --bg-card:       #1E1A15;
  --bg-card-hover: #2A2520;

  /* ---- Palette: Text ---- */
  --text-primary:  #F2E8DC;
  --text-secondary:#A89880;
  --text-muted:    #6B5E4F;
  --text-faint:    #3D3428;

  /* ---- Palette: Accent ---- */
  --saffron:       #E8A838;
  --saffron-dim:   #C48A20;
  --saffron-glow:  rgba(232, 168, 56, 0.15);
  --tamarind:      #D94F30;
  --tamarind-glow: rgba(217, 79, 48, 0.12);
  --mint:          #5B9A6F;
  --mint-glow:     rgba(91, 154, 111, 0.12);
  --purple:        #2D1B4E;

  /* ---- Palette: CTA strip (the bright moment) ---- */
  --cta-bg:        #E8A838;
  --cta-text:      #0F0B08;

  /* ---- Typography ---- */
  --font-display:  'Fraunces', 'Georgia', serif;
  --font-body:     'Outfit', 'Helvetica Neue', sans-serif;

  --fs-mega:       clamp(4.5rem, 18vw, 14rem);
  --fs-hero:       clamp(2.5rem, 5.5vw, 5rem);
  --fs-h1:         clamp(2rem, 4vw, 3.5rem);
  --fs-h2:         clamp(1.6rem, 3vw, 2.6rem);
  --fs-h3:         clamp(1.2rem, 2vw, 1.7rem);
  --fs-h4:         clamp(1rem, 1.5vw, 1.25rem);
  --fs-body:       clamp(0.95rem, 1.1vw, 1.05rem);
  --fs-body-lg:    clamp(1.05rem, 1.3vw, 1.2rem);
  --fs-small:      clamp(0.8rem, 0.9vw, 0.88rem);
  --fs-caption:    0.75rem;
  --fs-label:      0.7rem;

  --fw-light:      300;
  --fw-regular:    400;
  --fw-medium:     500;
  --fw-semibold:   600;
  --fw-bold:       700;
  --fw-black:      900;

  --lh-tight:      1.05;
  --lh-heading:    1.15;
  --lh-body:       1.7;
  --lh-loose:      1.9;

  --ls-tight:      -0.03em;
  --ls-normal:     0;
  --ls-wide:       0.08em;
  --ls-wider:      0.14em;
  --ls-widest:     0.2em;

  /* ---- Spacing ---- */
  --space-2xs:     0.25rem;
  --space-xs:      0.5rem;
  --space-sm:      1rem;
  --space-md:      1.5rem;
  --space-lg:      2.5rem;
  --space-xl:      4rem;
  --space-2xl:     6rem;
  --space-3xl:     10rem;

  --section-pad:   clamp(5rem, 12vh, 9rem);
  --container-max: 1140px;
  --container-pad: clamp(1.5rem, 5vw, 3rem);

  /* ---- Borders & Radius ---- */
  --radius-sm:     3px;
  --radius-md:     6px;
  --radius-lg:     12px;
  --radius-round:  9999px;

  /* ---- Shadows ---- */
  --shadow-sm:     0 1px 4px rgba(0, 0, 0, 0.3);
  --shadow-md:     0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg:     0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-glow:   0 0 30px var(--saffron-glow);

  /* ---- Transitions ---- */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:  0.2s;
  --duration-med:   0.45s;
  --duration-slow:  0.8s;

  /* ---- Z-index ---- */
  --z-grain:       9999;
  --z-nav:         100;
  --z-overlay:     10;
  --z-base:        1;
}