/* Le Ciel Wien · gemeinsames Stylesheet (Konzeptstudie, Stand 09/2026)
   Idee: ein Abend von der blauen Stunde bis Mitternacht. Der Seitenhimmel
   dunkelt beim Scrollen nach, die Karte liegt auf Elfenbein wie gedrucktes Papier.
   Nachtgrün, Champagner, Elfenbein. Keine Pills, keine Karten, keine Kreise:
   Haarlinien, Textlinks, rechteckige Buttons. */

/* Tenor Sans setzt die Punkte von Ä und Ö in die Buchstabenform ("GANGE", "OFFNUNGSZEITEN"),
   beim Ü sind sie in kleiner Schrift kaum zu sehen. Alle Umlaute kommen deshalb aus Jost, alles andere bleibt Tenor Sans. */
@font-face{font-family:'LC Label';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/tenor-sans-400.woff2) format('woff2');
  unicode-range:U+0000-00C3,U+00C5-00D5,U+00D7-00DB,U+00DD-00E3,U+00E5-00F5,U+00F7-00FB,U+00FD-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'LC Label';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-400.woff2) format('woff2');size-adjust:112%;
  unicode-range:U+00C4,U+00D6,U+00DC,U+00E4,U+00F6,U+00FC}

:root{
  --nacht:#0B1413; --nacht2:#0F1D1B; --nacht3:#15302C;
  --daemmerung:#1A2A3F;
  --champ:#D8C29A; --champ-hell:#EBDDBE; --champ-d:#B79E70;
  --elfenbein:#F3EEE4; --papier2:#EAE3D5; --papier3:#E0D7C4;
  --tinte:#15201E; --tinte2:#4B5552; --tinte3:#5F6865;
  --gruen:#1F4A43; --gruen-d:#173A34;
  --hell:#EFE9DD; --hell2:rgba(239,233,221,.74); --hell3:rgba(239,233,221,.56);
  --linie:rgba(216,194,154,.24); --linie2:rgba(216,194,154,.12);
  --linie-p:#D2C8B4;
  --sky:#0E1817;
  --disp:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'Jost','Futura','Century Gothic',system-ui,sans-serif;
  --label:'LC Label','Jost',system-ui,sans-serif;
  --pad:clamp(20px,5vw,72px);
  --max:1380px;
  --hd:84px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --slow:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 12px);background:var(--nacht)}
body{background:var(--sky);color:var(--hell);font-family:var(--sans);font-size:1.0625rem;line-height:1.7;font-weight:400;overflow-x:clip;-webkit-font-smoothing:antialiased;transition:background-color .6s linear}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:900;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:1px solid var(--champ);outline-offset:4px}
.paper :focus-visible{outline-color:var(--gruen)}
::selection{background:var(--champ);color:var(--nacht)}

.skip{position:absolute;left:12px;top:-80px;z-index:2000;background:var(--champ);color:var(--nacht);padding:12px 18px;font-size:.9rem}
.skip:focus{top:12px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:clamp(88px,11vw,168px);position:relative}
.sec--tight{padding-block:clamp(64px,7vw,104px)}
.paper{background:var(--elfenbein);color:var(--tinte)}
.paper2{background:var(--papier2);color:var(--tinte)}
.gruen{background:var(--nacht3)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Typografie ─────────────────────────── */
.label{font-family:var(--label);font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champ);line-height:1.5}
.paper .label,.paper2 .label{color:var(--gruen)}
.kicker{display:flex;align-items:center;gap:16px;margin-bottom:26px}
.kicker::before{content:"";width:36px;height:1px;background:currentColor;opacity:.7;flex:none}
.d1,.d2,.d3{font-family:var(--disp);font-weight:400;letter-spacing:-.012em;line-height:1.04}
.d1{font-size:clamp(min(2.9rem,12.4vw),6.6vw,6.4rem)}
.d2{font-size:clamp(2.25rem,4.5vw,4.1rem);line-height:1.06}
.d3{font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.18}
.d1 em,.d2 em,.d3 em,.stmt em{font-style:italic;color:var(--champ)}
.paper .d1 em,.paper .d2 em,.paper .d3 em,.paper .stmt em,.paper2 .d2 em{color:var(--gruen)}
.lead{font-size:clamp(1.08rem,1.3vw,1.24rem);line-height:1.66;color:var(--hell2);max-width:56ch;font-weight:300}
.paper .lead,.paper2 .lead{color:var(--tinte2);font-weight:400}
.muted{color:var(--hell2)}
.paper .muted{color:var(--tinte2)}
.prose p{max-width:62ch;color:var(--hell2)}
.prose p+p{margin-top:1.1em}
.paper .prose p{color:var(--tinte2)}
.stmt{font-family:var(--disp);font-size:clamp(1.7rem,3.3vw,3.05rem);line-height:1.22;letter-spacing:-.008em}

