/* ============================================================
   theme.css — ZENTRALE SCHALTZENTRALE (Day-to-Night)
   Hell = Standard (:root). Dunkel = [data-theme="dark"] je Sektion.
   Bilder, Farben, Schrift, Abstände an EINER Stelle steuerbar.
   ============================================================ */

:root {
  /* ---------- FARBEN – HELL (Standard) ---------- */
  --bg:            #F7F2EA;   /* warmes Elfenbein */
  --surface:       #FFFFFF;
  --surface-2:     #F1E9DB;
  --line:          #E6DDCC;

  --text:          #1C1622;   /* tiefe Tinte */
  --text-muted:    #5B5566;
  --text-dim:      #8A8296;

  --gold:          #9A6B22;   /* Gold – auf Hell gut lesbar */
  --gold-bright:   #C9A24B;
  --accent-2:      #6E4FA0;   /* gedämpftes Plum (kein Neon) */
  --on-accent:     #FFFFFF;   /* Text auf Akzent-Buttons */

  --grad-accent:   linear-gradient(100deg, var(--gold), var(--accent-2));
  --glow:          radial-gradient(60% 60% at 50% 0%, rgba(201,162,75,.20), transparent 70%);

  /* ---------- SCHRIFT ---------- */
  --font-body: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: var(--font-body);
  --fw-regular:400; --fw-medium:500; --fw-semi:600; --fw-bold:700; --fw-black:800;

  --step--1: clamp(0.83rem, 0.79rem + 0.2vw, 0.94rem);
  --step-0:  clamp(1rem,    0.95rem + 0.25vw, 1.13rem);
  --step-1:  clamp(1.2rem,  1.1rem  + 0.5vw,  1.5rem);
  --step-2:  clamp(1.5rem,  1.3rem  + 1vw,    2.1rem);
  --step-3:  clamp(2rem,    1.6rem  + 2vw,    3rem);
  --step-4:  clamp(2.6rem,  1.9rem  + 3.4vw,  4.6rem);

  /* ---------- LAYOUT / RHYTHMUS ---------- */
  --container:1200px; --container-narrow:760px;
  --gutter: clamp(20px, 5vw, 40px);
  --section-pad: clamp(64px, 9vw, 130px);
  --radius:18px; --radius-sm:12px; --radius-pill:999px;

  --shadow:      0 24px 60px -28px rgba(28,22,34,.28);
  --shadow-gold: 0 20px 50px -22px rgba(154,107,34,.35);
  --transition:  .35s cubic-bezier(.2,.7,.2,1);

  /* ---------- BILDER (zentral austauschbar) ---------- */
  --hero-image:          url("/assets/img/dj-tim-fayne-event-saarland.webp");
  --img-event:           url("/assets/img/event-party-dj-saarland.webp");
  --img-mixing:          url("/assets/img/dj-live-mixing-tim-fayne.webp");
  --img-hochzeit:        url("/assets/img/hochzeits-dj-saarland.webp");   /* helles Hochzeitsbild (folgt) */
  --img-fotobox:         url("/assets/img/fotobox-mieten-saarland.webp");  /* Fotobox (Arbeitsname) */
  --img-kontakt:         url("/assets/img/dj-tim-fayne-kontakt-saarland.webp");  /* Kontakt-Kopfbild */
  --img-fotobox-hero:    url("/assets/img/fotobox-mieten-saarland-tim-fayne.webp");  /* Fotobox-Kopfbild */
  --img-preise:          url("/assets/img/dj-event-saarland-tim-fayne.webp");  /* DJ-Hub-Kopfbild */
  --img-geburtstag:      url("/assets/img/geburtstag-dj-saarland-tim-fayne.webp");  /* Geburtstag-Kopfbild */
  --img-portrait:        url("/assets/img/dj-tim-fayne-portrait-saarland.webp");  /* Portrait Kontaktseite */
  --img-ueber:           url("/assets/img/dj-tim-fayne-ueber-mich-saarland.webp");  /* Über-mich Kopfbild */
  --img-liveset:         url("/assets/img/dj-tim-fayne-live-set-saarland.webp");  /* Tim im DJ-Einsatz */
  --img-musik:           url("/assets/img/dj-musik-stil-saarland-tim-fayne.webp");  /* Musik-&-DJ-Stil Kopfbild */
  --og-image:            "/assets/img/dj-fotobox-tim-fayne.webp";
  --ortsseiten-kopfbild: url("/assets/img/ortsseiten-header.webp");
}

/* ---------- FARBEN – DUNKEL (Sektions-Theme) ---------- */
[data-theme="dark"]{
  --bg:         #0F1420;   /* Anthrazit / tiefes Blau-Schwarz */
  --surface:    #161D2B;
  --surface-2:  #1C2536;
  --line:       #2A3446;

  --text:       #F4F1EA;
  --text-muted: #AEB4C2;
  --text-dim:   #7F8798;

  --gold:       #E7C079;   /* Champagner-Gold – leuchtet auf Dunkel */
  --gold-bright:#E7C079;
  --accent-2:   #9F7BD6;

  --glow:       radial-gradient(60% 60% at 50% 0%, rgba(231,192,121,.16), transparent 70%);
  --shadow:     0 24px 60px -24px rgba(0,0,0,.7);

  background: var(--bg);
  color: var(--text);
}