/* ==========================================================================
   Godz Casino – Design-Tokens (CSS Custom Properties)
   Alle Farben, Schriften, Abstände und Formen zentral definiert.
   ========================================================================== */
:root {
  /* ---- Farben ---- */
  --color-bg-primary: #121212;      /* Allgemeiner Seitenhintergrund, Header, Footer */
  --color-bg-dark: #0F1617;         /* Dunkle Karten, Spielsektionen, Panels */
  --color-accent: #009CA9;          /* Aktive Buttons, Plaketten, Badges */
  --color-white: #FFFFFF;           /* Heller Text auf dunklem Grund */
  --color-text: #A4A4A4;            /* Fließtext, Menü, Beschreibungen */
  --color-heading: #F8C64E;         /* H2, Sektionstitel, dekorative Linien */
  --color-btn-text: #FFFFFF;        /* Text in CTA-Buttons */
  --color-card: #181818;            /* Spielkarten, Panels, Content-Blöcke */
  --color-card-2: #0F1617;          /* Sekundärer Kartengrund */
  --color-cool: #394950;            /* Navigationspanels, Tabs, Trenner */

  /* ---- Verläufe / Buttons ---- */
  --btn-primary: linear-gradient(180deg, #09272B 0%, #3E9FAD 50%, #09272B 100%);
  --btn-secondary: linear-gradient(180deg, #0F1617 0%, #688091 51%, #2B313B 100%);

  /* ---- Typografie ---- */
  --font-main: 'Cabin', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Cabin', system-ui, sans-serif; /* dekorative Titel */
  --fs-base: clamp(0.95rem, 1.4vw, 1rem);         /* 14–16px */
  --fs-h1: clamp(2.125rem, 5vw, 2.875rem);        /* 34–46px */
  --fs-h2: clamp(1.625rem, 3.4vw, 2.125rem);      /* 26–34px */
  --fs-h3: clamp(1.25rem, 2.2vw, 1.5rem);         /* 20–24px */
  --lh-base: 1.6;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* ---- Abstände ---- */
  --space-section: clamp(2.5rem, 5vw, 3.75rem);   /* 40–60px zwischen Sektionen */
  --space-card-gap: 1.25rem;                      /* 20px zwischen Karten */
  --space-paragraph: 1.25rem;                     /* 20px zwischen Absätzen */
  --space-h2-text: 1.25rem;                       /* 20px H2 → Text */
  --space-h3-text: 1rem;                          /* 16px H3 → Text */
  --space-faq: 0.875rem;                          /* ~14px zwischen FAQ-Items */
  --pad-card: 1.5rem;                             /* 24px Innenabstand Karten */
  --container-max: 1440px;

  /* ---- Form: kein Radius, abgeschrägte Ecke ---- */
  --radius: 0;
  --clip-corner: polygon(100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 0);

  /* ---- Übergänge ---- */
  --transition: 0.25s ease;

  /* ---- Schatten ---- */
  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.35);
}