/* ============================================================
   VARIABLES — Wild Thyme Catering & Events Design Tokens
   ============================================================ */

:root {
  /* ── Brand Colors ── */
  --color-bg-primary:   #1A0F00;   /* Deep espresso brown */
  --color-bg-mid:       #2A1A0A;   /* Dark brown for nav */
  --color-bg-light:     #FFF8F0;   /* Warm cream for alternating sections */
  --color-bg-deep:      #0D0800;   /* Deepest dark for footer */
  --color-bg-footer:    #1A0F00;

  --color-accent:       #F59E0B;   /* Warm amber/gold — primary CTAs */
  --color-accent-light: #FBBF24;   /* Lighter gold */
  --color-accent-glow:  rgba(245, 158, 11, 0.35);

  --color-text-primary: #FFFFFF;   /* White on dark backgrounds */
  --color-text-muted:   #D4C5A9;   /* Warm muted on dark */
  --color-text-dark:    #1F1B16;   /* Dark on light backgrounds */
  --color-text-mid:     #6B6258;   /* Muted brown-gray */

  --color-white:        #FFFFFF;
  --color-cream:        #FFF8F0;

  --color-border:       rgba(255, 255, 255, 0.12);
  --color-border-faint: rgba(255, 255, 255, 0.06);
  --color-border-dark:  rgba(31, 27, 22, 0.12);

  /* ── Typography ── */
  --font-heading:      'Playfair Display', Georgia, serif;
  --font-body:         'Inter', Helvetica, Arial, sans-serif;
  --font-quote:        'Playfair Display', Georgia, serif;

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

  /* ── Fluid Type Scale ── */
  --size-hero-h1:    clamp(3.5rem, 9vw, 9rem);
  --size-section-h2: clamp(2rem, 4.5vw, 4rem);
  --size-stat-num:   clamp(2.5rem, 5vw, 4.5rem);
  --size-body:       1rem;
  --size-label:      0.72rem;

  /* ── Spacing ── */
  --section-pad:   clamp(80px, 10vw, 140px);
  --container-max: 1280px;
  --container-pad: clamp(1.5rem, 5vw, 4rem);

  /* ── Motion ── */
  --ease-out-expo:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-sweep:      cubic-bezier(0.77, 0, 0.175, 1);
  --transition-fast: 150ms ease;
  --transition-mid:  200ms ease;
  --transition-btn:  350ms var(--ease-sweep);

  /* ── Glow Effects ── */
  --glow-accent:    0 0 30px var(--color-accent-glow);
  --glow-accent-sm: 0 0 12px var(--color-accent-glow);

  /* ── Surfaces ── */
  --card-bg:     rgba(245, 158, 11, 0.04);
  --card-border: rgba(245, 158, 11, 0.10);
  --nav-shadow:  0 2px 40px rgba(0, 0, 0, 0.5);

  /* ── Z-Index ── */
  --z-gate:   9999;
  --z-nav:    1000;
}