/* =========================================================================
   GERLACH WATCHES – Design Tokens (Single Source of Truth)
   Farben aus der Originalseite gerlach-watches.com: Gold #BC933A als EINZIGER
   Akzent (Primäraktionen, aktive Zustände, Preis-Highlight), Rest neutral.
   Bei Anpassungen: Elementor Global Colors identisch pflegen (eine Quelle).
   ========================================================================= */
:root {
  /* --- Markenfarben (Original-Palette) --- */
  --gw-gold:       #bc933a;  /* Akzent / Primäraktion */
  --gw-gold-dark:  #987934;  /* Hover */
  --gw-gold-deep:  #826528;  /* Active / gedrückt */
  --gw-gold-light: #c09a47;  /* helle Verläufe / dezente Akzente */
  --gw-gold-soft:  #f8f3e8;  /* zarte Gold-Flächen (aktive Pills, Notices) */

  /* --- Neutrale --- */
  --gw-ink:     #101010;  /* Haupttext / Überschriften */
  --gw-ink-2:   #2e2e2e;  /* Sekundär-Überschriften */
  --gw-muted:   #707070;  /* Sekundärtext / Labels */
  --gw-border:  #e4e0d8;  /* Rahmen (warmes Hellgrau) */
  --gw-bg:      #ffffff;  /* Seitenhintergrund */
  --gw-bg-soft: #f8f8f8;  /* Karten / Panels */

  /* --- Status (sparsam einsetzen) --- */
  --gw-danger:       #cf2e2e;
  --gw-danger-soft:  #fdecec;
  --gw-success:      #2e7d46;
  --gw-success-soft: #eaf5ee;
  --gw-warning:      #b8860b;

  /* --- Typografie (Open Sans, lokal via Elementor Custom Fonts) --- */
  --gw-font: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --gw-fs-300: 0.8125rem;  /* 13px */
  --gw-fs-400: 1rem;       /* 16px */
  --gw-fs-500: 1.125rem;   /* 18px */
  --gw-fs-600: 1.375rem;   /* 22px */
  --gw-fs-700: 1.75rem;    /* 28px */
  --gw-fs-800: 2.25rem;    /* 36px */
  --gw-lh: 1.6;
  --gw-weight-normal: 400;
  --gw-weight-medium: 500;
  --gw-weight-semibold: 600;
  --gw-weight-bold: 700;
  --gw-weight-black: 800;

  /* --- Spacing-Skala --- */
  --gw-space-1: 0.25rem;
  --gw-space-2: 0.5rem;
  --gw-space-3: 0.75rem;
  --gw-space-4: 1rem;
  --gw-space-5: 1.5rem;
  --gw-space-6: 2rem;
  --gw-space-7: 3rem;
  --gw-space-8: 4rem;

  /* --- Form & Layout --- */
  --gw-radius:      8px;
  --gw-radius-lg:   14px;
  --gw-radius-pill: 999px;
  --gw-shadow:    0 2px 6px rgba(0, 0, 0, 0.05);
  --gw-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.12);
  --gw-container: 1400px; /* an Elementor-Inhaltsbreite angleichen */
  --gw-gutter: 1.25rem;
  --gw-transition: 0.2s ease;

  /* --- Touch --- */
  --gw-tap: 44px; /* Mindest-Tap-Fläche */
}