/* ── Buttons & Links ────────────────────── */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:54px;padding:0 28px;border:1px solid var(--champ);color:var(--champ);font-family:var(--label);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;overflow:hidden;isolation:isolate;transition:color .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--champ);transform:scaleX(0);transform-origin:right;transition:transform .55s var(--slow);z-index:-1}
.btn:hover{color:var(--nacht)}
.btn:hover::before{transform:scaleX(1);transform-origin:left}
.btn svg{width:18px;height:18px;flex:none;transition:transform .45s var(--slow)}
.btn:hover svg{transform:translateX(4px)}
.btn--solid{background:var(--champ);color:var(--nacht)}
.btn--solid::before{background:var(--champ-hell)}
.paper .btn{border-color:var(--gruen);color:var(--gruen)}
.paper .btn::before{background:var(--gruen)}
.paper .btn:hover{color:var(--elfenbein)}
.paper .btn--solid{background:var(--gruen);color:var(--elfenbein)}
.paper .btn--solid::before{background:var(--gruen-d)}
.tlink{display:inline-flex;align-items:center;gap:10px;font-family:var(--label);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champ);padding-block:6px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .5s var(--slow)}
.tlink:hover{background-size:0 1px;background-position:100% 100%}
.tlink svg{width:16px;height:16px;transition:transform .45s var(--slow)}
.tlink:hover svg{transform:translateX(4px)}
.paper .tlink,.paper2 .tlink{color:var(--gruen)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}

/* ── Header ─────────────────────────────── */
.hd{position:fixed;inset:0 0 auto;z-index:500;height:var(--hd);transition:background-color .5s var(--ease),border-color .5s var(--ease),height .4s var(--ease);border-bottom:1px solid transparent}
.hd.is-solid{background:rgba(11,20,19,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--linie2)}
.hd-in{height:100%;display:flex;align-items:center;gap:40px}
.brand{display:flex;flex-direction:column;line-height:1;color:var(--hell)}
.brand-w{font-family:var(--disp);font-style:italic;font-size:1.72rem;letter-spacing:.005em}
.brand-s{font-family:var(--label);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--champ);margin-top:7px}
.nav{margin-left:auto}
.nav ul{display:flex;gap:38px}
.nav a{position:relative;font-family:var(--label);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--hell2);padding-block:8px;transition:color .3s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--champ);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--slow)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--hell)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.hd .btn{min-height:46px;padding:0 22px}
.burger{display:none;width:48px;height:48px;margin-left:auto;position:relative}
.burger span{position:absolute;left:12px;right:12px;height:1px;background:var(--hell);transition:transform .45s var(--slow),opacity .3s}
.burger span:nth-child(1){top:18px}
.burger span:nth-child(2){top:24px;right:20px}
.burger span:nth-child(3){top:30px}
.menu-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:450;background:var(--nacht);padding:calc(var(--hd) + 28px) var(--pad) 36px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s .45s;overflow-y:auto}
.menu-open .mnav{opacity:1;visibility:visible;transition:opacity .45s var(--ease)}
.menu-open{overflow:hidden}
.menu-open .hd{background:var(--nacht);border-bottom-color:var(--linie2)}
.mnav li{border-bottom:1px solid var(--linie2)}
.mnav li a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0;font-family:var(--disp);font-size:clamp(2rem,8vw,2.8rem);line-height:1.1}
.mnav li a small{font-family:var(--label);font-size:.7rem;letter-spacing:.22em;color:var(--champ)}
.mnav li a[aria-current="page"]{font-style:italic;color:var(--champ)}
.mnav-foot{display:grid;gap:18px;margin-top:36px}
.mnav-foot .btn{width:100%}
.mnav-foot p{color:var(--hell3);font-size:.95rem}
.mnav-foot a.tel{font-family:var(--disp);font-size:1.5rem;color:var(--hell)}

/* ── Reveal ─────────────────────────────── */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity 1.1s var(--ease),transform 1.2s var(--slow);transition-delay:var(--rd,0s)}
.js .rv.in{opacity:1;transform:none}
.js .rv-img{clip-path:inset(12% 0 0 0);transition:clip-path 1.5s var(--slow)}
.js .rv-img img{transform:scale(1.12);transition:transform 2s var(--slow)}
.js .rv-img.in{clip-path:inset(0 0 0 0)}
.js .rv-img.in img{transform:none}

/* ── Hero Startseite ────────────────────── */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.js .hero-bg img{animation:heroZoom 2.8s var(--slow) both}
@keyframes heroZoom{from{transform:scale(1.1);filter:brightness(.4)}to{transform:scale(1);filter:none}}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(11,20,19,.72) 0%,rgba(11,20,19,.08) 26%,rgba(11,20,19,.12) 50%,rgba(11,20,19,.88) 84%,var(--sky) 100%),
  linear-gradient(90deg,rgba(11,20,19,.66) 0%,rgba(11,20,19,0) 62%)}
