:root {
  /* Primary colors */
  --color-primary: #11110D;
  --color-primary-dark: #081C15;
  --color-primary-green: #05572A;
  --color-cream: #ECE5E5;

  /* Dark surfaces */
  --color-surface-1: #141615;
  --color-surface-2: #1F2120;
  --color-surface-3: #2A2C2B;

  /* Neutral / muted */
  --color-muted: #B9B0B1;
  --color-muted-light: #D1CDCC;

  /* Backgrounds & borders */
  --color-border: #E1E1E1;
  --color-secondary: #F5F5F5;
  --color-background: #FFFFFF;

  /* Semantic */
  --color-foreground: #11110D;
  --color-foreground-muted: #6B7280;
  --color-primary-foreground: #FFFFFF;

  /* Typography */
  --font-family: 'Montserrat', sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --font-size-7xl: 4.5rem;
  --font-size-8xl: 6rem;

  /* Spacing */
  --section-padding: 7rem;
  --container-max: 72rem;
  --container-narrow: 48rem;
  --header-height: 3rem;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;

  /* Shadows */
  --shadow-header: 0 1px 3px rgba(0, 0, 0, 0.08);

  /* Border radius */
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;
}