:root {
  --color-charcoal: #373737;
  --color-gold: #B29C73;
  --color-slate: #3D5A73;
  --color-bg: #FBFBFB;
  --color-bg-alt: #FAFAFA;
  --color-bg-dark: #373737;
  --color-text: #373737;
  --color-text-secondary: #5B5B5B;
  --color-text-muted: #6E6E6E;
  --color-text-on-dark: #FBFBFB;
  --color-text-on-dark-muted: #D4CFC2;
  --color-border: #C4C5C1;
  --color-border-subtle: rgba(55, 55, 55, 0.08);
  --color-border-on-dark: rgba(212, 207, 194, 0.18);
  --color-accent: #B29C73;
  --color-accent-hover: #9C8862;
  --color-focus-ring: #B29C73;
  --color-gold-deep: #7A6A49;
  --color-gold-on-light: var(--color-gold-deep);

  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: "Raleway", sans-serif;
  --font-body: "Lato", sans-serif;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --space-11: 10rem;

  --radius-sm: 2px;
  --radius-md: 4px;
  --shadow-sm: 0 1px 2px rgba(55, 55, 55, 0.04);
  --shadow-md: 0 12px 32px -8px rgba(55, 55, 55, 0.12);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 160ms;
  --duration-base: 240ms;
  --duration-slow: 480ms;
  --container-max: 1200px;
  --container-narrow: 880px;
}