.hero-in{width:100%;padding-top:calc(var(--hd) + 40px);padding-bottom:clamp(40px,6vw,76px);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:40px}
.hero h1{font-weight:400}
.hero-name{display:block;font-family:var(--disp);font-size:clamp(5rem,15.5vw,14.5rem);line-height:.86;letter-spacing:-.03em;margin-left:-.04em}
.hero-name em{font-style:italic;color:var(--champ)}
.hero-sub{display:block;font-family:var(--label);font-size:clamp(.8rem,1.1vw,.95rem);letter-spacing:.3em;text-transform:uppercase;color:var(--hell);margin-top:clamp(18px,2.4vw,30px)}
.line{display:block;overflow:hidden;padding-bottom:.06em}
.line>span{display:block}
.js .line>span{animation:lineUp 1.4s var(--slow) both;animation-delay:var(--ld,.3s)}
@keyframes lineUp{from{transform:translateY(105%)}to{transform:none}}
.js .hero-fade{animation:fadeUp 1.3s var(--ease) both;animation-delay:var(--ld,.9s)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero .lead{margin-top:26px;color:var(--hell);max-width:48ch}
.hero .actions{margin-top:34px}
.hero-side{width:min(320px,30vw);border-top:1px solid var(--linie);padding-top:20px}
.hero-side dl{display:grid;gap:14px}
.hero-side dt{font-family:var(--label);font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champ)}
.hero-side dd{font-size:.98rem;color:var(--hell);line-height:1.5}
.today{display:flex;align-items:center;gap:10px}

/* ── Seitenkopf Unterseiten ─────────────── */
.phead{position:relative;min-height:min(86svh,860px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.phead-bg{position:absolute;inset:0;z-index:-2}
.phead-bg img{width:100%;height:100%;object-fit:cover}
.js .phead-bg img{animation:heroZoom 2.6s var(--slow) both}
.phead::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,20,19,.7) 0%,rgba(11,20,19,.1) 30%,rgba(11,20,19,.35) 55%,rgba(11,20,19,.94) 90%,var(--sky) 100%),linear-gradient(90deg,rgba(11,20,19,.55),rgba(11,20,19,0) 65%)}
.phead-in{width:100%;padding-top:calc(var(--hd) + 60px);padding-bottom:clamp(44px,6vw,80px)}
.phead .lead{margin-top:24px;color:var(--hell)}
.phead--plain{min-height:0}
.phead--plain::before{display:none}
.crumbs{display:flex;gap:10px;margin-bottom:30px;font-family:var(--label);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--hell3)}
.crumbs a:hover{color:var(--champ)}
.crumbs li+li::before{content:"·";margin-right:10px}
.jump{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:40px;padding-top:22px;border-top:1px solid var(--linie)}
.jump a{font-family:var(--label);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--hell2);display:flex;gap:10px}
.jump a span{color:var(--champ)}
.jump a:hover{color:var(--hell)}

/* ── Abschnittskopf ─────────────────────── */
.shead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px clamp(40px,6vw,110px);align-items:end;margin-bottom:clamp(52px,6vw,88px)}
.shead .lead{justify-self:end}
.shead--solo{grid-template-columns:1fr}

/* ── Einleitung / Statement ─────────────── */
.intro-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.intro-grid .label{grid-column:1/4}
.intro-grid .stmt{grid-column:4/13}
.intro-grid .prose{grid-column:7/13;margin-top:34px}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(64px,8vw,112px);border-top:1px solid var(--linie)}
.facts>div{padding:26px 26px 4px 0}
.facts>div+div{padding-left:26px;border-left:1px solid var(--linie)}
.facts dt{font-family:var(--disp);font-size:clamp(2.1rem,3.6vw,3.3rem);line-height:1;color:var(--champ)}
.facts dt small{font-size:.42em;letter-spacing:.02em;margin-left:6px;color:var(--hell2);font-family:var(--sans)}
.facts dd{margin-top:12px;font-size:.95rem;color:var(--hell2);max-width:24ch}
.paper .facts{border-color:var(--linie-p)}
.paper .facts>div+div{border-color:var(--linie-p)}
.paper .facts dt{color:var(--gruen)}
.paper .facts dd,.paper .facts dt small{color:var(--tinte2)}

