/* Hands4You — Design-Tokens (FINAL, Marken-Fundament seit 2026-07-14).
   Quelle Farben: website/_clients/grundwerk/ds-bundle/tokens/tokens.css
   (echte Hausfarben, nur gelesen — Hands4You/Grundwerk teilen dieselbe
   Palette, siehe BRIEF.md). Fonts: NEU auf dieses Fundament umgestellt,
   Zilla Slab + Work Sans statt Fraunces + Inter — Fraunces ist die
   reservierte Eigenmarke von Umsatzarchitektur, nicht fuer Kunden nutzbar.
   Stil-Richtung R1/A ("Wortmarke verfeinert", vgl.
   entwurf-rebranding-2026-07/optionen-blatt.html) ist hiermit final. */

:root {
  /* ----------------------------------------------------------------
     FARBEN — warmer, erdiger Baustellen-Ton. Clay ist DER EINE Akzent
     (CTAs, "4" in der Wortmarke, Highlights). Keine zweite Akzentfarbe.
  ---------------------------------------------------------------- */
  --ink:        #17140f; /* Haupt-Hintergrund (fast schwarz, warm) */
  --ink2:       #211c15; /* Panels/Karten auf --ink, leicht angehoben */
  --line:       #38312a; /* Trennlinien, Borders */
  --paper:      #f3efe6; /* Primärtext / Wortmarke auf Dunkel / Druckgrund */
  --sand:       #cbb99b; /* Tertiär-Ton (Trust-Labels, Markenton-Flächen) */
  --dim:        #a89e8d; /* Fließtext gedämpft, Meta-Infos */
  --clay:       #b5703a; /* Akzent — CTAs, "4" in der Wortmarke, Highlights */
  --clay-hell:  #cc8b52; /* Akzent hell — Hover, em-Highlights */

  /* ----------------------------------------------------------------
     TYPOGRAFIE — Zilla Slab (Display/Wortmarke) + Work Sans (Body/UI).
     Ersetzt bewusst Fraunces (UA-Eigenmarke, reserviert) + Inter.
  ---------------------------------------------------------------- */
  --slab: 'Zilla Slab', Georgia, serif;
  --sans: 'Work Sans', -apple-system, Segoe UI, Roboto, sans-serif;

  /* Type-Scale (clamp, responsive) — identisches Raster wie Grundwerk,
     nur die Fonts dahinter sind neu. */
  --fs-h1:      clamp(40px, 6vw, 72px);   /* Hero */
  --fs-h2:      clamp(28px, 4vw, 40px);   /* Section */
  --fs-h3:      26px;                      /* Sparten-Karten-Titel */
  --fs-lead:    18px;                      /* Lede/Intro */
  --fs-body:    16px;                      /* Body */
  --fs-eyebrow: 12px;                      /* Eyebrow/Label */

  --lh-body: 1.6;
  --ls-eyebrow-lg: .3em;  /* Hero-Eyebrow-Tracking */
  --ls-eyebrow-sm: .14em; /* Section-Eyebrow-Tracking */

  --weight-brand: 700; /* Zilla Slab Wortmarke/Hero (700, nicht 600 — robuster, weniger Zierde als Fraunces) */
  --weight-ui:    500; /* Buttons/Labels/Eyebrows (Work Sans 500) */
  --weight-text:  400; /* Body (Work Sans 400) */

  /* ----------------------------------------------------------------
     SPACING & LAYOUT — unverändert aus dem Grundwerk-Fundament.
  ---------------------------------------------------------------- */
  --maxw:      1080px;
  --sp-1:      12px;
  --sp-2:      18px;
  --sp-3:      26px;
  --sp-4:      30px;
  --sp-5:      44px;
  --sp-6:      76px;

  /* ----------------------------------------------------------------
     RADIUS & LINIEN — grosszügige, warme Radien (16–22px bei Karten),
     passend zum handfesten, bodenständigen Ton. Favicon-Kachel folgt
     demselben Idiom (22%).
  ---------------------------------------------------------------- */
  --radius-sm: 3px;   /* Buttons */
  --radius-md: 16px;  /* Projekt-Karten */
  --radius-lg: 18px;  /* Sparten-Karten, Before/After */
  --radius-xl: 22px;  /* Funnel-Box, Favicon-Kachel */

  --border: 1px solid var(--line);
}