@font-face{font-family:G;src:url(/f/eb-garamond-400-normal.ttf) format("truetype");font-display:swap}
@font-face{font-family:G;font-style:italic;src:url(/f/eb-garamond-400-italic.ttf) format("truetype");font-display:swap}
@font-face{font-family:J;font-weight:300;src:url(/f/josefin-sans-300-normal.ttf) format("truetype");font-display:swap}
:root{--gruen:#1E2B24;--nacht:#121A16;--papier:#EFE9DF;--kupfer:#9A6644;--tinte:#1E2B24;--rand:64px;--ease:cubic-bezier(.16,1,.3,1)}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:G,Garamond,Georgia,serif;background:var(--nacht);color:var(--papier);-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--papier);color:var(--tinte)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.mikro{font-family:J;font-weight:300;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.kursiv,em{font-style:italic}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.zeile{display:block;overflow:hidden;padding-bottom:.08em}.zeile>span{display:block}
.js .zeile>span{transform:translate(0,105%)}
svg.l{display:block;width:100%;height:auto;fill:currentColor;overflow:hidden}

/* Ladebild + Vorhang */
#lader{position:fixed;inset:0;z-index:100;background:var(--papier);color:var(--tinte);display:none}
.js #lader{display:block}
#lader .name{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:20px;white-space:nowrap}
#lader .name i{display:inline-block;width:4px;height:4px;border-radius:50%;background:currentColor;margin:0 12px;vertical-align:middle;opacity:.6}
#lader .strich{position:absolute;left:50%;top:calc(50% + 26px);width:120px;height:1px;background:currentColor;opacity:.25;transform:translateX(-50%)}
#lader .strich b{display:block;height:100%;width:0;background:currentColor}
#lader .zahl{position:absolute;right:var(--rand);bottom:40px;font-family:J;font-size:12px;letter-spacing:.2em}
#vorhang{position:absolute;inset:0;background:var(--nacht);transform:translateY(101%)}

/* Hero nach Settele: Vollbild-Stillleben, dunkle Fläche mit harter Kante, Titel darin */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;background:var(--nacht)}
.hero .bild{position:absolute;inset:0}
.hero .bild img{width:100%;height:100%;object-fit:cover;object-position:80% 60%}
.hero .flaeche{position:absolute;top:0;bottom:0;left:0;width:53%;background:rgba(13,19,16,.8);z-index:2}
.hero .menue{position:absolute;left:var(--rand);top:34px;z-index:6;display:flex;align-items:center;gap:14px;background:none;border:0;cursor:pointer;padding:8px 0;font-family:J;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.hero .menue i{display:block;width:30px;height:1px;background:currentColor;position:relative}
.hero .menue i:after{content:"";position:absolute;left:0;top:6px;width:20px;height:1px;background:currentColor;transition:width .5s var(--ease)}
.hero .menue:hover i:after{width:30px}
.hero .menue u{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:4px}
.hero .siegel{position:absolute;left:50%;top:26px;width:58px;height:58px;margin-left:-29px;border:1px solid rgba(239,233,223,.5);border-radius:50%;display:grid;place-items:center;z-index:6}
.hero .siegel svg{width:34px;height:15px;fill:var(--papier);display:block}
.hero .x{position:absolute;right:var(--rand);top:30px;width:48px;height:48px;z-index:6;background:none;border:0;cursor:pointer;visibility:hidden}.hero .x:before,.hero .x:after{content:"";position:absolute;left:24px;top:2px;bottom:2px;width:1px;background:var(--papier);transform:rotate(calc(var(--r,0) * 1deg))}.hero .x:after{transform:rotate(calc(var(--r,0) * -1deg))}.hero .titel{position:absolute;left:22vw;top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;align-items:flex-start}
.hero .kicker{color:#C9B49A;letter-spacing:.42em;font-size:12px;margin:0 0 28px 2px;white-space:nowrap}
.hero .tp{width:53.4%;margin-left:23.3%;margin-bottom:10.8%;color:var(--papier)}
.hero .wort{width:100%;color:var(--papier)}
.hero .by{width:35.1%;margin:6.6% 0 0 33%;color:var(--papier)}
.hero .titel .blk{width:min(35vw,640px)}
.hero .text{margin-top:34px;font-size:17px;line-height:1.5;max-width:34ch;opacity:.82}
.hero .reserv{margin-top:34px;font-family:J;font-size:12px;letter-spacing:.22em;text-transform:uppercase;border:0;border-top:1px solid rgba(239,233,223,.55);border-bottom:1px solid rgba(239,233,223,.55);padding:9px 2px 8px;background:none;cursor:pointer;transition:letter-spacing .6s var(--ease)}
.hero .reserv:hover{letter-spacing:.3em}
.hero .lauf{position:absolute;left:var(--rand);bottom:9vh;width:1px;height:16vh;background:rgba(239,233,223,.25);z-index:5;overflow:hidden}
.hero .lauf b{position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--papier);animation:lauf 2.4s cubic-bezier(.6,0,.2,1) infinite}
@keyframes lauf{to{top:100%}}
.hero .wisch{position:absolute;inset:0;background:var(--papier);color:var(--tinte);transform:translateX(101%);z-index:8;display:grid;place-items:end center;padding-bottom:14vh;text-align:center}.hero .wisch .wt{font-weight:400;font-size:clamp(48px,6vw,104px);line-height:1.04}.hero .wisch .wt em{opacity:.6}.hero .wisch .lead{max-width:52ch;margin:3.5vh auto 0;font-size:19px;line-height:1.55;opacity:.8}.hero .wisch .wt .zeile>span{transform:none}

/* Menü-Ebene (hero2 21.10.2026): die Fläche wächst nach rechts und wird satt, rechts öffnet sich ein Bildfenster,
   das beim Überfahren jedes Punkts mit weicher Maskenblende zum passenden Foto wechselt. Zeilen steigen aus der Maske,
   die aktive Zeile trägt eine Kupfer-Haarlinie. Unten Anfragezeile und das Weinglas, das sich vom Fuß her zeichnet. */
@property --hm-m{syntax:'<number>';inherits:false;initial-value:1}
.hero.schwebt{position:fixed!important;top:0!important;left:0!important;right:0!important;width:auto!important;height:100vh!important;height:100dvh!important;max-height:none!important;transform:none!important;z-index:70}
.hero.schwebt .wisch{visibility:hidden}
html.hm-sperre,html.hm-sperre body{overflow:hidden}
.hero nav.hm{position:absolute;inset:0;z-index:5;visibility:hidden;pointer-events:none;--hm-b:58%}
.hero nav.hm>*{pointer-events:auto}
.hm-grund{position:absolute;top:0;bottom:0;left:0;width:calc(var(--hm-b) - 1px);background:rgba(10,15,12,.86);pointer-events:none!important}
.hm-bilder{position:absolute;top:0;bottom:0;right:0;left:var(--hm-b);overflow:hidden;background:var(--nacht);clip-path:inset(0 0 0 100%)}
.hm-bilder img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;--hm-m:0;-webkit-mask-image:linear-gradient(0deg,#000 calc(var(--hm-m) * 140% - 40%),transparent calc(var(--hm-m) * 140%));mask-image:linear-gradient(0deg,#000 calc(var(--hm-m) * 140% - 40%),transparent calc(var(--hm-m) * 140%))}
.hm-bilder img:first-of-type{--hm-m:1}
.hm-bilder:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(10,15,12,.5) 0%,rgba(10,15,12,0) 22%,rgba(10,15,12,0) 70%,rgba(10,15,12,.62) 100%)}
.hm-cap{position:absolute;left:40px;right:40px;bottom:34px;z-index:4;display:flex;align-items:center;gap:16px;color:var(--papier);font-size:11px;letter-spacing:.26em}
.hm-cap i{display:block;width:28px;height:1px;background:rgba(239,233,223,.5)}
.hm-cn{font-variant-numeric:tabular-nums}
.hm-liste{position:absolute;left:15.5vw;top:46%;transform:translateY(-50%);list-style:none;display:flex;flex-direction:column;gap:clamp(2px,.9vh,10px);width:calc(var(--hm-b) - 15.5vw - 3vw)}
.hm-liste a{--ts:clamp(26px,min(2.1vw,3.7vh),40px);position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);align-items:baseline;padding:2px 0;min-height:44px;transition:opacity .6s var(--ease)}
.hm-nr{grid-row:1;font-family:J;font-weight:300;font-size:11px;letter-spacing:.2em;color:rgba(239,233,223,.5);font-variant-numeric:tabular-nums}
.hm-t{grid-row:1;grid-column:2;display:block;overflow:hidden;font-size:var(--ts);line-height:1.1;letter-spacing:-.01em;padding-bottom:.05em;white-space:nowrap}
.hm-t>span{display:block;transition:translate .8s var(--ease)}
.hm-u{grid-column:2;font-size:14px;line-height:1.3;color:rgba(239,233,223,.46);transition:color .6s var(--ease)}
.hm-linie{position:absolute;left:-74px;top:calc(2px + var(--ts) * .6);width:56px;height:1px;background:var(--kupfer);transform:scaleX(0);transform-origin:100% 50%;transition:transform .8s var(--ease)}
.hm-liste a.an .hm-linie{transform:scaleX(1)}
.hm-liste a.an .hm-t>span{translate:12px 0}
.hm-liste a.an .hm-u{color:rgba(239,233,223,.82)}
.hm-liste.hat-an a:not(.an){opacity:.36}
.hm-fuss{position:absolute;left:15.5vw;bottom:30px;width:calc(var(--hm-b) - 15.5vw - 3vw);display:grid;grid-template-columns:1fr auto;align-items:end;row-gap:16px}
.hm-gruss{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding-bottom:16px;font-size:20px}
.hm-gruss em{color:rgba(239,233,223,.6)}
.hm-an{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:20px}
.hm-an:before{content:"";display:block;width:40px;height:1px;background:var(--kupfer);transform-origin:0 50%;transition:width .7s var(--ease)}
.hm-an:hover:before,.hm-an.an:before,.hm-an:focus-visible:before{width:72px}
.hero .hm-glas{grid-column:2;grid-row:1;width:auto;height:min(15vh,150px);aspect-ratio:1320/3218;color:var(--papier);margin-right:6%}
.hm-platte{grid-column:1/-1;grid-row:1;align-self:end;display:block;height:1px;background:var(--kupfer);opacity:.8;transform-origin:0 50%}
.hm-wer,.hm-ort{grid-row:2;font-size:10.5px;letter-spacing:.26em;color:rgba(239,233,223,.55);white-space:nowrap}
.hm-ort{grid-column:2;text-align:right}
/* Header-Details (hero2): Jahreszeit oben rechts, Kupferkerbe auf der Kante folgt dem Zeiger, Ortszeit im Fuß */
.hero .hdatum{position:absolute;right:var(--rand);top:46px;z-index:6;display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.26em;color:rgba(239,233,223,.66);pointer-events:none}
.hero .hdatum i{display:block;width:22px;height:1px;background:rgba(239,233,223,.4)}
.hero .flaeche .kerbe{position:absolute;right:-10px;top:0;width:20px;height:1px;background:var(--kupfer);opacity:0;z-index:1}
.hero .hfuss .ort b.uhr:empty{display:none}

/* Zwei Kreise: Firmen und Privat – nach Settele liegt das Wort über der Kreiskante: außen Tannengrün auf Papier,
   innen Papier über dem Bild. Beide Wortlagen stehen im selben Bezugsrahmen (.kreis, Ursprung = Kreis oben links,
   Größe --d). Die dunkle Lage liegt UNTER dem Bild (das Bild deckt sie innen ab), die helle liegt in .lage darüber
   und ist per clip-path exakt auf den Kreis beschnitten. --kx (Versatz in Kreisbreiten) und --ka (Deckkraft)
   treiben Bild UND Beschnitt gemeinsam – so bleibt die Kante auch beim Einrollen deckungsgleich. */
.kreise{position:relative;background:var(--papier);color:var(--tinte);padding:6vh var(--rand) 12vh;overflow:hidden}
.kreise .paar{display:flex;justify-content:center;align-items:flex-start;gap:9vw}
.kreis{--d:min(28vw,420px);--kx:0;--ka:1;--ef:clamp(34px,3.9vw,60px);position:relative;display:flex;flex-direction:column;width:var(--d);text-align:left;color:var(--tinte)}
.kreis.k1{--ex:calc(var(--d) * -.2);--ey:calc(var(--d) * .2)}
.kreis.k2{--d:min(33vw,500px);--ex:calc(var(--d) * .6);--ey:calc(var(--d) * .74);margin-top:16vh}
.kreis .rund{position:relative;z-index:2;display:block;width:var(--d);height:var(--d);border-radius:50%;overflow:hidden;background:var(--nacht);transform:translate3d(calc(var(--kx) * 100%),0,0);opacity:var(--ka)}
.kreis .rund img{width:100%;height:100%;object-fit:cover;transition:scale 1.4s var(--ease)}
.kreis:hover .rund img,.kreis:focus-visible .rund img{scale:1.06}
.kreis .rund:after{content:"";position:absolute;inset:0;pointer-events:none}
.kreis.k1 .rund:after{background:linear-gradient(180deg,rgba(18,26,22,.38) 0%,rgba(18,26,22,0) 46%)}
.kreis.k2 .rund:after{background:linear-gradient(180deg,rgba(18,26,22,.62) 0%,rgba(18,26,22,.18) 34%,rgba(18,26,22,0) 52%,rgba(18,26,22,0) 58%,rgba(18,26,22,.64) 100%)}
.kreis .etikett{position:absolute;z-index:1;left:var(--ex);top:var(--ey);font-size:var(--ef);line-height:1;letter-spacing:-.006em;white-space:nowrap;color:var(--tinte);pointer-events:none;font-kerning:normal}
.kreis .lage{position:absolute;left:0;top:0;z-index:3;width:var(--d);height:var(--d);pointer-events:none;clip-path:circle(50% at calc(50% + var(--kx) * 100%) 50%);opacity:var(--ka)}
.kreis .lage .etikett{color:var(--papier);text-shadow:0 1px 16px rgba(18,26,22,.38)}
.kreis .satz{display:block;margin-top:34px;max-width:32ch;font-size:17px;line-height:1.55;color:var(--tinte)}
.kreis .satz>span{opacity:.82}
.kreis.k2 .satz{align-self:flex-end;text-align:right}
.kreis .satz b{display:inline-block;margin-top:14px;font-weight:400;font-size:18px}
.kreis:focus-visible{outline:0}.kreis:focus-visible .rund{outline:1px solid var(--tinte);outline-offset:8px}

