@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@300;400;500;600;700&display=swap');

:root {
  --color-primary: #5f1e1e;
  --color-primary-dark: #4a1818;
  --color-primary-light: #7a2828;
  --color-secondary: #e8a210;
  --color-secondary-dark: #c78b0d;
  --color-secondary-light: #f4b830;
  --color-white: #ffffff;
  --color-black: #1a1a1a;
  --color-gray-100: #f8f9fa;
  --color-gray-200: #e9ecef;
  --color-gray-300: #dee2e6;
  --color-gray-400: #ced4da;
  --color-gray-500: #adb5bd;
  --color-gray-600: #6c757d;
  --color-gray-700: #495057;
  --color-gray-800: #343a40;
  --color-gray-900: #212529;

  --font-heading: 'Inter', sans-serif;
  --font-body: 'Space Grotesk', sans-serif;

  --container-width: 1200px;
  --container-padding: 20px;
  --radius-sm: 5px;
  --radius-md: 10px;
  --radius-lg: 20px;
  --radius-full: 50px;
  --transition: 0.3s ease;
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.2);
}