/* Fundus · Rezept „Coworking und Räume: hell, offen, buchbar“ · tokens.css · Stand 02.11.2026
   Quelle: https://cecodesign.de/lab/fundus/rezepte/coworking-buero-raeume/ · Bauplan: bauplan.txt · Leitfaden: https://cecodesign.de/lab/fundus/leitfaden.txt
   Alle Gestaltung der Seite nutzt nur diese Variablen. Schriftpfade beim Kopieren in ein Projekt anpassen. */

@font-face { font-family: 'Bricolage Grotesque'; src: url('../../../../assets/fonts/bricolage-grotesque-latin-opsz-normal.woff2') format('woff2'); font-weight: 200 800; font-stretch: 75% 100%; font-display: swap; }
@font-face { font-family: 'Azeret Mono'; src: url('../../../../assets/fonts/azeret-mono-latin-wght-normal.woff') format('woff'); font-weight: 100 900; font-display: swap; }

:root {
  /* Schrift */
  --schrift-headline: 'Bricolage Grotesque', system-ui, sans-serif;
  --schrift-text: 'Bricolage Grotesque', system-ui, sans-serif;
  --schrift-akzent: 'Azeret Mono', ui-monospace, monospace;
  /* Größen laut Rezept: h1 Bricolage Grotesque clamp(2.5rem, 1.2rem + 5vw, 5.25rem), opsz 96, wdth 90, wght 700, Laufweite -0.03em, Zeilenhöhe 0.95; Kapitel-H2 clamp(1.75rem, 1.2rem + 2.2vw, 3rem), opsz 48, wght 650. H3 und Gebrauchsüberschriften Bricolage 600, opsz 14, 1.25rem. Fließtext Bricolage Grotesque 1.0625rem (17 px), opsz 14, wght 400, Zeilenhöhe 1.55, höchstens 64ch. Raumcodes, Uhrzeiten, Personenzahlen und Preise Azeret Mono 0.875rem bis 1rem, Versal, +0.06em, Tabellenziffern. Knöpfe Bricolage 600, 1rem. */
  --mass: 64ch;
  --zeilenhoehe-text: 1.55;

  /* Farbe (Prinzip: Hell wie ein Raum mit großen Fenstern: Beton hell als Grund, Kreidegrün als Fläche für Preise und Räume, Graphit für Kapitel, Raumliste und Fuß. Tomatenrot nur für „Tagespass buchen“ und „Raum buchen“. Keine Neonfarben, kein Startup-Lila, keine Glasflächen.) */
  --farbe-grund: #EEEDE8; /* Grund Beton hell */
  --farbe-text: #1A1A18; /* Text (14,9 : 1 auf Grund) */
  --farbe-flaeche: #D7E2D9; /* Fläche Kreidegrün: Preise, Räume, Heute (Text 13,1 : 1) */
  --farbe-dunkel: #232629; /* Dunkel Graphit: Kapitel, Raumliste, Footer (Weiß darauf 15,2 : 1, Beton hell 13,0 : 1) */
  --farbe-signal: #B8361F; /* Signal Tomate: Tagespass buchen, Raum buchen (Weiß darauf 5,9 : 1; als Schrift auf Grund 5,0 : 1) */
  --farbe-leise: #595954; /* Leise: Raumcodes, Stand-Daten (6,0 : 1 auf Grund, 5,3 : 1 auf Kreidegrün) */
  --farbe-linie: #CCCBC7; /* abgeleitet: Haarlinien (nur Dekoration) */
  --farbe-fehler: #B3261E; /* abgeleitet: Fehlermeldungen, 5.6 : 1 auf Grund */

  /* Dauer-Rahmen des Rezepts (gilt vor der Stil-Skala darunter): 250 (Hover, Farbe), 400 (Reiter, Akkordeon, Dialog öffnen), 280 (schließen), 525 (H1-Zeilen einmal), 725 (Geschosse des Hausbilds heben sich einmal), 1100 (Seitenwechsel als fünf Stufen, zurück 740) */
  --dauer-rezept-1: 250ms;
  --dauer-rezept-2: 280ms;
  --dauer-rezept-3: 400ms;
  --dauer-rezept-4: 525ms;
  --dauer-rezept-5: 725ms;
  --dauer-rezept-6: 1100ms;
  /* Bewegung: token-studio-signatur */
  --ease: cubic-bezier(0.625, 0.05, 0, 1);
  --ease-ein: cubic-bezier(0.625, 0.05, 0, 1);
  --ease-aus: cubic-bezier(0.625, 0.05, 0, 1);
  --dauer-xs: 250ms;
  --dauer-s: 400ms;
  --dauer-button: 475ms;
  --dauer-m: 525ms;
  --dauer-l: 725ms;
  --stagger: 40ms;
  --aus-faktor: 0.7; /* Schließen = Öffnen × Faktor */
  /* Wege: Button-Fläche translateY 101 % → 0, Text rollt 100 %, Unterschriften 8 bis 16 px, Bild scale 1.08 → 1 */

  /* Flächen, Bilder, Seitenwechsel (clip-path, Panels, Bänder): Kurve ohne Überschwingen */
  --ease-flaeche: var(--ease-ein);
  --ease-flaeche-aus: var(--ease-aus);
  --dauer-xl: 725ms; /* größte Stufe für große Flächen (= --dauer-gross der Partitur); der Seitenwechsel nimmt --dauer-seitenwechsel */

  /* Bewegungs-Partitur (rezept.bewegung, Stand 05.11.2026): Rollen statt Stufen; gleiche Werte wie oben, nur benannt */
  --dauer-klein: 250ms; /* = --dauer-rezept-1 */
  --dauer-mittel: 400ms; /* = --dauer-rezept-3 */
  --dauer-gross: 725ms; /* = --dauer-rezept-5 */
  --dauer-seitenwechsel: 1100ms; /* = --dauer-rezept-6 */
  --dauer-schliessen: 280ms; /* = --dauer-rezept-2 */
  --dauer-hover-ein: 400ms;
  --dauer-hover-aus: 280ms;
  --ease-ausnahme: cubic-bezier(0.37, 0, 0.63, 1); /* nur: nur die fünf Stufen beim Seitenwechsel (seitenwechsel-wachsende-form, stufe) */
  --ease-stufe: var(--ease-ausnahme); /* Name, den die Partitur beim Laden nennt */
  /* Laden 1: H1 (zwei Zeilen) */
  --dauer-laden-1-ab: 0ms;
  --dauer-laden-1: 525ms;
  --dauer-laden-1-versatz: 40ms;
  /* Laden 2: Geschoss-Scheiben (bild-scheiben-tiefe, waagerecht) */
  --dauer-laden-2-ab: 120ms;
  --dauer-laden-2: 725ms;
  --dauer-laden-2-versatz: 40ms;

  /* Raum (mittel): Offen wie eine Etage: Preise und Raumliste dicht mit Haarlinien, Hero und Haus mit viel Luft. */
  --raum-1: 4px;
  --raum-2: 8px;
  --raum-3: 12px;
  --raum-4: 16px;
  --raum-5: 24px;
  --raum-6: 32px;
  --raum-7: 48px;
  --raum-8: 64px;
  --raum-9: 96px;
  --raum-10: 128px;
  --raum-sektion: clamp(64px, 8vw, 128px);
  /* Raster: Hero 5/7 mit dem Hausbild rechts; Raumliste als Werkliste über 12 Spalten mit Haarlinien (gap-decorations-raster); Preise als drei ungleich breite Spalten. */
  --raster-spalten: 12;
  --raster-rand: clamp(16px, 4vw, 64px);
  --raster-spalt: clamp(16px, 2vw, 32px);
  --raster-max: 1320px;
  /* Form: Knöpfe als Pille, Karten 14 px, Raumliste ohne Kästen. */
  --radius-klein: 6px;
  --radius-gross: 14px;
  --radius-button: 999px;
  --linie-staerke: 1px; /* 1px #1A1A1824 als Haarlinie in Raumliste und Preisen (row-rule); Felder 1px in Leise (3:1) */
  /* Schatten: nur an gehobenen Scheiben (aus bild-scheiben-tiefe) */

  /* Buttons: pfeil-icon-button (Variante kreis-expand), kontur-button-zeichnen (Variante zeichnen) */
  --button-hoehe: 44px; /* Trefferfläche mindestens 44 × 44 px */
  --button-farbe: var(--farbe-signal, currentColor);
  --fokus-ring: 2px solid var(--farbe-text, currentColor); /* außen um den Knopf, Abstand s. u.; auf dunklen Flächen eigene Farbe setzen */
  --fokus-abstand: 3px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --stagger: 0ms; --ui-stagger: 0ms; }
  :root { --dauer-klein: 150ms; --dauer-mittel: 150ms; --dauer-gross: 150ms; --dauer-seitenwechsel: 150ms; --dauer-schliessen: 100ms; --dauer-hover-ein: 150ms; --dauer-hover-aus: 100ms; } /* nur Überblenden, höchstens 150 ms; nie länger als normal */
  /* Partitur reduziert: Hausbild flach mit den Geschossen als Textliste daneben; H1 steht; Knöpfe nur Farbwechsel; Seitenwechsel als Überblendung 150 ms ohne Stufen. */
  /* Reduziert laut Stil: Farbwechsel ohne Bewegung */
}