/* Haltung (Papier) */
.haltung{position:relative;background:var(--papier);color:var(--tinte);padding:10vh var(--rand) 14vh;overflow:hidden}
.rubrik{display:flex;align-items:center;gap:18px;white-space:nowrap}
.rubrik:after{content:"";flex:0 1 160px;min-width:28px;height:1px;background:currentColor;opacity:.35}
.haltung .wz{position:absolute;right:-10vw;top:46vh;width:62vw;opacity:.06;fill:var(--tinte)}
.haltung h2{margin:14vh auto 0;max-width:1100px;text-align:center;font-weight:400;font-size:clamp(40px,5.4vw,92px);line-height:1.06;letter-spacing:-.012em}
.haltung h2 em{opacity:.62}
.bildblock{display:grid;grid-template-columns:minmax(0,54fr) minmax(0,46fr);gap:6vw;margin-top:20vh;align-items:end}
.bildblock .rahmen{position:relative;aspect-ratio:4/5;overflow:hidden;max-height:86vh;clip-path:inset(18% 22% 18% 0)}
.bildblock .rahmen img{width:100%;height:118%;object-fit:cover;will-change:transform}
.bildblock .unterschrift{margin-top:14px;opacity:.74}
.bildblock .spalte{padding-bottom:8vh;max-width:380px;position:relative}
.bildblock .plus{position:absolute;top:-64px;left:0;width:15px;height:15px;opacity:.5}
.bildblock .plus:before,.bildblock .plus:after{content:"";position:absolute;background:currentColor}
.bildblock .plus:before{left:7px;top:0;bottom:0;width:1px}.bildblock .plus:after{top:7px;left:0;right:0;height:1px}
.bildblock p{font-size:19px;line-height:1.55}
.bildblock .link{display:inline-block;margin-top:12px;padding:16px 0 9px;min-height:44px;font-size:17px}

