/* BITEZZA · Feinschliff der Glut-Sprache. Bestehende Schriften, scharfe Kanten,
   rote Handlungen und Gold aus dem Logo. Keine neuen Bibliotheken. */
:root{--gold:#f3cd68;--bon-grund:#17130f;--detail:#b9aa99;--bon-linie:#493d2d}
.detail-label{display:block;margin-bottom:.6rem;font-size:.68rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gold)}
/* Der Einstieg: Typografie und Essen teilen sich eine Bühne. */
.ist-start .hero{min-height:min(960px,100svh);padding-top:calc(var(--kopf-h) + 2.3rem);padding-bottom:1.6rem;background:var(--nacht-tief)}
.hero-buehne{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,1fr);grid-template-areas:'kicker motiv' 'titel motiv' 'text motiv' 'tat motiv';align-items:center;column-gap:1.4rem;flex:1;max-width:1600px;width:100%;margin:auto}
.hero-kicker{grid-area:kicker;align-self:end;font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);padding-bottom:1.6rem}
.hero-kicker span{margin:0 .75rem;color:var(--asche)}
.ist-start .hero-typo{grid-area:titel;margin:0;font-size:clamp(2.5rem,6.25vw,7rem);line-height:.94;letter-spacing:-.025em;align-self:start}
.ist-start .hero-text{grid-area:text;max-width:44ch;margin:1.2rem 0 1.1rem;font-size:clamp(.94rem,1.12vw,1.04rem);line-height:1.65;color:var(--detail)}
.ist-start .hero-tat{grid-area:tat;align-self:start;gap:.75rem}
.hero-tat .knopf{min-height:54px;padding-inline:1.2rem}
.hero-tat .knopf span{margin-left:1.3rem;font-family:Satoshi,sans-serif;font-size:1.15rem}
.hero-motiv{grid-area:motiv;position:relative;align-self:center;min-width:0;margin:0 -3rem 0 -1rem;padding-block:3rem;isolation:isolate}
.hero-motiv::before{content:'';position:absolute;inset:10% 4%;z-index:-1;border:1px solid var(--bon-linie);border-radius:50%;transform:rotate(-18deg) scaleY(.83);opacity:.7}
.hero-motiv img{width:100%;height:auto;max-width:800px;mix-blend-mode:lighten;mask-image:radial-gradient(ellipse 68% 68% at 50% 50%,#000 50%,transparent 92%);-webkit-mask-image:radial-gradient(ellipse 68% 68% at 50% 50%,#000 50%,transparent 92%)}
.hero-motiv figcaption{margin:1rem 0 0 15%;padding-left:1rem;border-left:2px solid var(--gold);font-size:.8rem;line-height:1.65;color:var(--detail)}
.hero-motiv figcaption span{display:block;font-family:Kanit,sans-serif;font-size:1.08rem;font-weight:700;color:var(--papier)}
.ist-start .hero-fuss{max-width:1600px;width:100%;margin:2rem auto 0;grid-template-columns:1fr 1.5fr auto;gap:1.4rem;padding-top:1.2rem;align-items:start;color:var(--detail);font-size:.76rem}
.hero-fuss .detail-label{margin-bottom:.35rem;font-size:.6rem}
.hero-fuss a{color:var(--papier);display:inline-block;min-height:24px}
.hero-fuss a:hover{color:var(--gold)}
.hero-sortiment{align-self:center;white-space:nowrap;letter-spacing:.12em;text-transform:uppercase;font-size:.67rem}
.hero-sortiment span{margin:0 .4rem;color:var(--gold)}
.ist-start .glut{left:76%;bottom:-70vh;opacity:.42}
/* Die Standortkarte liegt als Grafik bei uns; der externe Dienst öffnet erst nach Klick. */
.standort-karte{position:relative;margin-bottom:2.8rem;overflow:hidden;border:1px solid var(--bon-linie);background:#131410;min-height:350px}
.standort-karte>img{width:100%;height:420px;object-fit:cover;object-position:center}
.standort-adresse{position:absolute;left:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:39%;padding:clamp(1.4rem,3vw,3rem);background:linear-gradient(90deg,#131410 72%,transparent)}
.standort-adresse strong{font-family:Kanit,sans-serif;font-size:clamp(1.7rem,3.2vw,3.1rem);font-weight:900;text-transform:uppercase;line-height:1.02;margin:.6rem 0 1rem}
.standort-adresse>span:not(.detail-label){font-size:.78rem;color:var(--detail)}
.standort-adresse .knopf{margin-top:1.4rem;font-size:.76rem;min-height:48px}
.karten-quelle{position:absolute;bottom:.55rem;right:.8rem;font-size:.62rem;color:var(--detail);background:#131410;padding:.25rem .4rem}
.finden-block{min-width:0}.finden-text{overflow-wrap:anywhere}
.finden-titel{color:var(--gold);font-size:.76rem;letter-spacing:.14em;margin-bottom:1rem}
/* Karte, Auswahl und Bon: dieselbe Lesereihenfolge vom ersten Klick bis zur Kasse. */
.ist-bestellen .best-seite{max-width:1600px;margin-inline:auto;padding-top:2.5rem}
.best-kopf .titel{font-size:clamp(2.45rem,5.2vw,4.9rem);line-height:.98}
.best-kopf .detail-label{margin-bottom:.85rem}
.schritte{gap:1.6rem;color:var(--detail);margin-bottom:2rem}
.schritt span{width:1.8rem;height:1.8rem}
.schritt.jetzt span{background:var(--gold);border-color:var(--gold)}
.schritt.fertig span{border-color:var(--gold);color:var(--gold)}
.art-inhalt{position:relative;padding:1.2rem 3rem 1.2rem 1.2rem;height:100%;background:var(--bon-grund)}
.art-inhalt::after,.zahl-inhalt::after{content:'';position:absolute;right:1.1rem;top:1.3rem;width:14px;height:14px;border:1px solid var(--detail);border-radius:50%}
.art-feld input:checked+.art-inhalt,.zahl-feld input:checked+.zahl-inhalt{border-color:var(--gold);background:#211b11}
.art-feld input:checked+.art-inhalt::after,.zahl-feld input:checked+.zahl-inhalt::after{border:4px solid var(--gold);background:var(--nacht)}
.art-inhalt em,.zahl-inhalt em{color:var(--detail)}
.suche-feld input{min-height:54px;background:var(--bon-grund);border-color:var(--bon-linie)}
.g-karte{border-color:var(--bon-linie);background:var(--bon-grund)}
.g-name{font-size:1.1rem}.g-text{color:var(--detail)}
.g-knopf{min-width:44px;min-height:44px}.g-leiste{gap:.5rem}
.korb,.uebersicht{background:var(--bon-grund);border:1px solid var(--bon-linie);border-top:3px solid var(--gold);padding:1.6rem 1.3rem}
.korb-titel,.uebersicht-titel{font-size:1.16rem;margin-bottom:1.4rem}
.korb-liste,.u-liste{gap:1rem}.korb-leer{line-height:1.8;color:var(--papier)}
.korb-leer span{color:var(--detail);font-size:.8rem}.korb-zusatz,.u-zusatz{color:var(--detail)}
.korb-summe,.u-summe{border-top:1px dashed var(--bon-linie);padding-top:1.1rem}
.u-gesamt{font-size:1.35rem;color:var(--gold)}
.u-weg{width:44px;height:44px;color:var(--papier-leise)}
.u-zeile{grid-template-columns:auto minmax(0,1fr) auto 44px;gap:.5rem}
.u-art{color:var(--detail)}
.ist-kasse .kasse-raster{grid-template-columns:minmax(0,1fr) minmax(0,.75fr);gap:clamp(2rem,5vw,5.5rem)}
.ist-kasse .formular{margin:0;max-width:none;min-width:0}
.form-abschnitt{margin:0 0 2.2rem;min-width:0}
.form-abschnitt legend{font-family:Kanit,sans-serif;font-weight:700;font-size:1.13rem;margin-bottom:1.4rem;line-height:1.3}
.form-abschnitt legend span{font-family:Satoshi,sans-serif;font-size:.68rem;color:var(--gold);padding-right:.7rem}
.form-raster{gap:1.2rem}.feld>span{color:var(--detail);letter-spacing:.025em;text-transform:none;font-size:.82rem}
.feld input,.feld textarea{background:var(--bon-grund);border-color:var(--bon-linie);padding:.9rem 1rem;min-height:52px;font-size:1rem}
.feld input::placeholder,.feld textarea::placeholder{color:var(--detail);opacity:.7}
.feld input:focus-visible,.feld textarea:focus-visible,.suche-feld input:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-color:var(--gold)}
.feld small{display:block;margin-top:.4rem;color:var(--detail);font-size:.73rem}
.feld em{font-style:normal;font-size:.7rem;color:var(--asche);padding-left:.5rem}
.bestell-notiz{margin-bottom:2.2rem}
.zahlwahl{padding-top:1.3rem;margin-bottom:1.7rem;border-top:1px solid var(--bon-linie);gap:.8rem}
.zahlwahl legend{padding-right:1rem;font-family:Kanit,sans-serif;font-size:1.13rem;font-weight:700;letter-spacing:0;text-transform:none;color:var(--papier)}
.zahl-inhalt{position:relative;padding:1.15rem 2.8rem 1.15rem 1.1rem;border-color:var(--bon-linie)}
.zustimmung{line-height:1.65;color:var(--detail);font-size:.82rem;margin-bottom:1.5rem}
.formular .knopf-voll{min-height:56px}.knopf:disabled{cursor:wait;opacity:.65}
.kasse-leer{text-align:left;padding:3rem 1.8rem;border:1px solid var(--bon-linie);background:var(--bon-grund)}
.kasse-leer p{font-family:Kanit,sans-serif;font-size:1.8rem;font-weight:700;color:var(--papier)}
/* Die Spur: Status links, Bon rechts; auf kleinen Geräten folgt der Bon direkt. */
.ist-verfolgen .seite{max-width:1160px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:1.5rem 3.5rem;padding-top:3.5rem;padding-bottom:3.5rem;align-items:start;min-height:70svh}
.ist-verfolgen .kopf{height:4.4rem}.ist-verfolgen .kopf-logo{height:2.63rem}
.ist-verfolgen .spur{grid-column:1/-1;grid-template-columns:minmax(0,1fr);gap:1rem;padding:1rem 0 2rem;justify-content:stretch;border:0}
.ist-verfolgen.hat-bestellung .spur{grid-column:1;grid-template-columns:minmax(0,1fr) 38px;gap:2rem}
.ist-verfolgen .spur-text{grid-column:1;grid-row:1;min-width:0}
.ist-verfolgen .spiess{grid-column:2;grid-row:1;width:32px;min-height:14rem;height:60%;align-self:center}
.ist-verfolgen .nummer-schild{color:var(--gold);font-size:.7rem;letter-spacing:.16em;margin-bottom:.9rem}
.ist-verfolgen .nummer{font-size:clamp(4.6rem,8vw,6.4rem);color:var(--papier);background:none;margin-bottom:1.4rem}
.ist-verfolgen .lage{font-size:clamp(2.2rem,3.7vw,3rem);line-height:1.05;margin-bottom:1rem;text-wrap:balance}
.ist-verfolgen .zeit{font-size:1rem;margin:0 0 .8rem;color:var(--papier-leise)}
.ist-verfolgen .zeit b{color:var(--gold);font-size:1.3rem}
.stand-hinweis{color:var(--detail);font-size:.88rem;line-height:1.7;max-width:46ch}
.live-takt{margin-top:.9rem;color:var(--detail);font-size:.68rem;line-height:1.5;padding-left:.8rem;border-left:2px solid var(--gold)}
.ist-verfolgen .stufen{margin-top:1.8rem;gap:.2rem}
.ist-verfolgen .stufe{color:var(--detail);font-size:.83rem;padding:.65rem 0}
.ist-verfolgen .stufe.jetzt{color:var(--gold)}
.ist-verfolgen .stufe-punkt{border-radius:50%;width:.7rem;height:.7rem}
.ist-verfolgen .stufe.durch .stufe-punkt{background:var(--gold);border-color:var(--gold)}
.ist-verfolgen .bon{grid-column:2;margin-top:1rem;padding:1.8rem 1.6rem;border:1px solid var(--bon-linie);border-top:3px solid var(--gold);background:var(--bon-grund);min-width:0}
.ist-verfolgen .bon-titel{color:var(--papier);font-family:Kanit,sans-serif;font-size:1.15rem;font-weight:700;letter-spacing:0}
.ist-verfolgen .posten{grid-template-columns:1.6rem minmax(0,1fr) auto;font-size:.87rem;gap:.35rem .55rem}
.ist-verfolgen .posten-name{overflow-wrap:anywhere}.ist-verfolgen .posten-menge{color:var(--gold)}
.ist-verfolgen .posten-wahl,.ist-verfolgen .bon-hinweis{color:var(--detail);font-size:.75rem}
.ist-verfolgen .bon-summen .gross{color:var(--gold);font-size:1.4rem}
.ist-verfolgen .hilfe{grid-column:1/-1;border-top:1px solid var(--bon-linie);margin-top:1rem;padding-top:1.5rem}
.ist-verfolgen .hilfe b{color:var(--papier);font-weight:700}
.vorschau-hinweis{grid-column:1/-1;font-size:.73rem;color:var(--gold);padding:.65rem 1rem;border:1px dashed var(--bon-linie)}
/* Bestellannahme gesperrt (Dashboard-Schalter) */
.annahme-banner{margin:0 0 1.2rem;padding:.9rem 1.1rem;border:1px solid var(--gold);background:rgba(243,205,104,.08);color:var(--gold);font-size:.88rem;line-height:1.5}
body.annahme-zu .kasse-absenden,body.annahme-zu .best-fuss .knopf-voll{opacity:.55}
@media(min-width:980px){.ist-kasse .uebersicht-spalte .korb-klebt{position:sticky;top:calc(var(--kopf-h) + 1.5rem)}}
@media(max-width:979px){.ist-kasse .kasse-raster{grid-template-columns:minmax(0,1fr)}.ist-kasse .uebersicht-spalte{order:1}.ist-kasse .formular{order:2}.ist-verfolgen .seite{gap:1.5rem;grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}.ist-verfolgen.hat-bestellung .spur{grid-template-columns:minmax(0,1fr)}.ist-verfolgen .spiess{display:none}.ist-verfolgen .bon{padding:1.4rem 1.1rem}.ist-verfolgen .lage{font-size:2.2rem}}
@media(max-width:700px){
  .ist-start .hero{min-height:0;padding-top:calc(var(--kopf-h) + 1.5rem);padding-bottom:2rem}
  .hero-buehne{grid-template-columns:minmax(0,1fr);grid-template-areas:'kicker' 'titel' 'motiv' 'text' 'tat';gap:0}
  .hero-kicker{padding-bottom:1.1rem;font-size:.63rem}
  .ist-start .hero-typo{font-size:clamp(2.2rem,10.4vw,4.3rem);line-height:.96}
  .hero-motiv{margin:-.5rem -.8rem 0;padding:.8rem 0 0;max-width:540px;justify-self:center}
  .hero-motiv img{max-height:240px;object-fit:contain}.hero-motiv::before{inset:2% 8% 8%}
  .hero-motiv figcaption{display:none}
  .ist-start .hero-text{margin:1rem 0;font-size:.89rem;line-height:1.6;max-width:42ch}
  .hero-tat .knopf{padding-inline:.8rem;font-size:.78rem;flex:1 1 auto}.hero-tat .knopf span{margin-left:.5rem}
  .ist-start .hero-fuss{grid-template-columns:minmax(0,1fr);gap:.7rem;margin-top:1.6rem;font-size:.71rem}.hero-fuss .detail-label{display:none}.hero-sortiment{display:none}
  .standort-karte>img{height:300px;object-fit:cover;object-position:65% center}
  .standort-adresse{position:relative;width:100%;padding:1.4rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem;background:var(--bon-grund);border-top:1px solid var(--bon-linie)}
  .standort-adresse .detail-label{grid-column:1/-1;margin:0}.standort-adresse strong{margin:0;font-size:1.7rem}.standort-adresse>span:not(.detail-label){grid-column:1/-1;font-size:.75rem}.standort-adresse .knopf{grid-column:2;grid-row:2;margin:0;align-self:center;padding-inline:.8rem}.karten-quelle{top:270px;bottom:auto;font-size:.58rem}
  .ist-bestellen .best-seite{padding-top:1.6rem}.schritte{gap:.9rem;font-size:.65rem;letter-spacing:.02em}.schritt{gap:.4rem}.schritt span{width:1.5rem;height:1.5rem}
  .art-oben .art-inhalt{padding:1rem 1.9rem 1rem .85rem}.art-inhalt::after{right:.65rem;top:1.2rem;width:12px;height:12px}
  .g-name{font-size:.92rem}.g-knopf{min-width:44px;min-height:44px}.g-zaehler{gap:.25rem}.g-menge{min-width:1.1rem}.g-text{font-size:.75rem}
  .ist-verfolgen .seite{display:block;padding-top:2rem;min-height:72svh}.ist-verfolgen .spur{padding-top:1rem}.ist-verfolgen .bon{margin-top:.5rem;padding:1.5rem 1.1rem}.ist-verfolgen .lage{font-size:2.4rem}.ist-verfolgen .nummer{font-size:5rem}.ist-verfolgen .kopf-logo{height:2.18rem}.ist-verfolgen .hilfe{gap:1rem}.ist-verfolgen .hilfe .knopf-rand{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.hero-motiv,.hero-motiv img{animation:none;transition:none}html{scroll-behavior:auto}}

/* ---------- Allergene: Buchstaben-Chips in der Kachel, Legende unter der Karte ---------- */
.g-allergene{display:flex;flex-wrap:wrap;gap:.25rem;margin:.45rem 0 0;padding:0}
.g-allergen{display:inline-grid;place-items:center;min-width:1.35rem;height:1.35rem;padding:0 .3rem;
  border:1px solid color-mix(in srgb,var(--asche) 55%,transparent);border-radius:.3rem;
  font:700 .66rem/1 "Kanit",system-ui,sans-serif;letter-spacing:.06em;color:var(--papier-leise);
  background:color-mix(in srgb,var(--nacht) 60%,transparent)}
.gericht-koerper .g-allergene{margin-top:.35rem}
.blatt-allergene{margin:.35rem 0 0;font-size:.8rem;line-height:1.5;color:var(--papier-leise)}
.blatt-allergene b{color:var(--papier);font-weight:600}
.allergen-legende{margin-top:1.4rem;border-top:1px solid color-mix(in srgb,var(--asche) 40%,transparent);padding-top:.9rem;max-width:64ch}
.allergen-legende summary{display:flex;align-items:baseline;gap:.7rem;cursor:pointer;list-style:none}
.allergen-legende summary::-webkit-details-marker{display:none}
.allergen-legende-kopf{font:700 .78rem/1 "Kanit",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--glut-hell)}
.allergen-legende-hinweis{font-size:.8rem;color:var(--asche)}
.allergen-legende-hinweis::after{content:" ▾";opacity:.7}
.allergen-legende[open] .allergen-legende-hinweis::after{content:" ▴"}
.allergen-liste{list-style:none;margin:.8rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:.3rem .9rem;font-size:.82rem;color:var(--papier-leise)}
.allergen-liste li{display:flex;align-items:center;gap:.5rem}
.allergen-liste b{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;border:1px solid color-mix(in srgb,var(--asche) 55%,transparent);border-radius:.3rem;font:700 .7rem/1 "Kanit",system-ui,sans-serif;color:var(--papier)}
.allergen-fuss{margin:.8rem 0 0;font-size:.78rem;color:var(--asche);line-height:1.5}