/* ── Signatur: Der Abend, Gang für Gang ─── */
.abend{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,6vw,110px)}
.stage{position:sticky;top:calc(var(--hd) + 3vh);height:calc(100svh - var(--hd) - 6vh);min-height:520px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:22px}
.clock{display:flex;align-items:baseline;justify-content:space-between;gap:20px;border-bottom:1px solid var(--linie);padding-bottom:16px}
.clock-t{font-family:var(--disp);font-style:italic;font-size:clamp(3.2rem,5.4vw,5.2rem);line-height:.9;color:var(--champ);display:flex;overflow:hidden;height:1em}
.clock-t span{display:block;transition:transform .7s var(--slow),opacity .5s}
.clock-t.tick span{transform:translateY(-40%);opacity:0;transition:none}
.clock-n{font-family:var(--label);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--hell2);text-align:right}
.frames{position:relative;overflow:hidden;background:var(--nacht2)}
.frames img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1s var(--ease),transform 1.8s var(--slow),clip-path 1.2s var(--slow);clip-path:inset(0 0 100% 0)}
.frames img.on{opacity:1;transform:none;clip-path:inset(0 0 0 0);z-index:1}
.frames img.was{opacity:1;clip-path:inset(0 0 0 0);z-index:0}
.frame-cap{display:flex;justify-content:space-between;gap:20px;font-size:.88rem;color:var(--hell3)}
.progress{position:relative;height:1px;background:var(--linie);margin-top:2px}
.progress i{position:absolute;inset:0 auto 0 0;width:var(--p,0%);background:var(--champ);transition:width .8s var(--slow)}
.stations{counter-reset:st}
.station{min-height:74svh;display:flex;flex-direction:column;justify-content:center;padding-block:40px;border-top:1px solid var(--linie2);opacity:.38;transition:opacity .7s var(--ease)}
.station:first-child{border-top:0}
.station.on{opacity:1}
.station-t{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.station-t b{font-family:var(--disp);font-style:italic;font-weight:400;font-size:1.5rem;color:var(--champ);letter-spacing:0;text-transform:none}
.station h3{margin-bottom:16px}
.station p{color:var(--hell2);max-width:44ch}
.station .pair{margin-top:18px;font-size:.92rem;color:var(--hell3)}
.station .pair b{font-family:var(--label);font-weight:400;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ);margin-right:10px}
.station-img{display:none}
.abend-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:20px 36px;align-items:center}

/* ── Preise (Papier) ────────────────────── */
.prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--linie-p);border-bottom:1px solid var(--linie-p)}
.prices>div{padding:38px 34px 40px 0}
.prices>div+div{padding-left:34px;border-left:1px solid var(--linie-p)}
.prices .price,.price{font-family:var(--disp);font-size:clamp(2.6rem,4.4vw,4rem);line-height:1;color:var(--gruen);margin:18px 0 16px}
.price small{font-family:var(--sans);font-size:.36em;color:var(--tinte2);margin-left:8px;letter-spacing:.02em}
.prices h3{font-family:var(--disp);font-weight:400;font-size:1.6rem;line-height:1.2}
.prices p:not(.label):not(.price){color:var(--tinte2);font-size:.98rem;max-width:34ch}
.prices-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 40px;margin-top:34px}
.prices-foot p{color:var(--tinte2);font-size:.95rem;max-width:60ch}

/* ── Raum / Bild-Text ───────────────────── */
.room{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}
.room-a{grid-column:1/7}
.room-b{grid-column:8/12;margin-top:clamp(120px,16vw,240px)}
.room-t{grid-column:8/13;grid-row:1;align-self:start}
.fig{position:relative}
.fig .ph{overflow:hidden;background:var(--nacht2)}
.fig figcaption{display:flex;gap:14px;margin-top:14px;font-size:.86rem;color:var(--hell3)}
.fig figcaption b{font-family:var(--label);font-weight:400;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ)}
.paper .fig figcaption{color:var(--tinte3)}
.paper .fig figcaption b{color:var(--gruen)}
.ph img{width:100%;height:100%;object-fit:cover}
.r34 .ph{aspect-ratio:3/4}
.r45 .ph{aspect-ratio:4/5}
.r32 .ph{aspect-ratio:3/2}
.r11 .ph{aspect-ratio:1/1}
.specs{display:grid;grid-template-columns:auto 1fr;border-top:1px solid var(--linie);margin-top:34px}
.specs dt,.specs dd{padding:14px 0;border-bottom:1px solid var(--linie)}
.specs dt{font-family:var(--label);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--champ);padding-right:28px;padding-top:17px}
.specs dd{color:var(--hell2)}
.paper .specs,.paper .specs dt,.paper .specs dd{border-color:var(--linie-p)}
.paper .specs dt{color:var(--gruen)}
.paper .specs dd{color:var(--tinte2)}

/* ── Stimmen ────────────────────────────── */
.quotes{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--linie)}
.quotes figure{padding:40px 48px 8px 0}
.quotes figure+figure{padding-left:48px;border-left:1px solid var(--linie)}
.quotes blockquote{font-family:var(--disp);font-style:italic;font-size:clamp(1.35rem,2vw,1.8rem);line-height:1.38}
.quotes figcaption{margin-top:22px;font-size:.9rem;color:var(--hell3)}
.quotes figcaption b{font-weight:500;color:var(--hell)}

/* ── FAQ ────────────────────────────────── */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,7vw,120px)}
.faq{border-top:1px solid var(--linie)}
.faq details{border-bottom:1px solid var(--linie)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;font-family:var(--disp);font-size:clamp(1.2rem,1.7vw,1.45rem);line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat;color:var(--champ);transition:transform .45s var(--slow)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--champ)}
.faq .a{padding:0 48px 28px 0;color:var(--hell2);max-width:64ch}
.paper .faq,.paper .faq details{border-color:var(--linie-p)}
.paper .faq summary::after{color:var(--gruen)}
.paper .faq summary:hover{color:var(--gruen)}
.paper .faq .a{color:var(--tinte2)}

