:root {
  /* Palette — Forest Green + Warm Orange */
  --clr-bg: #0f1e18;
  --clr-bg-2: #162419;
  --clr-bg-3: #1e2e22;
  --clr-surface: rgba(255,255,255,0.05);
  --clr-border: rgba(255,255,255,0.09);
  --clr-gold: #e8823a;
  --clr-gold-light: #f0a96e;
  --clr-gold-dim: #a0561f;
  --clr-amber: #d4603a;
  --clr-cream: #f5ede3;
  --clr-cream-dim: rgba(245,237,227,0.7);
  --clr-text: #eae3da;
  --clr-text-muted: rgba(234,227,218,0.5);
  --clr-text-on-hero: #f4ece2;
  --clr-text-hero-muted: rgba(242,235,227,0.78);
  --clr-white: #ffffff;
  --clr-error: #ef4444;
  --clr-success: #22c55e;

  /* Semantic — Headings (maps to cream on dark, near-black on light) */
  --clr-text-heading: #f5ede3;

  /* Semantic — Overlays & Scrims */
  --clr-scrim: rgba(0,0,0,0.75);
  --clr-scrim-light: rgba(0,0,0,0.55);
  --clr-nav-bg: rgba(15, 30, 24, 0.92);
  --clr-nav-overlay: rgba(5, 8, 7, 0.55);
  --clr-nav-menu-bg: linear-gradient(180deg, rgba(12, 10, 9, 0.99) 0%, rgba(15, 22, 18, 0.98) 45%, rgba(10, 14, 12, 0.99) 100%);
  --clr-nav-divider: rgba(245, 237, 227, 0.06);
  --clr-nav-divider-md: rgba(245, 237, 227, 0.08);
  --clr-nav-divider-lg: rgba(245, 237, 227, 0.1);

  /* Semantic — Cards & Floating UI */
  --clr-float-bg: rgba(255,255,255,0.05);
  --clr-cart-bg: rgba(20,18,16,0.95);
  --clr-cart-shadow: 0 8px 40px rgba(0,0,0,0.6), 0 0 0 1px rgba(201,151,58,0.1);
  --clr-backtop-bg: rgba(20,18,16,0.9);
  --clr-sig-bg: rgba(15, 30, 24, 0.55);

  /* Semantic — Forms */
  --clr-input-bg: var(--clr-surface);
  --clr-input-text: #f5ede3;
  --clr-input-placeholder: rgba(232,221,208,0.25);
  --clr-input-focus-bg: rgba(201,151,58,0.04);
  --clr-input-focus-ring: rgba(201,151,58,0.1);
  --clr-input-cart-bg: rgba(15, 30, 24, 0.4);

  /* Semantic — Interactive hover tints */
  --clr-hover-gold-tint: rgba(232,130,58,0.06);
  --clr-hover-gold-subtle: rgba(201,151,58,0.08);
  --clr-hover-gold-soft: rgba(201,151,58,0.12);
  --clr-hover-gold-btn: rgba(201,151,58,0.1);

  /* Semantic — Status */
  --clr-success-bg: rgba(34,197,94,0.08);
  --clr-success-border: rgba(34,197,94,0.2);
  --clr-error-text: #e57373;
  --clr-error-bg: rgba(220, 80, 80, 0.06);
  --clr-error-border: rgba(220, 80, 80, 0.85);

  /* Hero scrim — dark mode gradient stops */
  --clr-hero-scrim-1: rgba(15, 30, 24, 0.97);
  --clr-hero-scrim-2: rgba(15, 30, 24, 0.93);
  --clr-hero-scrim-3: rgba(15, 30, 24, 0.82);
  --clr-hero-scrim-4: rgba(15, 30, 24, 0.48);
  --clr-hero-scrim-5: rgba(15, 30, 24, 0.22);
  --clr-hero-scrim-6: rgba(15, 30, 24, 0.1);
  /* Hero scrim — mobile */
  --clr-hero-scrim-m1: rgba(15, 30, 24, 0.94);
  --clr-hero-scrim-m2: rgba(15, 30, 24, 0.72);
  --clr-hero-scrim-m3: rgba(15, 30, 24, 0.45);
  --clr-hero-scrim-m4: rgba(15, 30, 24, 0.28);

  /* Hero photo overlay gradient */
  --clr-hero-photo-1: rgba(20, 18, 16, 0.75);
  --clr-hero-photo-2: rgba(30, 24, 20, 0.45);
  --clr-hero-photo-3: rgba(45, 36, 24, 0.2);
  --clr-hero-photo-fallback: #1a1410;

  /* Typography */
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-sans: 'Outfit', system-ui, sans-serif;

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 8rem;

  /* Border radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 24px;
  --radius-xl: 40px;

  /* Animations */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 200ms;
  --dur-med: 400ms;
  --dur-slow: 700ms;
  --motion-lift: 4px;
  --shadow-card-hover: 0 20px 56px rgba(0,0,0,0.32);
}

