/* Hallmark · pre-emit critique: P5 H4 E4 S4 R4 V5 */
/* Hallmark · macrostructure: Conversational FAQ (H9 hero opener) · H9 knobs: build=Tier-B hand-SVG, animation=none, scale=dominant
 * theme: custom · vibe: "Kindergarten-Poster, warm, taktil, Fuchs" · paper: oklch(96% 0.016 75) · accent: oklch(62.7% 0.159 44)
 * display: Bricolage Grotesque 800 · body: Geist · axes: light / display-heavy / warm · fonts: self-hosted (DSGVO)
 * genre: playful · nav: N7 · footer: Ft8 · enrichment: offizielles Logo (freigestellt) · studied: no · context: user-provided
 * rotation: differs from Letter-build on display style + macrostructure + nav + footer + enrichment
 * contrast: pass (40–41) · slop: pass (42–45) · honest: pass (46) · chrome: pass (47) · tokens: pass (48)
 * responsive: pass (49) · icons: pass (30) · mobile: pass (34, 49, 50–57) — verifiziert bei 320/375/414/768/1280 px
 */

/* Selbst gehostet — kein Google-CDN, keine IP-Übertragung an Dritte (DSGVO)
   Beide Dateien auf Latin gekürzt; Bricolage nur noch 700–800 bei Breite 100 (mehr nutzt die Seite nicht) */
@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('fonts/BricolageGrotesque-var.woff2') format('woff2-variations');
  font-weight: 700 800;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('fonts/Geist-var.woff2') format('woff2-variations');
  font-weight: 100 900;
  font-display: swap;
}

:root {
  /* Farbe — Anker: Fuchs-Orange, warm getönte Neutrale, Poster-Papier */
  --color-paper:       oklch(96%   0.016 75);
  --color-paper-2:     oklch(92.5% 0.020 73);
  --color-rule:        oklch(82%   0.024 65);
  --color-muted:       oklch(45%   0.035 52);
  --color-ink-2:       oklch(34%   0.022 55);
  --color-ink:         oklch(24%   0.024 55);
  --color-accent:      oklch(62.7% 0.159 44);
  --color-accent-deep: oklch(45.4% 0.119 40);
  --color-accent-ink:  oklch(24%   0.024 55); /* Text auf Accent-Fläche — nur für große Typo ≥ 3:1 */
  --color-focus:       oklch(52%   0.19  44);
  --color-whatsapp:    oklch(76.1% 0.201 150);
  --color-whatsapp-dn: oklch(72%   0.19  150);
  --color-photo-paper: oklch(99%   0.005 70); /* Fotopapier/Bildflächen — nie reines Weiß */

  /* Schrift — Bricolage Grotesque (Display) + Geist (Body), beide OFL, selbst gehostet */
  --font-display: 'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif;
  --font-body:    'Geist', ui-sans-serif, system-ui, sans-serif;

  /* Skala — 1.25 (große Terz) ab 16 px */
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.25rem;
  --text-lg:   1.5625rem;
  --text-xl:   1.9531rem;
  --text-2xl:  2.4414rem;
  --text-display: clamp(2.6rem, 4.5vw + 1rem, 4.6rem);

  /* Raum — 4-pt-Skala */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  /* Bewegung — 3 Primitive: Akkordeon-Fade · CTA-Lift · Marquee */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.7, 0, 0.84, 0);
  --dur-micro: 120ms;
  --dur-short: 200ms;

  /* Linien, Schatten, Radien */
  --rule-heavy: 2px solid var(--color-ink);
  --rule-hairline: 1px solid var(--color-rule);
  --shadow-whisper: 0 1px 2px oklch(24% 0.024 55 / 0.08);
  --shadow-drop: drop-shadow(0 1px 2px oklch(24% 0.024 55 / 0.14));
  --radius-soft: 12px;

  --page-gutter: clamp(1.25rem, 5vw, 3.5rem);
  --content-max: 68rem;  /* Breite der zentrierten Inhaltsspalte */
  --text-col:    46rem;  /* Lesespalte innerhalb der Inhaltsspalte */
}