/* ── Reservierung ───────────────────────── */
.resv{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(48px,7vw,120px)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:6px 28px;margin-top:40px}
.form[hidden]{display:none}
.fld{display:flex;flex-direction:column;gap:6px;padding-top:14px}
.fld--full{grid-column:1/-1}
.fld label,.fld legend{font-family:var(--label);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ)}
.fld input,.fld select,.fld textarea{background:transparent;border:0;border-bottom:1px solid var(--linie);padding:12px 0;font-size:1.05rem;color:var(--hell);border-radius:0;-webkit-appearance:none;appearance:none;transition:border-color .3s}
.fld select{background-image:linear-gradient(45deg,transparent 50%,var(--champ) 50%),linear-gradient(135deg,var(--champ) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:30px}
.fld select option{background:var(--nacht);color:var(--hell)}
.fld input::-webkit-calendar-picker-indicator{filter:invert(.85) sepia(.4)}
.fld textarea{resize:vertical;min-height:96px}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-bottom-color:var(--champ)}
.fld .err{display:none;font-size:.84rem;color:#E7A48F}
.fld.bad .err{display:block}
.fld.bad input,.fld.bad select{border-bottom-color:#E7A48F}
fieldset.fld{border:0}
.seg{display:flex;flex-wrap:wrap;border:1px solid var(--linie);margin-top:8px}
.seg label{flex:1 1 auto;position:relative;font-family:var(--sans);letter-spacing:0;text-transform:none;font-size:.95rem;color:var(--hell2)}
.seg label+label{border-left:1px solid var(--linie)}
.seg input{position:absolute;opacity:0;inset:0;cursor:pointer}
.seg span{display:block;padding:13px 16px;text-align:center;transition:background-color .3s,color .3s}
.seg input:checked+span{background:var(--champ);color:var(--nacht)}
.seg input:focus-visible+span{outline:1px solid var(--champ);outline-offset:-4px}
.consent{grid-column:1/-1;display:flex;gap:14px;align-items:flex-start;margin-top:18px;font-size:.9rem;color:var(--hell2)}
.consent input{appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;border:1px solid var(--champ);margin-top:3px;display:grid;place-content:center;cursor:pointer}
.consent input:checked{background:var(--champ)}
.consent input:checked::after{content:"";width:9px;height:5px;border-left:1.5px solid var(--nacht);border-bottom:1.5px solid var(--nacht);transform:rotate(-45deg) translate(1px,-1px)}
.consent a{text-decoration:underline;text-underline-offset:3px}
.consent.bad{color:#E7A48F}
.form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px;margin-top:30px}
.form-foot small{color:var(--hell3);font-size:.86rem;max-width:40ch}
.form-ok{display:none;margin-top:40px;border-top:1px solid var(--champ);padding-top:28px}
.form-ok.on{display:block}
.form-ok p{color:var(--hell2);margin-top:12px;max-width:52ch}
.info{border-top:1px solid var(--linie)}
.info>div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--linie)}
.info dt{font-family:var(--label);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ);padding-top:4px}
.info dd{color:var(--hell)}
.info dd small{display:block;color:var(--hell3);font-size:.88rem;margin-top:4px}
.info a{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:1px}
.info a:hover{color:var(--champ)}
.map{margin-top:34px}

/* ── CTA-Band ───────────────────────────── */
.cta{position:relative;overflow:hidden;isolation:isolate;padding-block:clamp(110px,14vw,210px)}
.cta-bg{position:absolute;inset:0;z-index:-1}
.cta-bg img{width:100%;height:100%;object-fit:cover;opacity:.42}
.cta-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--sky) 0%,rgba(11,20,19,.35) 30%,rgba(11,20,19,.5) 70%,var(--nacht) 100%)}
.cta .wrap{text-align:center;display:flex;flex-direction:column;align-items:center}
.cta .d1{max-width:14ch}
.cta p{margin-top:24px;color:var(--hell2);max-width:50ch}
.cta .actions{justify-content:center;margin-top:40px}

