/* =============================================================================
   X-SPORT RELAUNCH · VARIANTE 3 "FAMILIE & WERKSTATT"
   tokens.css — Local-Trust/Full-Service-Hypothese. Nachbarschaftsgeschäft mit Kompetenz.
   Signature: durchgängige Trust-Module (Öffnungsstatus, Abhol-Hinweis, Werkstatt-Termin).
   Charakter: warm, ruhig, menschlich. "We are Family!" wörtlich.
   Markenrot #cc0000 = VERIFIZIERT (Logo) — hier nur SPARSAM als CTA-Akzent.
   Sekundärfarbe Teal = eigenständig, differenziert von V1/V2.
   ========================================================================== */

:root {
  /* --- FARBROLLEN (warme helle Basis — Gegenpol zu V1-Labor & V2-Dark) --- */
  --sand:       #F6F2EA;   /* wärmstes Off-White, Seitenhintergrund           */
  --sand-2:     #EFE9DE;   /* alternierende warme Sektion                     */
  --cream:      #FBF9F4;   /* Cards / erhöhte Flächen (heller als Grund)      */
  --paper:      #FFFFFF;   /* reines Weiß für Produktbilder                    */
  --line:       #E4DCCE;   /* warme Haarlinie                                 */
  --line-2:     #D8CFBD;   /* stärkere warme Linie                            */

  --ink:        #2A2620;   /* warmes Dunkelbraun statt Schwarz (Text)         */
  --ink-soft:   #4A4438;   /* Sekundärtext                                    */
  --ink-dim:    #6B6456;   /* Tertiär / Captions (WCAG-geprüft auf sand)      */

  --teal:       #176B5E;   /* Sekundär — Vertrauen/Ruhe (forest-teal)         */
  --teal-600:   #12574C;   /* Hover                                           */
  --teal-tint:  #E3EDE9;   /* teal-Fläche hell                                */

  --signal:     #C41E1E;   /* Marken-Rot — SPARSAM, nur für primäre CTAs      */
  --signal-600: #A81818;   /* Hover                                           */
  --signal-tint:#F7E7E4;

  --amber:      #B8791C;   /* warmer Akzent — nur große UI/Icons              */
  --amber-text: #8A5A10;   /* amber für KLEINEN Text (WCAG ≥4.5 auf warm)     */
  --go:         #2E7D46;   /* Verfügbarkeit (auf hell, WCAG-konform)          */
  --focus:      #1A73C7;   /* Fokus-Ring                                      */

  /* --- TYPOGRAFIE (Serif-Headlines + humanist Sans — differenziert) ----- */
  --font-head:  "Fraunces", Georgia, "Times New Roman", serif;   /* warm serif */
  --font-body:  "Source Sans 3", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

  --fs-hero:    clamp(2.4rem, 1.6rem + 3.2vw, 4rem);   /* Serif-Hero, ruhiger als V2 */
  --fs-h1:      clamp(2rem, 1.5rem + 2vw, 3rem);
  --fs-h2:      clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
  --fs-h3:      clamp(1.25rem, 1.1rem + 0.6vw, 1.6rem);
  --fs-h4:      1.1875rem;
  --fs-lede:    clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --fs-body:    1.125rem;   /* 18px — komfortabel, Plan-Vorgabe                */
  --fs-sm:      1rem;
  --fs-xs:      0.875rem;
  --fs-label:   0.8125rem;

  --lh-head:    1.12;
  --lh-snug:    1.3;
  --lh-body:    1.65;       /* großzügig, ruhig                               */
  --tr-head:    -0.01em;
  --tr-label:   0.08em;
  --measure:    66ch;       /* komfortable Zeilenlänge (Plan: 60–70 ch)       */

  /* --- SPACING (großzügiger Weißraum, Plan) ---------------------------- */
  --s1:.25rem; --s2:.5rem; --s3:.75rem; --s4:1rem; --s5:1.5rem;
  --s6:2rem; --s7:3rem; --s8:4.5rem; --s9:6rem; --s10:8rem;
  --section-y: clamp(3.5rem, 2.5rem + 3.5vw, 6.5rem);

  /* --- LAYOUT (soft 8-col, generöse Margins) --------------------------- */
  --container: 1180px;
  --container-text: var(--measure);
  --gutter: clamp(1rem, 0.6rem + 2vw, 2rem);

  /* --- RADIUS (weich aber zurückhaltend, ≤12px Plan) ------------------- */
  --r-sm:6px; --r-md:10px; --r-lg:12px; --r-xl:12px; --r-pill:999px;

  /* --- ELEVATION (weich, warm getönt) ---------------------------------- */
  --shadow-1: 0 1px 3px rgba(42,38,32,.06), 0 4px 12px rgba(42,38,32,.05);
  --shadow-2: 0 4px 12px rgba(42,38,32,.08), 0 16px 40px rgba(42,38,32,.10);

  /* --- MOTION (minimal, Plan: nur accordion/reveal) -------------------- */
  --dur-fast: 130ms;
  --dur: 240ms;
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-soft: cubic-bezier(.25,.8,.35,1);

  /* --- Z-INDEX --------------------------------------------------------- */
  --z-header:100; --z-overlay:190; --z-drawer:200; --z-consent:300; --z-toast:400;
}