@media (prefers-color-scheme: light) {
  :root {
    /* Core palette overrides */
    --clr-bg: #fcfbf9;
    --clr-bg-2: #f4ece5;
    --clr-bg-3: #eae3d9;
    --clr-surface: rgba(0,0,0,0.03);
    --clr-border: rgba(0,0,0,0.08);
    --clr-text: #1a231f;
    --clr-text-muted: rgba(26,35,31,0.55);
    --clr-text-on-hero: #ffffff;
    --clr-text-hero-muted: rgba(255,255,255,0.8);
    --shadow-card-hover: 0 20px 56px rgba(0,0,0,0.12);

    /* Headings — dark text on light bg */
    --clr-text-heading: #1a231f;
    --clr-cream: #1a231f;
    --clr-cream-dim: rgba(26,35,31,0.7);

    /* Gold adjustments for light bg contrast */
    --clr-gold: #c96a20;
    --clr-gold-light: #b85e1a;
    --clr-gold-dim: #d48a40;

    /* Overlays & Scrims — lighter for light mode */
    --clr-scrim: rgba(0,0,0,0.5);
    --clr-scrim-light: rgba(0,0,0,0.3);
    --clr-nav-bg: rgba(252, 251, 249, 0.92);
    --clr-nav-overlay: rgba(0, 0, 0, 0.25);
    --clr-nav-menu-bg: linear-gradient(180deg, rgba(252, 251, 249, 0.99) 0%, rgba(244, 236, 229, 0.98) 45%, rgba(252, 251, 249, 0.99) 100%);
    --clr-nav-divider: rgba(0, 0, 0, 0.06);
    --clr-nav-divider-md: rgba(0, 0, 0, 0.08);
    --clr-nav-divider-lg: rgba(0, 0, 0, 0.1);

    /* Cards & Floating UI */
    --clr-float-bg: rgba(0,0,0,0.04);
    --clr-cart-bg: rgba(255, 255, 255, 0.95);
    --clr-cart-shadow: 0 8px 40px rgba(0,0,0,0.15), 0 0 0 1px rgba(201,151,58,0.15);
    --clr-backtop-bg: rgba(255, 255, 255, 0.92);
    --clr-sig-bg: rgba(15, 30, 24, 0.65);

    /* Forms */
    --clr-input-bg: rgba(0,0,0,0.03);
    --clr-input-text: #1a231f;
    --clr-input-placeholder: rgba(26,35,31,0.35);
    --clr-input-focus-bg: rgba(201,151,58,0.06);
    --clr-input-focus-ring: rgba(201,151,58,0.15);
    --clr-input-cart-bg: rgba(0, 0, 0, 0.04);

    /* Interactive hover tints */
    --clr-hover-gold-tint: rgba(232,130,58,0.08);
    --clr-hover-gold-subtle: rgba(201,151,58,0.1);
    --clr-hover-gold-soft: rgba(201,151,58,0.15);
    --clr-hover-gold-btn: rgba(201,151,58,0.12);

    /* Status */
    --clr-success-bg: rgba(34,197,94,0.1);
    --clr-success-border: rgba(34,197,94,0.25);
    --clr-error-text: #dc3545;
    --clr-error-bg: rgba(220, 80, 80, 0.08);
    --clr-error-border: rgba(220, 80, 80, 0.6);

    /* Hero scrim — stays dark even in light mode (photo overlay) */
    /* These intentionally keep the dark overlay to maintain hero text readability */
    --clr-hero-scrim-1: rgba(15, 30, 24, 0.92);
    --clr-hero-scrim-2: rgba(15, 30, 24, 0.85);
    --clr-hero-scrim-3: rgba(15, 30, 24, 0.7);
    --clr-hero-scrim-4: rgba(15, 30, 24, 0.4);
    --clr-hero-scrim-5: rgba(15, 30, 24, 0.18);
    --clr-hero-scrim-6: rgba(15, 30, 24, 0.08);
    --clr-hero-scrim-m1: rgba(15, 30, 24, 0.88);
    --clr-hero-scrim-m2: rgba(15, 30, 24, 0.65);
    --clr-hero-scrim-m3: rgba(15, 30, 24, 0.38);
    --clr-hero-scrim-m4: rgba(15, 30, 24, 0.22);
  }
}