/* ══════════════════════════════════════════════════════════════════════════
   Zimmerei Gerber — Gestaltungstokens

   Auftrag (16.10.2026): schlicht schwarz-weiß, eckig, traditionell. Das Logo
   des Betriebs ist selbst reines Schwarz-Weiß (rundes Siegel mit Zunft-
   zeichen); die Fotos werden in Graustufen ausgeliefert (bilder.py).

   Zwei Regeln, die pruefen.py am CSS nachprüft:
     1. Keine Rundungen: kein border-radius über 0, kein rx/ry.
     2. Keine Farbe: jede Farbangabe ist ein Grauton (R = G = B). Einzige
        Ausnahme sind die gelben Platzhalter-Marken der Aufbauphase
        (--offen-*), die beim Livegang verschwinden.

   Kontraste (WCAG, gerechnet 16.10.2026):
     Schwarz  #0b0b0b auf Weiß ......... 19,7:1
     --grau-600 #555 auf Weiß .......... 7,5:1   (leiser Text auf hell)
     --grau-600 auf --grau-50 #f4f4f4 .. 6,8:1
     --grau-300 #b3b3b3 auf Schwarz .... 9,4:1   (leiser Text auf dunkel)
     --grau-400 #8c8c8c ............... nur Schmuck, nie Text (3,4:1 auf Weiß)

   Schrift: EINE Familie, lokal — keine Google Fonts (das übertrüge die
   IP-Adresse). Helvena (Zippie Letras), vom Auftraggeber geliefert:
     400 Fließtext · 600 Etiketten, Navigation, Zwischentitel ·
     800 Überschriften. Zuschnitt: _generator/schrift.py.
   Seit 22.10.2026 [Auftrag „sämtliche Serifenschriften durch eine moderne
   serifenlose Schrift ersetzen"]; vorher Source Serif 4 im Fließtext.
   Helvena hat KEINE Kapitälchen: Etiketten sind Versalien mit Sperrung
   (uppercase + letter-spacing), nie font-variant-caps.
   ══════════════════════════════════════════════════════════════════════════ */

/* Drei Schnitte, je genau ein Gewicht — keine erfundenen Spannen. Weitere
   Gewichte (500, 700) gibt es hier nicht; der Browser nähme den nächsten. */
@font-face {
  font-family: 'Helvena';
  src: url('../fonts/helvena-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Helvena';
  src: url('../fonts/helvena-semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Helvena';
  src: url('../fonts/helvena-extrabold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Farbwelt: Schwarz, Weiß, Grau ───────────────────────────────────── */
  --schwarz: #0b0b0b;
  --schwarz-800: #161616;    /* Flächen auf Schwarz */
  --grau-700: #333333;       /* Linien auf Schwarz */
  --grau-600: #555555;       /* leiser Text auf hell */
  --grau-400: #8c8c8c;       /* Schmucklinien */
  --grau-300: #b3b3b3;       /* leiser Text auf dunkel */
  --grau-200: #d4d4d4;       /* Linien auf hell */
  --grau-100: #e8e8e8;
  --grau-50: #f4f4f4;        /* helles Band (Referenzen) */
  --weiss: #ffffff;

  /* ── Rollen ──────────────────────────────────────────────────────────── */
  --grund: var(--weiss);
  --text: var(--schwarz);
  --text-leise: var(--grau-600);
  --linie: var(--grau-200);
  --fokus: var(--schwarz);

  /* Platzhalter-Marken (nur in der Aufbauphase sichtbar) — einzige Farbe */
  --offen-grund: #ffe9a8;
  --offen-text: #5c3b00;
  --offen-kasten: #fff8e1;
  --offen-rand: #c9a13b;

  /* ── Schrift ─────────────────────────────────────────────────────────── */
  /* Ausweichschriften serifenlos wie Helvena, damit die Seite während des
     Ladens nicht die Anmutung wechselt. */
  --schrift: 'Helvena', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --gr-text: 1.0625rem;                                     /* 17 px — Helvena hat eine hohe x-Höhe */
  --gr-etikett: 0.8125rem;                                  /* 13 px Versalien, gesperrt */
  --gr-klein: 0.9375rem;
  --gr-hero: clamp(3rem, 1.55rem + 5.4vw, 7rem);
  --gr-h1: clamp(2.375rem, 1.6rem + 3vw, 4rem);
  --gr-h2: clamp(2.125rem, 1.45rem + 2.6vw, 3.625rem);
  --gr-h3: clamp(1.3125rem, 1.17rem + 0.55vw, 1.625rem);

  /* ── Maße ────────────────────────────────────────────────────────────── */
  --inhalt-breite: 76rem;                                   /* 1216 px */
  --rand: clamp(1.25rem, 5vw, 3rem);
  --band-abstand: clamp(4.5rem, 3rem + 5.5vw, 9rem);
  --kopf-hoehe: 5rem;
  --balken: 2px;             /* Linienstärke der „Balken" (Raster, Rahmen) */
  --dauer: 0.22s;
}