/* Nirvana 2026 – Gestaltung aus Entwurf D (Modern Luxury, Hell und Dunkel) */
:root{
  --feder:linear(0,.32 7%,.62 15%,.86 24%,1.01 34%,1.06 43%,1.05 52%,1.02 63%,1 80%,1);
  --feder-weich:linear(0,.2 6%,.5 14%,.76 23%,.93 33%,1.02 43%,1.04 52%,1.03 62%,1.01 74%,1);
}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips.zeiten{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr))}
.chips.zeiten span{min-width:0;padding:0 8px}
.chips label{position:relative;cursor:pointer}
.chips input{position:absolute;opacity:0}
.chips span{display:grid;place-items:center;min-width:52px;height:46px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--sheet-linie);font-variant-numeric:tabular-nums;transition:background .2s,color .2s,box-shadow .2s,transform .4s var(--feder)}
.chips label:hover span{box-shadow:inset 0 0 0 1.5px var(--sheet-akzent)}
.chips label:active span{transform:scale(.93)}
.chips input:checked+span{background:var(--sheet-akzent);color:var(--sheet-akzent-fg);box-shadow:none}
.chips input:focus-visible+span{outline:2px solid var(--sheet-akzent);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
}

/* Eine Gestaltung (Modern Luxury) in zwei Darstellungen: dunkel und hell */
html{--schrift:"Hanken Grotesk",system-ui,sans-serif;--titel:"Fraunces",serif;--gold:linear-gradient(180deg,#f0dc9d,#d2a85c 58%,#b98a3e);
  --h1-gewicht:300;--h1-groesse:clamp(2.4rem,11.4cqw,6.2rem);--h1-zeile:1;--h1-abstand:-.025em;--h1-breite:100%}
html[data-look=dunkel]{
  --bg:#0c0a08;--fg:#f4ede1;--leise:rgba(244,237,225,.8);--zweite:#e6c88a;--akzent:#d9b46c;--akzent-fg:#1b1206;--gut:#9fd3a8;
  --bar:rgba(12,10,8,.8);--rand:rgba(244,237,225,.14);--hover:rgba(244,237,225,.1);
  --karte-bg:rgba(18,14,11,.66);--karte-schatten:inset 0 0 0 1px rgba(244,237,225,.12),0 40px 80px -30px rgba(0,0,0,.85);
  --sheet-bg:#14100c;--sheet-fg:#f4ede1;--sheet-akzent:#d9b46c;--sheet-akzent-fg:#1b1206;--sheet-linie:rgba(244,237,225,.14);--sheet-flaeche:rgba(244,237,225,.07);--schleier:rgba(0,0,0,.62);
}
html[data-look=hell]{
  --bg:#f6f1e7;--fg:#1a1510;--leise:rgba(26,21,16,.72);--zweite:#8a6420;--akzent:#8a6420;--akzent-fg:#fff;--gut:#1d8a4a;
  --bar:rgba(246,241,231,.86);--rand:rgba(26,21,16,.12);--hover:rgba(26,21,16,.06);
  --karte-bg:#fffdf8;--karte-schatten:0 0 0 1px rgba(26,21,16,.06),0 30px 60px -30px rgba(60,40,10,.35);
  --sheet-bg:#fffdf8;--sheet-fg:#1a1510;--sheet-akzent:#8a6420;--sheet-akzent-fg:#fff;--sheet-linie:rgba(26,21,16,.12);--sheet-flaeche:rgba(26,21,16,.05);--schleier:rgba(26,21,16,.4);
}
*{box-sizing:border-box;margin:0}
[hidden]{display:none!important}
html{--pad:clamp(16px,4vw,48px);background:var(--bg);-webkit-font-smoothing:antialiased;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
h1,h3,.rechtstext h2{text-wrap:balance}
.knopf{white-space:nowrap}
.blatt-fuss{flex-wrap:wrap}
.blatt-fuss .hinw{flex:1 1 120px}
.blatt-fuss .knopf{margin-left:auto}
.springen{position:fixed;left:12px;top:-80px;z-index:60;padding:.75rem 1.1rem;border-radius:999px;background:var(--fg);color:var(--bg);font-weight:600;transition:top .2s}
.springen:focus{top:12px}
main:focus{outline:none}
.blatt-inhalt,.gerichte,.kat{overscroll-behavior:contain}
.feld[aria-invalid=true]{border-color:#c4473a;box-shadow:0 0 0 1px #c4473a}
body{background:var(--bg);color:var(--fg);font:400 1.05rem/1.45 var(--schrift)}
[data-look=dunkel] body{background:linear-gradient(90deg,rgba(12,10,8,.93),rgba(12,10,8,.62) 45%,rgba(12,10,8,.4)),linear-gradient(0deg,rgba(12,10,8,.9),rgba(12,10,8,0) 50%),url(hero.webp) center/cover fixed #0c0a08}
h1 span+span{font-style:italic}
html .menue .haupt,html .menue .haupt:hover,html .kontakt button,html .knopf{background:var(--gold);color:#1b1206}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* Menüleiste: jeder Punkt führt direkt zu einer Aufgabe */
.kopf{position:sticky;top:0;z-index:30;background:var(--bar);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);box-shadow:0 1px 0 var(--rand)}
.kopf-innen{display:flex;align-items:center;gap:.8rem;max-width:1296px;height:68px;margin:0 auto;padding:0 var(--pad)}
.marke{display:flex;align-items:center;gap:.6rem;margin-right:auto;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.gold{display:block;height:52px;width:auto}
.emblem{width:40px;height:40px}
[data-look=hell] .gold,[data-look=dunkel] .emblem,[data-look=dunkel] .wort{display:none}
.wort{font-family:var(--titel);font-size:1.2rem;font-weight:400}
.menue{display:flex;align-items:center;gap:.15rem}
.menue a,.menue button{display:inline-flex;align-items:center;gap:.5rem;min-height:42px;padding:0 1rem;border:0;border-radius:999px;background:none;color:inherit;font:500 .95rem var(--schrift);white-space:nowrap;cursor:pointer;transition:background .25s,color .25s,filter .25s,transform .45s var(--feder)}
.menue a:hover,.menue button:hover,.menue .an{background:var(--hover)}
.menue a:active,.menue button:active{transform:scale(.95)}
.menue .haupt,.menue .haupt:hover{margin-left:.5rem;background:var(--akzent);color:var(--akzent-fg);font-weight:600}
.menue .haupt:hover{filter:brightness(1.14)}
.menue .zweit{margin-left:.5rem;box-shadow:inset 0 0 0 1.5px var(--akzent);font-weight:600}
.menue .zweit+.haupt{margin-left:.35rem}
.menue svg{display:none;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.menue .kurz{display:none}
.vorschau{display:flex;align-items:center;gap:2px;padding:3px;border-radius:999px;background:var(--hover);font:500 12px/1 system-ui,sans-serif}
.vorschau button,.vorschau a{border:0;border-radius:999px;background:none;color:inherit;font:inherit;padding:7px 10px;cursor:pointer;opacity:.7}
.sprache{margin-left:-.4rem}
.toast{position:fixed;top:84px;right:16px;z-index:45;max-width:min(340px,calc(100vw - 32px));padding:12px 16px;border-radius:16px;background:var(--sheet-bg);color:var(--sheet-fg);box-shadow:0 0 0 1px var(--sheet-linie),0 20px 50px -10px rgba(0,0,0,.5);font-size:.9rem;opacity:0;translate:0 -8px;transition:opacity .25s,translate .45s var(--feder);pointer-events:none}
.toast.da{opacity:1;translate:0 0}
.vorschau button[aria-pressed=true]{background:var(--fg);color:var(--bg);opacity:1}

/* Held: Überschrift und die Karte „Heute“ mit dem, was Gäste zuerst wissen wollen */
.held{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:clamp(24px,5vw,72px);align-items:center;max-width:1296px;min-height:calc(100svh - 68px);margin:0 auto;padding:clamp(24px,5vh,64px) var(--pad)}
.text{container-type:inline-size;animation:ein 1s cubic-bezier(.2,.7,.2,1) backwards}
h1{font-family:var(--titel,var(--schrift));font-weight:var(--h1-gewicht);font-size:var(--h1-groesse);line-height:var(--h1-zeile);letter-spacing:var(--h1-abstand);font-stretch:var(--h1-breite)}
h1 span{display:block}
h1 span+span{color:var(--zweite)}
.sub{max-width:34ch;margin-top:1em;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.35;color:var(--leise)}
.heute{padding:1.4rem;border-radius:26px;background:var(--karte-bg);box-shadow:var(--karte-schatten);animation:ein 1s cubic-bezier(.2,.7,.2,1) .15s backwards}
.heute h2{margin-bottom:.8rem;font-size:.95rem;font-weight:600;color:var(--leise)}
.status{display:flex;align-items:center;gap:.65rem;font-size:1.12rem;font-weight:700;letter-spacing:-.01em}
.status i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--zweite)}
.status.offen i{background:var(--gut);box-shadow:0 0 0 4px color-mix(in srgb,var(--gut) 25%,transparent)}
.heute p+p{margin-top:.45rem;color:var(--leise)}
.kontakt{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:1.2rem}
.kontakt a{display:grid;place-items:center;min-height:46px;border-radius:14px;background:var(--hover);font-size:.92rem;font-weight:600;transition:background .25s,color .25s,transform .45s var(--feder)}
.kontakt a:hover{background:var(--akzent);color:var(--akzent-fg)}
.kontakt a:active{transform:scale(.95)}
.kontakt button{grid-column:1/-1;min-height:48px;border:0;border-radius:14px;background:var(--akzent);color:var(--akzent-fg);font:600 .95rem var(--schrift);cursor:pointer;transition:filter .25s,transform .45s var(--feder)}
.kontakt button:hover{filter:brightness(1.14)}
.kontakt button:active{transform:scale(.97)}

/* Speisekarte im großen Blatt: eine Liste zum Durchscrollen, die Kategorie wandert mit */
dialog.blatt.gross{width:min(1040px,calc(100vw - 32px));height:min(820px,calc(100vh - 32px));height:min(820px,calc(100dvh - 32px))}
.anz{font-size:.88rem;opacity:.65}
.karte{flex:1;min-height:0;display:grid;grid-template-columns:260px minmax(0,1fr)}
.kat{display:flex;flex-direction:column;gap:2px;padding:14px;overflow:auto;border-right:1px solid var(--sheet-linie);scrollbar-width:thin}
.kat button{flex:none;display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.7rem .95rem;border:0;border-radius:13px;background:none;color:inherit;font:500 .98rem var(--schrift);text-align:left;cursor:pointer;transition:background .25s,color .25s,transform .4s var(--feder)}
.kat button:hover{background:var(--sheet-flaeche)}
.kat button:active{transform:scale(.97)}
.kat button[aria-current=true]{background:var(--sheet-akzent);color:var(--sheet-akzent-fg)}
.kat span{font-size:.8rem;opacity:.6;font-variant-numeric:tabular-nums}
.gerichte{position:relative;overflow:auto;padding:22px 26px 26px}
.gerichte section{padding-bottom:2.2rem}
.gerichte h3{font-family:var(--titel,var(--schrift));display:flex;align-items:center;gap:.9rem;margin-bottom:.3rem;font-size:1.6rem;font-weight:700;letter-spacing:-.025em}
.gerichte h3 img{width:56px;height:56px;border-radius:50%;object-fit:cover}
.gerichte ul{list-style:none;padding:0}
.gerichte li{display:grid;grid-template-columns:2rem 1fr auto;gap:0 .8rem;align-items:baseline;padding:.85rem 0;border-bottom:1px solid var(--sheet-linie)}
.gerichte .nr{font-size:.8rem;opacity:.5;font-variant-numeric:tabular-nums}
.gerichte b{font-weight:600}
.gerichte sup{margin-left:.25em;font-size:.65em;font-weight:400;opacity:.65}
.gerichte small{display:block;font-size:.9rem;opacity:.72}
.gerichte em{font-style:normal;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.stoffe{font-size:.85rem}
.stoffe summary{cursor:pointer;font-weight:600}
.stoffe p{margin:.6rem 0;opacity:.75}
.stoffe ol{columns:2;gap:1.5rem;padding-left:1.6rem;opacity:.75}

/* Auswahlkarten (Jetzt bestellen) */
.wege{display:grid;gap:12px}
.weg{display:grid;gap:.3rem;padding:1.2rem 1.3rem;border-radius:22px;background:var(--sheet-flaeche);transition:box-shadow .25s,transform .45s var(--feder)}
a.weg:hover{box-shadow:inset 0 0 0 2px var(--sheet-akzent)}
a.weg:active{transform:scale(.98)}
.weg b{font-size:1.2rem;font-weight:700;letter-spacing:-.015em}
.weg span{opacity:.76}
.weg.aus{background:none;box-shadow:inset 0 0 0 1px var(--sheet-linie);opacity:.7}

/* Blätter (Pop-ups) für Reservierung, Catering und Feier */
dialog.blatt{border:0;padding:0;margin:auto;width:min(520px,calc(100vw - 24px));max-width:none;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);border-radius:28px;overflow:hidden;background:var(--sheet-bg);color:var(--sheet-fg);font:400 1rem/1.45 var(--schrift);box-shadow:0 40px 100px -20px rgba(0,0,0,.55);opacity:0;transform:scale(.92);
  transition:opacity .3s,transform .5s var(--feder),overlay .5s allow-discrete,display .5s allow-discrete}
dialog.blatt[open]{display:flex;flex-direction:column;opacity:1;transform:none}
dialog.blatt::backdrop{background:var(--schleier);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .35s,overlay .35s allow-discrete,display .35s allow-discrete}
dialog.blatt[open]::backdrop{opacity:1}
@starting-style{dialog.blatt[open]{opacity:0;transform:scale(.92)}dialog.blatt[open]::backdrop{opacity:0}}
dialog.mittel{width:min(680px,calc(100vw - 24px))}
@media (min-width:861px){dialog.blatt[data-breit="1"]{width:min(980px,calc(100vw - 32px))}}
.blatt-kopf{position:relative;flex:none;display:flex;align-items:center;gap:.8rem;padding:16px 16px 14px 24px;border-bottom:1px solid var(--sheet-linie)}
.blatt-kopf h2{font-family:var(--titel,var(--schrift));margin-right:auto;font-size:1.45rem;font-weight:700;letter-spacing:-.02em}
.rund{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:var(--sheet-flaeche);color:inherit;font-size:1.3rem;line-height:1;cursor:pointer;transition:transform .4s var(--feder)}
.rund:active{transform:scale(.88)}
.zurueck{margin-left:-10px}
.blatt-inhalt{flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:22px 24px 26px}   /* „auto“ statt 0: Safari lässt den Inhalt sonst zusammenfallen */
.blatt-fuss{flex:none;display:flex;align-items:center;gap:1rem;padding:14px 20px;border-top:1px solid var(--sheet-linie)}
.hinw{margin-right:auto;font-size:.88rem;opacity:.78}
.knopf{min-height:50px;padding:0 1.5rem;border:0;border-radius:999px;background:var(--sheet-akzent);color:var(--sheet-akzent-fg);font:600 1rem var(--schrift);cursor:pointer;transition:transform .45s var(--feder),opacity .2s,filter .2s}
.knopf:hover{filter:brightness(1.18)}
.knopf:active{transform:scale(.96)}
.knopf:disabled{opacity:.35;filter:none;cursor:not-allowed}
.wechsel{animation:rein .35s ease}
.frage{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin:1.5rem 0 .7rem;font-size:1.05rem;font-weight:700}
.wechsel>.frage:first-child,.blatt-inhalt>.frage:first-child{margin-top:0}
.rest{font-size:.85rem;font-weight:500;opacity:.7}
.klein{margin-top:1rem;font-size:.85rem;opacity:.72}
.feld{height:48px;padding:0 1rem;border:1px solid var(--sheet-linie);border-radius:14px;background:none;color:inherit;font:inherit}
.zaehler{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem}
.zaehler output{min-width:3ch;text-align:center;font-size:1.7rem;font-weight:700;font-variant-numeric:tabular-nums}
/* Gästezahl zum Eintippen: sieht aus wie die Zahl, beim Antippen erscheint ein Rahmen */
.zaehler .zahl{width:4.2ch;padding:.15rem .2rem;border:0;border-radius:10px;background:transparent;color:inherit;text-align:center;font:inherit;font-size:1.7rem;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:inset 0 0 0 1px var(--sheet-linie);-moz-appearance:textfield;appearance:textfield}
.zaehler .zahl::-webkit-inner-spin-button,.zaehler .zahl::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.zaehler .zahl:focus{outline:none;box-shadow:inset 0 0 0 2px var(--sheet-akzent)}
.summe{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.blatt .chips span{height:auto;min-height:46px;padding:.6rem 1rem;border-radius:23px;text-align:center}
.blatt .chips input:disabled+span{opacity:.35;cursor:not-allowed}
/* Catering: drei Pakete nebeneinander, Speisen als Kacheln mit Platz für ein Foto */
.pakete{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.paket{position:relative;display:block;cursor:pointer}
.paket input{position:absolute;opacity:0}
.paket>span{display:flex;flex-direction:column;gap:.55rem;height:100%;padding:1.2rem;border-radius:22px;box-shadow:inset 0 0 0 1px var(--sheet-linie);transition:box-shadow .2s,background .2s,transform .45s var(--feder)}
.paket:hover>span{box-shadow:inset 0 0 0 1.5px var(--sheet-akzent)}
.paket:active>span{transform:scale(.98)}
.paket input:checked+span{background:var(--sheet-flaeche);box-shadow:inset 0 0 0 2px var(--sheet-akzent)}
.paket input:focus-visible+span{outline:2px solid var(--sheet-akzent);outline-offset:2px}
.paket b{font-size:1.15rem;letter-spacing:-.01em}
.paket em{font-style:normal;font-size:1.7rem;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.paket em i{display:block;font-style:normal;font-size:.8rem;font-weight:400;letter-spacing:0;opacity:.72}
.paket small{font-size:.88rem;opacity:.76}
.paket ul{list-style:none;padding:0;font-size:.9rem}
.paket li{padding:.32rem 0;border-top:1px solid var(--sheet-linie)}
.paket .wahl{margin-top:auto;padding:.7rem;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--sheet-akzent);text-align:center;font-weight:600;color:var(--sheet-akzent)}
.paket .wahl::before{content:attr(data-aus)}
.paket input:checked+span .wahl{background:var(--sheet-akzent);color:var(--sheet-akzent-fg)}
.paket input:checked+span .wahl::before{content:attr(data-an)}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.kachel{position:relative;display:block;cursor:pointer}
.kachel input{position:absolute;opacity:0}
.kachel>span{position:relative;display:grid;align-content:start;gap:.5rem;height:100%;padding:8px 8px 12px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--sheet-linie);transition:box-shadow .2s,background .2s,opacity .2s,transform .45s var(--feder)}
.kachel:hover>span{box-shadow:inset 0 0 0 1.5px var(--sheet-akzent)}
.kachel:active>span{transform:scale(.97)}
.kachel input:checked+span{background:var(--sheet-flaeche);box-shadow:inset 0 0 0 2px var(--sheet-akzent)}
.kachel input:checked+span::after{content:"✓";position:absolute;top:14px;right:14px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--sheet-akzent);color:var(--sheet-akzent-fg);font-size:.85rem;font-weight:700}
.kachel input:focus-visible+span{outline:2px solid var(--sheet-akzent);outline-offset:2px}
.kachel input:disabled+span{opacity:.35;cursor:not-allowed}
.foto{display:grid;place-items:center;aspect-ratio:4/3;border-radius:12px;border:1.5px dashed var(--sheet-linie);background:var(--sheet-flaeche);font-style:normal;font-size:.75rem;opacity:.7}
img.foto{display:block;width:100%;height:auto;object-fit:cover;border:0;opacity:1;background:var(--sheet-flaeche)}
.kachel b{padding:0 .3rem;font-size:.95rem;font-weight:600;line-height:1.25}
.kachel small{padding:0 .3rem;font-size:.82rem;opacity:.72;line-height:1.25}
.zeit{margin-bottom:.3rem;font-size:.92rem;opacity:.76}
.voll{width:100%}
textarea.feld{height:auto;min-height:130px;padding:.8rem 1rem;resize:vertical}
/* iPhone: Datums- und Zeitfelder haben dort eine eigene Mindestbreite und schieben sonst das Pop-up seitlich */
.feld{min-width:0;max-width:100%}
input.feld[type=date],input.feld[type=time]{-webkit-appearance:none;appearance:none;display:block;line-height:46px;text-align:left}
input.feld[type=date]::-webkit-date-and-time-value,input.feld[type=time]::-webkit-date-and-time-value{text-align:left}
.blatt-inhalt{overflow-x:hidden}
.fortschritt{width:90px;height:4px;border-radius:2px;background:var(--sheet-linie);overflow:hidden}
.fortschritt i{display:block;width:calc(var(--p,0)*100%);height:100%;background:var(--sheet-akzent);transition:width .4s}
.optionen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.felder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.f span{display:block;margin-bottom:.3rem;font-size:.85rem;font-weight:600}
.f.breit{grid-column:1/-1}
.zus dd.offen{opacity:.7}
.kal{max-width:380px}
.kal-kopf{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.kal-kopf b{font-size:1.05rem}
.kal-raster{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.kal-raster span{padding:.3rem 0;font-size:.78rem;opacity:.6}
.kal-raster button{aspect-ratio:1;border:0;border-radius:50%;background:none;color:inherit;font:500 .95rem var(--schrift);font-variant-numeric:tabular-nums;cursor:pointer;transition:background .2s,transform .4s var(--feder)}
.kal-raster button:hover:not(:disabled){background:var(--sheet-flaeche)}
.kal-raster button:active:not(:disabled){transform:scale(.9)}
.kal-raster button:disabled{opacity:.28;cursor:not-allowed}
.kal-raster button[aria-pressed=true]{background:var(--sheet-akzent);color:var(--sheet-akzent-fg);font-weight:700}
.kal-wahl{margin-top:.8rem;font-weight:600}
.rund:disabled{opacity:.3;cursor:not-allowed}
.tisch-raster{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:clamp(20px,4vw,48px)}
.zeiten{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:6px}
.zeiten span{min-width:0!important;padding:.5rem .2rem!important}
.haken{display:flex;align-items:flex-start;gap:.6rem;margin-top:1rem;font-size:.88rem;cursor:pointer}
.haken input{flex:none;width:20px;height:20px;accent-color:var(--sheet-akzent)}
.beratung{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:1.4rem;padding:1rem 1.2rem;border-radius:18px;background:var(--sheet-flaeche)}
.beratung p{flex:1 1 240px}
.beratung a{display:inline-flex;align-items:center;min-height:42px;padding:0 1.1rem;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--sheet-akzent);font-weight:600;text-decoration:none}
.beratung a:hover{background:var(--sheet-akzent);color:var(--sheet-akzent-fg)}
.aufpreis{justify-self:start;margin:0 .3rem;padding:.15rem .55rem;border-radius:999px;background:var(--sheet-akzent);color:var(--sheet-akzent-fg);font-size:.75rem;font-weight:700}
.aufpreis:empty{display:none}
select.feld{background:var(--sheet-bg);cursor:pointer}
html[data-look=dunkel]{color-scheme:dark}
.zus div{display:grid;grid-template-columns:10.5rem 1fr;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--sheet-linie)}
.zus dt{opacity:.7}
.zus .preis dd{font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums}

/* Fußbereich, Rechtstexte, Cookie-Hinweis */
.fuss{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;max-width:1296px;margin:0 auto;padding:26px var(--pad) 34px;border-top:1px solid var(--rand);font-size:.92rem;color:var(--leise)}
.fuss nav{display:flex;flex-wrap:wrap;gap:4px}
.fuss nav+nav{margin-left:auto}
.fuss a,.fuss button{padding:.5rem .85rem;border:0;border-radius:999px;background:none;color:inherit;font:500 .92rem var(--schrift);cursor:pointer;transition:background .25s,color .25s}
.fuss a:hover,.fuss button:hover{background:var(--hover);color:var(--fg)}
.rechtstext h2{margin:1.4rem 0 .4rem;font-size:1.05rem}
.rechtstext h2:first-child{margin-top:0}
.rechtstext p{margin:.5rem 0;opacity:.85}
.rechtstext a{text-decoration:underline}
.cookie{position:fixed;left:50%;bottom:16px;z-index:40;translate:-50% 0;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;width:max-content;max-width:min(720px,calc(100vw - 24px));padding:12px 14px 12px 18px;border-radius:20px;background:var(--sheet-bg);color:var(--sheet-fg);box-shadow:0 0 0 1px var(--sheet-linie),0 20px 50px -10px rgba(0,0,0,.55);font-size:.88rem}
.cookie p{flex:1 1 260px}
.cookie button{min-height:40px;padding:0 1.1rem;border:0;border-radius:999px;font:600 .88rem var(--schrift);cursor:pointer}
.cookie .zweit{background:var(--sheet-flaeche);color:inherit}
/* Weicher Wechsel zwischen Hell und Dunkel */
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
/* „Transparenz reduzieren“: deckende Flächen statt Glas */
@media (prefers-reduced-transparency:reduce){
  .kopf,.menue{background:var(--bg)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .heute{background:var(--sheet-bg)}
  dialog.blatt::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}
}
@keyframes ein{from{opacity:0;transform:translateY(16px)}}
@keyframes rein{from{opacity:0;transform:translateY(8px)}}

@media (max-width:860px){
  body{padding-bottom:96px}
  .kopf{position:static;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
  .kopf-innen{height:64px}
  .wort{display:none}
  /* dieselbe Menüleiste, am Handy unten in Daumenreichweite */
  .menue{position:fixed;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:30;gap:2px;padding:6px;border-radius:28px;background:var(--bar);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);box-shadow:inset 0 0 0 1px var(--rand),0 18px 40px -12px rgba(0,0,0,.45)}
  .menue a,.menue button{flex:1;flex-direction:column;gap:3px;min-height:58px;padding:6px 1px;border-radius:20px;font-size:.68rem;font-weight:600}
  .menue .haupt,.menue .haupt:hover,.menue .zweit+.haupt{order:-1;margin-left:0}
  .menue .zweit{order:-2;margin-left:0;box-shadow:none}
  .menue .karten-link{order:-3}
  .menue svg{display:block}
  .menue .lang{display:none}
  .menue .kurz{display:inline}
  .held{grid-template-columns:1fr;align-content:center;min-height:calc(100svh - 160px)}
  dialog.blatt.gross{height:calc(100vh - 48px);height:calc(100dvh - 48px)}
  .karte{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .kat{flex-direction:row;gap:6px;padding:10px 14px;border-right:0;border-bottom:1px solid var(--sheet-linie);scrollbar-width:none}
  .kat button{padding:.6rem 1rem;border-radius:999px;background:var(--sheet-flaeche);white-space:nowrap}
  .kat span{display:none}
  .gerichte{padding:18px 18px 24px}
  .stoffe ol{columns:1}
  /* Am Handy unten angeheftet: feste Unterkante (top:auto) statt Rand-Automatik, damit iPhone-Safari das Blatt
     über seiner Leiste zeigt; der Fuß hält Abstand zum Home-Balken (viewport-fit=cover). */
  dialog.blatt,dialog.blatt.gross{position:fixed;inset:auto 0 0 0;width:100%;margin:0;border-radius:26px 26px 0 0;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);transform:translateY(70px)}
  .blatt-fuss{padding-bottom:max(14px,env(safe-area-inset-bottom))}
  .blatt-inhalt:last-child{padding-bottom:max(24px,env(safe-area-inset-bottom))}
  @starting-style{dialog.blatt[open]{opacity:0;transform:translateY(70px)}}
  .blatt-inhalt{padding:18px 18px 24px}
  /* Griff: das Blatt lässt sich am Kopf nach unten wegziehen */
  .blatt-kopf{padding-top:22px;touch-action:none;cursor:grab}
  .blatt-kopf::before{content:"";position:absolute;top:8px;left:50%;width:38px;height:5px;margin-left:-19px;border-radius:3px;background:currentColor;opacity:.28}
  /* Pakete am Handy seitlich zum Wischen */
  .pakete{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;margin:0 -18px;padding:2px 18px 8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .paket{scroll-snap-align:center}
  .kacheln{grid-template-columns:repeat(2,minmax(0,1fr))}
  .optionen{grid-template-columns:minmax(0,1fr)}
  .cookie{bottom:88px}
  .fuss nav+nav{margin-left:0}
  .tisch-raster{grid-template-columns:minmax(0,1fr)}
  .schritt-text{display:none}
  .zus div{grid-template-columns:1fr;gap:.1rem}
  .summe{margin-left:0;width:100%}
}

/* ===== WordPress: eigene Seiten (Speisekarte, Catering, Feiern, Rechtliches, Formulare des Plugins) ===== */
[data-look=dunkel] body:not(.home){background:#0c0a08}
.falle,.trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.cookie a.zweit{display:inline-grid;place-items:center;min-height:40px;padding:0 1.1rem;border-radius:999px;font-weight:600}
.seite{min-height:60vh}
.seite-innen{max-width:820px;margin:0 auto;padding:clamp(40px,7vw,96px) var(--pad) clamp(56px,8vw,110px)}
.seite-innen.breit{max-width:1180px}
.seite h1{margin:.5rem 0 1rem;font-family:var(--titel);font-size:clamp(2.2rem,5.6vw,4.2rem);font-weight:300;line-height:1.02;letter-spacing:-.025em}
.seite h1 em,.seite h2 em{color:var(--zweite)}
.seite h2{margin:2.6rem 0 .8rem;font-family:var(--titel);font-size:clamp(1.6rem,3vw,2.3rem);font-weight:400;letter-spacing:-.02em}
.seite h3{margin:1.6rem 0 .5rem;font-size:1.1rem}
.seite .lead{max-width:56ch;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.55;color:var(--leise)}
.seite .klein{margin-top:1.4rem;font-size:.92rem;color:var(--leise)}
.seite .inhalt{line-height:1.65}
.seite .inhalt p,.seite .inhalt ul,.seite .inhalt ol{margin:.7rem 0}
.seite .inhalt a,.seite .klein a{text-decoration:underline}
.marke-klein{font-size:.78rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--zweite)}
.unten{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:1.8rem}
.weiter-link{display:inline-flex;align-items:center;min-height:50px;padding:0 1.5rem;border:0;border-radius:999px;background:var(--gold);color:#1b1206;font:600 1rem var(--schrift);text-decoration:none;cursor:pointer;transition:transform .45s var(--feder),filter .2s}
.weiter-link:hover{filter:brightness(1.1)}
.weiter-link:active{transform:scale(.96)}
.weiter-link.leise{background:none;color:inherit;box-shadow:inset 0 0 0 1.5px var(--rand)}
.paketkarten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(32px,5vw,52px)}
.pk{display:flex;flex-direction:column;gap:.35rem;padding:30px 28px;border-radius:26px;background:var(--karte-bg);box-shadow:var(--karte-schatten)}
.pk b{font-size:.8rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--zweite)}
.pk em{font-family:var(--titel);font-size:clamp(2.2rem,3.6vw,3rem);font-style:normal;font-weight:300;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pk span{font-size:.92rem;color:var(--leise)}
.pk ul{list-style:none;padding:0;margin-top:1rem}
.pk li{padding:.5rem 0;border-top:1px solid var(--rand);font-size:.95rem}
.gruppen{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px 32px}
.gruppen ul{list-style:none;padding:0}
.gruppen li{padding:.4rem 0;border-bottom:1px solid var(--rand)}
.gruppen small{color:var(--leise)}
.zwei{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.uhr{font-family:var(--titel);font-size:clamp(5rem,14vw,11rem);font-weight:300;line-height:.9;letter-spacing:-.04em;color:var(--zweite);font-variant-numeric:tabular-nums}
.uhr small{display:block;margin-top:1rem;font-family:var(--schrift);font-size:1rem;letter-spacing:.2em;text-transform:uppercase;color:var(--leise)}
.seite .liste{list-style:none;padding:0;margin-top:1.4rem;border-top:1px solid var(--rand)}
.seite .liste li{padding:.9rem 0;border-bottom:1px solid var(--rand)}
.seiten-kat{position:sticky;top:76px;z-index:5;display:flex;gap:6px;margin:2rem calc(var(--pad) * -1) 0;padding:10px var(--pad);overflow-x:auto;background:var(--bar);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);scrollbar-width:none}
.seiten-kat a{flex:none;padding:.55rem 1rem;border-radius:999px;background:var(--hover);font-size:.92rem;font-weight:500}
.seiten-kat a:hover{background:var(--akzent);color:var(--akzent-fg)}
.seiten-karte{padding:0;overflow:visible}
.seiten-karte section{scroll-margin-top:140px;padding-top:1.4rem}
.seiten-karte h2{margin-top:1.2rem}
.seiten-karte li{grid-template-columns:1fr auto;border-color:var(--rand)}
.seiten-karte small{color:var(--leise);opacity:1}
/* Formulare des Plugins auf /reservieren/ und /anfragen/ (ohne JavaScript oder nach Fehlern) */
.seite form label,.seite .field{display:grid;gap:.35rem;margin:0 0 1rem;font-size:.92rem;font-weight:600}
.seite form input:not([type=checkbox]):not([type=radio]),.seite form select,.seite form textarea{width:100%;min-height:48px;padding:0 1rem;border:1px solid var(--rand);border-radius:14px;background:var(--bg);color:inherit;font:400 1rem var(--schrift)}
.seite form textarea{min-height:120px;padding:.8rem 1rem}
.seite form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.seite form button,.seite .button{display:inline-flex;align-items:center;min-height:50px;padding:0 1.5rem;border:0;border-radius:999px;background:var(--gold);color:#1b1206;font:600 1rem var(--schrift);cursor:pointer}
.seite .booking-status,.seite .form-alert,.seite .enquiry-confirmation{margin:1rem 0;padding:1rem 1.2rem;border-radius:16px;background:var(--hover)}
.seite .field-error{color:#d9776b;font-weight:500}
.seite .section,.seite .wrap{max-width:none;padding:0}
@media (max-width:860px){
  .paketkarten{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;margin-inline:calc(var(--pad) * -1);padding:4px var(--pad) 12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .pk{scroll-snap-align:center}
  .zwei{grid-template-columns:minmax(0,1fr)}
  .seiten-kat{top:0}
  .seite form .field-row{grid-template-columns:1fr}
}

/* Speisekarte ohne Nummernspalte (die WordPress-Gerichte haben keine Nummern) */
.gerichte li{grid-template-columns:minmax(0,1fr) auto}