/* ── Menükarte ──────────────────────────── */
.carte{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,110px)}
.carte-stage{position:sticky;top:calc(var(--hd) + 4vh);height:calc(100svh - var(--hd) - 8vh);min-height:480px;overflow:hidden;background:var(--papier3)}
.carte-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s var(--ease),transform 1.6s var(--slow);transform:scale(1.04)}
.carte-stage img.on{opacity:1;transform:none}
.carte-stage figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:60px 22px 18px;background:linear-gradient(180deg,transparent,rgba(11,20,19,.75));color:var(--hell);font-size:.86rem;display:flex;justify-content:space-between;gap:12px}
.carte-stage figcaption b{font-family:var(--label);font-weight:400;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ-hell)}
.course{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 20px;padding:34px 0;border-top:1px solid var(--linie-p)}
.course:last-child{border-bottom:1px solid var(--linie-p)}
.course-n{font-family:var(--disp);font-style:italic;font-size:1.6rem;line-height:1.2;color:var(--gruen)}
.course h3{font-family:var(--disp);font-weight:400;font-size:clamp(1.55rem,2.3vw,2.1rem);line-height:1.15}
.course p{margin-top:10px;color:var(--tinte2)}
.course .pair{margin-top:14px;font-size:.93rem;color:var(--tinte3)}
.course .pair b{font-family:var(--label);font-weight:400;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gruen);margin-right:10px}
.course-img{display:none}
.dark-list .course{border-color:var(--linie)}
.dark-list .course:last-child{border-color:var(--linie)}
.dark-list .course-n,.dark-list .course .pair b{color:var(--champ)}
.dark-list .course p,.dark-list .course .pair{color:var(--hell2)}
.menu-sum{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px 30px;padding:26px 0 0;font-family:var(--disp);font-size:1.4rem}
.menu-sum span{font-family:var(--sans);font-size:.95rem;color:var(--tinte2)}
.dark-list .menu-sum span{color:var(--hell2)}
.veg{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,6vw,110px);align-items:start}
.veg .fig{position:sticky;top:calc(var(--hd) + 5vh)}
.pairings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--linie-p)}
.pairings>div{padding:34px 34px 36px 0}
.pairings>div+div{padding-left:34px;border-left:1px solid var(--linie-p)}
.pairings h3{font-family:var(--disp);font-weight:400;font-size:1.7rem;line-height:1.2;margin-top:12px}
.pairings p:not(.label):not(.price){margin-top:12px;color:var(--tinte2);font-size:.98rem}
.pairings .price{font-size:2.6rem;margin:22px 0 0}
.drinks{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,100px);align-items:center;margin-top:clamp(64px,8vw,110px)}
.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--linie)}
.notes>div{padding:28px 30px 8px 0}
.notes>div+div{padding-left:30px;border-left:1px solid var(--linie)}
.notes h3{font-family:var(--disp);font-weight:400;font-size:1.35rem;margin-bottom:10px}
.notes p{color:var(--hell2);font-size:.98rem}

/* ── Philosophie ────────────────────────── */
.story{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}
.story-t{grid-column:1/7}
.story-f{grid-column:8/13}
.pull{margin-top:clamp(80px,10vw,150px);padding-top:40px;border-top:1px solid var(--linie);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.pull blockquote{grid-column:2/12;font-family:var(--disp);font-style:italic;font-size:clamp(2rem,4.6vw,4.2rem);line-height:1.12;letter-spacing:-.01em}
.pull blockquote em{color:var(--champ)}
.pull figcaption{grid-column:2/12;margin-top:22px}
.principles{border-top:1px solid var(--linie-p)}
.principle{display:grid;grid-template-columns:120px minmax(0,1fr) minmax(0,1.1fr);gap:24px clamp(24px,4vw,64px);padding:44px 0;border-bottom:1px solid var(--linie-p);align-items:start}
.principle-n{font-family:var(--disp);font-style:italic;font-size:2.6rem;line-height:1;color:var(--gruen)}
.principle p{color:var(--tinte2)}
.producers{width:100%;border-collapse:collapse}
.producers caption{text-align:left;margin-bottom:20px}
.producers th,.producers td{text-align:left;padding:18px 20px 18px 0;border-bottom:1px solid var(--linie);vertical-align:top}
.producers thead th{font-family:var(--label);font-weight:400;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champ);border-bottom-color:var(--champ-d)}
.producers tbody th{font-family:var(--disp);font-weight:400;font-size:1.3rem}
.producers td{color:var(--hell2)}
.producers td.km{text-align:right;font-family:var(--disp);font-style:italic;color:var(--champ);padding-right:0;white-space:nowrap}
.producers th.km{text-align:right;padding-right:0}
.prod-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,100px);align-items:start}
.prod-imgs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.prod-imgs .fig:first-child{margin-top:80px}
.awards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--linie-p)}
.awards>div{padding:30px 24px 6px 0}
.awards>div+div{padding-left:24px;border-left:1px solid var(--linie-p)}
.awards b{display:block;font-family:var(--disp);font-weight:400;font-size:clamp(1.9rem,3vw,2.7rem);line-height:1;color:var(--gruen)}
.awards span{display:block;margin-top:12px;color:var(--tinte2);font-size:.95rem}

