/* ==========================================================================
   DESIGN TOKENS
   ========================================================================== */

:root {
  --color-primary:        #111814;
  --color-secondary:      #f4f6f1;
  --color-accent:         #0f7b52;
  --color-accent-light:   #f0c84b;

  --color-success:        #2e6b46;
  --color-warning:        #b5772e;
  --color-danger:         #a3372c;

  --color-bg:             #ffffff;
  --color-surface:        #f4f6f1;
  --color-surface-alt:    #e8ece3;
  --color-border:         #dce2d8;

  --color-text-primary:   #111814;
  --color-text-secondary: #4f5d55;
  --color-muted:          #7b877f;

  --color-dark:           #101714;
  --color-dark-surface:   #18231f;
  --color-white:          #ffffff;

  --font-display: 'Space Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --fs-hero:   clamp(2.75rem, 6vw, 5.5rem);
  --fs-h1:     clamp(2.25rem, 4vw, 3.5rem);
  --fs-h2:     clamp(1.75rem, 3vw, 2.5rem);
  --fs-h3:     1.5rem;
  --fs-body:   1rem;
  --fs-small:  0.875rem;
  --fs-micro:  0.75rem;

  --lh-tight: 1.05;
  --lh-normal: 1.6;

  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  --shadow-soft:  0 10px 32px rgba(17,24,20,0.07);
  --shadow-lift:  0 24px 52px rgba(17,24,20,0.14);
  --shadow-hairline: inset 0 0 0 1px var(--color-border);

  --ease-luxury: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 0.25s;
  --duration-med: 0.5s;
  --duration-slow: 0.9s;

  --container-max: 1320px;
  --header-height: 88px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}