/* =========================================================================
Mount Lavinia v2 — Original-Design (Elegantia-Stil, modern umgesetzt)
Oliv #505534 · Gold #C9973A · Creme #F7F2E4 · Papier #FBF8F0
========================================================================= */
/* Hinweis: Der frueher hier stehende @import der Schriften wurde entfernt (15.07.2026).
* Ein @import zwingt den Browser, erst theme.css zu laden UND zu parsen, bevor er fonts.css
* ueberhaupt entdeckt -> die Anfragen laufen nacheinander statt parallel und verzoegern den
* Textaufbau. fonts.css wird jetzt als eigener in functions.php eingebunden
* (Handle 'mlv2-fonts', laedt parallel). Optisch aendert sich nichts. */
:root{
--olive:#505534; --olive-dk:#3E4227; --olive-lt:#7A8050; --olive-pale:#B0B48C;
--gold:#C9973A; --gold-lt:#E4B860;
--cream:#F7F2E4; --paper:#FBF8F0; --parch:#EFE3C2; --card:#FFFFFF;
--ink:#2A2D1D; --soft:#5C6046; --white:#F9F6EC;
--serif:'Vollkorn',Georgia,serif;
--label:'Alegreya Sans',sans-serif;
--sans:'Alegreya Sans',system-ui,sans-serif;
--e:cubic-bezier(.22,1,.36,1);
--sh-1:0 2px 10px rgba(30,32,18,.06),0 10px 30px rgba(30,32,18,.08);
--sh-2:0 8px 24px rgba(30,32,18,.12),0 24px 56px rgba(30,32,18,.16);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
/* Original-Look der Live-Seite: Oliv-Body mit fixiertem Hintergrundbild */
body{font-family:var(--sans);background:url('../images/elegantia/body-backdrop.png') var(--olive) left top/cover fixed no-repeat;color:var(--ink);font-weight:400;font-size:16.5px;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
/* Inhaltsflächen liegen als helle Bahnen auf dem Oliv */
main#main{background:var(--paper)}
main#main.on-olive{background:transparent}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;background:none;border:none;cursor:pointer}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.12}
::selection{background:var(--olive);color:var(--cream)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:50%;transform:translateX(-50%) translateY(-140%);top:8px;z-index:999;background:var(--gold);color:#2A2D1D;padding:.7rem 1.3rem;font-size:.8rem;border-radius:0 0 8px 8px;transition:transform .25s}
.skip:focus{transform:translateX(-50%) translateY(0)}
.wrap{max-width:1200px;margin:0 auto;padding:0 5%}
.sec{padding:4.6rem 0}
.eyebrow{font-family:var(--label);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--olive-lt)}
.center{text-align:center}
/* ─── Buttons (Original: Pergament-Pill auf Oliv) ─────────────────────── */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--label);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;padding:.9rem 1.9rem;border-radius:999px;border:1px solid transparent;min-height:46px;transition:.35s var(--e);cursor:pointer}
.btn-gold{background:var(--gold);color:#2A2D1D}
.btn-gold:hover{background:var(--gold-lt);transform:translateY(-2px);box-shadow:0 8px 22px rgba(201,151,58,.35)}
.btn-olive{background:var(--olive);color:var(--white)}
.btn-olive:hover{background:var(--olive-dk);transform:translateY(-2px)}
.btn-line{border-color:rgba(80,85,52,.4);color:var(--olive-dk)}
.btn-line:hover{background:var(--olive);color:var(--white);border-color:var(--olive)}
.btn-line-light{border-color:rgba(249,246,236,.55);color:var(--white)}
.btn-line-light:hover{background:var(--white);color:var(--olive-dk)}
/* =========================================================================
HEADER — Oliv, zentriertes Logo, Nav links/rechts (wie Original)
========================================================================= */
/* Startseite: Header schwebt über dem Hero (Bild geht bis ganz oben).
Unterseiten: Header im normalen Fluss, keine Überlagerung. */
.site-header{background:transparent;position:relative;z-index:100}
.site-header.is-front{position:absolute;top:0;left:0;right:0}
.hdr-in{max-width:1280px;margin:0 auto;display:flex;justify-content:center;align-items:center;padding:1rem 4% .3rem;position:relative}
/* Logo als dunkelgrüner Schriftzug (ohne Kreis) — nur Startseite, über dem Hero.
Dezenter heller Schein, damit die dunkle Schrift auch vor den Fotos lesbar bleibt. */
.logo-wordmark{display:inline-flex;align-items:center;justify-content:center;transition:transform .35s var(--e)}
.logo-wordmark:hover{transform:scale(1.02)}
.logo-wordmark img{width:300px;max-width:72vw;height:auto;filter:drop-shadow(0 1px 1px rgba(255,255,255,.55)) drop-shadow(0 2px 14px rgba(255,255,255,.4))}
/* Desktop-Navigation: dunkle, gut lesbare Leiste — großzügige Schrift und Abstände */
.hdr-navrow{display:flex;justify-content:center;align-items:center;gap:2.3rem;flex-wrap:wrap;padding:.85rem 4%;background:rgba(42,45,29,.78);backdrop-filter:blur(8px);border-bottom:1px solid rgba(228,184,96,.22)}
.hdr-navrow a{font-family:var(--label);font-size:.94rem;letter-spacing:.07em;text-transform:uppercase;color:#F9F6EC;padding:.55rem .15rem;position:relative;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}
.hdr-navrow a::after{content:'';position:absolute;left:0;right:100%;bottom:.3rem;height:2px;background:var(--gold-lt);transition:right .3s var(--e)}
.hdr-navrow a:hover{color:var(--gold-lt)}
.hdr-navrow a:hover::after{right:0}
.hdr-navrow a[aria-current=page]{color:var(--gold-lt)}
.hdr-navrow a[aria-current=page]::after{right:0}
.hdr-navrow .nav-cta{border:1px solid var(--gold-lt);color:var(--gold-lt);padding:.55rem 1.4rem;border-radius:999px;transition:.3s var(--e)}
.hdr-navrow .nav-cta::after{display:none}
.hdr-navrow .nav-cta:hover{background:var(--gold);border-color:var(--gold);color:#2A2D1D}
/* Bei schmalen Desktops rutscht die Zeile sauber um, nichts überlappt */
@media(min-width:1025px) and (max-width:1300px){ .hdr-navrow{gap:1.5rem} .hdr-navrow a{font-size:.86rem} }
/* Startseiten-Variante: cremefarbene Leiste UNTER dem Hero (nie über Bildern) */
.hdr-navrow.cream{background:url('../images/elegantia/body.png') #F7F2E4;border-top:1px solid #fce2af;border-bottom:1px solid #fce2af;backdrop-filter:none;padding:1rem 4%}
.hdr-navrow.cream a{color:#3E4227;font-size:1rem;text-shadow:none}
.hdr-navrow.cream a:hover{color:#8A6410}
.hdr-navrow.cream a::after{background:#C9973A}
.hdr-navrow.cream a[aria-current=page]{color:#8A6410}
.hdr-navrow.cream .nav-cta{border-color:#C9973A;color:#8A6410}
.hdr-navrow.cream .nav-cta:hover{background:var(--gold);color:#2A2D1D}
@media(max-width:1024px){ .hdr-navrow.cream{display:none} }
/* Mobil: „Menü" als schlichtes Wort oben rechts — kein Rahmen, leicht
zurückgenommen (fällt nicht ins Auge, ist aber da). */
.mmenu-word{display:none;position:fixed;top:14px;right:16px;z-index:320;background:none;border:0;font-family:var(--label);font-size:.74rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(249,246,236,.55);text-shadow:0 1px 10px rgba(20,22,12,.6);padding:.65rem .45rem;cursor:pointer;transition:color .3s var(--e)}
.mmenu-word:hover,.mmenu-word:active,.mmenu-word[aria-expanded=true]{color:rgba(249,246,236,.95)}
/* Grüner Plus-Kreis unten rechts (schwebend), Orange nur als feiner Akzent-Ring.
Beim Öffnen dreht sich das Plus zum X. */
.mmenu-fab{display:none;position:fixed;right:16px;bottom:18px;z-index:320;width:52px;height:52px;border-radius:50%;background:rgba(80,85,52,.94);border:1.5px solid rgba(201,151,58,.6);color:#F9F6EC;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 20px rgba(20,22,12,.5);backdrop-filter:blur(6px)}
.mmenu-fab svg{width:21px;height:21px;transition:transform .35s var(--e)}
.mmenu-fab[aria-expanded=true] svg{transform:rotate(45deg)}
.mmenu-fab:active{background:rgba(94,100,62,.96)}
/* Vollbild-Menü: ruhiges Dunkeloliv, Logo oben, Gruppen mit Gold-Überschriften */
.mmenu{position:fixed;inset:0;z-index:310;background:radial-gradient(circle at 50% 30%,#3E4227,#1C1E10 78%);opacity:0;visibility:hidden;transition:opacity .4s var(--e),visibility .4s var(--e);overflow-y:auto}
.mmenu.open{opacity:1;visibility:visible}
.mm-in{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4.4rem 1.6rem 2.2rem;text-align:center}
.mm-home{display:block;margin-bottom:.9rem}
.mm-logo{width:min(215px,56vw);height:auto;filter:drop-shadow(0 4px 18px rgba(0,0,0,.45))}
.mm-nav{display:flex;flex-direction:column;align-items:center}
.mm-group{font-family:var(--label);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(230,217,184,.75);margin:1.05rem 0 .3rem}
.mm-link{font-family:var(--serif);font-size:1.28rem;color:var(--white);padding:.34rem 1rem;min-height:42px;display:inline-flex;align-items:center;opacity:0;transform:translateY(12px);transition:color .25s,opacity .45s var(--e),transform .45s var(--e)}
.mmenu.open .mm-link{opacity:1;transform:none}
.mm-link:hover,.mm-link:active{color:#E6D9B8}
.mm-link[aria-current=page]{color:#E6D9B8;text-decoration:underline;text-underline-offset:.35em;text-decoration-color:rgba(230,217,184,.5)}
.mm-actions{display:flex;flex-direction:column;align-items:center;gap:.55rem;margin-top:1.5rem;opacity:0;transition:opacity .5s var(--e) .35s}
.mmenu.open .mm-actions{opacity:1}
.mm-cta{font-family:var(--label);font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;background:#EFE6CC;color:#2A2D1D;border-radius:999px;padding:.95rem 2.3rem;min-height:48px;display:inline-flex;align-items:center}
.mm-cta:hover,.mm-cta:active{background:#F9F1DA;color:#2A2D1D}
.mm-tel{font-family:var(--sans);font-size:.98rem;color:rgba(249,246,236,.78);min-height:44px;display:inline-flex;align-items:center}
body.ov-lock{overflow:hidden}
/* Unterseiten mobil: kleines weißes Logo oben als Heimweg (Desktop: aus) */
.hdr-mini{display:none}
@media(max-width:1024px){
.hdr-in{padding:.9rem 4% .3rem}
.logo-wordmark img{width:230px}
.hdr-navrow{display:none}
.mmenu-word{display:block}
.mmenu-fab{display:flex}
/* Hero-Slide-Label nach links, damit der Plus-Knopf unten rechts frei liegt */
.hero-slide-label{right:auto;left:1.1rem}
/* Unterseiten: schmale dunkle Leiste mit kleinem Logo */
.site-header:not(.is-front){min-height:60px;background:rgba(42,45,29,.94);display:flex;align-items:center;justify-content:center}
.hdr-mini{display:inline-flex;padding:.55rem 0}
.hdr-mini img{width:150px;height:auto}
}
/* =========================================================================
HERO + PERGAMENT-STREIFEN (wie Original)
========================================================================= */
.hero{position:relative;overflow:hidden}
/* Zarter dunkler Schleier oben — Burger bleibt vor den hellen Slides lesbar */
.hero::before{content:'';position:absolute;top:0;left:0;right:0;height:140px;background:linear-gradient(180deg,rgba(20,22,12,.38),transparent);z-index:4;pointer-events:none}
/* Bilder-Loop: drei anklickbare Slides in sanfter Überblendung */
.hero-slides{position:relative;height:min(78vh,760px)}
/* Alternativer Hero-Stil "Nur Farbe" (Customizer -> Mount Lavinia: Hero-Bereich) */
.hero-flat{position:relative;height:min(78vh,760px)}
.hero-slide{position:absolute;inset:0;display:block;opacity:0;transition:opacity 1.3s var(--e);z-index:1}
.hero-slide.is-on{opacity:1;z-index:2}
.hero-slide img{width:100%;height:100%;object-fit:cover;display:block}
.hero-slide-label{position:absolute;right:1.3rem;bottom:1.3rem;z-index:3;font-family:var(--label);font-size:.9rem;letter-spacing:.16em;text-transform:uppercase;background:rgba(247,242,228,.93);color:#4A4326;padding:.75rem 1.5rem;border-radius:999px;box-shadow:var(--sh-1);transition:.3s var(--e)}
.hero-slide:hover .hero-slide-label,.hero-slide:focus-visible .hero-slide-label{background:var(--gold);color:#2A2D1D;transform:translateY(-2px)}
/* Pfeil-Buttons: manuell durch den Hero-Loop schalten (zusaetzlich zu Auto-Rotation + Swipe auf dem Handy) */
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:44px;height:44px;border-radius:50%;border:none;background:rgba(20,22,12,.35);color:#F9F6EC;font-size:1.7rem;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.25s var(--e)}
.hero-arrow:hover,.hero-arrow:focus-visible{background:rgba(20,22,12,.65)}
.hero-arrow-prev{left:1rem}
.hero-arrow-next{right:1rem}
@media(max-width:767px){.hero-arrow{width:36px;height:36px;font-size:1.35rem}.hero-arrow-prev{left:.6rem}.hero-arrow-next{right:.6rem}}
/* Weißes Logo OBEN MITTIG über dem Loop (40 % kleiner): Elefant gleitet ein, Schriftzug blendet auf */
.hero-logo{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:clamp(1.2rem,4.5vh,2.8rem);gap:.55rem;pointer-events:none;will-change:transform,opacity}
.hero-logo .hl-wordmark{width:min(455px,58vw);height:auto;filter:drop-shadow(0 6px 26px rgba(0,0,0,.6));animation:hlWord 1.3s var(--e) .3s both}
.hero-logo .hl-elefant{width:min(220px,40vw);height:auto;filter:drop-shadow(0 3px 14px rgba(0,0,0,.55));animation:hlEle 1.1s var(--e) 1.5s both}
.hero-logo .hl-since{width:min(220px,40vw);height:auto;margin-top:.4rem;filter:drop-shadow(0 3px 12px rgba(0,0,0,.5));animation:hlSince 1.1s var(--e) 1.55s both}
@keyframes hlEle{from{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:none}}
@keyframes hlWord{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@keyframes hlSince{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* Startseiten-Header: der kleine Schriftzug oben entfällt — das Logo steht jetzt groß im Hero.
(Wieder aktivierbar: diese Zeile entfernen.) */
.site-header.is-front .hdr-in{display:none}
@media(max-width:767px){
.hero-slides{height:min(72vh,640px)}
}
@media(prefers-reduced-motion:reduce){
.hero-slide{transition:none}
.hero-logo .hl-elefant,.hero-logo .hl-wordmark{animation:none}
}
/* ---- Intro: „Mount Lavinia" schreibt sich beim Betreten der Website --------
Der echte weiße Schriftzug wird per Clip-Reveal von links nach rechts
freigelegt (wirkt bei der Schreibschrift wie ein schreibender Stift),
danach erscheint der Elefant, dann blendet das Intro zur Seite über. */
.intro-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 42%,#3E4227,#1C1E10 74%);cursor:pointer;transition:opacity .85s var(--e)}
.intro-overlay.is-hidden{opacity:0;pointer-events:none}
.intro-inner{display:flex;flex-direction:column;align-items:center;gap:1.15rem;padding:0 6vw}
.intro-elefant{width:min(280px,52vw);height:auto;opacity:0;transform:translateY(-24px);transition:opacity .7s var(--e),transform .7s var(--e);filter:drop-shadow(0 3px 14px rgba(0,0,0,.5))}
.intro-overlay.is-crest .intro-elefant{opacity:1;transform:none}
.intro-wordmark{width:min(640px,86vw);height:auto;clip-path:inset(-10% 101% -10% -2%);filter:drop-shadow(0 6px 26px rgba(0,0,0,.55))}
.intro-overlay.is-writing .intro-wordmark{clip-path:inset(-10% -2% -10% -2%);transition:clip-path 2.2s cubic-bezier(.32,.12,.48,.92)}
.intro-since{width:min(280px,52vw);height:auto;margin-top:.55rem;opacity:0;transform:translateY(20px);transition:opacity .7s var(--e),transform .7s var(--e);filter:drop-shadow(0 3px 12px rgba(0,0,0,.5))}
.intro-overlay.is-crest .intro-since{opacity:1;transform:none}
body.intro-lock{overflow:hidden}
/* Cookie-Banner (Complianz) erst nach dem Intro zeigen, nicht gleichzeitig mit der Animation */
body.intro-lock .cmplz-cookiebanner{opacity:0!important;pointer-events:none!important;transition:none!important}
/* Pergament-Streifen: nur Farbton, Textur-Bild entfernt */
.strip{background:#e5d6ba;min-height:50px;padding:.55rem 4%;display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;text-align:center}
.strip p{font-family:var(--serif);font-size:1.02rem;color:#4A4326;font-weight:600}
.strip a.tel{color:#7A5B14;border-bottom:1px solid rgba(122,91,20,.4);font-weight:600}
.strip .btn{padding:.45rem 1.2rem;min-height:34px;font-size:.66rem}
/* Nur auf dem Handy zeigen (Telefon + Reserve now unter dem Hero), ab Tablet/Desktop ausgeblendet */
@media(min-width:768px){.strip{display:none}}
/* =========================================================================
CREME-BOX (Willkommen) — wie Original-Startseite
========================================================================= */
.welcome-box{max-width:880px;margin:3.6rem auto;background:url('../images/elegantia/body.png') #FAF7F2;border:1px solid #fce2af;box-shadow:var(--sh-1);padding:3.6rem clamp(1.4rem,5vw,4rem) 3.2rem;text-align:center;position:relative;border-radius:4px}
.welcome-box::before{content:'';position:absolute;top:1.1rem;left:50%;transform:translateX(-50%);width:120px;height:26px;background:url('../images/elegantia/elegant-shape.png') no-repeat center/contain;opacity:.85}
.welcome-box .eyebrow{display:block;margin-bottom:.6rem}
.welcome-box h1,.welcome-box h2{font-size:clamp(1.9rem,4.6vw,3.1rem);color:var(--olive-dk);margin-bottom:.4rem}
.welcome-box h1 em,.welcome-box h2 em{font-style:italic;color:var(--gold)}
.welcome-box .since{font-family:var(--label);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--soft);margin-bottom:1.6rem}
.welcome-box p{color:#3A3D2B;font-size:1.05rem;font-weight:400;line-height:1.85;margin-bottom:1rem;text-align:left}
.welcome-box p strong{color:var(--olive-dk);font-weight:500}
.welcome-box .actions{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;margin-top:1.6rem}
/* =========================================================================
SEKTIONEN
========================================================================= */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.split .visual{border-radius:14px;overflow:hidden;box-shadow:var(--sh-2);position:relative}
.split .visual img{width:100%;height:100%;object-fit:cover}
.sec-h{font-size:clamp(1.8rem,3.6vw,2.7rem);color:var(--olive-dk);margin:.5rem 0 1rem}
.sec-h em{font-style:italic;color:var(--gold)}
.sec p.lead{color:#454936;line-height:1.85;margin-bottom:1rem}
.link-row{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:1.2rem}
.link-row a{font-family:var(--label);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--olive);border-bottom:1px solid var(--olive-pale);padding-bottom:2px}
.link-row a:hover{color:var(--gold);border-color:var(--gold)}
/* Öffnungszeiten — Oliv-Band */
.hours{background:var(--olive);color:var(--white)}
.hours .in{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:center}
.hours h2{color:var(--white)}
.hours h2 em{color:var(--gold-lt)}
.hours .row{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid rgba(249,246,236,.18);font-size:.98rem}
.hours .row b{font-family:var(--label);font-weight:400;letter-spacing:.05em}
.hours .tel{font-family:var(--serif);font-size:1.5rem;color:var(--gold-lt);margin-top:1.2rem;display:inline-block}
.hours .caps{display:flex;gap:2.4rem;margin-top:1.4rem;flex-wrap:wrap}
.hours .caps b{font-family:var(--serif);font-size:2rem;color:var(--gold-lt);display:block;line-height:1}
.hours .caps span{font-size:.84rem;color:rgba(249,246,236,.75)}
/* Teaser-Karten (Ayurveda/Gutschein) */
.teasers{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem}
.teaser{position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--sh-1);background:var(--card);display:flex;flex-direction:column}
.teaser img{height:230px;object-fit:cover;width:100%}
.teaser .pad{padding:1.6rem 1.7rem 1.9rem}
.teaser h3{font-size:1.5rem;color:var(--olive-dk);margin-bottom:.5rem}
.teaser p{font-size:.92rem;color:var(--soft);margin-bottom:1.1rem}
/* Karte */
.map-grid{display:grid;grid-template-columns:1fr 1.4fr;border-radius:14px;overflow:hidden;box-shadow:var(--sh-2)}
.map-info{background:var(--olive-dk);color:var(--white);padding:2.8rem 2.4rem;display:flex;flex-direction:column;gap:1rem;justify-content:center}
.map-info h2{color:var(--white)}.map-info h2 em{color:var(--gold-lt)}
.map-info address{font-style:normal;line-height:1.8;color:rgba(249,246,236,.85)}
.map-grid iframe{width:100%;height:100%;min-height:340px;border:0}
/* Karten-Consent (DSGVO: Google Maps erst nach Klick laden) */
.map-consent{display:flex;align-items:center;justify-content:center;text-align:center;min-height:340px;height:100%;background:var(--olive-dk);color:var(--white);padding:2rem 1.6rem}
.map-consent.resv-map{height:360px;min-height:0;border-radius:12px;box-shadow:var(--sh-1);margin-top:1.8rem}
.map-consent-inner{max-width:380px;display:flex;flex-direction:column;gap:.85rem;align-items:center}
.map-consent-title{font-family:var(--serif);font-size:1.45rem;color:var(--gold-lt);margin:0}
.map-consent-text{font-size:.85rem;line-height:1.6;color:rgba(249,246,236,.8);margin:0}
.map-consent .map-consent-btn{margin-top:.35rem}
@media(max-width:760px){.map-consent.resv-map{height:280px}}
/* Aus unserer Küche — Karten */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem}
.kcard{background:var(--card);border-radius:14px;overflow:hidden;box-shadow:var(--sh-1);transition:transform .4s var(--e),box-shadow .4s var(--e)}
.kcard:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.kcard .im{position:relative;aspect-ratio:5/4;overflow:hidden}
.kcard img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--e)}
.kcard:hover img{transform:scale(1.06)}
.kcard .pad{padding:1.3rem 1.4rem 1.6rem}
.kcard h3{font-size:1.35rem;color:var(--olive-dk);margin-bottom:.4rem}
.kcard p{font-size:.9rem;color:var(--soft)}
/* =========================================================================
BILD-LABEL (kleiner Name in der Bildecke)
========================================================================= */
.img-label{position:absolute;right:.7rem;bottom:.7rem;z-index:5;font-family:var(--label);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--white);background:rgba(42,45,29,.55);backdrop-filter:blur(6px);border:1px solid rgba(249,246,236,.18);padding:.3rem .65rem;border-radius:999px;pointer-events:none;white-space:nowrap;max-width:72%;overflow:hidden;text-overflow:ellipsis}
/* =========================================================================
UNTERSEITEN — Kopfband + Inhalt (übernommene Live-Texte)
========================================================================= */
/* Unterseiten: Header ist im Fluss — normaler Abstand reicht */
.page-head{background:transparent;color:var(--white);text-align:center;padding:3.2rem 5% 1.6rem}
@media(max-width:1024px){ .page-head{padding-top:2.4rem} }
.page-head h1{color:var(--white);font-size:clamp(1.9rem,4.4vw,3rem);font-weight:400;text-shadow:0 2px 14px rgba(30,32,18,.35)}
.page-head .crumb{font-family:var(--label);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(249,246,236,.75);margin-top:.6rem}
/* Unterseiten: Creme-Blatt mit Abriss-Kanten (Original-Grafiken) auf Oliv */
main#main.on-olive .entry-sheet{max-width:1000px;margin:0 auto 4rem;position:relative}
.sheet-edge{height:40px;background:url('../images/elegantia/container-top-.png') no-repeat center top;pointer-events:none}
.sheet-edge.btm{background-image:url('../images/elegantia/container-bottom-.png');background-position:center bottom}
.entry{max-width:1000px;margin:0 auto;background:url('../images/elegantia/body.png') #FBF8F0;border:1px solid #fce2af;padding:2.8rem clamp(1.2rem,6vw,4.5rem) 3.6rem}
.entry h1,.entry h2{color:var(--olive-dk);margin:1.8rem 0 .8rem;font-size:clamp(1.5rem,3vw,2.2rem)}
.entry h3{color:var(--olive-dk);margin:1.4rem 0 .6rem;font-size:1.3rem}
.entry p{margin-bottom:1rem;color:#33362A;font-size:1.02rem;font-weight:400;line-height:1.85}
.entry ul,.entry ol{margin:0 0 1rem 1.3rem;list-style:disc}
.entry ol{list-style:decimal}
.entry li{margin-bottom:.4rem;color:#3E4130}
.entry img{border-radius:12px;box-shadow:var(--sh-1);margin:1.2rem auto}
.entry a{color:var(--olive);border-bottom:1px solid var(--olive-pale)}
.entry a:hover{color:var(--gold);border-color:var(--gold)}
.entry blockquote{border-left:3px solid var(--gold);padding:.4rem 0 .4rem 1.2rem;font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--soft);margin:1.4rem 0}
.entry .wp-block-image{margin:1.4rem 0}
.entry figure figcaption{font-size:.8rem;color:var(--soft);text-align:center;margin-top:.5rem}
/* =========================================================================
SPEISEKARTE — perfekt lesbar (Handy + Desktop)
========================================================================= */
.cat-nav{position:sticky;top:0;z-index:60;background:rgba(251,248,240,.94);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(80,85,52,.12)}
.cat-scroll{display:flex;gap:.5rem;overflow-x:auto;padding:.8rem 5%;max-width:1200px;margin:0 auto;scrollbar-width:none}
.cat-scroll::-webkit-scrollbar{display:none}
.pill{flex:0 0 auto;font-size:.8rem;font-weight:500;color:var(--soft);background:var(--card);padding:.55rem 1.15rem;border-radius:999px;box-shadow:var(--sh-1);white-space:nowrap;min-height:40px;display:inline-flex;align-items:center;transition:.3s var(--e)}
.pill[aria-current=true]{background:var(--olive);color:var(--white)}
.menu-main{max-width:1100px;margin:0 auto 3.4rem;padding:2rem clamp(1rem,4vw,3rem) 3rem;background:url('../images/elegantia/body.png') #FBF8F0;border:1px solid #fce2af}
.dish{border-radius:6px}
.teaser,.kcard,.split .visual,.map-grid{border-radius:6px}
.cat-block{scroll-margin-top:80px;margin-top:3rem}
.cat-title{display:flex;align-items:baseline;gap:.9rem;padding-bottom:.9rem;margin-bottom:1.3rem;border-bottom:1px solid rgba(80,85,52,.18)}
.cat-title .no{font-family:var(--label);font-size:.76rem;letter-spacing:.16em;color:var(--gold)}
.cat-title h2{font-size:clamp(1.6rem,3vw,2.2rem);color:var(--olive-dk)}
.cat-list{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.dish{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem 1rem;background:var(--card);border-radius:6px;padding:1.15rem 1.35rem;box-shadow:var(--sh-1);transition:transform .35s var(--e),box-shadow .35s var(--e)}
.dish:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
/* Gerichtenamen: aufrecht, kräftiger, dunkler — elegant über die Serifen-Schrift, aber gut lesbar */
.dish h3{font-family:var(--serif);font-style:normal;font-weight:600;font-size:1.38rem;color:#232619;line-height:1.3;letter-spacing:.005em}
.dish .price{font-family:var(--serif);font-size:1.3rem;font-weight:600;color:#3E4227;white-space:nowrap;text-align:right}
.dish .dc{grid-column:1/-1;font-size:.95rem;font-weight:400;color:#43462F;line-height:1.65}
.dish .tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.4rem}
.dish-thumb{grid-row:1/span 4;width:84px;height:84px;object-fit:cover;border-radius:8px;box-shadow:0 3px 10px rgba(40,42,26,.18)}
.dish-fineprint{font-size:.8rem!important;color:#6B6E55!important}
.dish.has-img{grid-template-columns:auto minmax(0,1fr) auto}
.dish.has-img .dc,.dish.has-img .tags{grid-column:2/-1}
.chip{display:inline-flex;align-items:center;gap:.3rem;font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;padding:.3rem .65rem;border-radius:999px}
.chip.heat{background:rgba(200,100,48,.12);color:#A4541E}
.chip.veg{background:rgba(80,110,40,.14);color:#3E5226}
.chip.fish{background:rgba(40,90,140,.12);color:#1F5486}
.chip.new{background:rgba(201,151,58,.16);color:#8A6410}
.menu-note{max-width:1200px;margin:2rem auto 0;padding:1.3rem 1.5rem;background:var(--cream);border:1px solid rgba(201,151,58,.3);border-radius:14px;font-size:.88rem;color:var(--soft)}
/* =========================================================================
FOOTER — Oliv wie Original
========================================================================= */
.site-footer{background:var(--olive-dk);color:var(--white);margin-top:4rem}
.ft-in{max-width:1200px;margin:0 auto;padding:3.4rem 5% 2.4rem;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:2.6rem}
.ft-in img{height:64px;width:auto;margin-bottom:1rem}
.ft-in p{font-size:.86rem;color:rgba(249,246,236,.65);line-height:1.7;max-width:300px}
.ft-in h2{font-family:var(--label);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:1rem}
.ft-in a{display:block;font-size:.88rem;color:rgba(249,246,236,.72);padding:.34rem 0;min-height:30px}
.ft-in a:hover{color:var(--gold-lt)}
.ft-btm{border-top:1px solid rgba(249,246,236,.12);padding:1.2rem 5%;display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap;max-width:1200px;margin:0 auto}
.ft-btm p{font-size:.76rem;color:rgba(249,246,236,.5)}
/* Reveals (dezent) */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--e),transform .8s var(--e)}
.rv.in{opacity:1;transform:none}
/* =========================================================================
RESPONSIVE
========================================================================= */
@media(max-width:980px){
.split,.hours .in,.teasers,.map-grid{grid-template-columns:1fr}
.cards{grid-template-columns:1fr 1fr}
.cat-list{grid-template-columns:1fr}
.ft-in{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
.sec{padding:3.2rem 0}
.hero-slides{height:58vh}
.cards{grid-template-columns:1fr}
.ft-in{grid-template-columns:1fr}
.dish{padding:.95rem 1.05rem}
.dish h3{font-size:1.12rem}
.dish .price{font-size:1.1rem}
.welcome-box{margin:2.4rem 4%}
}
@media(prefers-reduced-motion:reduce){
*{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.rv{opacity:1!important;transform:none!important}
}
/* =========================================================================
SPEISE-/GETRÄNKEKARTE: Allergen-Legende, Filter, Suche (aus PDF-Import)
========================================================================= */
.scr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.allergen-legend{max-width:1000px;margin:1.4rem auto 0;padding:.9rem 1.2rem;background:#F7F2E4;
border:1px solid #e3d8b8;border-radius:12px;font-size:.82rem;color:#3E4227;line-height:1.9}
.allergen-legend strong{color:#8A6410;margin-right:.4rem}
.allergen-legend span{display:inline-block;margin-right:1rem;white-space:nowrap}
.allergen-legend b{display:inline-block;min-width:1.1em;text-align:center;color:#8A6410}
/* Toolbar als helle Karte: Suche prominent oben, Filter-Buttons darunter */
.menu-tools{max-width:1000px;margin:1.4rem auto 0;padding:1.1rem 1.2rem 1.2rem;background:#fff;
border:1px solid #e3d8b8;border-radius:14px;box-shadow:var(--sh-1,0 6px 20px rgba(30,32,18,.08));
display:flex;flex-direction:column;gap:1rem;align-items:center}
.menu-search{position:relative;display:block;width:100%;max-width:580px}
.menu-search-ico{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);font-size:1.35rem;color:var(--olive,#505534);pointer-events:none}
.menu-search input{width:100%;font-size:1.02rem;padding:.85rem 1rem .85rem 2.7rem;border:2px solid var(--olive,#505534);
border-radius:8px;background:#fff;color:#2A2D1D}
.menu-search input::placeholder{color:#9a9482}
.menu-search input:focus{outline:none;border-color:var(--gold,#C9973A);box-shadow:0 0 0 3px rgba(201,151,58,.25)}
.menu-filter{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center}
.fbtn{font-family:var(--label,inherit);font-size:.86rem;letter-spacing:.02em;padding:.55rem 1.15rem;min-height:42px;
border:1.5px solid #cdbf95;background:#fff;color:#3E4227;border-radius:8px;cursor:pointer;transition:.18s;font-weight:600}
.fbtn:hover{border-color:var(--gold,#C9973A);color:#8A6410}
.fbtn.is-on{background:var(--gold,#C9973A);color:#2A2D1D;border-color:var(--gold,#C9973A)}
/* Aktiver Button in der Farbe seiner Kennzeichnung – klar unterscheidbar */
.fbtn.f-vegan.is-on,.fbtn.f-vegetarisch.is-on,.fbtn.f-glutenfrei.is-on,.fbtn.f-ayurveda.is-on{background:#4a7a3a;color:#fff;border-color:#4a7a3a}
.fbtn.f-fisch.is-on{background:#356b8a;color:#fff;border-color:#356b8a}
.fbtn.f-fleisch.is-on{background:#8a5a2a;color:#fff;border-color:#8a5a2a}
.fbtn.f-mild.is-on{background:#7a8050;color:#fff;border-color:#7a8050}
.fbtn.f-scharf.is-on{background:#b0472f;color:#fff;border-color:#b0472f}
.menu-empty{max-width:1000px;margin:1.2rem auto;text-align:center;color:#6b6b52;font-style:italic}
.dish-no{color:#8A6410;font-weight:600}
.dish-variant{font-size:.8rem;color:#6b6b52}
.dish-allergene{margin-top:.35rem;font-size:.72rem;letter-spacing:.02em;color:#8a7c50}
.chip.meat{background:#efe3d2;color:#7a5320}
@media(max-width:600px){ .menu-tools{padding:.9rem} }
/* ---- Gewürze-Seite: Karten-Grid (3 Desktop / 2 Handy) --------------------- */
.spice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;max-width:1180px;margin:2.2rem auto 0;padding:0 5%}
.spice-card{background:var(--card);border-radius:14px;overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column}
.spice-media{aspect-ratio:640/460;overflow:hidden;background:#e9e2d2}
.spice-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--e)}
.spice-card:hover .spice-media img{transform:scale(1.05)}
.spice-body{padding:1.05rem 1.2rem 1.3rem}
.spice-name{font-family:var(--serif);font-weight:600;font-size:1.5rem;line-height:1.15;margin:0;color:var(--olive)}
.spice-tag{font-style:italic;color:var(--gold);margin:.15rem 0 .55rem;font-size:.98rem}
.spice-text{font-size:.95rem;line-height:1.62;color:var(--soft);margin:0}
@media(max-width:760px){ .spice-grid{grid-template-columns:repeat(2,1fr);gap:1rem} .spice-body{padding:.85rem .95rem 1rem} .spice-name{font-size:1.28rem} .spice-text{font-size:.9rem} }
/* ---- Reservierungs-Seite --------------------------------------------------- */
.resv-intro{max-width:760px;margin:2rem auto 0;padding:0 5%;text-align:center;color:var(--soft);font-size:1.05rem;line-height:1.7}
.resv-info{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;max-width:1080px;margin:2.4rem auto 0;padding:0 5%}
.resv-card{background:var(--card);border-radius:14px;box-shadow:var(--sh-1);padding:1.5rem 1.6rem;display:flex;flex-direction:column;gap:.45rem}
.resv-card .eyebrow{margin-bottom:.4rem;color:var(--olive-lt)}
.resv-row{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed rgba(80,85,52,.18);padding:.35rem 0;color:var(--ink)}
.resv-row b{font-weight:600}
.resv-note{font-size:.85rem;color:var(--soft);margin-top:.3rem}
.resv-big{font-family:var(--serif);font-size:1.9rem;color:var(--olive);font-weight:600;line-height:1.1}
.resv-mail{color:var(--gold);border-bottom:1px solid rgba(201,151,58,.4);align-self:flex-start;font-size:.95rem}
.resv-card address{font-style:normal;line-height:1.6;color:var(--ink)}
.resv-form-wrap{max-width:900px;margin:2.6rem auto 0;padding:0 5%}
.resv-fallback{background:var(--card);border-radius:14px;box-shadow:var(--sh-1);padding:2.2rem;text-align:center}
.resv-fallback h2{color:var(--olive);margin-bottom:.6rem}
.resv-fallback-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:1.2rem}
.resv-map-sec{margin-top:1.5rem}
@media(max-width:760px){ .resv-info{grid-template-columns:1fr;gap:1rem} }
/* ---- Helles „Blatt" (Pergament) auch für Karten-/Formular-Seiten ----------- */
.sheet-body{background:url('../images/elegantia/body.png') #FBF8F0;border:1px solid #fce2af;padding:2.4rem clamp(1rem,4vw,3rem) 3rem}
.sheet-body .spice-grid{max-width:none;margin:.2rem 0 0;padding:0}
.sheet-body .spice-note{margin:1.8rem 0 0;color:var(--soft);font-size:.95rem;line-height:1.7}
.sheet-body .resv-intro{max-width:none;margin:0 0 1.6rem;padding:0;text-align:left;color:#33362A;font-size:1.02rem;line-height:1.8}
.sheet-body .resv-info{max-width:none;margin:0;padding:0}
.sheet-body .resv-form-wrap{max-width:none;margin:1.8rem 0 0;padding:0}
.resv-map{width:100%;height:360px;border:0;border-radius:12px;box-shadow:var(--sh-1);margin-top:1.8rem;display:block}
@media(max-width:760px){ .sheet-body{padding:1.4rem 1rem 2rem} .resv-map{height:280px} }
/* Lange Links (Datenschutzseite: ausgeschriebene Behoerden- und Google-URLs)
haben am Handy keine Trennstelle und schoben die Seite seitlich hinaus.
„anywhere" bricht nur dort um, wo es sonst ueberlaufen wuerde. (24.07.2026) */
.entry a{overflow-wrap:anywhere}
/* ---- Bildkasten aus der alten Seite (WordPress-Standard von 2014) ----------
Das
traegt seine Breite fest im
style-Attribut (Galerie-Titelbild: 1490px) und schwimmt nach links.
Am Handy ragte das Bild damit weit aus dem Blatt: sichtbar blieb ein
schmaler linker Streifen des Fotos, die Bildunterschrift lief rechts hinaus.
!important, weil die Breite inline steht. (24.07.2026) */
.entry .wp-caption{width:auto!important;max-width:100%;float:none;margin:1.6rem auto;text-align:center}
.entry .wp-caption img{width:100%;height:auto}
.entry .wp-caption-text{font-size:.8rem;color:var(--soft);text-align:center;margin-top:.5rem}
/* ---- Galerie: Platzhalter-Raster unter dem großen Titelbild ---- */
/* Umbau 24.07.2026: aus neun Platzhaltern wurden fuenf echte Fotos.
Am Rechner (Sheris Wunsch, an einem Screenshot bestaetigt): breites Titelbild,
darunter drei Kacheln, darunter zwei — beide Zeilen schliessen buendig ab,
das Ganze steht als geschlossenes Rechteck unter dem Titelbild.
Technisch: sechs Spalten, jede Kachel nimmt zwei davon (= drei pro Zeile);
die letzten beiden nehmen je drei, damit die zweite Zeile voll wird.
Die :nth-last-child-Bedingung greift NUR bei genau fuenf sichtbaren Kacheln —
blendet Sheri eine im Customizer aus, sind wieder alle gleich breit. */
.ml-galerie-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;margin:2.2rem 0 .5rem;clear:both}
.ml-galerie-item{grid-column:span 2}
.ml-galerie-item:nth-child(4):nth-last-child(2),
.ml-galerie-item:nth-child(5):nth-last-child(1){grid-column:span 3}
.ml-galerie-item{margin:0;position:relative;border-radius:12px;overflow:hidden;box-shadow:var(--sh-1)}
.ml-galerie-item img{width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:cover}
/* Beschriftung sitzt AUF dem Foto. Zwei Korrekturen (24.07.2026, am Handy nachgemessen):
1) Im Papier-Layout haben Bilder 22px Aussenabstand. "bottom:0" landete deshalb im
Abstand UNTER dem Foto — die Schrift lag halb auf dem Bild, halb auf dem Papier.
Im Raster ist der Aussenabstand ueberfluessig (das Gitter setzt die Abstaende).
2) ".entry figure figcaption" (weiter oben) ist spezifischer als ein einzelner
Klassenselektor und hat die Schrift auf --soft zurueckgesetzt -> Olivgruen auf
Foto, praktisch unlesbar. Deshalb hier mit ZWEI Klassen adressiert.
Zusaetzlich ein dunkler Verlauf am unteren Rand: Weiss auf hellem Foto (Aussenbereich,
Buffet) traegt sonst allein durch den Schatten nicht. */
/* body.ml-neu davor, weil neu.css mit "body.ml-neu .entry img{margin:1.4rem auto}"
sonst gewinnt (drei Klassen gegen zwei). */
body.ml-neu .entry .ml-galerie-item img{margin:0}
.entry .ml-galerie-item figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:1.5rem .75rem .5rem;font-family:var(--label);font-size:.74rem;letter-spacing:.06em;text-align:center;color:#FFFFFF;text-shadow:0 1px 3px rgba(0,0,0,.8);background:linear-gradient(to top,rgba(0,0,0,.62),rgba(0,0,0,0))}
/* Am Handy zwei nebeneinander — auch die letzten beiden, deshalb die Spannweiten
zuruecksetzen. Einspaltig waere die Seite unnoetig lang und die Kacheln wuerden
gegenueber dem grossen Titelbild ihre Nebenrolle verlieren. */
@media(max-width:760px){
.ml-galerie-grid{grid-template-columns:repeat(2,1fr);gap:.6rem}
/* Die Mittig-Ruecker der Desktop-Zeile MUESSEN hier zurueckgesetzt werden —
sonst schiebt das transform die Kacheln 4 und 5 aus dem Blatt heraus. */
.ml-galerie-item,
.ml-galerie-item:nth-child(4):nth-last-child(2),
.ml-galerie-item:nth-child(5):nth-last-child(1){grid-column:auto;transform:none}
/* Bleibt bei ungerader Anzahl unten eine Kachel allein uebrig, steht sie
mittig statt links — sonst sieht die letzte Zeile aus wie abgerissen.
Bewusst NICHT auf volle Breite gezogen: dann waere die letzte Kachel so
gross wie das Titelbild darueber und wuerde ihm die Hauptrolle nehmen. */
.ml-galerie-item:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;width:calc(50% - .3rem)}
}
/* GROSSES TITELBILD der Galerie-Seite (Buddha, 1024x362).
Am Rechner steht der volle Streifen — dort wirkt das Querformat ruhig und
nutzt die ganze Textbreite. Am Handy waere ein Streifen nur 124 Pixel hoch
und damit KLEINER als der Zweierblock darunter; das Aufmacherbild saehe aus
wie eine Fussnote. Deshalb dort ein 4:3-Ausschnitt aus der Bildmitte:
350 x 262 Pixel, also gut doppelt so hoch wie eine Kachel.
Beschnitten wird per CSS, damit die Datei in voller Aufloesung bleibt und
am Rechner nichts fehlt. Eng auf die Galerie-Seite begrenzt — wp-caption
kommt auch in anderen uebernommenen Texten vor. */
@media(max-width:760px){
body.ml-fotos-von-der-mount-lavinia .entry .wp-caption img{
aspect-ratio:4/3;object-fit:cover;object-position:center}
}
/* Backend-Schalter "Galerie-Raster auf dem Handy ausblenden" (Customizer -> Mount Lavinia: Galerie) */
@media(max-width:760px){ .ml-galerie-hide-mobil{display:none} }
/* ---- Reservierung direkt auf der Startseite ---- */
.reserve-home{padding-top:1rem}
.reserve-home .rr-wrap{margin-top:1.4rem}
#tisch-reservieren{scroll-margin-top:88px}
/* Reservierungs-Angaben: schlicht ohne Kaestchen, zentriert mit feinem Trenner */
.reserve-meta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.9rem 2.8rem;margin:.4rem auto 2.2rem;max-width:600px}
.reserve-meta .rm-item{text-align:center;min-width:190px}
.reserve-meta .rm-label{display:block;font-family:var(--label);font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:.45rem}
.reserve-meta .rm-item p{margin:0;font-size:.98rem;line-height:1.6;color:var(--soft)}
.reserve-meta .rm-div{width:1px;align-self:stretch;min-height:2.4rem;background:linear-gradient(rgba(80,85,52,0),rgba(80,85,52,.28),rgba(80,85,52,0))}
@media(max-width:560px){.reserve-meta .rm-div{display:none}}
/* Plugin-eigene Titelzeile auf der Startseite ausblenden - Abschnitts-Ueberschrift genuegt (kein doppeltes "Tisch reservieren") */
.reserve-home .rr-header{display:none}
/* Gutschein temporaer versteckt (mlv2_gutschein_live=false): alle Gutschein-Links in Nav/Mobil-Menue ausblenden */
body.gs-off a[href*="restaurant-mount-lavinia-gutschein"]{display:none !important}
/* ============================================================
Speise-/Getraenkekarte — Version A (Editorial, OHNE Kaestchen)
Foto links (6px), Name .. Punktlinie .. Preis; scoped .menu-main
schlaegt die alten Karten-Styles per Spezifitaet.
============================================================ */
.menu-main .cat-title{align-items:baseline}
.menu-main .cat-title .no{font-family:var(--label);font-size:.8rem;letter-spacing:.16em;color:var(--gold);text-transform:uppercase}
.menu-main .cat-list{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 2.8rem}
.menu-main .dish{display:grid;grid-template-columns:76px minmax(0,1fr);gap:.1rem 1.1rem;align-items:start;
background:none;border:0;border-radius:0;box-shadow:none;padding:0;transition:none}
.menu-main .dish:hover{transform:none;box-shadow:none}
.menu-main .dish-photo{width:76px;height:76px;border-radius:6px;margin-top:.15rem;
background-size:cover;background-position:center;box-shadow:0 2px 8px rgba(40,42,26,.14)}
.menu-main .dish-photo.is-ph{box-shadow:none;position:relative;overflow:hidden;
background-image:radial-gradient(130% 120% at 28% 18%, hsl(var(--ph-h,38) 46% 60%), hsl(var(--ph-h,38) 42% 36%) 74%)}
.menu-main .dish-photo.is-ph::after{content:"";position:absolute;inset:0;opacity:.5;
background:center/36% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3v6a2 2 0 0 0 4 0V3'/%3E%3Cpath d='M8 9v12'/%3E%3Cpath d='M17 3c-1.6 0-2.8 2.3-2.8 5.2S15.4 13 17 13'/%3E%3Cpath d='M17 3v18'/%3E%3C/svg%3E")}
.menu-main .dish-body{min-width:0}
.menu-main .dish-head{display:flex;align-items:baseline;gap:.5rem}
.menu-main .dish-nm{font-family:var(--serif);font-style:normal;font-weight:600;font-size:1.28rem;color:var(--ink);line-height:1.2}
.menu-main .dish-no{font-family:var(--label);color:var(--gold);font-size:.8em;font-weight:400}
.menu-main .dish-lead{flex:1;min-width:1.1rem;transform:translateY(-.28rem);border-bottom:1.5px dotted rgba(80,85,52,.38)}
.menu-main .dish-price{font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--gold);white-space:nowrap}
.menu-main .dish-dc{font-size:.9rem;color:var(--soft);line-height:1.55;margin:.32rem 0 .48rem;font-weight:400}
.menu-main .dish-dc.dish-variant{font-style:italic;color:var(--olive-lt);margin:.1rem 0 .4rem}
.menu-main .dish-tags{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-top:.1rem}
.menu-main .dish-tags .chip{background:rgba(176,180,140,.22);color:var(--olive-dk)}
.menu-main .dish-allergene{font-family:var(--label);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-top:.45rem}
/* "Mehr über dieses Gericht" — Link von der Karte auf die Vertiefungsseiten (15.07.2026).
Bewusst in derselben Bauart wie .dish-allergene darüber (Marcellus, Versalien, gesperrt),
damit er sich einfügt statt sich aufzudrängen. Farbe --olive statt --gold: Das Gold hat auf
hellem Grund nur 2,5:1 Kontrast und ist bei dieser Größe nicht mehr lesbar; --olive liegt
bei 7,4:1. Die Unterstreichung erst beim Hover, sonst wird die Karte unruhig.
min-height 44px: Fingertipp-Ziel auf dem Handy — von dort kommen die meisten Ads-Klicks. */
.menu-main .dish-more{margin-top:.5rem}
.menu-main .dish-more a{display:inline-flex;align-items:center;min-height:44px;
font-family:var(--label);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;
color:var(--olive);border-bottom:1px solid rgba(80,85,52,.35);transition:.25s var(--e)}
.menu-main .dish-more a:hover{color:var(--olive-dk);border-bottom-color:var(--olive-dk)}
.menu-main .dish[hidden]{display:none}
.menu-main .dish.drink{grid-template-columns:minmax(0,1fr)}
.menu-main .dish.drink .dish-photo{display:none}
@media(max-width:900px){.menu-main .cat-list{grid-template-columns:1fr;gap:1.3rem}}
@media(max-width:520px){
.menu-main .dish{grid-template-columns:64px minmax(0,1fr);gap:.1rem .9rem}
.menu-main .dish-photo{width:64px;height:64px}
.menu-main .dish-nm{font-size:1.16rem}
.menu-main .dish-price{font-size:1.1rem}
}
/* Weicher Anker-Scroll (respektiert reduzierte Bewegung) */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
/* =========================================================================
Catering-Anfrageformular (Shortcode [ml_catering_anfrage], 15.07.2026)
Optik am Reservierungsformular orientiert, damit es kein Fremdkörper ist.
Farben ausschliesslich aus :root oben — kein neuer Farbwert.
Eingabefelder: 16px Schriftgroesse ist Absicht. Unter 16px zoomt iOS beim
Antippen automatisch hinein — das wirkt wie ein Fehler. Die meisten
Ads-Klicks kommen vom Handy, deshalb hier kein Kleingedrucktes.
========================================================================= */
.mlcat{max-width:640px;margin:2.5rem auto 0}
.mlcat-form{background:var(--card);border:1px solid var(--parch);border-radius:16px;
padding:clamp(1.2rem,4vw,2rem);box-shadow:var(--sh-1)}
.mlcat-row{margin-bottom:1.1rem}
.mlcat-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:560px){.mlcat-2{grid-template-columns:1fr;gap:0}}
.mlcat label{display:block;font-family:var(--label);font-size:.68rem;letter-spacing:.14em;
text-transform:uppercase;color:var(--soft);margin-bottom:.4rem}
.mlcat-req{color:var(--gold)}
.mlcat-opt{text-transform:none;letter-spacing:0;font-family:var(--sans);color:var(--olive-lt)}
.mlcat input[type=text],.mlcat input[type=email],.mlcat input[type=tel],
.mlcat input[type=date],.mlcat input[type=number],.mlcat select,.mlcat textarea{
width:100%;box-sizing:border-box;font-family:var(--sans);font-size:16px;color:var(--ink);
background:var(--paper);border:1px solid var(--parch);border-radius:10px;
padding:.8rem .9rem;min-height:48px;transition:.25s var(--e)}
.mlcat textarea{min-height:110px;resize:vertical;line-height:1.6}
.mlcat input:focus,.mlcat select:focus,.mlcat textarea:focus{
outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(80,85,52,.12)}
.mlcat-hint{display:block;font-size:.76rem;color:var(--olive-lt);margin-top:.3rem;line-height:1.4}
.mlcat-datenschutz{font-size:.78rem;color:var(--soft);line-height:1.6;margin:1.2rem 0 0}
.mlcat-datenschutz a{border-bottom:1px solid rgba(80,85,52,.35);color:var(--olive)}
.mlcat-send{margin:1.3rem 0 0;text-align:center}
/* Honeypot: fuer Menschen unsichtbar, fuer Bots auffindbar.
Bewusst NICHT display:none — manche Bots ignorieren versteckte Felder gezielt. */
.mlcat-hp{position:absolute;left:-9999px;top:-9999px;height:1px;width:1px;overflow:hidden}
.mlcat-ok,.mlcat-err{border-radius:12px;padding:1.1rem 1.3rem;margin-bottom:1.4rem;line-height:1.65}
.mlcat-ok{background:var(--cream);border:1px solid var(--parch);border-left:4px solid var(--olive)}
.mlcat-ok-t{font-family:var(--serif);font-size:1.25rem;color:var(--olive-dk);margin:0 0 .3rem}
.mlcat-err{background:#FBF3EC;border:1px solid #E8D3BE;border-left:4px solid #A8622C}
.mlcat-err-t{font-family:var(--label);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
color:#8A4E22;margin:0 0 .5rem}
.mlcat-err ul{margin:0;padding-left:1.1rem;font-size:.88rem;color:var(--ink)}
.mlcat-err li{margin:.2rem 0}