/* ── Galerie ────────────────────────────── */
.filter{display:flex;flex-wrap:wrap;gap:8px 34px;padding-bottom:18px;border-bottom:1px solid var(--linie);margin-bottom:clamp(40px,5vw,64px)}
.filter button{position:relative;font-family:var(--label);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--hell3);padding:10px 0}
.filter button sup{font-family:var(--disp);font-style:italic;letter-spacing:0;font-size:.9rem;margin-left:6px;color:var(--champ);vertical-align:0}
.filter button::after{content:"";position:absolute;left:0;right:0;bottom:-19px;height:1px;background:var(--champ);transform:scaleX(0);transition:transform .5s var(--slow)}
.filter button[aria-pressed="true"]{color:var(--hell)}
.filter button[aria-pressed="true"]::after{transform:scaleX(1)}
.filter button:hover{color:var(--hell)}
.gal{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2vw,28px);grid-auto-flow:dense}
.gal figure{grid-column:span 4}
.gal figure.w6{grid-column:span 6}
.gal figure.w5{grid-column:span 5}
.gal figure.w7{grid-column:span 7}
.gal figure.w8{grid-column:span 8}
.gal figure.is-hidden{display:none}
.gal button{display:block;width:100%;text-align:left;cursor:zoom-in}
.gal .ph{overflow:hidden;background:var(--nacht2)}
.gal .ph img{transition:transform 1.4s var(--slow),filter .8s}
.gal button:hover .ph img{transform:scale(1.04)}
.gal figcaption{display:flex;gap:14px;align-items:baseline;margin-top:12px;font-size:.9rem;color:var(--hell2)}
.gal figcaption b{font-family:var(--disp);font-style:italic;font-weight:400;color:var(--champ)}
.lb{border:0;padding:0;margin:auto;width:min(1200px,94vw);max-width:none;max-height:94svh;background:var(--nacht);color:var(--hell)}
.lb::backdrop{background:rgba(6,11,10,.9)}
.lb-in{display:grid;grid-template-rows:minmax(0,1fr) auto;max-height:94svh}
.lb-img{min-height:0;display:flex;justify-content:center;background:#060B0A}
.lb-img img{max-height:calc(94svh - 90px);width:auto;object-fit:contain}
.lb-bar{display:flex;align-items:center;gap:24px;padding:18px 22px;border-top:1px solid var(--linie2)}
.lb-cap{flex:1;font-size:.95rem;color:var(--hell2)}
.lb-cap b{font-family:var(--disp);font-style:italic;font-weight:400;color:var(--champ);margin-right:10px}
.lb-bar button{font-family:var(--label);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--hell2);padding:10px 0}
.lb-bar button:hover{color:var(--champ)}

/* ── Footer ─────────────────────────────── */
.ft{background:var(--nacht);border-top:1px solid var(--linie2);padding-top:clamp(72px,8vw,112px);position:relative}
.ft .ft-word{font-family:var(--disp);font-style:italic;font-size:clamp(4.4rem,15vw,13.5rem);line-height:.8;color:var(--champ);opacity:.9;letter-spacing:-.03em;margin-bottom:clamp(48px,6vw,80px)}
.ft-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px}
.ft h2{font-family:var(--label);font-weight:400;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--champ);margin-bottom:18px}
.ft p,.ft address,.ft li{font-style:normal;color:var(--hell2);font-size:.96rem;line-height:1.85}
.ft a:hover{color:var(--champ)}
.ft-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 30px;padding:26px 0 32px;border-top:1px solid var(--linie2);font-size:.86rem;color:var(--hell3)}
.ft-bot nav{display:flex;gap:26px}
.ft-bot a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--linie)}

