/**
 * colors.css - Farbpalette und Variablen (V2-Vorlage index_v17)
 */
:root {
  --color-orange: #FC4C02;
  --color-orange-hover: #e04402;
  --color-accent: #FC4C02;
  --color-accent-hover: #c93d02;
  --color-text: #46464B;
  --color-background: #FFFFFF;
  --color-anthracite: #46464B;
  --color-turquoise: #5CB8B2;
  --color-yellow: #FEDD00;
  --color-lightblue: #4FC8E9;
  --color-darkred: #9D0051;
  --color-black: #2C2A29;
  --color-white: #FFFFFF;
  --color-gray-10: #f7f7f7;
  --color-gray-20: #D4D4D6;
  --color-gray-50: #8A8A8E;
  --color-orange-gradient-end: #ff6b2c;
  --color-event-gold: #b89a00;
  --color-product-image-gradient-start: #1a2a3a;
  --color-product-image-gradient-end: #0d1b2a;
  --color-table-border: rgba(70, 70, 75, 0.2);
  --color-ai-overview-bg: var(--color-white);
  --color-ai-overview-border: rgba(70, 70, 75, 0.15);
  --color-table-row-bg: var(--color-white);
  --color-table-row-hover: rgba(70, 70, 75, 0.06);
  --shadow-sm: 0 2px 8px rgba(70, 70, 75, 0.08);
  --shadow-md: 0 4px 16px rgba(70, 70, 75, 0.12);
  --shadow-lg: 0 8px 32px rgba(70, 70, 75, 0.16);
  --shadow-hover: 0 12px 40px rgba(70, 70, 75, 0.20);
  --color-search-focus-ring: rgba(252, 76, 2, 0.12);
  --color-hero-badge-gradient-start: rgba(252, 76, 2, 0.1);
  --color-hero-badge-gradient-end: rgba(92, 184, 178, 0.1);
  --color-hero-badge-border: rgba(252, 76, 2, 0.2);
  --hexagon-size: 120px;
  --transition-fast: 0.2s ease;
  --transition-medium: 0.3s ease;
  --transition-slow: 0.5s ease;
}