/* Gänge */
.gaenge{position:relative;background:radial-gradient(90% 70% at 50% 45%,#22312a 0%,var(--nacht) 70%);color:var(--papier)}
.gaenge .vor{padding:20vh var(--rand) 4vh;display:grid;grid-template-columns:1fr auto;align-items:end;gap:6vw}
.gaenge h2{font-weight:400;font-size:clamp(40px,5vw,86px);line-height:1.05;letter-spacing:-.012em}
.gaenge h2 em{opacity:.6}
.gaenge .vor p{max-width:34ch;font-size:18px;line-height:1.5;opacity:.75;padding-bottom:10px}
.buehne{position:relative;height:100svh;overflow:hidden}
.buehne .tl{position:absolute;left:0;right:0;top:74%;height:1px;background:var(--kupfer)}
.buehne .t{position:absolute;top:42%;left:50%;width:min(52vh,40vw);aspect-ratio:1;will-change:transform,opacity,filter}
.buehne .t img{width:100%;height:100%}
.buehne .t.mitte img{filter:drop-shadow(0 40px 60px rgba(0,0,0,.55))}
.buehne .glas{position:absolute;left:calc(50% + min(26vh,20vw) + 2vw);bottom:26%;height:34vh;fill:var(--kupfer)}
.buehne .glas svg{height:100%;width:auto}
.buehne .info{position:absolute;left:var(--rand);top:calc(74% + 34px)}
.buehne .info h3{font-weight:400;font-size:clamp(32px,3vw,48px);margin:12px 0 4px}
.buehne .info p{font-size:20px;opacity:.75}
.buehne .zaehler{position:absolute;right:var(--rand);top:calc(74% + 40px);display:flex;align-items:center;gap:18px}
.buehne .zaehler button{background:none;border:1px solid rgba(239,233,223,.4);width:44px;height:44px;border-radius:50%;cursor:pointer;font-family:G;font-size:18px;transition:background .4s,color .4s}
.buehne .zaehler button{--f:var(--papier)}.buehne .zaehler button:hover{color:var(--tinte)}
.buehne .hinweis{position:absolute;right:var(--rand);bottom:28px;opacity:.64}.buehne .striche{display:flex;gap:6px}.buehne .striche i{display:block;width:22px;height:1px;background:rgba(239,233,223,.3);transition:background .5s}.buehne .striche i.an{background:var(--kupfer);height:2px}

/* Gastgeber */
.gastgeber{display:grid;grid-template-columns:62% 38%;min-height:100svh;background:var(--nacht)}
.gastgeber .bild{position:relative;overflow:hidden}
.gastgeber .bild img{position:absolute;inset:-3% 0;width:100%;height:106%;object-fit:cover;object-position:46% 40%}
.gastgeber .zitat{display:flex;flex-direction:column;justify-content:center;padding:12vh 4.5vw;min-width:0}
.gastgeber blockquote{font-size:clamp(28px,2.6vw,46px);line-height:1.16;margin:5vh 0 4vh;letter-spacing:-.006em}
.gastgeber blockquote .zeile>span{white-space:nowrap}
.gastgeber blockquote .zeile:first-child{margin-left:-.4em}
.gastgeber blockquote em{opacity:.62}
.gastgeber cite{font-style:normal;opacity:.6}

/* Anlässe (Karten nach Settele „Veranstaltungen“) */
.anlaesse{background:var(--papier);color:var(--tinte);padding:16vh var(--rand) 14vh;text-align:center}
.anlaesse h2{font-weight:400;font-size:clamp(40px,4.4vw,74px)}
.karten{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:8vh;text-align:left}
.karte{position:relative;cursor:pointer;outline-offset:6px}
.karte .bildk{aspect-ratio:4/5;overflow:hidden;position:relative}
.karte .bildk img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.karte .inhalt{position:absolute;inset:0;background:var(--gruen);color:var(--papier);padding:28px 24px;display:flex;flex-direction:column;justify-content:flex-end;clip-path:inset(100% 0 0 0);transition:clip-path .8s var(--ease)}
.karte:hover .inhalt,.karte:focus-within .inhalt,.karte:focus .inhalt{clip-path:inset(0 0 0 0)}
.karte:hover .bildk img{transform:scale(1.05)}
.karte .inhalt p{font-size:17px;line-height:1.5;margin-top:10px;opacity:.9}
.karte h3{font-weight:400;font-size:22px;margin-top:16px}
.karte>.mikro{opacity:.6;margin-top:6px;display:block}
.anlaesse .rund-knopf{display:inline-grid;place-items:center;width:92px;height:92px;border-radius:50%;border:1px solid var(--tinte);margin-top:8vh;font-family:J;font-size:11px;letter-spacing:.2em;text-transform:uppercase;background:none;cursor:pointer;transition:background .5s var(--ease),color .5s var(--ease)}
.anlaesse .rund-knopf:hover{background:var(--tinte);color:var(--papier)}

/* Reservierung: Halbkreis wächst von unten */
.reservierung{position:relative;height:160svh;background:var(--nacht)}
.reservierung .halt{position:sticky;top:0;height:100svh;overflow:hidden}
.reservierung .rund{position:absolute;left:50%;bottom:0;width:min(120vh,92vw);aspect-ratio:1;border-radius:50%;background:var(--papier);transform:translate(-50%,50%) scale(.2)}
.reservierung .im{position:absolute;left:50%;bottom:7vh;transform:translateX(-50%);width:min(46vh,80vw);text-align:center;color:var(--tinte);z-index:3}
.reservierung .im p{font-size:18px;line-height:1.5}
.reservierung .im button{--f:var(--papier);margin-top:24px;background:var(--tinte);color:var(--papier);border:0;border-radius:40px;padding:16px 38px;min-height:54px;font-family:G;font-size:18px;cursor:pointer;border:1px solid var(--tinte)}.reservierung .im button:hover{color:var(--tinte)}
.reservierung .gross{position:absolute;left:0;right:0;text-align:center;font-size:clamp(56px,7vw,124px);line-height:1;color:var(--tinte);z-index:4;pointer-events:none}
.reservierung .tel{position:absolute;left:0;right:0;top:16vh;text-align:center;opacity:.6}

/* Fuß */
.fuss{background:var(--nacht);padding:16vh var(--rand) 40px}
.fuss .reihe{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:4vw;font-size:17px;line-height:1.6}
.fuss .reihe .mikro{display:block;margin-bottom:14px;opacity:.55}
.fuss .gross{margin-top:14vh;color:var(--papier)}
.fuss .letzte{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:4px 24px;margin-top:20px;opacity:.64}

/* Anfrage-Ebene */
dialog{margin:auto;border:0;background:var(--gruen);color:var(--papier);width:min(560px,92vw);padding:56px 48px 44px;border-radius:2px}
dialog::backdrop{background:rgba(10,14,12,.78);backdrop-filter:blur(4px)}
dialog h2{font-weight:400;font-size:52px;line-height:1;margin:14px 0 34px}
dialog h2 em{opacity:.6}
dialog .felder{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
dialog label{display:flex;flex-direction:column;gap:8px}
dialog label.breit{grid-column:1/-1}
dialog input,dialog select{background:none;border:0;border-bottom:1px solid rgba(239,233,223,.4);color:var(--papier);font-family:G;font-size:19px;padding:6px 0 8px;border-radius:0}
dialog select option{color:#111}
dialog .senden{--f:var(--nacht);margin-top:34px;width:100%;background:var(--papier);color:var(--tinte);border:0;border-radius:40px;padding:16px;min-height:54px;font-family:G;font-size:18px;cursor:pointer}dialog .senden:hover{color:var(--papier)}
dialog .zu{position:absolute;right:18px;top:14px;background:none;border:0;font-size:28px;cursor:pointer;width:44px;height:44px}
dialog .antwort{margin-top:18px;min-height:1.4em;font-style:italic;opacity:.85}

/* Zeiger */
/* Zeiger: der äußere Rahmen trägt nur die Position (GSAP x/y), der Ring darin Größe und Skalierung – so überschreibt GSAP keine Zustände */
.zeiger{position:fixed;left:0;top:0;width:0;height:0;z-index:90;pointer-events:none;opacity:0;transition:opacity .3s;mix-blend-mode:difference}
.zeiger i{position:absolute;left:-23px;top:-23px;width:46px;height:46px;border-radius:50%;border:1px solid #EFE9DF;transform:scale(.4);transition:transform .5s var(--ease),width .5s var(--ease),height .5s var(--ease),left .5s var(--ease),top .5s var(--ease)}
.zeiger.an{opacity:.9}.zeiger.an i{transform:scale(1)}
.zeiger.gross i{width:84px;height:84px;left:-42px;top:-42px}
@media (hover:none){.zeiger{display:none}}

@media (max-width:820px){
 :root{--rand:24px}
 .hero .bild img{object-position:50% 70%}.hero .flaeche{width:100%}
 .hero .flaeche{left:0;top:auto;height:62%;background:linear-gradient(0deg,rgba(18,26,22,.96) 45%,rgba(18,26,22,0))}
 .hero .siegel{display:none}.hero .menue{top:24px}.hero .x{top:16px}
 .hero .titel{left:var(--rand);right:var(--rand);top:auto;bottom:8vh;transform:none}
 .hero .titel .blk{width:78vw}.hero .kicker{font-size:10px;letter-spacing:.32em;margin-bottom:18px;text-shadow:0 0 12px rgba(10,15,12,.85),0 0 3px rgba(10,15,12,.7)}
 .hero .text{font-size:15px;margin-top:20px}.hero .reserv{margin-top:22px}.hero .lauf{display:none}
  .hero .wisch{padding:0 var(--rand) 16vh}.hero .wisch .wt{font-size:44px}.hero .wisch .lead{font-size:16px}
 .kreise{padding:5vh var(--rand) 11vh}.kreise .paar{flex-direction:column;align-items:center;gap:11vh}
 .kreis{--ef:42px}
 .kreis.k1{--d:72vw;--ex:calc(var(--d) * -.1);--ey:calc(var(--d) * .14)}
 .kreis.k2{--d:76vw;--ex:calc(var(--d) * .42);--ey:calc(var(--d) * .72);margin-top:0}
 .kreis .satz{margin-top:26px;font-size:17px;max-width:none}
 .kreis.k2 .satz{align-self:stretch;text-align:left}
 .haltung{padding:12vh var(--rand) 10vh}.haltung .wz{width:110vw;right:-50vw}
 .haltung h2{margin-top:8vh;text-align:left;font-size:40px}
 .bildblock{grid-template-columns:1fr;margin-top:12vh;gap:6vh}.bildblock .rahmen{max-height:70vh}.bildblock .spalte{padding-bottom:0}.bildblock .plus{display:none}
 .gaenge .vor{grid-template-columns:1fr;padding-top:14vh}.gaenge h2{font-size:40px}
 .buehne .t{width:80vw;top:34%}.buehne .tl{top:60%}
 .buehne .glas{left:auto;right:5vw;height:18vh;bottom:40%}
 .buehne .info{top:calc(60% + 22px)}.buehne .zaehler{top:auto;bottom:28px;right:var(--rand)}.buehne .hinweis{display:none}
 .gastgeber{grid-template-columns:1fr}.gastgeber .bild{height:62svh}.gastgeber .zitat{padding:9vh var(--rand)}
 .gastgeber blockquote{font-size:27px}.gastgeber blockquote .zeile>span{white-space:normal}
 .karten{grid-template-columns:1fr 1fr;gap:14px}.karte .inhalt{padding:16px}.karte .inhalt p{font-size:14px}
 .reservierung .rund{width:150vw}.reservierung .im{width:84vw}.reservierung .gross{font-size:48px}
 .fuss .reihe{grid-template-columns:1fr 1fr;gap:8vh 6vw}
 dialog{padding:48px 24px 32px}dialog .felder{grid-template-columns:1fr}dialog h2{font-size:42px}
}
@media (prefers-reduced-motion:reduce){.js .zeile>span{transform:none}.bildblock .rahmen{clip-path:none}.hero .lauf b{animation:none}.reservierung .rund{transform:translate(-50%,50%)}}

/* Feste Kopfzeile nach dem Auftakt */
.leiste{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:10px var(--rand);background:rgba(18,26,22,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--papier);transform:translateY(-110%);transition:transform .6s var(--ease)}
.leiste.an{transform:none}
.leiste a,.leiste button{min-height:44px;display:inline-flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;color:inherit}
.leiste .lm{font-family:J;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.leiste .lm i{display:block;width:26px;height:1px;background:currentColor;box-shadow:0 6px 0 currentColor;margin-bottom:6px}
.leiste .lmarke{font-family:J;font-size:12px;letter-spacing:.28em}
.leiste .lan{font-size:17px;border:1px solid rgba(239,233,223,.5);border-radius:40px;padding:0 20px}
.leiste .lan{--f:var(--papier)}.leiste .lan:hover{color:var(--tinte)}
.hero .menue{min-height:44px}.hero .reserv{min-height:44px}
.fuss .letzte a{display:inline-block;padding:16px 2px}
@media (max-width:820px){.leiste .lmarke{display:none}.leiste .lan{font-size:15px;padding:0 16px}}
.sz2.sz2-an .sz2-grund img{inset:-8%!important;width:116%!important;height:116%!important}

/* Szenen */
/* Szene 1 – Riesenschrift-Durchflug (nach Referenz „The Art of Life“, pin2/p_f87430).
   Präfix .sz1-, keine globalen Selektoren. Schriften G (EB Garamond) und J (Josefin Sans 300) kommen von der Seite.
   Ohne JS / bei reduzierter Bewegung: drei ruhige Vollbild-Stationen untereinander.
   Mit JS (.sz1-an): eine gepinnte Bühne, Stationen liegen übereinander. */
.sz1{position:relative;background:var(--nacht,#121A16);color:var(--papier,#EFE9DF);font-family:G,Garamond,Georgia,serif}
.sz1-buehne{position:relative}
.sz1-station{position:relative;height:100svh;min-height:560px;overflow:hidden}
.sz1-bild{position:absolute;inset:0;margin:0;overflow:hidden;background:var(--nacht,#121A16)}
.sz1-bild img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.sz1-bild:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,26,22,.55) 0%,rgba(18,26,22,.3) 38%,rgba(18,26,22,.38) 62%,rgba(18,26,22,.8) 100%)}
.sz1-titel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;text-align:left;white-space:nowrap;text-shadow:0 2px 30px rgba(10,14,12,.35)}
.sz1-kicker{display:block;font-family:J,sans-serif;font-weight:300;font-size:12px;letter-spacing:.42em;text-transform:uppercase;color:#D9C7AE;margin:0 0 22px 6px}
.sz1-titel h2{margin:0;font-weight:400;font-size:clamp(58px,11vw,190px);line-height:.92;letter-spacing:-.018em}
.sz1-titel h2 span{display:block}
.sz1-titel h2 span+span{padding-left:.62em}
.sz1-bei{font-style:italic;font-size:.22em;letter-spacing:0;margin-left:.7em;vertical-align:.95em;opacity:.85}
.sz1-fuss{position:absolute;left:var(--rand,64px);right:var(--rand,64px);bottom:34px;z-index:20;display:none;align-items:center;gap:18px;font-family:J,sans-serif;font-weight:300;font-size:12px;letter-spacing:.24em}
.sz1-linie{position:relative;flex:0 0 160px;height:1px;background:rgba(239,233,223,.25)}
.sz1-linie b{position:absolute;left:0;top:0;bottom:0;width:100%;background:var(--kupfer,#9A6644);transform-origin:0 50%;transform:scaleX(0)}

/* gepinnte Fassung */
.sz1.sz1-an .sz1-buehne{height:100svh;min-height:560px;overflow:hidden}
.sz1.sz1-an .sz1-station{position:absolute;inset:0;height:auto;min-height:0;overflow:visible}
.sz1.sz1-an .sz1-bild{will-change:transform,opacity}
.sz1.sz1-an .sz1-station .sz1-titel{z-index:3}
.sz1.sz1-an .sz1-fuss{display:flex}

@media (max-width:820px){
  .sz1-titel{left:50%}
  .sz1-titel h2{font-size:clamp(52px,19vw,104px);line-height:.94}
  .sz1-titel h2 span+span{padding-left:.42em}
  .sz1-bei{display:block;font-size:.24em;margin:.9em 0 0 .3em;vertical-align:0}
  .sz1-kicker{font-size:11px;margin-bottom:16px}
  .sz1-fuss{left:24px;right:24px;bottom:26px}
  .sz1-linie{flex-basis:96px}
}

/* Szene 2 – Halbkreis der Karten (nach Referenz „Voyage“, pin2/p_aaaf73).
   Präfix .sz2-, keine globalen Selektoren. Schriften G und J kommen von der Seite.
   Ohne JS: Kartenreihe zum Wischen mit Unterschrift je Karte.
   Mit JS (.sz2-an): Bühne mit 3D-Bahn, großer Titel über der mittleren Karte, Nebel beim Wechsel. */
.sz2{position:relative;background:var(--nacht,#121A16);color:var(--papier,#EFE9DF);font-family:G,Garamond,Georgia,serif;overflow:hidden}
.sz2-buehne{position:relative;padding:12vh 0 10vh}
.sz2-grund,.sz2-nebel,.sz2-titel,.sz2-pfeil,.sz2-zaehler{display:none}
.sz2-kopf{position:relative;z-index:6;padding:0 var(--rand,64px);display:flex;align-items:center;gap:18px;font-family:J,sans-serif;font-weight:300;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.sz2-kopf:after{content:"";flex:0 0 120px;height:1px;background:var(--kupfer,#9A6644)}
.sz2-bahn{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6vh var(--rand,64px) 0;list-style:none;margin:0}
.sz2-karte{flex:0 0 min(62vw,320px);scroll-snap-align:center;margin:0}
.sz2-bild{position:relative;aspect-ratio:7/10;overflow:hidden;background:#0d1310}
.sz2-bild img{display:block;width:100%;height:100%;object-fit:cover}
.sz2-karte figcaption{padding-top:16px}
.sz2-karte h3{font-weight:400;font-size:26px;line-height:1.1;margin:0}
.sz2-karte p{margin:8px 0 0;font-size:16px;line-height:1.45;opacity:.78}

/* Bühne */
.sz2.sz2-an .sz2-buehne{height:100svh;min-height:560px;padding:0;overflow:hidden;touch-action:pan-y}
.sz2.sz2-an .sz2-grund{display:block;position:absolute;inset:0;z-index:0}
.sz2.sz2-an .sz2-grund img{position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;opacity:0}
.sz2.sz2-an .sz2-grund:after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 48%,rgba(18,26,22,.25) 0%,rgba(18,26,22,.85) 100%)}
.sz2.sz2-an .sz2-nebel{display:block;position:absolute;left:-10%;right:-10%;bottom:-18%;height:62%;z-index:4;pointer-events:none;opacity:0;
  background:radial-gradient(40% 50% at 30% 70%,rgba(239,233,223,.55) 0%,rgba(239,233,223,0) 70%),radial-gradient(45% 55% at 72% 62%,rgba(239,233,223,.5) 0%,rgba(239,233,223,0) 70%),radial-gradient(60% 60% at 50% 95%,rgba(239,233,223,.6) 0%,rgba(239,233,223,0) 75%);filter:blur(28px)}
.sz2.sz2-an .sz2-kopf{position:absolute;left:0;top:34px}
.sz2.sz2-an .sz2-bahn{position:absolute;inset:0;z-index:2;display:block;overflow:visible;padding:0;perspective:1400px;perspective-origin:50% 50%}
.sz2.sz2-an .sz2-karte{position:absolute;left:50%;top:50%;width:min(25vw,42vh);will-change:transform}
.sz2.sz2-an .sz2-bild{box-shadow:0 30px 60px rgba(0,0,0,.45)}
.sz2.sz2-an .sz2-bild:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,26,22,.12) 0%,rgba(18,26,22,.42) 45%,rgba(18,26,22,.6) 100%),rgba(18,26,22,var(--dunkel,0))}
.sz2.sz2-an .sz2-karte figcaption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sz2.sz2-an .sz2-titel{display:block;position:absolute;left:50%;top:50%;z-index:5;width:min(44vw,640px);text-align:center;pointer-events:none;text-shadow:0 2px 24px rgba(10,14,12,.55)}
.sz2-titel .sz2-nr{display:block;font-family:J,sans-serif;font-weight:300;font-size:12px;letter-spacing:.32em;margin-bottom:18px;color:var(--papier,#EFE9DF);opacity:.85}
.sz2-titel h3{font-weight:400;font-size:clamp(46px,5.4vw,92px);line-height:.98;letter-spacing:-.012em;margin:0}
.sz2-titel p{margin:18px auto 0;max-width:30ch;font-size:19px;line-height:1.45}
.sz2-titel .sz2-strich{display:block;width:44px;height:1px;background:var(--kupfer,#9A6644);margin:20px auto 0}
.sz2.sz2-an .sz2-pfeil{display:grid;place-items:center;position:absolute;top:50%;z-index:6;width:52px;height:52px;margin-top:-26px;border-radius:50%;border:1px solid rgba(239,233,223,.45);background:none;color:var(--papier,#EFE9DF);cursor:pointer;font-family:G,serif;font-size:22px;line-height:1;transition:background .4s,color .4s}
.sz2.sz2-an .sz2-pfeil:hover{background:var(--papier,#EFE9DF);color:var(--tinte,#1E2B24)}
.sz2.sz2-an .sz2-pfeil:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.sz2.sz2-an .sz2-zurueck{left:var(--rand,64px)}
.sz2.sz2-an .sz2-weiter{right:var(--rand,64px)}
.sz2.sz2-an .sz2-zaehler{display:flex;position:absolute;left:50%;bottom:32px;z-index:6;transform:translateX(-50%);gap:10px;align-items:center}
.sz2-zaehler i{display:block;width:22px;height:1px;background:rgba(239,233,223,.3);transition:width .5s,background .5s}
.sz2-zaehler i.sz2-jetzt{width:44px;background:var(--papier,#EFE9DF)}

@media (max-width:820px){
  .sz2.sz2-an .sz2-karte{width:min(60vw,40vh)}
  .sz2.sz2-an .sz2-titel{width:84vw}
  .sz2-titel h3{font-size:clamp(38px,11vw,56px)}
  .sz2-titel p{font-size:17px}
  .sz2.sz2-an .sz2-pfeil{top:auto;bottom:22px;margin-top:0;width:44px;height:44px}
  .sz2.sz2-an .sz2-zaehler{bottom:43px}
  .sz2.sz2-an .sz2-kopf{top:26px}
}
/* Lesegrund hinter dem Titel: weicher dunkler Hof, damit Schrift auch über hellen Tellern trägt */
.sz2.sz2-an .sz2-titel:before{content:"";position:absolute;left:8%;right:8%;top:-6%;bottom:-6%;z-index:-1;background:radial-gradient(closest-side,rgba(18,26,22,.62),rgba(18,26,22,0));pointer-events:none}
@media (max-width:820px){
  .sz2.sz2-an .sz2-karte{width:min(66vw,48vh)}
  .sz2.sz2-an .sz2-titel{width:74vw}
  .sz2-titel p{font-size:16px}
  .sz2-kopf{font-size:11px;letter-spacing:.16em;gap:12px}
  .sz2-kopf:after{flex-basis:48px}
}


/* Feinschliff 20.10.2026 */
/* Typografie: Kerning und Ligaturen überall, Mediävalziffern im Garamond-Lauftext, Titel ausgeglichen, Absätze ohne Hurenkinder */
body{font-kerning:normal;font-variant-ligatures:common-ligatures;font-variant-numeric:oldstyle-nums proportional-nums;text-rendering:optimizeLegibility}
.mikro,.leiste .lm,.leiste .lmarke{font-variant-numeric:lining-nums tabular-nums}
h1,h2,h3,blockquote,.etikett{text-wrap:balance}
p,.satz>span,figcaption{text-wrap:pretty}
.reservierung .tel{margin-right:-.24em}
/* Knöpfe mit gerichteter Füllung: Fläche wächst vom Eintrittspunkt des Zeigers und zieht sich zum Austrittspunkt zurück */
.fuell{position:relative;overflow:hidden;isolation:isolate;transition:color .55s var(--ease)}
.fuell:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--f,var(--papier));clip-path:circle(0% at var(--fx,50%) var(--fy,50%));transition:clip-path .75s var(--ease);pointer-events:none}
.fuell:hover:before,.fuell:focus-visible:before{clip-path:circle(160% at var(--fx,50%) var(--fy,50%))}
.fuell:active{transform:scale(.98)}
/* Link-Linien: Linie läuft beim Überfahren nach rechts aus und von links wieder ein */
.linie,.bildblock .link,.fuss .reihe a{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:4px}
.bildblock .link{background-position:0 calc(100% - 5px)}
.linie:hover,.bildblock .link:hover,.fuss .reihe a:hover,.kreis:hover .linie,.kreis:focus-visible .linie{animation:linie .95s var(--ease)}
@keyframes linie{0%{background-size:100% 1px;background-position:100% calc(100% - var(--lo,0px))}42%{background-size:0 1px;background-position:100% calc(100% - var(--lo,0px))}58%{background-size:0 1px;background-position:0 calc(100% - var(--lo,0px))}100%{background-size:100% 1px;background-position:0 calc(100% - var(--lo,0px))}}
.bildblock .link{--lo:5px}
.fuss .reihe a{display:inline-block;padding:13px 0 5px;margin-top:-13px}
.fuss .letzte a{background:linear-gradient(currentColor,currentColor) 0 calc(100% - 12px)/0 1px no-repeat;transition:background-size .6s var(--ease)}
.fuss .letzte a:hover{background-size:100% 1px}
/* Zeiger: über den Kreisen trägt der Ring ein Wort */
.zeiger b{position:absolute;left:-48px;top:-48px;width:96px;height:96px;display:grid;place-items:center;font-family:J;font-weight:300;font-size:9px;letter-spacing:.22em;text-indent:.22em;text-transform:uppercase;color:#EFE9DF;opacity:0;transition:opacity .35s}
.zeiger.wort b{opacity:1}
.zeiger.wort i{width:96px;height:96px;left:-48px;top:-48px}
.zeiger.an.klein i{transform:scale(.42)}
/* Fuß: Wortmarke steigt aus einer Kante */
.fuss .gross{overflow:hidden}
@media (max-width:820px){
 .gastgeber .bild img{object-position:50% 40%}.gastgeber .bild{height:56svh}
 .gastgeber blockquote{font-size:28px;line-height:1.18}
 .reservierung .tel{left:var(--rand);right:var(--rand);font-size:11px;letter-spacing:.16em;margin-right:0}
 .reservierung .im p{font-size:17px}
 .fuss{padding:12vh var(--rand) 28px}
 .fuss .reihe{gap:6vh 6vw;font-size:17px}
 .fuss .reihe .mikro{letter-spacing:.16em;white-space:nowrap}
 .fuss .gross{margin-top:10vh}
 .fuss .letzte{flex-direction:column;align-items:flex-start;gap:0;margin-top:22px}
 .fuss .letzte .mikro,.fuss .letzte{letter-spacing:.16em}
 .rubrik{gap:14px}
}
@media (prefers-reduced-motion:reduce){.fuell:before,.fuell{transition:none}.linie:hover,.bildblock .link:hover,.fuss .reihe a:hover,.kreis:hover .linie{animation:none}.kreis .rund img{transition:none}}
.gastgeber blockquote{font-size:clamp(26px,2.35vw,40px)!important}.gastgeber blockquote .zeile{overflow:visible}.gastgeber blockquote .zeile>span{white-space:normal}

/* Premium 20.10.2026 – additive Veredelung: Struktur, Szenen, Header, Bilder und Texte unverändert; nur Stil und Wertigkeit */
:root{--korn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='k'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23k)'/%3E%3C/svg%3E");--haar:rgba(239,233,223,.15)}
/* Kapitelmarken als echte Abfolge 01–04: Ziffer in Garamond kursiv (Mediävalziffern), Kupfer-Haarlinie zeichnet sich beim Eintreten */
.rubrik .kap,.sz2-kopf .kap{font-family:G,Garamond,serif;font-style:italic;font-weight:400;font-size:17px;letter-spacing:0;text-transform:none;font-variant-numeric:oldstyle-nums proportional-nums;opacity:.7;margin-right:2px;position:relative;top:-1px}
.rubrik:after{background:var(--kupfer);opacity:.9;transform-origin:0 50%;transition:transform 1.6s var(--ease) .2s}
.js .rubrik:not(.da):after{transform:scaleX(0)}
.gaenge .vor .rubrik{grid-column:1/-1;margin-bottom:5vh}
/* Bild-Behandlung: feine Körnung nur im Bild, Vignette als Licht, das von der Mitte kommt */
.bildblock .rahmen:before,.bildblock .rahmen:after,.gastgeber .bild:before,.gastgeber .bild:after,.sz1-bild:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}
.bildblock .rahmen:after,.gastgeber .bild:after,.sz1-bild:before{background:var(--korn);mix-blend-mode:overlay;opacity:.13}
.bildblock .rahmen:before{box-shadow:inset 0 0 140px rgba(18,26,22,.26)}
.gastgeber .bild:before{background:linear-gradient(90deg,rgba(18,26,22,0) 74%,rgba(18,26,22,.5) 100%),radial-gradient(120% 95% at 42% 42%,rgba(18,26,22,0) 58%,rgba(18,26,22,.42) 100%)}
.kreis .rund:before{content:"";position:absolute;inset:0;z-index:1;border-radius:50%;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(239,233,223,.14),inset 0 0 70px rgba(18,26,22,.22)}
/* Licht und Tiefe auf der Drehbühne: ein ruhiger Lichtkegel über dem Teller in der Mitte */
.buehne:before{content:"";position:absolute;left:50%;top:42%;width:min(120vh,92vw);aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(239,233,223,.075),rgba(239,233,223,0));pointer-events:none}
/* Bildunterschrift mit Einzug durch eine Haarlinie */
.bildblock .unterschrift{display:flex;align-items:center;gap:14px}
.bildblock .unterschrift:before{content:"";flex:0 0 28px;height:1px;background:currentColor;opacity:.5}
/* Gastgeberstimme: Name kursiv, Anlass in Versal darunter, Kupferstrich als Ansatz */
.gastgeber blockquote{hanging-punctuation:first allow-end}
.gastgeber cite{display:flex;flex-direction:column;align-items:flex-start;gap:8px;opacity:1}
.gastgeber cite:before{content:"";width:36px;height:1px;background:var(--kupfer);margin-bottom:10px}
.gastgeber cite .wer{font-size:21px;line-height:1.2;opacity:.88}
.gastgeber cite .mikro{opacity:.6;line-height:1.7}
/* Fuß als letzter Gestaltungsmoment: Haarlinie über der letzten Zeile, Tischzeichen als Siegel in der Mitte */
.fuss .letzte{border-top:1px solid var(--haar);padding-top:6px;margin-top:30px}
.fuss .letzte a.siegel-f{display:grid;place-items:center;width:46px;height:46px;padding:0;background:none;border:1px solid rgba(239,233,223,.4);border-radius:50%;transition:border-color .5s var(--ease)}.fuss .letzte a.siegel-f:hover{border-color:var(--papier)}
.fuss .siegel-f svg{width:26px;height:11px;fill:var(--papier)}
@media (max-width:820px){
 .rubrik .kap,.sz2-kopf .kap{font-size:15px}
 .gaenge .vor .rubrik{margin-bottom:3vh}
 .gastgeber .bild:before{background:linear-gradient(180deg,rgba(18,26,22,0) 70%,rgba(18,26,22,.55) 100%),radial-gradient(120% 95% at 50% 40%,rgba(18,26,22,0) 60%,rgba(18,26,22,.35) 100%)}
 .gastgeber cite .wer{font-size:19px}
 .fuss .letzte a.siegel-f{display:none}
}
@media (prefers-reduced-motion:reduce){.js .rubrik:not(.da):after{transform:none}.rubrik:after{transition:none}}

/* CD 21.10.2026 – additiv: Header als Lichtbild, größere Typo-Skala, stille Vollbild-Szene. Settele-Aufbau unverändert. */
/* Header: das Bild ist ein Lichtbild. Dämmer (−0,8 Blenden ≈ 43 % Nacht) weicht, ein warmes Licht legt sich über den Teller,
   die Kamera fährt sehr langsam heran (Rahmen .bild, damit der Wisch am img nicht kollidiert). Ohne JS: Endzustand. */
.hero .bild{transform-origin:74% 66%}
.hero .bild .daemmer{position:absolute;inset:0;background:#0b100d;opacity:0;pointer-events:none}
.hero .bild picture{display:block;width:100%;height:100%}
.hero .bild .licht{--lx:74;--ly:64;position:absolute;inset:-10% -10%;pointer-events:none;mix-blend-mode:soft-light;opacity:.85;background:radial-gradient(34% 40% at calc(var(--lx) * 1%) calc(var(--ly) * 1%),rgba(255,224,178,.75) 0%,rgba(255,214,160,.28) 45%,rgba(255,214,160,0) 72%)}
.hero .bild:after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--korn);mix-blend-mode:overlay;opacity:.09}
/* Die harte Kante der Fläche als Kupfer-Haarlinie, sie zeichnet sich von oben nach unten */
.hero .flaeche:after{content:"";position:absolute;top:0;bottom:0;right:0;width:1px;background:var(--kupfer);opacity:.75;transform-origin:50% 0;transform:scaleY(var(--kante,1))}
/* Wortmarke mit mehr Gewicht im Raum: größer, weiter links, schneidet die Bildkante */
.hero .titel{left:15.5vw}
.hero .titel .blk{width:min(42vw,820px)}
.hero .kicker{margin-bottom:34px}
.hero .text{font-size:19px;line-height:1.52;max-width:33ch;margin-top:40px}
/* Rahmenlinie und Kapitelzeile am Fuß des Headers: Haarlinie von Rand zu Rand, darunter Ort und Koordinaten, rechts der Abend in drei Worten */
.hero .hfuss{position:absolute;left:var(--rand);right:var(--rand);bottom:30px;z-index:5;display:flex;justify-content:space-between;align-items:flex-end;font-size:11px;letter-spacing:.26em;color:var(--papier);pointer-events:none}
.hero .hfuss:before{content:"";position:absolute;left:0;right:0;top:-22px;height:1px;background:rgba(239,233,223,.16);transform-origin:0 50%;transform:scaleX(var(--linie,1))}
.hero .hfuss span{opacity:.62}
.hero .hfuss .ort b{font-weight:300;opacity:.7;margin-left:14px}
.hero .lauf{bottom:calc(30px + 34px)}
/* Wisch „Ein Tisch. Zwei Gastgeber.“: große, leichte Typografie */
.hero .wisch .wt{font-size:clamp(60px,8.6vw,164px);line-height:.98;letter-spacing:-.018em}
.hero .wisch .lead{font-size:20px;margin-top:5vh}
/* Typo-Skala der Kapitel */
.haltung h2{font-size:clamp(44px,6.4vw,118px);line-height:1.02;letter-spacing:-.018em;max-width:1300px}
.gaenge h2{font-size:clamp(44px,6vw,108px);line-height:1;letter-spacing:-.016em}
/* Bildblock: das Bild bekommt Fläche und Luft */
.bildblock{grid-template-columns:minmax(0,62fr) minmax(0,38fr);gap:7vw;margin-top:24vh}
.bildblock .rahmen{max-height:94vh}
/* Galerie 21.10.2026: zwei helle Atempausen auf Papier mit hartem Schnitt. (1) Vorspann der Gänge, (2) „In Bildern“ nach der Gänge-Bühne. */
.gaenge .vor{background:var(--papier);color:var(--tinte);padding:24vh var(--rand) 24vh;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2vw;align-items:center}
.gaenge .vor .sig-text{grid-column:1/6;grid-row:1}
.gaenge .vor .rubrik{margin-bottom:9vh}
.gaenge .vor h2{font-size:clamp(44px,5vw,92px)}
.gaenge .vor h2 em{opacity:.62}
.gaenge .vor .sig-text>p{margin-top:6vh;max-width:32ch;font-size:19px;line-height:1.55;opacity:.8;padding:0}
.sig-gruss{margin-top:9vh;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.sig-linie{display:block;width:44px;height:1px;background:var(--kupfer)}
.signatur{display:block;font-style:italic;font-size:clamp(34px,3vw,52px);line-height:1.05;letter-spacing:-.01em}
.signatur svg{display:block;height:1.4em;width:auto}
.sig-rolle{opacity:.68}
.sig-raster{grid-column:7/13;grid-row:1;display:grid;grid-template-columns:1fr 1fr;gap:1.6vw}
.sig-r{position:relative;display:block;overflow:hidden;aspect-ratio:4/5;background:#e3dccf}
.sig-r img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover}

.galerie{position:relative;background:var(--papier);color:var(--tinte);padding:22vh var(--rand) 30vh;overflow:hidden}
.gal-kopf{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2vw;align-items:end;margin-bottom:16vh}
.gal-kopf .rubrik{grid-column:1/-1;margin-bottom:9vh}
.gal-kopf h2{grid-column:1/8;font-weight:400;font-size:clamp(44px,6vw,108px);line-height:1;letter-spacing:-.016em}
.gal-kopf h2 em{opacity:.62}
.gal-kopf p{grid-column:9/13;font-size:18px;line-height:1.55;opacity:.8;padding-bottom:10px}
.gal-tipp{display:block;margin-top:22px;opacity:.6}
.gal-raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2vw;row-gap:14vh;align-items:start}
.gal-f{grid-column:var(--d);margin-top:var(--dt,0);min-width:0}
.gal-weit{margin-left:calc(var(--rand) * -1);margin-right:calc(var(--rand) * -1)}
.gal-b{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;text-align:left}
.gal-r{position:relative;display:block;overflow:hidden;background:#e3dccf}
.gal-r img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%;transition:filter .8s var(--ease)}
.gal-b:hover img{filter:brightness(1.04)}
.gal-f figcaption{display:flex;align-items:baseline;gap:14px;margin-top:16px}
.gal-weit figcaption{padding:0 var(--rand)}
.gal-nr{font-style:italic;font-size:17px;font-variant-numeric:oldstyle-nums proportional-nums;opacity:.7}
.gal-f figcaption .mikro{opacity:.74}
.gal-satz{grid-column:var(--d);margin-top:var(--dt,0);font-size:clamp(40px,5vw,92px);line-height:1.02;letter-spacing:-.016em}
.gal-satz em{opacity:.62}

/* Lichtbild: ruhige Vollbildansicht */
dialog.lb{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--nacht);color:var(--papier);overflow:hidden}
dialog.lb::backdrop{background:var(--nacht);backdrop-filter:none}
.lb-buehne{position:absolute;inset:7vh 9vw 13vh;touch-action:pan-y}
.lb-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.lb-unter{position:absolute;left:0;right:0;bottom:4.5vh;display:flex;justify-content:center;align-items:baseline;gap:18px}
.lb-nr{font-style:italic;font-size:17px;font-variant-numeric:oldstyle-nums proportional-nums;opacity:.7}
.lb-text{opacity:.74}
.lb-pfeil{position:absolute;top:50%;margin-top:-28px;width:56px;height:56px;border-radius:50%;border:1px solid rgba(239,233,223,.36);background:none;color:var(--papier);font-size:20px;cursor:pointer;transition:border-color .4s}
.lb-pfeil:hover{border-color:rgba(239,233,223,.9)}
.lb-zurueck{left:var(--rand)}.lb-weiter{right:var(--rand)}
.lb-zu{position:absolute;right:var(--rand);top:28px;width:48px;height:48px;background:none;border:0;cursor:pointer}
.lb-zu:before,.lb-zu:after{content:"";position:absolute;left:23px;top:6px;bottom:6px;width:1px;background:var(--papier);transform:rotate(45deg)}.lb-zu:after{transform:rotate(-45deg)}
html.lb-offen{overflow:hidden}
@media (max-width:820px){
 .gaenge .vor{grid-template-columns:1fr;padding:12vh var(--rand) 14vh}
 .gaenge .vor .sig-raster{grid-column:1/-1;grid-row:1;gap:3vw}
 .gaenge .vor .sig-text{grid-column:1/-1;grid-row:2;margin-top:10vh}
 .gaenge .vor .rubrik{margin-bottom:5vh}
 .gaenge .vor h2{font-size:42px}
 .gaenge .vor .sig-text>p{margin-top:4vh;font-size:17px}
 .sig-gruss{margin-top:6vh}
 .signatur{font-size:36px}
 .galerie{padding:14vh var(--rand) 18vh}
 .gal-kopf{grid-template-columns:1fr;margin-bottom:9vh}
 .gal-kopf .rubrik{margin-bottom:5vh}
 .gal-kopf h2,.gal-kopf p{grid-column:1/-1}
 .gal-kopf h2{font-size:42px}
 .gal-kopf p{margin-top:4vh;font-size:17px}
 .gal-raster{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:3vw;row-gap:8vh}
 .gal-f,.gal-satz{grid-column:var(--m);margin-top:var(--mt,0)}
 .gal-satz{font-size:40px}
 .gal-f figcaption{margin-top:12px;gap:10px}
 .gal-nr{font-size:15px}
 .lb-buehne{inset:9vh 0 16vh}
 .lb-pfeil{top:auto;bottom:3vh;margin-top:0;width:48px;height:48px}
 .lb-unter{bottom:calc(3vh + 14px)}
 .lb-zu{top:14px}
}
@media (max-width:820px){
 .hero .titel{left:var(--rand)}
 .hero .titel .blk{width:84vw}
 .hero .text{font-size:16px;margin-top:22px}
 .hero .flaeche:after,.hero .hfuss{display:none}
 .hero .bild{transform-origin:50% 29%}
 .hero .bild img{object-position:50% 50%}
 .hero .bild .licht{background:radial-gradient(60% 34% at 50% 29%,rgba(255,224,178,.7) 0%,rgba(255,214,160,.25) 45%,rgba(255,214,160,0) 72%)}
 .hero .flaeche{height:68%}
 /* hero2 – Handy: eigenes Vollbild-Menü. Oben ein Bildband, das ruhig durch die Fotos blendet, darunter die Liste, unten die Anfragezeile */
 .hero nav.hm{--hm-b:100%}
 .hm-grund{width:100%;background:var(--nacht)}
 .hm-bilder{left:0;bottom:auto;height:31svh;clip-path:inset(0 0 100% 0)}
 .hm-bilder:after{background:linear-gradient(180deg,rgba(18,26,22,.55) 0%,rgba(18,26,22,0) 34%,rgba(18,26,22,0) 58%,var(--nacht) 100%)}
 .hm-cap{left:var(--rand);right:var(--rand);bottom:10px;font-size:10px}
 .hm-liste{left:var(--rand);right:var(--rand);top:calc(31svh + 6px);transform:none;width:auto;gap:0}
 .hm-liste a{--ts:clamp(27px,7.6vw,32px);grid-template-columns:38px minmax(0,1fr);min-height:46px;padding:4px 0}
 .hm-u{display:none}
 .hm-linie{left:-18px;width:12px}
 .hm-liste a.an .hm-t>span{translate:6px 0}
 .hm-fuss{left:var(--rand);right:var(--rand);width:auto;bottom:max(18px,env(safe-area-inset-bottom));row-gap:10px}
 .hm-gruss{font-size:17px;padding-bottom:8px}.hm-an{font-size:18px}
 .hero .hm-glas{height:min(10svh,74px);margin-right:4%}
 .hm-wer{font-size:9.5px;letter-spacing:.2em}.hm-ort{display:none}
 .hero .hdatum{display:none}
 .hero .wisch .wt{font-size:clamp(46px,14vw,64px)}.hero .wisch .lead{font-size:17px}
 .haltung h2{font-size:42px}.gaenge h2{font-size:42px}
 .bildblock{grid-template-columns:1fr;gap:6vh;margin-top:12vh}
}

/* Luxus 21.10.2026 – eine Grammatik für die ganze Seite (Maßstab: „02 Die Gänge“ und „03 In Bildern“).
   Abstands-Tokens: --rand (Seitenrand), --luft (Sektion oben/unten), --a1 (Rubrik → Satz, Satz → Gruß), --a2 (Satz → Text), --spalt (Rasterfuge).
   Signatur-Geste: feine Kupferlinie + Kursive (.sig-link, .sig-gruss). Additiv: Ideen und Szenen unverändert. */
:root{--rand:clamp(64px,5.6vw,112px);--luft:clamp(120px,22vh,260px);--a1:clamp(48px,9vh,96px);--a2:clamp(28px,5vh,56px);--spalt:2vw;
 --pfeil:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 12'%3E%3Cpath d='M0 6H43M37 .5L43 6 37 11.5' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E")}
/* Signatur-Geste als Verweis: Kupferlinie, dann die Kursive; die Linie wächst beim Überfahren */
.sig-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;margin-top:20px;padding:0;background:none;font-family:G,Garamond,serif;font-style:italic;font-weight:400;font-size:21px;line-height:1.2;color:inherit;cursor:pointer}
.sig-link:before{content:"";flex:0 0 44px;height:1px;background:var(--kupfer);transition:flex-basis .8s var(--ease)}
.sig-link:hover:before,.sig-link:focus-visible:before,.kreis:hover .sig-link:before,.kreis:focus-visible .sig-link:before{flex-basis:76px}
/* Kreise: ruhige Satzspalten mit gleicher Kante unter jedem Kreis */
.kreise{padding:var(--luft) var(--rand)}
.kreis .satz,.kreis.k2 .satz{align-self:flex-start;text-align:left;max-width:30ch;margin-top:var(--a2);font-size:19px;line-height:1.55}
.kreis .satz>span{display:block;opacity:.8}
.kreis .satz b.sig-link{display:flex;margin-top:22px;font-size:21px}
/* 01 Der Abend: Rubrik und Satz auf der Rasterkante statt mittig */
.haltung{padding:var(--luft) var(--rand)}
.haltung h2{margin:var(--a1) 0 0;text-align:left;max-width:none}
.bildblock{margin-top:var(--luft)}
.bildblock .plus{display:none}
.bildblock .spalte p{font-size:19px;line-height:1.55;opacity:.86}
.haltung .kv-begleiter{margin-bottom:var(--a1)}
/* Durchflug: Vorzeile mit Kupferstrich */
.sz1-kicker{display:flex;align-items:center;gap:16px}
.sz1-kicker:after{content:"";flex:0 0 44px;height:1px;background:var(--kupfer)}
/* 02 Die Gänge (Maßstab) auf die Tokens */
.gaenge .vor{padding:var(--luft) var(--rand);column-gap:var(--spalt)}
.gaenge .vor .rubrik{margin-bottom:var(--a1)}
.gaenge .vor .sig-text>p{margin-top:var(--a2)}
.sig-gruss{margin-top:var(--a1)}
/* Gänge-Bühne: Unterzeile als Satzspiegel – großer Gangname, kursive Weinzeile, Zähler in Mediävalziffern, Pfeile als Haarlinien */
.buehne .info{left:var(--rand);top:calc(74% + var(--a2))}
.buehne .info h3{font-size:clamp(40px,4.2vw,76px);line-height:1;letter-spacing:-.012em;margin:20px 0 12px}
.buehne .info p{font-size:21px;opacity:.72}
.buehne .zaehler{top:calc(74% + var(--a2));gap:6px}
.buehne .striche{display:none}
.buehne .zaehler button,.sz2.sz2-an .sz2-pfeil{width:64px;height:48px;border:0;border-radius:0;background:none;font-size:0;color:var(--papier);opacity:.62;transition:opacity .5s var(--ease)}
.buehne .zaehler button:before{display:none}
.buehne .zaehler button:after,.sz2.sz2-an .sz2-pfeil:after{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:var(--pfeil) center/44px 12px no-repeat;mask:var(--pfeil) center/44px 12px no-repeat;transition:transform .6s var(--ease)}
.buehne .zaehler button[data-vor="-1"]:after,.sz2.sz2-an .sz2-zurueck:after{transform:scaleX(-1)}
.buehne .zaehler button:hover,.sz2.sz2-an .sz2-pfeil:hover{opacity:1;color:var(--papier);background:none}
.buehne .zaehler button[data-vor="1"]:hover:after,.sz2.sz2-an .sz2-weiter:hover:after{transform:translateX(6px)}
.buehne .zaehler button[data-vor="-1"]:hover:after,.sz2.sz2-an .sz2-zurueck:hover:after{transform:scaleX(-1) translateX(6px)}
.gz{display:flex;align-items:baseline;gap:8px;margin:0 14px;font-family:G,Garamond,serif;font-style:italic;font-size:17px;letter-spacing:0;text-transform:none;font-variant-numeric:oldstyle-nums proportional-nums}
.gz b{font-weight:400;font-size:36px;line-height:1}.gz span{opacity:.6}
.buehne .hinweis{bottom:34px;opacity:.5}
.buehne .glas svg{-webkit-mask-image:linear-gradient(0deg,#000 calc(var(--kv-p,1) * 122% - 22%),transparent calc(var(--kv-p,1) * 122%));mask-image:linear-gradient(0deg,#000 calc(var(--kv-p,1) * 122% - 22%),transparent calc(var(--kv-p,1) * 122%))}
/* 03 In Bildern: Federzeichnungen in den Leerräumen, Tannengrün leise, hinter oder neben den Bildern */
.galerie{padding:var(--luft) var(--rand) calc(var(--luft) * 1.3)}
.gal-kopf{column-gap:var(--spalt);margin-bottom:var(--luft)}
.gal-kopf .rubrik{margin-bottom:var(--a1)}
.gal-raster{column-gap:var(--spalt)}
.gal-kv{grid-column:var(--d);margin-top:var(--dt,0);min-width:0;color:var(--tinte);pointer-events:none}
.gal-kv .kv-ding{opacity:.2;--kv-r:20deg}
.gal-kv-a{align-self:center}
.gal-kv-b .kv-ding{--kv-r:0deg;width:86%;margin-left:auto}
.gal-kv-name{display:block;margin-top:16px;font-style:italic;font-size:17px;opacity:.62}
.gal-mit-kv{position:relative;isolation:isolate}
.gal-kv-c{position:absolute;right:calc(100% - 4vw);bottom:18%;width:22vw;z-index:-1;margin:0}
/* 04 Die Gastgeber: Satz, kurzer Text, Signatur */
.gastgeber .zitat{padding:var(--a1) var(--rand) var(--a1) 5vw}
.gastgeber blockquote{margin:var(--a1) 0 var(--a2)}
.gg-text{max-width:32ch;margin-bottom:var(--a1);font-size:19px;line-height:1.55;opacity:.78}
/* 05 Anlässe: Titel nicht mehr auf dem Bild – er steht unter der Kupferlinie wie eine Bildunterschrift */
.sz2.sz2-an .sz2-kopf{top:calc(64px + 4vh);padding:0 var(--rand)}
.sz2.sz2-an .sz2-karte{top:42%;width:min(19vw,34vh)}
body .sz2.sz2-an .sz2-buehne::after{top:calc(42% + min(19vw,34vh) * .714 + 28px)}
.sz2.sz2-an .sz2-titel{top:calc(42% + min(19vw,34vh) * .714 + 150px);height:220px;text-shadow:none;width:min(52vw,760px)}
.sz2.sz2-an .sz2-titel:before{display:none}
.sz2-titel .sz2-nr{font-family:G,Garamond,serif;font-style:italic;font-size:17px;letter-spacing:0;margin-bottom:12px;opacity:.7;font-variant-numeric:oldstyle-nums proportional-nums}
.sz2-titel h3{font-size:clamp(40px,3.6vw,66px)}
.sz2-titel p{margin-top:14px;font-size:19px;opacity:.78}
.sz2.sz2-an .sz2-pfeil{top:calc(42% + min(19vw,34vh) * .714 + 60px);margin-top:0}
.sz2.sz2-an .sz2-zaehler{display:none}
/* Ihr Abend: kürzere dunkle Strecke, im Halbkreis baut sich der Tisch auf – Platte, Glas, Siegel, Zitrone */
.reservierung{height:118svh}
.reservierung .tel .kap{font-family:G,Garamond,serif;font-style:italic;font-size:17px;letter-spacing:0;margin-right:14px;font-variant-numeric:oldstyle-nums proportional-nums}
.reservierung .tel:after{content:"";display:block;width:44px;height:1px;background:var(--kupfer);margin:18px auto 0}
.reservierung .gross{font-size:clamp(56px,6vw,104px);letter-spacing:-.014em}
.reservierung .im{bottom:6vh;width:min(64vh,80vw)}
.reservierung .kv-anstoss{display:none}
.ra-szene{position:relative;height:clamp(90px,13vh,140px);margin:0 auto var(--a2);color:var(--tinte)}
.ra-platte{position:absolute;left:50%;bottom:0;width:min(96vh,80vw);margin-left:calc(min(96vh,80vw) / -2);height:1px;background:var(--kupfer);transform-origin:50% 50%}
.ra-szene .ra-glas{position:absolute;bottom:0;left:calc(50% - 128px);width:auto;height:100%;aspect-ratio:1320/3218;--kv-r:0deg}
.ra-szene .ra-zitrone{position:absolute;bottom:0;left:calc(50% + 64px);width:auto;height:58%;aspect-ratio:3056/1915;--kv-r:90deg}
.ra-siegel{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border:1px solid rgba(30,43,36,.4);border-radius:50%;display:grid;place-items:center}
.ra-siegel svg{width:34px;height:14px;fill:var(--tinte)}
/* Fuß: Satz mit Signatur links, die Angaben als 2 × 2 rechts – Echo des Vierer-Rasters */
.fuss{padding:var(--luft) var(--rand) 40px}
.fuss .reihe{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);row-gap:var(--a2);align-items:start}
.fuss .fu-satz{grid-column:1/7;grid-row:1/3}
.fuss .reihe>div:nth-child(2){grid-column:8/10;grid-row:1}.fuss .reihe>div:nth-child(3){grid-column:11/13;grid-row:1}
.fuss .reihe>div:nth-child(4){grid-column:8/10;grid-row:2}.fuss .reihe>div:nth-child(5){grid-column:11/13;grid-row:2}
.fu-gross{font-size:clamp(36px,3.6vw,64px);line-height:1.06;letter-spacing:-.012em;text-wrap:balance}
.fu-gross em{opacity:.62}
.fuss .sig-gruss{margin-top:var(--a2)}
.fuss .signatur{font-size:clamp(28px,2.4vw,40px)}
.fuss .reihe a.sig-link{display:inline-flex;margin-top:-6px;padding:0;background:none}
.fuss .gross{margin-top:var(--luft)}
@media (max-width:820px){
 :root{--rand:24px;--luft:clamp(88px,13vh,128px);--a1:clamp(36px,5vh,56px);--a2:clamp(22px,3.5vh,36px);--spalt:3vw}
 .sig-link{font-size:19px}
 .kreis .satz,.kreis.k2 .satz{max-width:none;font-size:17px}
 .haltung h2{font-size:40px}
 .bildblock{margin-top:var(--a1)}
 .buehne .info{top:calc(60% + 22px)}.buehne .info h3{font-size:36px;margin:14px 0 8px}.buehne .info p{font-size:18px}
 .buehne .zaehler{top:auto;bottom:22px}.buehne .zaehler button{width:52px;height:44px}.gz b{font-size:26px}.gz{margin:0 6px}
 .gal-kv{grid-column:var(--m);margin-top:var(--mt,0)}
 .gal-kv-b{display:none}
 .fuss .reihe a.sig-link{white-space:nowrap;gap:12px}.fuss .reihe a.sig-link:before{flex-basis:24px}
 .gal-kv-c{right:-6vw;left:auto;bottom:auto;top:-9vh;width:46vw}
 .gastgeber .zitat{padding:var(--luft) var(--rand)}
 .gg-text{font-size:17px}
 .sz2.sz2-an .sz2-kopf{top:calc(56px + 3vh)}
 .sz2.sz2-an .sz2-karte{top:40%;width:min(54vw,34vh)}
 body .sz2.sz2-an .sz2-buehne::after{top:calc(40% + min(54vw,34vh) * .714 + 22px)}
 .sz2.sz2-an .sz2-titel{top:calc(40% + min(54vw,34vh) * .714 + 112px);height:170px;width:80vw}
 .sz2-titel h3{font-size:36px}.sz2-titel p{font-size:16px;margin-top:10px}
 .sz2.sz2-an .sz2-pfeil{top:calc(40% + min(54vw,34vh) * .714 + 22px);bottom:auto;margin-top:-24px;width:48px;height:48px}
 .reservierung .rund{width:200vw}
 .reservierung .im{width:86vw;bottom:5vh}
 .reservierung .gross{font-size:46px}
 .ra-szene{height:84px}
 .ra-platte{width:100vw;margin-left:-50vw}
 .ra-szene .ra-glas{left:calc(50% - 98px)}.ra-szene .ra-zitrone{left:calc(50% + 44px)}
 .ra-siegel{width:48px;height:48px;margin:-24px 0 0 -24px}.ra-siegel svg{width:28px;height:12px}
 .fuss .reihe{grid-template-columns:1fr 1fr;row-gap:6vh}
 .fuss .fu-satz{grid-column:1/-1;grid-row:auto;margin-bottom:2vh}
 .fuss .reihe>div:nth-child(n+2){grid-column:auto;grid-row:auto}
 .fu-gross{font-size:34px}
}
/* Prüfer r27 */
.kv-begleiter,.kv-wandel,.kv-rand,.kv-fries,.galerie,.gal,section{overflow-x:clip}
.reservierung .tel{top:8vh}
dialog label .mikro,dialog .mikro{opacity:1;color:rgba(30,43,36,.84)}
.gal-tipp,.gal-hinweis{opacity:1!important;color:rgba(30,43,36,.74)!important}

/* Toskana 21.10.2026 – additiv: „02 Der erste Abend · Una Serata Toscana" als gedruckte Menükarte auf Tannengrün,
   „06 Der Raum · Concept Kitchen" mit den echten Raumfotos (640 px: Anzeige nie breiter als 800 px), Kontakt in Fuß und Ebene.
   Kupfer nur als feine Linie (Rahmen der Karte, Tischplatte, Striche). Ohne JS und bei reduzierter Bewegung steht alles fertig. */
/* Header: Hinweiszeile rechts im Fuß des Headers – gleiche Versalzeile, nur mit Kupferstrich davor */
.hero .hfuss .h-erst{pointer-events:auto;display:inline-flex;align-items:center;gap:14px;min-height:44px;margin:-16px 0;color:var(--papier);opacity:.86;transition:opacity .5s var(--ease)}
.hero .hfuss .h-erst .h-e1{opacity:1;white-space:pre}
.hero .hfuss .h-erst i{display:block;width:28px;height:1px;background:var(--kupfer);transform-origin:100% 50%;transition:width .7s var(--ease)}
.hero .hfuss .h-erst:hover,.hero .hfuss .h-erst:focus-visible{opacity:1}.hero .hfuss .h-erst:hover i{width:52px}
/* Menü: ein Punkt mehr – Liste etwas höher, Fugen etwas enger */
.hm-liste{top:45%;gap:clamp(4px,1vh,14px)}

/* 02 Der erste Abend */
.toskana{position:relative;isolation:isolate;background:radial-gradient(70% 55% at 72% 38%,#26372e 0%,var(--gruen) 52%,var(--nacht) 100%);color:var(--papier);padding:var(--luft) var(--rand) calc(var(--a1) * 1.6)}
.toskana:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--korn);mix-blend-mode:overlay;opacity:.07;pointer-events:none}
.tk-raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);align-items:start}
.tk-text{grid-column:1/6;position:sticky;top:calc(72px + 5vh);padding-bottom:8vh}
.toskana h2{margin-top:var(--a1);font-weight:400;font-size:clamp(48px,6vw,108px);line-height:1;letter-spacing:-.016em}
.toskana h2 em{opacity:.62}
.tk-unter{margin-top:calc(var(--a2) * .8);color:rgba(239,233,223,.72)}
.tk-lead{margin-top:var(--a2);max-width:36ch;font-size:19px;line-height:1.55;opacity:.84}
.tk-daten{margin-top:var(--a2);max-width:460px;display:grid;grid-template-columns:auto 1fr;column-gap:28px;border-top:1px solid var(--haar)}
.tk-daten dt,.tk-daten dd{padding:13px 0 12px;border-bottom:1px solid var(--haar)}
.tk-daten dt{font-family:J;font-weight:300;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:rgba(239,233,223,.62);padding-top:17px;font-variant-numeric:lining-nums}
.tk-daten dd{font-size:18px;line-height:1.35}
.tk-daten a{display:inline-block;padding:14px 0 6px;margin:-14px 0 -6px;background-position:0 100%}
.tk-text .tk-an{margin-top:calc(var(--a2) * .9)}
.tk-hinweis{margin-top:10px;font-style:italic;font-size:16px;opacity:.6}
.tk-buehne{grid-column:7/13;position:relative;display:flex;justify-content:center;padding-bottom:0}
.tk-platte{position:absolute;left:calc(-60vw);right:calc(var(--rand) * -1);bottom:0;height:1px;background:var(--kupfer);opacity:.85;transform-origin:100% 50%;z-index:0}
.tk-glas,.tk-platte{pointer-events:none}
.toskana .tk-glas{position:absolute;bottom:1px;right:calc(100% + var(--spalt) * 1.5);width:auto;height:min(28vh,250px);aspect-ratio:1320/3218;color:var(--papier);opacity:.9;z-index:1}
/* die Karte: Papier, doppelte Rahmenlinie (Kupfer + Tinte), blind geprägtes Tischzeichen, Licht folgt dem Zeiger */
.tk-karte{position:relative;z-index:2;width:min(100%,600px);background:#F5F0E7;color:var(--tinte);text-align:center;isolation:isolate;
 padding:clamp(60px,6.4vw,92px) clamp(40px,4.6vw,72px) clamp(52px,5.4vw,80px);
 box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 60px 90px -40px rgba(0,0,0,.7),0 22px 40px -22px rgba(0,0,0,.5)}
.tk-karte:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--korn);mix-blend-mode:multiply;opacity:.12;pointer-events:none}
.tk-licht{--mx:30;--my:12;position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(70% 45% at calc(var(--mx) * 1%) calc(var(--my) * 1%),rgba(255,252,244,.75),rgba(255,252,244,0) 70%),linear-gradient(180deg,rgba(255,255,255,0) 60%,rgba(30,43,36,.045) 100%)}
.tk-rahmen{position:absolute;inset:16px;pointer-events:none}
.tk-rahmen:after{content:"";position:absolute;inset:6px;border:1px solid rgba(30,43,36,.13)}
.tk-rahmen i{position:absolute;background:var(--kupfer)}
.tk-rahmen i:nth-child(1),.tk-rahmen i:nth-child(3){left:0;right:0;height:1px}
.tk-rahmen i:nth-child(1){top:0;transform-origin:0 50%}.tk-rahmen i:nth-child(3){bottom:0;transform-origin:100% 50%}
.tk-rahmen i:nth-child(2),.tk-rahmen i:nth-child(4){top:0;bottom:0;width:1px}
.tk-rahmen i:nth-child(2){right:0;transform-origin:50% 0}.tk-rahmen i:nth-child(4){left:0;transform-origin:50% 100%}
.tk-praegung{display:block;width:84px;margin:0 auto 26px}
.tk-praegung svg{display:block;width:100%;height:auto;fill:#F5F0E7;filter:drop-shadow(0 1px 0 rgba(255,255,255,.95)) drop-shadow(0 -1px 0 rgba(30,43,36,.26)) drop-shadow(0 0 1px rgba(30,43,36,.08))}
.tk-marke{font-size:10.5px;letter-spacing:.32em;opacity:.72}
.tk-marke span{display:block;margin-top:8px;font-family:G,Garamond,serif;font-style:italic;font-size:15px;letter-spacing:0;text-transform:none}
.tk-m{display:block;overflow:hidden;padding-bottom:.1em}.tk-m>span{display:block}
.tk-kt{margin-top:28px;font-weight:400;font-style:italic;font-size:clamp(38px,3.4vw,58px);line-height:1.04;letter-spacing:-.012em}
.tk-ku{margin-top:12px;font-size:17px;line-height:1.4;opacity:.72}
.tk-strich{display:block;width:44px;height:1px;margin:30px auto;background:var(--kupfer);transform-origin:50% 50%}
.tk-folge{list-style:none;display:grid;gap:clamp(22px,3.2vh,32px)}
.tk-gang{display:flex;flex-direction:column;align-items:center}
.tk-art{font-size:10.5px;letter-spacing:.3em;opacity:.6;margin-bottom:8px}
.tk-nr{font-style:italic;font-size:15px;line-height:1;opacity:.55;margin-bottom:10px;font-variant-numeric:oldstyle-nums}
.tk-teller,.tk-wein{display:block;overflow:hidden;padding-bottom:.12em;max-width:30em}
.tk-teller>span,.tk-wein>span{display:block}
.tk-teller{font-size:clamp(18px,1.45vw,21px);line-height:1.38;text-wrap:balance}
.tk-wein{margin-top:5px;font-style:italic;font-size:16px;line-height:1.4;opacity:.72;text-wrap:balance}
.tk-teller b,.tk-wein b{font-weight:400;font-style:normal;opacity:.34;margin:0 .18em}
.tk-zier{display:flex;align-items:center;justify-content:center;gap:16px;margin:6px 0 2px;font-family:J;font-weight:300;font-size:10px;letter-spacing:.32em;text-transform:uppercase;opacity:.5}
.tk-zier i{display:block;width:34px;height:1px;background:currentColor}
.tk-gruss{font-style:italic;font-size:clamp(26px,2.2vw,34px);line-height:1.1}
.tk-fuss{margin-top:20px;font-size:10px;letter-spacing:.24em;opacity:.7;line-height:2.1}.tk-fuss span{display:block}.tk-s,.tk-claim span{white-space:nowrap}
.tk-claim{margin-top:8px;font-size:9.5px;letter-spacing:.26em;line-height:2;opacity:.48}

/* 06 Der Raum */
.raum{position:relative;background:var(--papier);color:var(--tinte);padding:var(--luft) var(--rand)}
.rm-raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);align-items:start}
.rm-text{grid-column:1/6;position:sticky;top:calc(72px + 5vh)}
.raum h2{margin-top:var(--a1);font-weight:400;font-size:clamp(44px,5vw,92px);line-height:1;letter-spacing:-.016em}
.raum h2 em{opacity:.62}
.rm-lead{margin-top:var(--a2);max-width:34ch;font-size:19px;line-height:1.55;opacity:.84}
.rm-adresse{margin-top:var(--a2);font-style:normal;font-size:19px;line-height:1.5;padding-top:18px;border-top:1px solid rgba(30,43,36,.16);max-width:360px}
.rm-adresse .mikro{display:block;margin-bottom:10px;color:rgba(30,43,36,.74)}
.rm-text .sig-link{margin-top:14px}
.rm-bilder{grid-column:6/13;justify-self:end;width:100%;max-width:800px;display:grid;grid-template-columns:1fr 1fr;column-gap:var(--spalt);row-gap:clamp(28px,5vh,52px)}
.rm-f{margin:0;min-width:0;display:flex;flex-direction:column}
.rm-a{grid-column:1;grid-row:1/3}.rm-b{grid-column:2;grid-row:1}.rm-c{grid-column:2;grid-row:2}.rm-d{grid-column:1/3;grid-row:3;width:100%}
.rm-r{position:relative;display:block;overflow:hidden;background:#e3dccf;aspect-ratio:3/2}
.rm-a .rm-r{aspect-ratio:auto;flex:1;min-height:0}
.rm-r img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rm-r:after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--korn);mix-blend-mode:overlay;opacity:.1}
.rm-r:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;box-shadow:inset 0 0 90px rgba(18,26,22,.16)}
.rm-f figcaption{display:flex;align-items:baseline;gap:14px;margin-top:14px}
.rm-f figcaption .mikro{opacity:.74}

/* Fuß und Anfrage-Ebene: Kontakt als Links, Tippziele ≥ 44 px */
.fuss .reihe .fu-kontakt a:not(.sig-link),.fuss .reihe>div:nth-child(2) a{display:inline-block;padding:12px 0 5px;margin:-12px 0 -5px}
.fuss .reihe .fu-kontakt a.sig-link{margin-top:10px}
#ebene input,#ebene select{min-height:44px}
#ebene .eb-direkt{display:flex;flex-wrap:wrap;align-items:center;column-gap:22px;margin-top:22px;padding-top:14px;border-top:1px solid rgba(30,43,36,.16);font-size:18px}
#ebene .eb-direkt .mikro{flex:1 0 100%;opacity:.62;color:var(--tinte)}
#ebene .eb-direkt a{display:inline-flex;align-items:center;min-height:44px;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 9px)/100% 1px no-repeat}

@media (max-width:820px){
 .hero .hfuss{display:flex;bottom:16px;justify-content:flex-start}.hero .hfuss:before,.hero .hfuss .ort{display:none}
 .hero .hfuss .h-erst{font-size:9.5px;letter-spacing:.2em;gap:10px;white-space:nowrap}.hero .hfuss .h-erst .h-e1{display:none}
 .hm-bilder{height:24svh}.hm-liste{top:calc(24svh + 6px)}.hm-liste a{min-height:44px;padding:3px 0}.hero .hfuss .h-erst i{width:18px}
 .hero .titel{bottom:calc(8vh + 22px)}
 .tk-raster,.rm-raster{grid-template-columns:minmax(0,1fr)}
 .tk-text,.rm-text{grid-column:1/-1;position:static}
 .toskana h2,.raum h2{font-size:44px}
 .tk-lead,.rm-lead{font-size:17px}
 .tk-buehne{grid-column:1/-1;margin-top:var(--a1)}
 .toskana .tk-glas{display:none}
 .tk-platte{left:calc(var(--rand) * -1)}
 .tk-karte{padding:56px 26px 48px}
 .tk-rahmen{inset:10px}.tk-rahmen:after{inset:4px}
 .tk-praegung{width:64px;margin-bottom:20px}
 .tk-kt{font-size:36px;margin-top:22px}
 .tk-ku{font-size:16px}
 .tk-teller{font-size:17px}.tk-wein{font-size:15px}
 .tk-strich{margin:24px auto}
 .rm-bilder{grid-column:1/-1;margin-top:var(--a1);row-gap:28px}
 .rm-f figcaption{margin-top:10px;gap:10px}
 #ebene .eb-direkt{font-size:17px}
}

/* r34 Split-Screen: offene Abende (Papier) ↔ Location exklusiv (Tannengrün), mit Foto und Federzeichnung über Kreuz */
.zweiwege{position:relative;display:grid;grid-template-columns:1fr 1fr;transition:grid-template-columns 1.2s var(--ease)}
.zweiwege:has(.zw-offen:hover){grid-template-columns:1.1fr .9fr}.zweiwege:has(.zw-exklusiv:hover){grid-template-columns:.9fr 1.1fr}
.zw{position:relative;display:flex;min-width:0;padding:clamp(72px,10vh,116px) var(--rand);overflow:hidden}
.zw-offen{background:var(--papier);color:var(--tinte);justify-content:flex-end}
.zw-exklusiv{background:var(--gruen);color:var(--papier)}
.zw-innen{width:100%;max-width:600px;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(32px,5vh,56px)}
.zw-bild{margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--nacht)}
.zw-bild img{display:block;width:100%;height:100%;object-fit:cover}
.zw-txt{position:relative}
.zw-k{opacity:.74}
.zw-h{margin-top:clamp(24px,4vh,44px);font-weight:400;font-size:clamp(40px,4.6vw,88px);line-height:1.02;letter-spacing:-.016em}
.zw-h em{opacity:.62}
.zw-t{margin-top:var(--a2);max-width:34ch;font-size:19px;line-height:1.55;opacity:.86}
.zw .sig-link{margin-top:22px}
.zw .zw-feder{position:absolute;right:0;margin:0;width:min(14vw,210px);color:var(--tinte)}
.zw-offen .zw-feder{bottom:4px}.zw-exklusiv .zw-feder{top:-40px;width:min(10.5vw,160px);color:var(--papier)}
.zw-feder .kv-platte,.zw-feder .kv-name{display:none}
@media(max-width:820px){.zweiwege{grid-template-columns:1fr}.zweiwege:has(.zw:hover){grid-template-columns:1fr}.zw{padding:clamp(64px,10vh,96px) 24px}.zw-offen{justify-content:flex-start}.zw-h{font-size:clamp(40px,11.5vw,64px)}.zw-t{font-size:18px}.zw .zw-feder{position:static;width:150px;margin-top:32px}.zw-exklusiv .zw-innen{flex-direction:column-reverse}.zw-exklusiv .zw-txt{order:0}}
.auf .zeile{padding-bottom:.24em;margin-bottom:-.16em}

/* r35 Header-Knöpfe und feineres Menü */
.hero .knoepfe{display:flex;flex-direction:column;gap:12px;margin-top:38px;width:min(100%,400px)}
.hero .kn{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:18px;align-items:center;text-align:left;padding:15px 22px 14px;border-radius:3px;cursor:pointer;font:inherit;color:var(--papier);background:none;border:1px solid rgba(239,233,223,.5);transition:background .6s var(--ease),color .6s var(--ease),border-color .6s var(--ease)}
.hero .kn-t{grid-column:1;font-size:20px;line-height:1.2}
.hero .kn-u{grid-column:1;margin-top:5px;font-family:J;font-weight:300;font-size:10.5px;letter-spacing:.16em;white-space:nowrap;text-transform:uppercase;opacity:.68}
.hero .kn i{grid-column:2;grid-row:1/3;display:block;width:26px;height:1px;background:currentColor;position:relative;transition:width .7s var(--ease)}
.hero .kn i:after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transform-origin:100% 0;translate:0 3px}
.hero .kn:hover i,.hero .kn:focus-visible i{width:40px}
.hero .kn-voll{background:var(--papier);color:var(--tinte);border-color:var(--papier)}
.hero .kn-voll:hover,.hero .kn-voll:focus-visible{background:transparent;color:var(--papier)}
.hero .kn-leer:hover,.hero .kn-leer:focus-visible{background:rgba(239,233,223,.12);border-color:var(--papier)}
@media(max-width:820px){.hero .knoepfe{width:100%;margin-top:24px;gap:10px}.hero .kn{padding:13px 18px 12px}.hero .kn-t{font-size:18px}.hero .kn-u{font-size:9.5px;white-space:normal;letter-spacing:.14em}}


/* 05.11.2026 Ticket-Wege, Preis, Piemont-Teaser */
.leiste .l-rechts{display:inline-flex;align-items:center;gap:10px}
.leiste .lti,.leiste .lan{gap:0}
.leiste .l-kurz{display:none}
.leiste .lti{font-size:17px;border:1px solid var(--papier);border-radius:40px;padding:0 20px;background:var(--papier);color:var(--tinte);--f:var(--nacht)}
.leiste .lti:hover{color:var(--papier)}
@media (max-width:820px){.leiste .lti{font-size:15px;padding:0 16px}.leiste .l-lang{display:none}.leiste .l-kurz{display:inline}}
@media (max-width:360px){.leiste .lti,.leiste .lan{padding:0 12px}}
.tk-preis{font-size:24px}
.tk-inkl{display:block;margin-top:4px;font-style:italic;font-size:16px;opacity:.72}
.tk-ticket{display:inline-flex;align-items:center;gap:16px;min-height:52px;margin-top:calc(var(--a2) * .9);padding:0 28px;border-radius:40px;background:var(--papier);color:var(--tinte);border:1px solid var(--papier);font-size:19px;--f:var(--gruen)}
.tk-ticket:hover,.tk-ticket:focus-visible{color:var(--papier)}
.tk-ticket i,.pm-t-knopf i{display:block;width:26px;height:1px;background:currentColor;position:relative;transition:width .7s var(--ease)}
.tk-ticket i:after,.pm-t-knopf i:after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transform-origin:100% 0;translate:0 3px}
.tk-ticket:hover i,.pm-t-knopf:hover i{width:40px}
.eb-ticket{margin-top:14px;font-size:15px;line-height:1.45;opacity:.75}
.eb-ticket a{text-decoration:underline;text-underline-offset:3px}
.pm-teaser{position:relative;background:var(--papier);color:var(--tinte);padding:var(--luft) var(--rand);overflow:hidden}
.pm-t-raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);align-items:end}
.pm-t-text{grid-column:1/7;padding-bottom:4vh}
.pm-teaser h2{margin-top:var(--a1);font-weight:400;font-size:clamp(48px,6vw,108px);line-height:1;letter-spacing:-.016em}
.pm-teaser h2 span,.pm-teaser h2 em{display:block}.pm-teaser h2 em{opacity:.62}
.pm-t-unter{margin-top:calc(var(--a2) * .8);color:rgba(30,43,36,.74)}
.pm-t-lead{margin-top:var(--a2);max-width:38ch;font-size:19px;line-height:1.55;opacity:.86}
.pm-t-preis{margin-top:22px;font-size:17px;line-height:1.45}.pm-t-preis span{font-size:26px}
.pm-t-knopf{display:inline-flex;align-items:center;gap:16px;min-height:52px;margin-top:28px;padding:0 28px;border-radius:40px;border:1px solid var(--tinte);background:var(--tinte);color:var(--papier);font-size:19px;--f:var(--papier)}
.pm-t-knopf:hover,.pm-t-knopf:focus-visible{color:var(--tinte)}
.pm-t-flaschen{grid-column:8/13;position:relative;display:flex;justify-content:center;align-items:flex-end;gap:clamp(10px,2vw,34px);padding:0 4%}
.pm-t-flaschen img{width:auto;height:clamp(260px,34vw,500px);filter:drop-shadow(0 18px 18px rgba(30,43,36,.18));transition:transform 1s var(--ease)}
.pm-t-flaschen img:nth-child(2){height:clamp(280px,37vw,540px)}
.pm-t-flaschen:hover img{transform:translateY(-8px)}
.pm-t-platte{position:absolute;left:0;right:calc(var(--rand) * -1);bottom:0;height:1px;background:var(--kupfer)}
@media (max-width:820px){.pm-t-raster{grid-template-columns:minmax(0,1fr)}.pm-t-text,.pm-t-flaschen{grid-column:1/-1}.pm-t-flaschen{margin-top:48px}.pm-t-flaschen img{height:260px}.pm-t-flaschen img:nth-child(2){height:284px}.pm-t-lead{font-size:17px}.tk-ticket,.pm-t-knopf{font-size:17px;padding:0 22px}}
@media (max-width:820px) and (max-height:760px){.hm-liste{top:calc(20svh + 6px);gap:0}.hm-liste a{--ts:clamp(24px,6.6vw,28px);min-height:44px;padding:1px 0}}
@media (prefers-reduced-motion:reduce){.pm-t-flaschen img,.tk-ticket i,.pm-t-knopf i{transition:none}}

/* Unterseiten 05.11.2026 – gemeinsamer Rahmen */
.sp{background:var(--papier);color:var(--tinte)}
.sp .leiste{transform:none}
.sp .leiste .lmarke{display:inline-flex;color:inherit}
.leiste .l-rechts{display:inline-flex;align-items:center;gap:10px}
.leiste .lti,.leiste .lan{gap:0}
.leiste .l-kurz{display:none}
.leiste .lti{font-size:17px;border:1px solid var(--papier);border-radius:40px;padding:0 20px;background:var(--papier);color:var(--tinte);--f:var(--nacht)}
.leiste .lti:hover{color:var(--papier)}
@media (max-width:820px){.leiste .lti{font-size:15px;padding:0 16px}.leiste .l-lang{display:none}.leiste .l-kurz{display:inline}.sp .leiste .lmarke{display:none}}
@media (max-width:360px){.leiste .lti,.leiste .lan{padding:0 12px}}
.sp-nav{position:fixed;inset:0;z-index:60;background:var(--nacht);color:var(--papier);padding:96px var(--rand) 40px;overflow-y:auto;display:none}
.sp-nav.offen{display:block}
.sp-nav ol{list-style:none;display:grid;gap:4px;max-width:900px}
.sp-nav li a{display:grid;grid-template-columns:44px 1fr;align-items:baseline;min-height:48px;padding:6px 0;border-bottom:1px solid rgba(239,233,223,.12)}
.sp-nav .n{font-family:J;font-size:11px;letter-spacing:.2em;opacity:.55}
.sp-nav .t{font-size:clamp(26px,3.2vw,40px);line-height:1.15}
.sp-nav .u{grid-column:2;font-style:italic;font-size:15px;opacity:.6}
.sp-nav a[aria-current] .t{color:#D9B48F}
.sp-nav .zu{position:absolute;top:18px;right:var(--rand);width:48px;height:48px;border:1px solid rgba(239,233,223,.4);border-radius:50%;background:none;color:inherit;font-size:24px;cursor:pointer}
.sp-nav .kontakt{margin-top:34px;font-size:17px;line-height:1.7;opacity:.8}
.sp-nav .kontakt a{text-decoration:underline;text-underline-offset:3px}
/* Kopf */
.sp-kopf{position:relative;isolation:isolate;background:radial-gradient(70% 55% at 72% 38%,#26372e 0%,var(--gruen) 52%,var(--nacht) 100%);color:var(--papier);padding:calc(var(--luft) * .7 + 64px) var(--rand) calc(var(--luft) * .7)}
.sp-kopf:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--korn);mix-blend-mode:overlay;opacity:.07;pointer-events:none}
.sp-kopf-r{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);align-items:center}
.sp-kopf-t{grid-column:1/8}
.sp-kopf-b{grid-column:8/13}
.sp-kopf-b img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.sp-kopf.ohne-bild .sp-kopf-t{grid-column:1/11}
.krumen{font-family:J;font-weight:300;font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.7}
.krumen ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px 10px}
.krumen li+li:before{content:"/";margin-right:10px;opacity:.6}
.krumen a{text-decoration:underline;text-underline-offset:3px}
.sp-kicker{margin-top:28px;color:#D9B48F}
.sp-kopf h1{margin-top:14px;font-weight:400;font-size:clamp(40px,5.2vw,88px);line-height:1.02;letter-spacing:-.014em;text-wrap:balance}
.sp-kopf h1 em{opacity:.66}
.sp-lead{margin-top:24px;max-width:44ch;font-size:clamp(18px,1.4vw,21px);line-height:1.55;opacity:.9}
.sp-knoepfe{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.knopf{display:inline-flex;align-items:center;gap:14px;min-height:52px;padding:0 26px;border-radius:40px;border:1px solid currentColor;font-size:18px;line-height:1.2;cursor:pointer;background:none;font-family:inherit;color:inherit}
.knopf.voll{background:var(--papier);color:var(--tinte);border-color:var(--papier);--f:var(--gruen)}
.knopf.voll:hover,.knopf.voll:focus-visible{color:var(--papier)}
.knopf.dunkel{background:var(--tinte);color:var(--papier);border-color:var(--tinte);--f:var(--papier)}
.knopf.dunkel:hover,.knopf.dunkel:focus-visible{color:var(--tinte)}
.knopf.leer{--f:var(--papier)}.sp-kopf .knopf.leer:hover{color:var(--tinte)}
.papier .knopf.leer{--f:var(--tinte)}.papier .knopf.leer:hover{color:var(--papier)}
.knopf i{display:block;width:24px;height:1px;background:currentColor;position:relative}
.knopf i:after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transform-origin:100% 0;translate:0 3px}
.sp-status{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 24px;border-radius:40px;border:1px dashed currentColor;font-size:18px;opacity:.9}
.sp-status b{width:7px;height:7px;border-radius:50%;background:var(--kupfer)}
/* Fakten */
.fakten{margin-top:34px;max-width:560px;display:grid;grid-template-columns:auto 1fr;column-gap:26px;border-top:1px solid rgba(239,233,223,.22)}
.fakten dt,.fakten dd{padding:12px 0 11px;border-bottom:1px solid rgba(239,233,223,.22)}
.fakten dt{font-family:J;font-weight:300;font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.7;padding-top:16px}
.fakten dd{font-size:18px;line-height:1.4}
.fakten dd small{display:block;font-style:italic;font-size:15px;opacity:.75}
.papier .fakten{border-color:rgba(30,43,36,.18)}.papier .fakten dt,.papier .fakten dd{border-color:rgba(30,43,36,.18)}
/* Inhalt */
.papier{background:var(--papier);color:var(--tinte);position:relative;isolation:isolate}
.papier:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--korn);mix-blend-mode:multiply;opacity:.05;pointer-events:none}
.gruen{background:var(--gruen);color:var(--papier)}
.abschnitt{padding:calc(var(--luft) * .65) var(--rand)}
.abschnitt+.abschnitt.papier{padding-top:0}
.spalte{max-width:720px;margin:0 auto}
.zwei{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--spalt);align-items:start;max-width:1320px;margin:0 auto}
.zwei>.txt{grid-column:1/7}.zwei>.bild{grid-column:8/13}
.zwei.um>.txt{grid-column:7/13;grid-row:1}.zwei.um>.bild{grid-column:1/6;grid-row:1}
.bild img{width:100%;height:auto;border-radius:2px}
.bild figcaption{margin-top:10px;font-family:J;font-weight:300;font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.abschnitt h2{font-weight:400;font-size:clamp(32px,3.3vw,52px);line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
.abschnitt h2 em{opacity:.66}
.abschnitt h3{font-weight:400;font-size:clamp(22px,1.8vw,28px);line-height:1.2;margin-top:34px}
.abschnitt p,.abschnitt li{font-size:19px;line-height:1.62}
.abschnitt p{margin-top:16px}
.abschnitt .rubrik{margin-bottom:22px}
.abschnitt ul.liste,.abschnitt ol.liste{margin:16px 0 0 1.2em}
.abschnitt ul.liste li,.abschnitt ol.liste li{margin-top:8px;padding-left:4px}
.abschnitt a.linie,.prosa a{text-decoration:underline;text-decoration-color:var(--kupfer);text-underline-offset:4px}
.direkt{font-size:21px!important;line-height:1.55!important}
.weine{list-style:none;margin-top:18px;border-top:1px solid rgba(30,43,36,.16)}
.weine li{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid rgba(30,43,36,.16);font-size:18px!important}
.weine li span{font-family:J;font-weight:300;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--kupfer);padding-top:5px}
.gruen .weine,.gruen .weine li{border-color:rgba(239,233,223,.2)}.gruen .weine li span{color:#D9B48F}
/* Menükarte */
.karte-buehne{display:flex;justify-content:center;position:relative}
/* Fragen */
.fragen{margin-top:20px;border-top:1px solid rgba(30,43,36,.18)}
.fragen details{border-bottom:1px solid rgba(30,43,36,.18)}
.fragen summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:baseline;padding:18px 0;font-size:clamp(19px,1.5vw,23px);line-height:1.3}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary:after{content:"+";font-family:J;font-size:22px;color:var(--kupfer);flex:0 0 auto}
.fragen details[open] summary:after{content:"–"}
.fragen .antwort{padding:0 0 20px}
.fragen .antwort p{margin-top:0}
.fragen .antwort p+p{margin-top:12px}
/* Karten zum Weiterlesen */
.weiter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--spalt);max-width:1320px;margin:28px auto 0}
.weiter a{display:block;background:#F6F1E8;border-top:2px solid var(--kupfer);padding:22px 22px 26px;transition:background .5s var(--ease)}
.weiter a:hover{background:#fff}
.weiter img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:18px}
.weiter .k{font-family:J;font-weight:300;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--kupfer)}
.weiter .t{display:block;margin-top:8px;font-size:24px;line-height:1.2}
.weiter .u{display:block;margin-top:8px;font-size:16px;line-height:1.45;opacity:.75}
/* Formular */
.formular{max-width:760px;margin:26px auto 0;background:#F6F1E8;border-top:2px solid var(--kupfer);padding:30px clamp(20px,4vw,40px) 34px}
.formular .felder{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
.formular label{display:flex;flex-direction:column;gap:7px}
.formular label.breit,.formular fieldset{grid-column:1/-1}
.formular .mikro{font-size:11px;opacity:.75}
.formular input,.formular select,.formular textarea{font:inherit;font-size:18px;color:var(--tinte);background:#fff;border:1px solid rgba(30,43,36,.25);border-radius:2px;padding:12px 14px;min-height:48px;width:100%}
.formular textarea{min-height:96px;resize:vertical}
.formular fieldset{border:0;display:grid;gap:10px}
.formular legend{margin-bottom:10px}
.formular .wahl{display:flex;gap:14px;align-items:flex-start;flex-direction:row;background:#fff;border:1px solid rgba(30,43,36,.25);padding:14px 16px;cursor:pointer;font-size:18px;line-height:1.35}
.formular .wahl input{width:20px;height:20px;min-height:0;margin-top:3px;flex:0 0 auto;accent-color:var(--gruen)}
.formular .wahl small{display:block;font-size:15px;opacity:.7}
.formular .hinweis{margin-top:16px;font-size:15px;line-height:1.5;opacity:.8}
.formular .antwort{margin-top:12px;font-style:italic}
.formular button{margin-top:22px}
/* Journal */
.beitrag-meta{margin-top:20px;font-family:J;font-weight:300;font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.75}
.prosa h2{margin-top:52px}
.prosa h2:first-child{margin-top:0}
.prosa figure{margin:34px 0}
.prosa blockquote{margin:30px 0;padding-left:22px;border-left:1px solid var(--kupfer);font-style:italic;font-size:22px;line-height:1.5}
.kasten{margin-top:28px;background:#F6F1E8;border-top:2px solid var(--kupfer);padding:22px 24px}
.kasten p{margin-top:8px!important;font-size:17px!important}
@media (max-width:820px){
 .sp-kopf-r,.zwei{grid-template-columns:minmax(0,1fr)}
 .sp-kopf-t,.sp-kopf-b,.zwei>.txt,.zwei>.bild,.zwei.um>.txt,.zwei.um>.bild{grid-column:1/-1;grid-row:auto}
 .sp-kopf-b{margin-top:34px}.sp-kopf-b img{aspect-ratio:4/3}
 .zwei>.bild{margin-top:28px}
 .abschnitt p,.abschnitt li{font-size:17px}.direkt{font-size:19px!important}
 .weiter{grid-template-columns:minmax(0,1fr)}
 .weine li{grid-template-columns:1fr;gap:4px}
 .formular .felder{grid-template-columns:1fr}
 .knopf{font-size:17px;padding:0 22px}
 .fakten dd{font-size:17px}
}
.karte-buehne .tk-karte{width:100%;max-width:540px;min-width:0;box-sizing:border-box}
.karte-buehne .tk-karte ul,.karte-buehne .tk-gang{min-width:0;max-width:100%}
.karte-buehne .tk-gang>*{max-width:100%}
@media (max-width:600px){.karte-buehne .tk-s{white-space:normal}}

.fuss .fu-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 26px;margin-top:9vh;padding-top:26px;border-top:1px solid rgba(245,240,231,.16);font-size:16px}.fuss .fu-links .mikro{flex-basis:100%;margin-bottom:6px;opacity:.55}.fuss .fu-links a{display:inline-block;padding:8px 0;opacity:.82;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 6px)/0 1px no-repeat;transition:background-size .6s var(--ease),opacity .3s}.fuss .fu-links a:hover{opacity:1;background-size:100% 1px}
/* 06.11.2026: Anfrage-Fenster der Unterseiten ist dunkelgrün – Beschriftungen hell (vorher dunkel auf dunkel, Zeile „dialog label .mikro“) */
dialog:not(.lb) .mikro,dialog label .mikro,#ebene .eb-direkt .mikro{color:var(--papier);opacity:.66}
#ebene .eb-direkt{border-top-color:rgba(239,233,223,.16)}