/* Ungarische Site — Farbwelt nach dem Entwurf „Puszta & Paprika" (25.09.2026).
   Christoph: „bei ungarn liebe ich die lebendigkeit und farbigkeit". Also kräftige Flächen statt zarter
   Töne: Paprikarot als Akzent, Salbeigrün für die Weite, Maisgelb als Wärme, Tinte für die Schrift.
   Papier ist wärmer als bei den anderen Küchen — Ungarn ist keine stille Küche. */
/* Die Farben der Tiefebene sind warm und trocken. Petrol (#1F3A46) war ein Fehlgriff — ein kühler
   Meeresblauton in einer Landschaft aus Staub, Paprika und getrocknetem Gras (Christoph, 2026-09-26).
   Das Dunkel ist jetzt gerösteter Paprika, das Grün trockenes Puszta-Gras statt kühlem Salbei. */
:root{--papier:#F2E8D4;--papier-hell:#FBF6EA;--tinte:#231C16;--paprika:#9E2D1F;--paprika-dunkel:#6D1D17;
  --lehm:#C65F36;--mais:#E8B950;--salbei:#7C8358;--nacht:#33231B;
  --background:var(--papier);--foreground:var(--tinte);--primary:var(--paprika);--muted-foreground:#6B6459}

body{background:var(--papier);color:var(--tinte)}

/* Die Kopfleiste trägt Farbe, nicht nur eine Linie. */
.topbar{background:rgba(242,232,212,.94);border-bottom:2px solid var(--paprika);backdrop-filter:blur(10px)}
.brand small{color:var(--paprika);letter-spacing:.12em}

/* Schauzeilen und Überschriften dürfen groß und selbstbewusst sein — das ist der Ton der Vorlage. */
.hero h1,.landseite h1{letter-spacing:-1.8px}
.hero h1 em,.landseite h1 em{color:var(--paprika);font-style:italic}
.eyebrow{color:var(--paprika);font:600 11px/1.4 ui-monospace,Consolas,monospace;letter-spacing:.14em}

.hero-tagesrezept .text-link span{color:var(--paprika)}
.daily-card{background:var(--nacht);box-shadow:16px 16px 0 var(--mais)}
.daily-meta{color:var(--mais)}
.card-link span{color:var(--lehm)}

/* Der Streifen „Heute außerdem" bekommt den Salbeiton der Weite als Grund. */
.today-strip{background:var(--salbei);color:var(--papier-hell);border-radius:6px;padding:30px 26px}
.today-strip .eyebrow{color:var(--mais)}
.today-strip h2{color:var(--papier-hell)}
.today-food{background-color:var(--lehm)}

/* Filterknöpfe als kräftige Marken, nicht als blasse Umrisse. */
.categories button[aria-pressed="true"],.categories button.active{background:var(--paprika);
  border-color:var(--paprika);color:var(--papier-hell)}
.mehr-filter{border-radius:2px}
.food{border-radius:2px;border-color:rgba(32,41,35,.16)}
.recipe{background:var(--papier-hell);border-radius:2px}

/* Die Sprachseite: Legende in Maisgelb gebettet, damit sie nicht wie ein Kasten wirkt. */
.legende{background:rgba(232,185,80,.18)}
.hoeren{border-color:rgba(158,45,31,.35);color:var(--paprika)}
.hoeren.spielt{background:var(--paprika);border-color:var(--paprika)}

footer{background:var(--nacht);color:var(--papier-hell);border-top:0}
footer a{color:var(--mais)}
:focus-visible{outline:2px solid var(--paprika);outline-offset:4px}

.zier-sammlung,.zier-heute{--zier-farbe:var(--paprika)}
.kopf-im-bild .topbar .brand small{color:rgba(251,246,234,.8)}

/* Die neuen Bausteine holen ihre Farben von hier — derselbe Baustein sieht in jeder Küche anders aus. */
.aufmacher{--aufmacher-grund:var(--papier-hell);--aufmacher-schrift:var(--tinte);--aufmacher-akzent:var(--paprika)}
.band-dunkel{--band-dunkel:var(--nacht);--band-dunkel-oben:var(--mais);--band-akzent:var(--mais)}
.band-akzent{--band-grund:var(--paprika)}
.band-ruhig{--band-ruhig:rgba(110,128,101,.18)}

/* ---------- Gegen die Kastenwirkung ----------
   Die Seite soll unter dem Kopf weiterleben, nicht in Rechtecke zerfallen. Die Formen kommen aus der
   Landschaft darüber: Hügelkuppen als Kanten, Sonnenscheiben hinter dem Essen. */

/* Der Streifen bekommt eine Kuppe oben links und läuft unten rechts flach aus — wie ein Hügelzug. */
/* Die Kuppe darf die Ueberzeile nicht anschneiden: Der Text rueckt so weit ein, wie die Rundung reicht. */
.today-strip{border-radius:150px 18px 18px 110px / 76px 18px 18px 64px;position:relative;overflow:hidden}
/* Die Kuppe rueckt die Ueberzeile ein - die Kacheln muessen denselben Anschlag haben, sonst stehen
   sie vor der Ueberschrift. */
.today-heading,.today-recipes{padding-left:clamp(0px,4.5vw,64px)}
.today-strip::after{content:"";position:absolute;right:-90px;top:-110px;width:280px;height:280px;
  border-radius:50%;background:rgba(232,185,80,.16);pointer-events:none}

/* Hinter jedem Gericht im Streifen steht eine Scheibe — das Essen sitzt darin statt in einem Kasten. */
/* Das Essen sitzt in einer Scheibe, nicht in einem Kasten — der Hof gehoert zum Bild, darum als
   Schattenring und nicht als eigenes Element: So kann er nicht daneben rutschen. */
.today-food{border-radius:50%;aspect-ratio:1;height:auto;background-size:cover;background-position:center;
  box-shadow:0 0 0 11px rgba(251,246,234,.15)}
.today-recipes>a{padding-top:6px}

/* Das Band schwingt oben ein und unten aus, mit einer Sonne im Rücken. */
.band{border-radius:0 160px 0 160px / 0 80px 0 80px;position:relative;overflow:hidden}
.band::after{content:"";position:absolute;right:6%;top:50%;transform:translateY(-50%);
  width:min(340px,38vw);aspect-ratio:1;border-radius:50%;background:rgba(232,185,80,.12);pointer-events:none}

/* Die Rezeptkarten: das Bild oben abgerundet, die Karte darunter gerade — wie ein Teller auf einem Tuch. */
.recipe{border-radius:14px 14px 4px 4px;overflow:hidden}
.recipe .food{border-radius:14px 14px 0 0;border:0}
.recipe:hover{transform:translateY(-3px);transition:transform .18s}

/* Der Sammlungskopf bekommt einen Bogen statt einer Linie. */
.section-head{border-bottom:0;position:relative;padding-bottom:26px}
.section-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;
  border-bottom:2px solid rgba(158,45,31,.35);border-radius:0 0 60% 60% / 0 0 100% 100%}

