:root {
  --primary: #dd9332;
  --primary-dark: #a3631b;
  --secondary: #86c3df;
  --accent: #3ca8b8;
  --dark: #1c1c1b;
  --dark-light: #333333;
  --white: #ffffff;


  --gray-50: #fafafa;
  --gray-100: #f0f2f5;
  --gray-200: #e0e4ea;
  --gray-300: #c7d1d9;
  --gray-400: #9db0bf;
  --gray-500: #748799;
  --gray-600: #5a6b7a;
  --gray-700: #404c59;
  --gray-800: #2a333d;
  --gray-900: #1b2229;

  --spacing-xs: 5px;
  --spacing-sm: 10px;
  --spacing-md: 15px;
  --spacing-lg: 20px;
  --spacing-xl: 25px;
  --spacing-2xl: 30px;
  --spacing-3xl: 40px;
  --spacing-4xl: 60px;

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 28px;
  --font-size-4xl: 36px;

  --radius: 30px;
  --radius-sm: calc(var(--radius) - 10px);
  --radius-lg: calc(var(--radius) + 10px);
  --radius-full: 9999px;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 15px 35px rgba(0, 0, 0, 0.18);

  --transition-fast: all 0.1s ease;
  --transition-normal: all 0.2s ease;
  --transition-slow: all 0.3s ease;

  --z-back: -1;
  --z-normal: 1;
  --z-header: 100;
  --z-overlay: 200;
  --z-modal: 300;
  --z-popover: 400;
  --z-tooltip: 500;

  --container-width: 1200px;
  --container-padding: var(--spacing-lg);
}