/* ── Responsiv ──────────────────────────── */
@media (max-width:1100px){
  .nav ul{gap:26px}
  .hd-in{gap:28px}
  .facts{grid-template-columns:1fr 1fr}
  .facts>div:nth-child(3){border-left:0;padding-left:0}
  .facts>div:nth-child(n+3){border-top:1px solid var(--linie)}
  .paper .facts>div:nth-child(n+3){border-top-color:var(--linie-p)}
  .ft-top{grid-template-columns:1fr 1fr}
  .awards{grid-template-columns:1fr 1fr}
  .awards>div:nth-child(3){border-left:0;padding-left:0}
  .awards>div:nth-child(n+3){border-top:1px solid var(--linie-p)}
  .principle{grid-template-columns:80px minmax(0,1fr)}
  .principle p{grid-column:2}
}
@media (max-width:900px){
  :root{--hd:70px}
  .nav,.hd .btn{display:none}
  .burger{display:block}
  .brand-w{font-size:1.5rem}
  .hero-in{grid-template-columns:1fr}
  .hero-side{width:100%}
  .hero-side dl{grid-template-columns:1fr 1fr;gap:16px 24px}
  .shead{grid-template-columns:1fr}
  .shead .lead{justify-self:start}
  .intro-grid .label,.intro-grid .stmt,.intro-grid .prose{grid-column:1/-1}
  .abend{grid-template-columns:1fr}
  .stage{display:none}
  .station{min-height:0;opacity:1;padding-block:34px}
  .station-img{display:block;margin-bottom:24px;aspect-ratio:4/3;overflow:hidden}
  .station-img img{width:100%;height:100%;object-fit:cover}
  .prices,.pairings,.notes{grid-template-columns:1fr}
  .prices>div+div,.pairings>div+div,.notes>div+div{padding-left:0;border-left:0;border-top:1px solid var(--linie-p)}
  .notes>div+div{border-top-color:var(--linie)}
  .prices>div,.pairings>div{padding-right:0}
  .room-a,.room-b,.room-t{grid-column:1/-1;grid-row:auto;margin-top:0}
  .room-b{width:78%;margin-left:auto;margin-top:36px}
  .quotes{grid-template-columns:1fr}
  .quotes figure+figure{padding-left:0;border-left:0;border-top:1px solid var(--linie);margin-top:32px}
  .quotes figure{padding-right:0}
  .faq-grid,.resv,.carte,.veg,.drinks,.prod-grid{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .carte-stage{display:none}
  .course-img{display:block;grid-column:1/-1;margin-bottom:20px;aspect-ratio:3/2;overflow:hidden}
  .course-img img{width:100%;height:100%;object-fit:cover}
  .veg .fig{position:static}
  .story-t,.story-f{grid-column:1/-1}
  .pull blockquote,.pull figcaption{grid-column:1/-1}
  .gal figure,.gal figure.w5,.gal figure.w6,.gal figure.w7,.gal figure.w8{grid-column:span 6}
  .gal figure.wide-m{grid-column:span 12}
}
@media (max-width:560px){
  body{font-size:1rem}
  .facts{grid-template-columns:1fr}
  .facts>div,.facts>div+div{padding-left:0;border-left:0}
  .facts>div+div{border-top:1px solid var(--linie)}
  .paper .facts>div+div{border-top-color:var(--linie-p)}
  .hero-name{font-size:clamp(4.4rem,23vw,7rem)}
  .hero-sub{letter-spacing:.22em}
  .ft-top{grid-template-columns:1fr}
  .awards{grid-template-columns:1fr}
  .awards>div,.awards>div+div{padding-left:0;border-left:0}
  .awards>div+div{border-top:1px solid var(--linie-p)}
  .principle{grid-template-columns:1fr;gap:14px}
  .principle p{grid-column:1}
  .course{grid-template-columns:44px minmax(0,1fr);gap:0 12px}
  .info>div{grid-template-columns:1fr;gap:4px}
  .gal figure,.gal figure.w5,.gal figure.w6,.gal figure.w7,.gal figure.w8{grid-column:span 12}
  .producers thead{display:none}
  .producers tr{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--linie);padding:14px 0}
  .producers th,.producers td{border:0;padding:2px 0}
  .producers td.ort{grid-column:1/-1}
  .producers tbody th{grid-column:1}
  .producers td.hof{grid-column:1/-1;grid-row:2}
  .producers td.km{grid-row:1;grid-column:2}
  .btn{width:100%}
  .actions .tlink{margin-inline:auto}
  .lb-bar{flex-wrap:wrap;gap:8px 20px}
  .lb-cap{flex-basis:100%}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .js .rv{opacity:1;transform:none}
  .js .rv-img{clip-path:none}
  .js .rv-img img{transform:none}
}

/* Nachträge */
.awards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.awards--2>div:nth-child(3){border-left:0;padding-left:0}
.awards--2>div:nth-child(n+3){border-top:1px solid var(--linie-p)}
.hero-name>span{padding-right:.08em}
@media (min-width:901px){
  .room-a{grid-row:1/3}
  .room-b{grid-row:2;margin-top:64px}
}
.gal .ph{display:block}
.gal figure{align-self:start}
:is(.cta,.notes,.station,.form-ok) p.label{font-size:.74rem;color:var(--champ);max-width:none}
.cta p.label{margin-top:0}
.station p.station-t{color:var(--hell3)}
:is(.frames,.carte-stage,.station-img,.course-img) img[src*="gruss-aus-der-kueche"]{object-position:50% 82%}
:is(.frames,.carte-stage) img[src*="schokolade"]{object-position:50% 75%}
.gruen .menu-sum span{color:var(--hell2)}
.prod-imgs{align-self:center}
.team-img{grid-column:1/6}
.team-txt{grid-column:7/13;align-self:center}
@media (max-width:900px){.team-img,.team-txt{grid-column:1/-1}.team-txt{margin-top:36px}}
@media (max-width:560px){.awards--2>div{padding-right:12px}.awards--2>div:nth-child(even){padding-left:16px;border-left:1px solid var(--linie-p)}.awards--2>div+div{border-top:0}.awards--2>div:nth-child(n+3){border-top:1px solid var(--linie-p)}}
@media (max-width:560px){
  .filter{gap:4px 24px}
  .filter button::after{bottom:2px}
  .gal figure.w4{grid-column:span 6}
  .gal figure.w4 .ph{aspect-ratio:3/4}
}
@media (max-width:560px){
  .gal{grid-auto-flow:row}
  .gal figure.m-full{grid-column:span 12}
  .gal figure.m-full .ph{aspect-ratio:3/2}
}
/* Korrekturen 28.09.2026: schmale Bildschirme */
@media (max-width:560px){
  .producers,.producers tbody{display:block;width:100%}
  .fig figcaption{flex-wrap:wrap;gap:4px 12px}
  .awards b{font-size:clamp(1.6rem,8vw,1.9rem)}
}
/* Galerie: breite Bilder exakt so hoch wie die 3:4-Nachbarn, damit Bildkanten und Bildunterschriften in einer Linie liegen */
@media (min-width:901px){
  .gal{container-type:inline-size;--g:clamp(16px,2vw,28px)}
  .gal figure.w8.r32 .ph{aspect-ratio:auto;height:calc(((100cqw - 11 * var(--g)) / 3 + 3 * var(--g)) * 4 / 3)}
}