/* =====================================================================================
   Bäckerei Halbsechs · Farben, Schrift, Ecken, Abstände
   Brücke zur Web-App: --bg --surface --text --muted --accent --on-accent --border --radius --schrift
   heißen wie in 00_Projektstart/starter-webapp/styles.css.
   Die Seite geht von der Nacht in den Morgen: oben dunkel (--nacht), ab den Preisen hell (--bg).
   Ein Akzent: Kornblumenblau, die Blume zwischen dem Roggen. Brauntöne gibt es nur im Brot selbst
   (Bilder in img/ und die Kruste im Ofen, --kruste-*), nie als Fläche oder Schrift.
   ===================================================================================== */
@font-face {
  font-family: "Epilogue";
  src: url("../fonts/epilogue-var.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --schrift: "Epilogue", "Segoe UI", system-ui, sans-serif;

  /* Tag: ruhige Abschnitte */
  --bg: #ffffff;
  --surface: #f2f4f9;       /* Karten, abgesetzte Flächen */
  --text: #15192a;          /* 17,4 : 1 auf Weiß */
  --muted: #586174;         /* 6,2 : 1 auf Weiß, 5,7 : 1 auf --surface */
  --accent: #3550e0;        /* Kornblume: Knöpfe, Links, Uhrzeiten. Weiß darauf 6,2 : 1 */
  --on-accent: #ffffff;
  --accent-tief: #2639b8;   /* Knopf beim Überfahren, Weiß darauf 8,9 : 1 */
  --accent-hell: #e8ecfd;   /* Hauch Kornblume: Marken, heutiger Tag */
  --border: #dde2ea;
  --error: #b42318;

  /* Nacht: erster Bildschirm, Backstube, Kontakt, Fuß */
  --nacht: #10142b;
  --nacht-2: #171c3a;       /* Karten auf Nacht */
  --nacht-text: #eef0f8;    /* 16,8 : 1 auf --nacht */
  --nacht-leise: #aeb5d0;   /* 8,9 : 1 auf --nacht */
  --nacht-akzent: #aab8ff;  /* Kornblume auf Nacht, 9,6 : 1; als Knopf mit --nacht als Schrift */
  --nacht-linie: rgba(174, 181, 208, .18);

  /* Inhaltsfarben: Ofenlicht und Kruste im Ofen (js/nacht.js mischt sie), kein Schmuck */
  --licht: #ffcf8a;
  --kruste-teig: #e9d2a4;   /* roher Teig */
  --kruste-gold: #cf8d45;   /* halb gebacken */
  --kruste-fertig: #7c3e15; /* kräftig ausgebacken */

  --radius: 22px;
  --radius-gross: 34px;
  --radius-klein: 12px;

  --breite: 1220px;
  --abstand: clamp(80px, 10vw, 140px);
  --kopf: 64px;
}