/* Fixed reference: the approved “Komm mit Appetit.” food hero.
   Same full-photo layout, veil, typography, widths and responsive values.
   Food keeps its original approved/styles.css; other photographic heroes
   and the photo menu use this application of that exact composition. */
:root{--screen-header:95px;--leaf-hero-height:calc(100svh - var(--screen-header,95px) - var(--screen-toolbar,0px) - 32px)}
@supports(height:100dvh){:root{--leaf-hero-height:calc(100dvh - var(--screen-header,95px) - var(--screen-toolbar,0px) - 32px)}}
html:root body.leaf-refresh :is(.lf-hero,.mk-hero){display:flex;position:relative;isolation:isolate;min-height:max(0px,var(--leaf-hero-height));height:auto;margin-block:16px!important;padding:0;overflow:hidden;border:0;border-radius:12px;background:#143f36;box-shadow:none;color:#f5f3ef;align-items:stretch}
html:root body.leaf-refresh .lf-hero{width:min(1180px,calc(100% - 80px));max-width:none;margin-inline:auto}
html:root body.leaf-refresh :is(.lf-hero-photo,.mk-hero-photo){position:absolute;inset:0;width:100%;height:100%;margin:0;z-index:-2;min-width:0;aspect-ratio:auto;border-radius:0}
html:root body.leaf-refresh :is(.lf-hero-photo,.mk-hero-photo) img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:var(--hero-focal,65% 48%)!important;border:0;border-radius:0}
html:root body.leaf-refresh :is(.lf-hero,.mk-hero)::after{content:'';display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#102e28f5 0%,#102e28e8 25%,#102e28af 46%,#102e2825 72%,#102e280a 100%)}
html:root body.leaf-refresh :is(.lf-hero-photo,.mk-hero-photo)::after{content:none;display:none}
html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div){position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:58%;max-width:none;padding:54px 48px 30px;background:transparent;border:0;box-shadow:none;color:#f5f3ef;gap:0}
html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div)::before{content:none;display:none}
html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) h1{font-family:inherit;font-size:clamp(60px,6.5vw,84px);font-weight:600;line-height:1.01;letter-spacing:-.045em;color:#f5f3ef;max-width:none;margin:0 0 28px;overflow-wrap:break-word}
html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) h1 em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.025em;color:#e4c1ad}
html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) :is(.lead-copy,.lead,.mk-intro,.hero-desktop-intro){max-width:40ch;font-size:15px!important;font-weight:400;line-height:1.8!important;color:#f1f4f1!important;margin:0 0 28px}
html:root body.leaf-refresh .lf-hero-copy .kicker{font-size:11px;line-height:1.5;letter-spacing:.13em;color:#d5c3ba!important;margin:0 0 18px}
html:root body.leaf-refresh .lf-hero-copy .btn{min-height:48px;padding:13px 22px!important;font-size:14px;font-weight:600;border-radius:4px!important;gap:24px;background:#f5f3ef!important;color:#143f36!important}
html:root body.leaf-refresh .lf-hero-copy .btn-outline-primary{background:transparent!important;color:#f5f3ef!important}
html:root body.leaf-refresh .lf-hero-signature{display:none}
html:root[lang=ar] body.leaf-refresh .lf-hero-copy h1{line-height:1.4;letter-spacing:0}
html:root[dir=rtl] body.leaf-refresh :is(.lf-hero,.mk-hero)::after{background:linear-gradient(270deg,#102e28f5 0%,#102e28e8 25%,#102e28af 46%,#102e2825 72%,#102e280a 100%)}
html:root body.leaf-refresh .lf-home-hero .lf-hero-photo img{object-position:50% 23%!important}
@media(max-width:1100px){html:root body.leaf-refresh .lf-hero{width:calc(100% - 48px)}}
@media(max-width:900px){
 :root{--screen-header:81px}
 html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div){width:70%;padding:42px 32px 26px}
 html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) h1{font-size:64px}
 html:root body.leaf-refresh :is(.lf-hero,.mk-hero)::after{background:linear-gradient(90deg,#102e28f2 0%,#102e28d9 35%,#102e2860 75%,#102e2820 100%)}
 html:root[dir=rtl] body.leaf-refresh :is(.lf-hero,.mk-hero)::after{background:linear-gradient(270deg,#102e28f2 0%,#102e28d9 35%,#102e2860 75%,#102e2820 100%)}
}
@media(max-width:640px){
 :root{--screen-header:75px;--leaf-hero-height:calc(100svh - var(--screen-header,75px) - var(--screen-toolbar,0px) - 32px)}
 html:root body.leaf-refresh .lf-hero{width:calc(100% - 36px)}
 html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div){width:100%;max-width:none;padding:clamp(80px,20svh,200px) 24px 28px;justify-content:flex-end}
 html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) h1{font-size:clamp(48px,12vw,60px);margin-bottom:20px}
 html:root body.leaf-refresh :is(.lf-hero-copy,.mk-hero>div) :is(.lead-copy,.lead,.mk-intro,.hero-desktop-intro){max-width:none;font-size:14px!important;line-height:1.75!important;margin-bottom:22px}
 html:root body.leaf-refresh .lf-hero-copy .kicker{font-size:10px;margin-bottom:14px;color:#eed9ca!important}
 html:root body.leaf-refresh :is(.lf-hero-photo,.mk-hero-photo) img{object-position:var(--hero-focal-mobile,var(--hero-focal,58% 30%))!important}
 html:root body.leaf-refresh .lf-home-hero .lf-hero-photo img{object-position:50% 25%!important}
 html:root body.leaf-refresh :is(.lf-hero,.mk-hero)::after,html:root[dir=rtl] body.leaf-refresh :is(.lf-hero,.mk-hero)::after{background:linear-gradient(180deg,#102e2805 0%,#102e2820 24%,#102e28b8 43%,#102e28ef 65%,#102e28fa 100%)}
 html:root body.leaf-refresh .lf-hero-copy>.btn{width:100%}
 @supports(height:100dvh){:root{--leaf-hero-height:calc(100dvh - var(--screen-header,75px) - var(--screen-toolbar,0px) - 32px)}}
}