@media(max-width:760px){
  .today-strip{border-radius:70px 12px 12px 48px / 44px 12px 12px 30px}
  .band{border-radius:0 70px 0 70px / 0 38px 0 38px}
}

/* Die Angaben unter dem Essen standen dunkel auf Gruen und verschwanden darin. */
.today-recipes small{color:rgba(251,246,234,.72)}
.today-recipes b{color:var(--papier-hell)}

/* Das Tagesrezept war der letzte harte Kasten: Bild links abgerundet, Text rechts auslaufend. */
.tagesrezept{border-radius:120px 14px 14px 14px / 70px 14px 14px 14px;overflow:hidden;
  background:var(--papier-hell)}
.tagesrezept .tagesbild{border-radius:0}
.tagesrezept .tagestext{padding-right:clamp(16px,3vw,44px)}

/* ---------- Gleiche Kanten, ruhiger Rhythmus ----------
   Gemessen am 2026-09-26: Das Band lief 1568 px breit, alles andere 1440 — 64 px links und rechts
   darüber hinaus, und das sieht man. Und zwischen Streifen und Tagesrezept lagen 10 px.
   Alle Blöcke halten jetzt dieselbe Breite und denselben Abstand. */
.band{margin-left:0;margin-right:0;padding-left:clamp(24px,4vw,56px);padding-right:clamp(24px,4vw,56px)}
.today-strip,.tagesrezept,.band{margin-top:0;margin-bottom:clamp(38px,4.6vw,68px)}
.section-head{margin-top:clamp(12px,2vw,26px)}

/* Der Saum des Fensters nimmt die Farbe des Bandes auf. */
.band-fenster{--band-saum:rgba(51,35,27,.6)}