/* Ilvi Komponenten: Gestaltung der Widgets. Farben/Schriften über die Theme-/Kit-Variablen (--gold, --cream …); die Werte nach dem Komma sind Notwerte, falls das Plugin ohne das Theme läuft. */ .elementor-widget[class*="elementor-widget-ilvi_"]{ --k-gold:var(--gold,#d4a05a);--k-gold-2:var(--gold-2,#e8bd7c);--k-red:var(--red,#bf4038); --k-cream:var(--cream,#f5e9d4);--k-cream-2:var(--cream-2,rgba(245,233,212,.74));--k-cream-3:var(--cream-3,rgba(245,233,212,.5)); --k-line:var(--line,rgba(212,160,90,.18));--k-line-2:var(--line-2,rgba(212,160,90,.36)); --k-bg:var(--bg,#0d0908);--k-bg-2:var(--bg-2,#130e0c); --k-head:var(--f-head,'Playfair Display',Georgia,serif);--k-body:var(--f-body,'Cormorant Garamond',Georgia,serif);--k-ui:var(--f-ui,'DM Sans',system-ui,sans-serif); --k-ease:var(--ease,cubic-bezier(.16,1,.3,1)); } .ilvi-hinweis{padding:14px 18px;border:1px dashed var(--k-gold);color:var(--k-cream);font:14px/1.4 var(--k-ui)} /* ---------------- Hero-Video (unterste Ebene im Hero-Container) */ .elementor-widget-ilvi_hero_video{position:absolute!important;inset:0;z-index:0;margin:0!important;width:100%!important;max-width:none!important} .ilvi-hero-media{position:absolute;inset:0;background:var(--k-bg)} .ilvi-hero-media video{width:100%;height:100%;object-fit:cover;display:block} .ilvi-hero-media::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 66% 58% at 50% 48%,rgba(13,9,8,.58),rgba(13,9,8,.78) 80%),linear-gradient(180deg,rgba(13,9,8,.55),rgba(13,9,8,.1) 32%,rgba(13,9,8,.25) 70%,var(--k-bg))} @media (max-width:760px){.ilvi-hero-media::after{background:radial-gradient(ellipse 92% 40% at 50% 50%,rgba(13,9,8,.66),rgba(13,9,8,.45) 70%,rgba(13,9,8,0) 100%),radial-gradient(ellipse 115% 85% at 50% 50%,rgba(13,9,8,0) 52%,rgba(13,9,8,.72) 100%),linear-gradient(180deg,rgba(13,9,8,.5),rgba(13,9,8,0) 24%,rgba(13,9,8,.12) 70%,var(--k-bg))}} /* ---------------- Speisekarte */ .elementor-widget-ilvi_karte_leiste,.elementor-widget-ilvi_karte_kategorie{width:100%} body{counter-reset:ilvi-kat} .ilvi-mcat{counter-increment:ilvi-kat} .ilvi-mcat-h .num::before{content:counter(ilvi-kat,decimal-leading-zero)} .ilvi-mtabs{position:relative;z-index:20;background:rgba(29,22,19,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--k-line);border-bottom:1px solid var(--k-line);margin:0 calc(50% - 50vw)} /* Die Leiste ist ein eigenes Element: der Widget-Rahmen klebt (sein Elternteil ist der ganze Speisekarten-Abschnitt). */ .elementor-widget-ilvi_karte_leiste{position:sticky!important;top:76px;z-index:20} .admin-bar .elementor-widget-ilvi_karte_leiste{top:108px} .ilvi-mtabs-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;justify-content:safe center;padding:0 var(--gut,24px)} .ilvi-mtabs-in::-webkit-scrollbar{display:none} .ilvi-mtabs a{flex:0 0 auto;font-family:var(--k-ui);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--k-cream-3);padding:20px 11px;position:relative;transition:color .3s} .ilvi-mtabs a::after{content:"";position:absolute;left:11px;right:11px;bottom:-1px;height:2px;background:var(--k-red);transform:scaleX(0);transition:transform .45s var(--k-ease)} .ilvi-mtabs a.on{color:var(--k-cream)} .ilvi-mtabs a.on::after{transform:scaleX(1)} @media (max-width:520px){.elementor-widget-ilvi_karte_leiste{top:68px}} @media (max-width:900px),(hover:none){.ilvi-mtabs{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(13,9,8,.98)}} .ilvi-mcat{padding:clamp(70px,8vw,110px) 0 10px;scroll-margin-top:140px} .ilvi-mcat-h{display:grid;grid-template-columns:auto 1fr;gap:10px 30px;align-items:end;margin-bottom:40px} .ilvi-mcat-h .num{font-family:var(--k-head);font-style:italic;font-size:22px;color:var(--k-gold);grid-row:1/3;align-self:start;padding-top:12px} .ilvi-mcat-h h2{font-family:var(--k-head);font-weight:600;font-size:clamp(38px,4.4vw,60px);line-height:1.04;margin:0} .ilvi-mcat-h p{margin:0;color:var(--k-cream-2);font-style:italic} .ilvi-mcat-img{margin:0 0 34px;aspect-ratio:21/8;overflow:hidden} .ilvi-menu .ilvi-mcat-img img{width:100%;height:100%;max-width:none;object-fit:cover;display:block} .ilvi-items{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(40px,6vw,90px)} .ilvi-items .item{padding:22px 0;border-bottom:1px solid var(--k-line)} .ilvi-items h3{font-family:var(--k-head);font-weight:600;font-size:clamp(20px,1.6vw,23px);line-height:1.2;margin:0} .ilvi-items p{margin:6px 0 0;color:var(--k-cream-2);font-size:.95em;line-height:1.48} .ilvi-items .ext{margin-top:10px;display:grid;gap:3px;font-family:var(--k-ui);font-size:12.5px;letter-spacing:.04em;color:var(--k-cream-2)} .ilvi-steaks{border-top:1px solid var(--k-line)} .ilvi-steaks .tr{display:grid;grid-template-columns:1fr auto;gap:0 24px;padding:24px 0;border-bottom:1px solid var(--k-line);align-items:baseline} .ilvi-steaks h3{font-family:var(--k-head);font-weight:600;font-size:clamp(21px,1.8vw,26px);line-height:1.2;margin:0} .ilvi-steaks p{margin:6px 0 0;color:var(--k-cream-2);font-size:.95em;max-width:620px} .ilvi-steaks .sp{font-family:var(--k-ui);font-size:11px;letter-spacing:.18em;white-space:nowrap;color:var(--k-gold);text-align:right} .ilvi-minfo{margin:28px 0 0;padding:24px 28px;border:1px solid var(--k-line);background:var(--k-bg-2);display:flex;gap:20px;align-items:flex-start} .ilvi-minfo svg{flex:0 0 22px;width:22px;color:var(--k-gold);margin-top:4px} .ilvi-minfo p{margin:0;color:var(--k-cream-2)} .ilvi-minfo b{color:var(--k-cream)} .ilvi-minfo .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px} .ilvi-minfo .chips span{font-family:var(--k-ui);font-size:12px;letter-spacing:.06em;padding:8px 14px;border:1px solid var(--k-line-2);color:var(--k-cream)} .ilvi-minfo .chips span.hl{border-color:var(--k-gold);color:var(--k-gold)} @media (max-width:900px){.ilvi-items{grid-template-columns:1fr}.ilvi-mcat-h{grid-template-columns:1fr}.ilvi-mcat-h .num{grid-row:auto;padding:0}} /* ---------------- Steak-Bilder + Steak-Liste */ .elementor-widget-ilvi_steak_bilder{width:100%} .ilvi-grill-frame{position:relative;aspect-ratio:4/5;max-width:100%;filter:drop-shadow(0 0 30px rgba(236,200,140,.035)) drop-shadow(0 0 80px rgba(236,200,140,.018))} @media (min-width:901px){.elementor-widget-ilvi_steak_bilder:has(.sticky){position:sticky;top:116px}} .ilvi-grill-media{position:absolute;inset:0 18% 12% 0;overflow:hidden;isolation:isolate;cursor:pointer;-webkit-tap-highlight-color:transparent} .ilvi-grill-frame .ilvi-grill-media img{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);max-width:none;object-fit:cover;transition:opacity .8s var(--k-ease),transform 1.6s var(--k-ease)} .ilvi-grill-frame .ilvi-grill-media img:not(.on){opacity:0;transform:scale(1.06)} .ilvi-grill-media .cap{position:absolute;left:0;right:0;bottom:-1px;padding:70px 40% 24px 28px;background:linear-gradient(transparent,rgba(13,9,8,.85));font-family:var(--k-ui);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--k-cream-2)} .ilvi-grill-b{position:absolute;right:0;bottom:0;width:46%;aspect-ratio:4/5;overflow:hidden;border:10px solid var(--k-bg);box-shadow:0 30px 60px rgba(0,0,0,.5);z-index:2} .ilvi-grill-frame .ilvi-grill-b img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 40%;display:block} .ilvi-cuts{list-style:none;margin:0;padding:0;border-top:1px solid var(--k-line)} .ilvi-cuts .cut{padding:24px 0;border-bottom:1px solid var(--k-line);cursor:pointer;position:relative} .ilvi-cuts .cut::before{content:"";position:absolute;left:-18px;top:30px;width:6px;height:6px;background:var(--k-red);transform:rotate(45deg) scale(0);transition:transform .4s var(--k-ease)} .ilvi-cuts .cut.on::before{transform:rotate(45deg) scale(1)} .ilvi-cuts h3{font-family:var(--k-head);font-weight:600;font-size:clamp(22px,1.9vw,27px);line-height:1.2;margin:0;transition:color .3s} .ilvi-cuts .cut.on h3,.ilvi-cuts .cut:hover h3{color:var(--k-gold-2)} .ilvi-cuts p{margin:6px 0 0;color:var(--k-cream-2);font-size:.95em;line-height:1.5} .ilvi-grill-note{margin:22px 0 0;font-size:.92em;color:var(--k-cream-3);font-style:italic} @media (max-width:900px){.ilvi-grill-frame{aspect-ratio:1/1;max-width:600px}.ilvi-grill-b{width:42%}.ilvi-cuts .cut::before{display:none}} @media (max-width:760px){.ilvi-grill-frame{width:94%;margin:0 auto}.ilvi-grill-b{border-width:7px}} /* ---------------- Gerichte-Liste (kurz) */ .ilvi-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(30px,4vw,60px);border-top:1px solid var(--k-line)} .ilvi-mini>div{padding:26px 0;border-bottom:1px solid var(--k-line)} .ilvi-mini h3{font-family:var(--k-head);font-weight:600;font-size:22px;line-height:1.2;margin:0} .ilvi-mini p{margin:8px 0 0;color:var(--k-cream-2);font-size:.92em;line-height:1.45} /* ---------------- Garstufen */ .elementor-widget-ilvi_garstufen_bild{width:100%} .ilvi-done-media{margin:0;aspect-ratio:3/2;max-width:100%;position:relative} .ilvi-done-media canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transform:translateY(10px);transition:opacity .8s var(--k-ease),transform 1.2s var(--k-ease)} .ilvi-done-media canvas.ready{opacity:1;transform:none} .ilvi-done-media figcaption{position:absolute;left:20px;top:18px;z-index:2;font-family:var(--k-ui);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--k-cream);background:rgba(13,9,8,.6);padding:7px 12px} .ilvi-done-media figcaption:empty{display:none} .ilvi-garwahl .dsteps{display:grid;grid-template-columns:repeat(5,1fr);margin-top:34px;position:relative} .ilvi-garwahl .dsteps::before{content:"";position:absolute;left:10%;right:10%;top:9px;height:1px;background:var(--k-line-2)} .ilvi-garwahl .dsteps button{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;font-family:var(--k-ui);font-size:11px;letter-spacing:.08em;color:var(--k-cream-3);position:relative;transition:color .3s;background:none;border:0;padding:0;cursor:pointer} .ilvi-garwahl .dsteps button i{width:19px;height:19px;border-radius:50%;border:1px solid var(--k-line-2);background:var(--k-bg-2);transition:all .4s var(--k-ease);display:block} .ilvi-garwahl .dsteps button.on{color:var(--k-cream)} .ilvi-garwahl .dsteps button.on i{background:var(--k-gold);border-color:var(--k-gold);box-shadow:0 0 0 6px rgba(212,160,90,.14)} .ilvi-garwahl .dsteps button b{display:block;font-family:var(--k-head);font-size:15px;font-weight:600;letter-spacing:0;color:inherit} .ilvi-garwahl .dout{margin-top:34px;padding:24px 28px;border:1px solid var(--k-line);background:rgba(26,20,17,.6);display:grid;grid-template-columns:auto 1fr;gap:4px 22px;align-items:center} .ilvi-garwahl .dout>*{transition:opacity .18s ease,transform .18s ease} .ilvi-garwahl .dout.swap>*{opacity:0;transform:translateY(4px)} .ilvi-garwahl .dout .t{font-family:var(--k-head);font-size:30px;color:var(--k-gold);grid-row:1/3;min-width:4.6em;white-space:nowrap} .ilvi-garwahl .dout b{font-family:var(--k-head);font-size:21px;font-weight:600} .ilvi-garwahl .dout .x{color:var(--k-cream-2);font-size:.95em} .ilvi-garwahl .house{margin:18px 0 0;font-style:italic;color:var(--k-cream-2)} .ilvi-garwahl .house b{color:var(--k-gold);font-style:normal;font-weight:600} @media (max-width:900px){.ilvi-garwahl .dsteps button b{font-size:13px}.ilvi-garwahl .dsteps button{font-size:9.5px}} @media (max-width:760px){ .ilvi-garwahl .dsteps{margin-top:10px}.ilvi-garwahl .dsteps button b{font-size:11.5px}.ilvi-garwahl .dsteps button{font-size:9px;gap:9px} .ilvi-garwahl .dout{margin-top:14px;padding:14px 16px;gap:2px 14px}.ilvi-garwahl .dout .t{font-size:24px;min-width:4.2em}.ilvi-garwahl .dout b{font-size:17px}.ilvi-garwahl .dout .x{font-size:.88em} .ilvi-garwahl .house{margin-top:12px;font-size:.9em} } /* ---------------- Bewertungen */ .elementor-widget-ilvi_bewertungen{width:100%} .ilvi-score-w{text-align:center;margin:calc(clamp(48px,5.5vw,76px) * -1 + 28px) 0 clamp(48px,5.5vw,76px)} .ilvi-score{display:inline-flex;align-items:center;gap:14px;padding:12px 22px;border:1px solid var(--k-line);font-family:var(--k-ui);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--k-cream-2)} .ilvi-score .stars{color:var(--k-gold);letter-spacing:.12em;font-size:15px} .ilvi-score b{font-family:var(--k-head);font-size:24px;letter-spacing:0;color:var(--k-cream);font-weight:600} .ilvi-reviews .rtrack{display:flex;gap:clamp(14px,2vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;cursor:grab;outline:none} .ilvi-reviews .rtrack::-webkit-scrollbar{display:none} .ilvi-reviews .rtrack.drag{cursor:grabbing;scroll-snap-type:none} .ilvi-reviews .review{flex:0 0 clamp(290px,31%,400px);scroll-snap-align:start;user-select:none;margin:0;padding:clamp(30px,3vw,44px);border:1px solid var(--k-line);background:linear-gradient(180deg,#2c221d,#241b17);display:flex;flex-direction:column;justify-content:space-between;gap:28px;position:relative} .ilvi-reviews .review::before{content:"\201C";position:absolute;top:8px;right:26px;font-family:var(--k-head);font-size:110px;line-height:1;color:var(--k-gold);opacity:.18} .ilvi-reviews .rstars{color:var(--k-gold);letter-spacing:.14em;font-size:14px} .ilvi-reviews blockquote{margin:0;font-family:var(--k-body);font-style:italic;font-size:clamp(21px,1.6vw,24px);line-height:1.45} .ilvi-reviews figcaption{display:flex;justify-content:space-between;align-items:baseline;padding-top:20px;border-top:1px solid var(--k-line)} .ilvi-reviews figcaption b{font-family:var(--k-head);font-weight:600;font-size:18px} .ilvi-reviews figcaption span{font-family:var(--k-ui);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--k-gold)} .ilvi-reviews .rnav{display:flex;align-items:center;gap:12px;margin-top:34px} .ilvi-reviews .rnav button{width:52px;height:52px;border:1px solid var(--k-line-2);display:grid;place-items:center;color:var(--k-cream);transition:border-color .3s,color .3s;background:none;cursor:pointer;padding:0} .ilvi-reviews .rnav button:hover{border-color:var(--k-gold);color:var(--k-gold)} .ilvi-reviews .rnav button svg{width:20px;height:20px} .ilvi-reviews .rnav .btn{margin-left:auto} @media (max-width:600px){.ilvi-reviews .review{flex-basis:84%}.ilvi-reviews .rnav .btn{margin-left:0;flex:1 0 100%}.ilvi-reviews .rnav{flex-wrap:wrap}} /* ---------------- Reservierungsformular */ .elementor-widget-ilvi_reservierung{width:100%} .ilvi-form{border:1px solid var(--k-line);background:var(--k-bg-2);padding:clamp(28px,4vw,54px)} .ilvi-form h3{font-family:var(--k-head);font-weight:600;font-size:30px;line-height:1.1;margin:0 0 8px} .ilvi-form .muted{margin:0;color:var(--k-cream-2)} .ilvi-form .fgrid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:30px} .ilvi-form .full{grid-column:1/-1} .ilvi-form .fld label,.ilvi-form .fld .lbl{display:block;font-family:var(--k-ui);font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--k-gold);margin-bottom:9px} .ilvi-form input,.ilvi-form textarea{width:100%;background:var(--k-bg);border:1px solid var(--k-line-2);color:var(--k-cream);font-family:var(--k-body);font-size:19px;padding:13px 16px;border-radius:0;outline:none;transition:border-color .3s;appearance:none;-webkit-appearance:none;color-scheme:dark} .ilvi-form input:focus,.ilvi-form textarea:focus{border-color:var(--k-gold)} .ilvi-form textarea{min-height:110px;resize:vertical} .ilvi-form .ppl,.ilvi-form .slots{display:flex;flex-wrap:wrap;gap:8px} .ilvi-form .ppl button,.ilvi-form .slots button{border:1px solid var(--k-line-2);background:none;color:var(--k-cream);cursor:pointer;transition:all .3s} .ilvi-form .ppl button{width:48px;height:48px;font-family:var(--k-head);font-size:19px;padding:0} .ilvi-form .slots button{padding:11px 15px;font-family:var(--k-ui);font-size:13px;letter-spacing:.06em} .ilvi-form .ppl button.on,.ilvi-form .slots button.on{background:var(--k-gold);color:#170f09;border-color:var(--k-gold)} .ilvi-form button[type="submit"]{margin-top:26px;width:100%} .ilvi-form button[type="submit"][disabled]{opacity:.6;cursor:wait} .ilvi-form .fld label .fhint{font-size:inherit;font-weight:400;letter-spacing:.06em;text-transform:none;color:var(--k-cream-3);font-style:italic} .ilvi-form .fheute{margin:8px 0 0;font-size:.85em;line-height:1.45;color:var(--k-cream-3);font-style:italic} .ilvi-form .fheute a{color:var(--k-gold);text-decoration:underline;white-space:nowrap} .ilvi-form .fnote{font-size:.85em;color:var(--k-cream-3);margin:18px 0 0;font-style:italic} .ilvi-form .fnote a{color:var(--k-gold);text-decoration:underline} .ilvi-form .fok{margin-top:22px;padding:18px 22px;border:1px solid var(--k-gold);color:var(--k-cream);display:none} .ilvi-form .fok.on{display:block} .ilvi-form .fok.fehler{border-color:var(--k-red)} .ilvi-form .ilvi-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden} @media (max-width:900px){.ilvi-form .fgrid2{grid-template-columns:1fr}} /* ---------------- Öffnungszeiten */ .ilvi-hours{width:100%;border-collapse:collapse;font-family:var(--k-body);font-size:18px;margin:0} .ilvi-hours td{padding:3px 0;border:0;background:none} .ilvi-hours td:last-child{text-align:right} .ilvi-hours tr.today td{color:var(--k-gold)} .ilvi-hours tr.off td{color:var(--k-cream-3)} /* ---------------- Karte */ .elementor-widget-ilvi_karte{width:100%;height:100%} .ilvi-map{position:relative;min-height:440px;height:100%;overflow:hidden;background:#1a1411;border:1px solid var(--k-line)} .elementor-widget .ilvi-map img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover} .ilvi-map .mo{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;background:linear-gradient(180deg,rgba(13,9,8,0) 30%,rgba(13,9,8,.92))} .ilvi-map .mo p{font-size:.88em;color:var(--k-cream-2);max-width:420px} .ilvi-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.55) invert(.9) hue-rotate(180deg) contrast(.92)} .ilvi-map .mbtns{display:flex;gap:12px;flex-wrap:wrap} /* ---------------- Schutz vor den Kit-Button-Stilen (gelten in Elementor für jedes