:root {
  /* Colors */
  --color-bg: #F7F3EC;
  --color-surface: #FFFDF8;
  --color-text: #211C17;
  --color-muted: #6E665D;
  --color-accent: #A94B32;
  --color-accent-dark: #843A27;
  --color-accent-light: #E8C7B9;
  --color-border: #E3DDD4;

  /* Content on inverse surfaces (notification bar, experience, hours band, footer) */
  --overlay-bg: rgba(255, 253, 248, 0.05);
  --overlay-bg-hover: rgba(255, 253, 248, 0.09);
  --overlay-border: rgba(255, 253, 248, 0.12);
  --overlay-text-faint: rgba(255, 253, 248, 0.5);
  --overlay-text: rgba(255, 253, 248, 0.65);
  --overlay-text-strong: rgba(255, 253, 248, 0.78);
  --accent-soft: rgba(232, 199, 185, 0.14);
  --accent-line: rgba(232, 199, 185, 0.4);

  /* Navbar glass */
  --navbar-bg: rgba(247, 243, 236, 0.92);

  color-scheme: light;

  /* Typography */
  --font-heading: 'DM Serif Display', Georgia, serif;
  --font-body: 'Manrope', system-ui, sans-serif;

  /* Type Scale */
  --text-hero: clamp(48px, 6vw, 72px);
  --text-section: clamp(36px, 4.3vw, 52px);
  --text-large: clamp(28px, 3.5vw, 42px);
  --text-card: 24px;
  --text-body: 17px;
  --text-small: 15px;
  --text-nav: 14px;
  --text-button: 14px;
  --text-tiny: 12px;
  --text-eyebrow: 11px;

  /* Line Heights */
  --lh-tight: 0.95;
  --lh-heading: 1.15;
  --lh-body: 1.65;

  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-base: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 80px;
  --space-section: 120px;
  --space-section-mobile: 72px;

  /* Border Radius */
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* Container */
  --container: 1240px;
  --container-padding: 24px;

  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(33, 28, 23, 0.04);
  --shadow-md: 0 8px 24px rgba(33, 28, 23, 0.06);
  --shadow-lg: 0 12px 30px rgba(33, 28, 23, 0.08);

  /* Transitions */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 180ms;
  --duration-normal: 300ms;
  --duration-slow: 600ms;
}

/* ========================================
   THEME: NOIR (dark / brass)
   ======================================== */

[data-theme="noir"] {
  --color-bg: #14100D;
  --color-surface: #1E1915;
  --color-text: #F0E9DC;
  --color-muted: #A29585;
  --color-accent: #C9A227;
  --color-accent-dark: #A8861E;
  --color-accent-light: #3A311C;
  --color-border: #342C23;

  --overlay-bg: rgba(20, 16, 13, 0.04);
  --overlay-bg-hover: rgba(20, 16, 13, 0.08);
  --overlay-border: rgba(20, 16, 13, 0.12);
  --overlay-text-faint: rgba(20, 16, 13, 0.55);
  --overlay-text: rgba(20, 16, 13, 0.68);
  --overlay-text-strong: rgba(20, 16, 13, 0.8);
  --accent-soft: rgba(201, 162, 39, 0.16);
  --accent-line: rgba(201, 162, 39, 0.5);

  --navbar-bg: rgba(20, 16, 13, 0.88);

  color-scheme: dark;
}

/* ========================================
   THEME: OLIVE (sage / botanical)
   ======================================== */

[data-theme="olive"] {
  --color-bg: #F2F3EA;
  --color-surface: #FBFCF6;
  --color-text: #21271E;
  --color-muted: #6C7362;
  --color-accent: #5F7048;
  --color-accent-dark: #4A5939;
  --color-accent-light: #DEE4CC;
  --color-border: #DFE2D2;

  --accent-soft: rgba(222, 228, 204, 0.16);
  --accent-line: rgba(222, 228, 204, 0.45);

  --navbar-bg: rgba(242, 243, 234, 0.92);

  color-scheme: light;
}