:root {
  /* Colors */
  --primary: #0b3d2e;
  --primary-dark: #071f18;
  --accent: #c9a84c;
  --accent-light: #e0c06e;
  --accent-dim: #8a6e2f;
  --surface: #0f1a14;
  --surface-2: #162219;
  --surface-3: #1e2e24;
  --light: #f4efe6;
  --light-dim: #c8c2b7;
  --muted: #6b8c78;
  --muted-dark: #4a6355;
  --pop: #e8533a;
  --white: #ffffff;
  --black: #000000;

  /* Typography */
  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: "DM Sans", sans-serif;
  --font-body: "Lora", Georgia, serif;

  /* Spacing */
  --section-py: 8rem;
  --container: 1200px;
  --gap: 2rem;

  /* Border radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 8px 32px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 16px 64px rgba(0, 0, 0, 0.5);
  --shadow-gold: 0 8px 32px rgba(201, 168, 76, 0.2);

  /* Transitions */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --transition: 0.3s var(--ease);
  --transition-slow: 0.6s var(--ease);

  /* Z-index layers */
  --z-base: 1;
  --z-card: 10;
  --z-nav: 100;
  --z-overlay: 200;
  --z-modal: 300;
  --z-cursor: 9999;
}