/* ============================================================
   FAILMEZGER WERKSTATT — Design Tokens
   ------------------------------------------------------------
   Single source of truth für Farben, Typografie, Spacing,
   Layout-Konstanten. Jede Entscheidung mit Begründung.
   Aus projekt.md Phase 4 abgeleitet.
   ============================================================ */

:root {
  /* --------------------------------------------------------
     FARBPALETTE — aus dem Material der Werkstatt abgeleitet
     -------------------------------------------------------- */

  /* Grundton: warmes Off-White, vom regionalen Muschelkalk.
     Kein klinisches Weiß, sondern beige-getöntes Papier. */
  --c-kalk:       #F4F1EC;

  /* Eine Spur tiefer für Sektionsboden / sanftes Layering. */
  --c-kalk-deep:  #ECE6DE;

  /* Fast-Schwarz mit Wärme. Nicht reines #000 — würde zu hart
     wirken. Headlines und Tiefe. */
  --c-basalt:     #1C1B19;

  /* Mittlerer Neutralton, weicher als Basalt. Fließtext-Farbe.
     Auf Kalkstein-Grund Kontrast WCAG AA für Body-Text. */
  --c-granit:     #5B5854;

  /* Subtext, Meta-Informationen, Captions. */
  --c-granit-li:  #8A867F;

  /* Sandstein-Ocker hell. Akzentfarbe für dünne Linien,
     Eyebrow-Trenner, Hover-Indikatoren. */
  --c-sand:       #B89070;

  /* Sandstein-Ocker tief. Italic-Akzent in Display-Headlines,
     Hover-Zustand, QR-Code-Module. Markant ohne aufdringlich. */
  --c-sand-deep:  #8B6A4F;

  /* Schiefer-Tiefblau — sehr sparsam für Selektion/Tiefe.
     Niemals als Flächenfarbe (würde ins Bestatter-Klischee
     rutschen). */
  --c-schiefer:   #2A3340;

  /* Trennlinien: dünn, ruhig, im Material-Ton. */
  --c-line:       #D8D1C5;


  /* --------------------------------------------------------
     TYPOGRAFIE
     --------------------------------------------------------
     Display: Fraunces (Variable Serif, Google Fonts).
       Charakter-Serif mit Soft/Wonk-Achsen für lebendige
       Italics. Spiegelt Tradition + Eigensinn — passt zu
       einer 150 Jahre alten Bildhauerwerkstatt.

     Body:    IBM Plex Sans.
       Technisch-präzise Grotesk, hat eigenen Charakter
       (kein Inter-Standard). Passt zur Werkstatt-Mentalität.
     -------------------------------------------------------- */

  --ff-serif: "Fraunces", "Source Serif 4", Georgia, serif;
  --ff-sans:  "IBM Plex Sans", system-ui, -apple-system,
              "Segoe UI", sans-serif;


  /* --------------------------------------------------------
     TYPO-SKALA (fluid, mit clamp)
     -------------------------------------------------------- */
  --fs-meta:    0.75rem;                                       /* 12px Eyebrow */
  --fs-small:   clamp(0.875rem, 0.84rem + 0.18vw, 1rem);       /* 14–16 */
  --fs-body:    clamp(1rem, 0.95rem + 0.22vw, 1.125rem);       /* 16–18 */
  --fs-lead:    clamp(1.125rem, 1.04rem + 0.4vw, 1.375rem);    /* 18–22 */
  --fs-h4:      clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
  --fs-h3:      clamp(1.5rem, 1.25rem + 1.1vw, 2.25rem);
  --fs-h2:      clamp(2rem, 1.5rem + 2.2vw, 3.5rem);
  --fs-h1:      clamp(2.75rem, 1.9rem + 4vw, 6rem);
  --fs-display: clamp(3.5rem, 2.2rem + 6vw, 8rem);


  /* --------------------------------------------------------
     SPACING — großzügig, Editorial
     -------------------------------------------------------- */
  --sp-1:  0.5rem;
  --sp-2:  1rem;
  --sp-3:  1.5rem;
  --sp-4:  2rem;
  --sp-6:  3rem;
  --sp-8:  5rem;
  --sp-12: 8rem;
  --sp-16: 11rem;


  /* --------------------------------------------------------
     LAYOUT
     -------------------------------------------------------- */
  --max-content: 1440px;
  --gutter:      clamp(1.25rem, 0.5rem + 3vw, 3rem);


  /* --------------------------------------------------------
     MOTION
     Eine Werkstatt mit 150 Jahren wackelt nicht — Bewegung
     ist zurückhaltend und nur als sanftes Reveal.
     -------------------------------------------------------- */
  --ease: cubic-bezier(0.2, 0.6, 0.2, 1);
}