/* ═══════════════════════════════════════════════════
   ANPASSUNGEN FÜR LAIEN — hier Farben & Abstände ändern
   Dunkles Premium-Theme, abgestimmt auf das Chrom-Group-Logo
   (Chrom-Silber + Feuer-Orange auf tiefem Schwarz)
   ═══════════════════════════════════════════════════ */

:root {
  /* Akzent: Logo-Orange inkl. Verlaufsstufen für Glanz/Glow */
  --color-accent: #ff7a1a;
  --color-accent-hover: #ff9640;
  --color-accent-2: #ffb347;
  --color-accent-soft: rgba(255, 122, 26, 0.16);
  --color-accent-glow: rgba(255, 122, 26, 0.45);

  /* Chrom/Silber-Ton für Überschriften & Metall-Optik */
  --color-chrome-1: #ffffff;
  --color-chrome-2: #c9cfd8;
  --color-chrome-3: #7d8492;

  /* Flächen: tiefes Schwarz mit warmem Unterton wie im Logo-Hintergrund */
  --color-bg: #08090b;
  --color-surface: #16181d;
  --color-surface-2: #1e2127;
  --color-surface-3: #262a32;
  --color-border: #2d313a;
  --color-border-strong: #3a3f4a;

  --color-text: #f3f4f6;
  --color-text-muted: #a7adb8;
  --color-text-light: #767c88;

  --color-open: #22c55e;
  --color-open-bg: rgba(34, 197, 94, 0.14);
  --color-closed: #ef4444;
  --color-closed-bg: rgba(239, 68, 68, 0.14);

  --font-display: "Bebas Neue", sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-size-base: 16px;
  --container-max: 1280px;
  --header-height: 96px;
  --mobile-bar-height: 72px;
  --scroll-gap: 12px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  /* Schatten: dunkel + orangener Glanz für Premium-Look */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 10px 32px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.6);
  --glow-accent: 0 0 0 1px rgba(255, 122, 26, 0.25), 0 8px 28px rgba(255, 122, 26, 0.22);
  --glow-accent-strong: 0 0 24px rgba(255, 122, 26, 0.55), 0 0 60px rgba(255, 122, 26, 0.18);

  --transition: 0.2s ease;
}