/* Schrift lokal eingebunden (kein Google-Fonts-Abruf) */
@font-face{font-family:'Inter';font-style:normal;font-weight:200 900;font-display:swap;src:url(../fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:200 900;font-display:swap;src:url(../fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{--bordeaux:#7B2639;--anth:#302D2B;--cream:#F5EFE5;--gold:#D4A94F;--warmgrey:#A89F95;--line:rgba(48,45,43,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--anth);font-family:"Inter",Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}.page{min-height:100svh;overflow:hidden}.wrap{width:calc(100% - 38px);margin-inline:auto}
/* HEADER: intentionally logo only */
.header{height:122px;display:flex;align-items:center;border-bottom:0}.logo{display:block;width:104px;text-decoration:none}.logo-main{display:flex;align-items:flex-end;font-family:"Inter",Arial,sans-serif;font-size:47px;font-weight:900;line-height:.78;letter-spacing:-.075em}.logo-main .b{color:var(--anth)}.logo-main .n{color:var(--bordeaux)}.logo-sub{display:flex;justify-content:space-between;width:100%;padding:12px 4px 0;font-size:7px;font-style:normal;font-weight:800;line-height:1;color:var(--anth)}
/* MOBILE HERO = one composed stage, matching the DALL-E mobile reference */
.hero{padding-top:17px}.hero-composition{position:relative;height:585px}.claim{position:absolute;z-index:5;left:0;top:0;margin:0;font-size:10px;font-weight:700;letter-spacing:.31em;text-transform:uppercase;white-space:nowrap}.headline{position:absolute;z-index:6;left:0;top:52px;width:70%;margin:0;font-size:61px;line-height:calc(.88em + 5px);letter-spacing:-.058em}.headline .thin{display:block;font-weight:200}.headline .thin.line2{width:max-content}.headline .bold{display:block;color:var(--bordeaux);font-weight:600;margin-top:5px;white-space:nowrap}.hero-photo{position:absolute;z-index:2;right:-48px;top:4px;width:62%;height:334px;overflow:hidden;clip-path:polygon(62% 0,100% 0,100% 100%,62% 100%,56% 82%,46% 66%,30% 49%,46% 32%,56% 16%)}.hero-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:49% 50%}.coming{position:absolute;z-index:8;right:0;top:256px;width:112px;height:112px;border-radius:50%;background:var(--bordeaux);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:14px;font-weight:800;line-height:1.08;letter-spacing:.065em;text-transform:uppercase}.coming:after{content:"";width:23px;height:3px;background:var(--gold);margin-top:12px}.copy{position:absolute;z-index:7;left:0;top:342px;width:62%;font-size:13px;line-height:1.58;font-weight:200}.copy p{margin:0}.copy p+p{margin-top:14px}.copy strong{font-weight:700}
.food-strip{margin-top:18px;background:#514B47;color:#fff;border-radius:28px;padding:14px 12px;display:flex;justify-content:center;gap:7px;font-size:12px;font-weight:650;white-space:nowrap}.food-strip span{opacity:.55}.food-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:28px 0 0}.food-card{margin:0;aspect-ratio:.72;border-radius:8px;overflow:hidden;background:#ddd}.food-card img{width:100%;height:100%;object-fit:cover;display:block}.food-card figcaption{display:none}
/* content below the photographed mobile viewport */
.info{margin-top:34px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;gap:20px}.info-item{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:center}.ico{width:44px;height:44px;border:2px solid var(--bordeaux);border-radius:50%;display:grid;place-items:center;color:var(--bordeaux)}.ico svg{width:21px;height:21px}.info small{display:block;font-size:11px;margin-bottom:3px}.info strong,.info a{font-size:14px;font-weight:400;line-height:1.35;text-decoration:none}.facts{display:grid;grid-template-columns:1fr 1fr;margin-top:24px;border:1px solid var(--line)}.fact{padding:14px 12px}.fact:nth-child(1){border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.fact:nth-child(2){border-bottom:1px solid var(--line)}.fact:nth-child(3){grid-column:1/-1}.fact small{display:block;text-transform:uppercase;letter-spacing:.11em;color:#706860;font-size:9px;font-weight:750;margin-bottom:5px}.fact strong{font-size:13px;line-height:1.35}.legal{display:flex;justify-content:center;gap:18px;padding:20px 0 102px;font-size:12px}.legal a{text-decoration:none}.legal a+a:before{content:"|";margin-right:18px;color:var(--warmgrey)}
.mobilebar{position:fixed;z-index:50;left:0;right:0;bottom:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(245,239,229,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:8px}.mobilebar a{height:56px;border-radius:4px;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05}.mobilebar .menu{background:var(--gold);color:var(--anth)}.mobilebar .call{background:var(--bordeaux);color:#fff}.mobilebar span{font-size:13px;font-weight:800}.mobilebar small{font-size:9px;margin-top:4px;font-weight:650;opacity:.82}
@media(max-width:380px){.wrap{width:calc(100% - 32px)}.header{height:112px}.logo{width:94px}.logo-main{font-size:43px}.hero-composition{height:585px}.headline{font-size:56px;top:51px;width:72%;line-height:calc(.88em + 5px)}.hero-photo{right:-44px;top:5px;width:62%;height:316px}.coming{width:104px;height:104px;top:263px;font-size:13px}.copy{top:332px;width:63%;font-size:12px}.food-strip{margin-top:18px;font-size:11px;gap:5px;padding-inline:9px}}
/* Desktop is deliberately separate, not a stretched mobile layout */
@media(min-width:760px){.wrap{width:min(calc(100% - 96px),1320px)}.header{height:118px}.logo{width:116px}.logo-main{font-size:54px}.logo-sub{font-size:8px;padding-top:13px}.hero{padding-top:44px}.hero-composition{height:440px}.claim{font-size:11px;top:0}.headline{top:58px;width:50%;font-size:78px;line-height:.9}.hero-photo{right:-20px;top:-44px;width:58%;height:500px;clip-path:ellipse(73% 58% at 76% 44%)}.coming{right:33%;top:128px;width:146px;height:146px;font-size:18px}.copy{top:300px;right:auto;width:45%;font-size:16px}.food-strip{width:45%;margin-top:0;font-size:14px}.food-grid{grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}.food-card{aspect-ratio:1.32;border-radius:8px}.food-card figcaption{display:block;position:absolute}.info{grid-template-columns:repeat(3,1fr);gap:0;margin-top:38px}.info-item{padding:0 32px;border-right:1px solid var(--line)}.info-item:first-child{padding-left:0}.info-item:last-child{border-right:0}.facts{grid-template-columns:repeat(3,1fr)}.fact,.fact:nth-child(1),.fact:nth-child(2),.fact:nth-child(3){grid-column:auto;border:0;border-right:1px solid var(--line)}.fact:last-child{border-right:0}.legal{padding-bottom:28px}.mobilebar{display:none}}

/* V5 mobile composition: keep the visible photo edge clear of the headline.
   The photo reaches inward only around the short middle line “wird”. */
@media(max-width:759px){
  .headline{width:74%;}
  .hero-photo{
    right:-46px;
    width:60%;
    clip-path:polygon(66% 0,100% 0,100% 100%,66% 100%,60% 82%,48% 66%,27% 49%,48% 32%,60% 16%);
  }
  .copy{top:342px;font-size:13px;}
}
@media(max-width:380px){
  .headline{width:75%;}
  .hero-photo{right:-42px;width:59%;}
  .copy{top:334px;font-size:12px;}
}

/* V6: asymmetrical mobile hero and tighter vertical rhythm */
@media(max-width:759px){
  .hero-composition{height:535px;}
  .hero-photo{
    top:-118px;
    right:-54px;
    width:64%;
    height:440px;
    clip-path:polygon(55% 0,100% 0,100% 100%,74% 100%,58% 83%,43% 68%,22% 49%,43% 31%,53% 14%);
  }
  .copy{
    top:292px;
    width:62%;
    font-size:14px;
    line-height:1.52;
  }
  .coming{top:238px;}
  .food-strip{margin-top:8px;}
  .food-grid{margin-top:20px;}
  .info{margin-top:28px;}
}
@media(max-width:380px){
  .hero-composition{height:535px;}
  .hero-photo{top:-108px;right:-48px;width:63%;height:420px;}
  .copy{top:292px;width:63%;font-size:13px;}
  .coming{top:240px;}
  .food-strip{margin-top:8px;}
}

/* V7: requested mobile refinements */
@media(max-width:759px){
  .header{height:132px;}
  .logo{width:130px;}
  .logo-main{font-size:59px;}
  .logo-sub{font-size:8px;padding:14px 5px 0;}

  .headline{top:42px;}
  .hero-composition{height:500px;}

  /* Triangular, asymmetric image: starts at upper right, points into line 2 “wird”,
     then opens toward the lower-right third corner. */
  .hero-photo{
    top:-132px;
    right:-58px;
    width:66%;
    height:445px;
    clip-path:polygon(56% 0,100% 0,100% 100%,78% 100%,57% 77%,18% 50%,54% 24%);
  }
  .hero-photo img{object-position:48% 50%;}

  .coming{top:225px;}
  .copy{top:227px;font-size:14px;line-height:1.52;}
  .food-strip{margin-top:-2px;}
  .food-grid{margin-top:18px;}
  .info{margin-top:26px;}
}
@media(max-width:380px){
  .header{height:122px;}
  .logo{width:118px;}
  .logo-main{font-size:54px;}
  .logo-sub{font-size:7.5px;padding-top:13px;}
  .headline{top:41px;}
  .hero-composition{height:500px;}
  .hero-photo{top:-122px;right:-52px;width:65%;height:425px;clip-path:polygon(57% 0,100% 0,100% 100%,78% 100%,57% 77%,17% 50%,54% 24%);}
  .coming{top:226px;}
  .copy{top:227px;width:63%;font-size:13px;}
  .food-strip{margin-top:-2px;}
}

/* V8: spacing, content order and mobile action icons */
@media(max-width:759px){
  /* +10 px between headline and copy */
  .copy{top:237px;}
  /* -15 px between copy/hero stage and food strip; following content moves upward */
  .hero-composition{height:485px;}
  .food-strip{margin-top:-17px;}
  .food-grid{margin-top:18px;}
  .facts{margin-top:22px;}
  .info{margin-top:16px;}
  .legal{padding-top:18px;}
  .mobilebar a{flex-direction:row;gap:8px;}
  .mobilebar .action-text{display:flex;flex-direction:column;align-items:flex-start;gap:2px;}
  .mobilebar svg{width:19px;height:19px;flex:0 0 auto;stroke:currentColor;}
  .mobilebar small{margin-top:0;}
}
@media(max-width:380px){
  .copy{top:237px;}
  .hero-composition{height:485px;}
  .food-strip{margin-top:-17px;}
}
/* V9: exact uploaded logo + desktop-only optimization. Mobile composition remains unchanged. */
.logo img{display:block;width:100%;height:auto}

@media(min-width:760px){
  /* Fit the complete microsite into a typical desktop viewport without touching mobile rules. */
  .page{min-height:100vh;overflow:visible}
  .wrap{width:min(calc(100% - 80px),1380px)}
  .header{height:82px;align-items:center}
  .logo{width:112px}
  .hero{padding-top:8px}
  .hero-composition{height:300px}
  .claim{top:0;font-size:10px}
  .headline{top:30px;width:51%;font-size:80px;line-height:.93;letter-spacing:-.055em}
  .headline .thin{display:inline;font-weight:200}
  .headline .thin.line2{display:inline;width:auto}
  .headline .thin.line2:before{content:" ";}
  .headline .thin.line2:after{content:"";display:block}
  .headline .bold{display:block;margin-top:7px;font-weight:600;white-space:nowrap}
  .hero-photo{right:-18px;top:-48px;width:57%;height:365px;clip-path:ellipse(74% 61% at 77% 44%)}
  .coming{right:34%;top:103px;width:116px;height:116px;font-size:15px}
  .copy{top:202px;width:46%;font-size:13px;line-height:1.42}
  .copy p+p{margin-top:8px}

  /* Requested +15 px desktop gap between copy/hero and grey food strip. */
  .food-strip{width:46%;margin-top:15px;padding:10px 14px;font-size:12px}
  .food-grid{gap:12px;margin-top:14px}
  .food-card{aspect-ratio:1.85;border-radius:7px;position:relative}
  .food-card figcaption{display:none!important}

  /* Compact all lower information so it remains visible in the same viewport. */
  .facts{margin-top:14px}
  .fact,.fact:nth-child(1),.fact:nth-child(2),.fact:nth-child(3){padding:10px 14px}
  .fact small{font-size:8px;margin-bottom:3px}
  .fact strong{font-size:11px}
  .info{margin-top:12px;padding:12px 0;gap:0}
  .info-item{grid-template-columns:34px 1fr;gap:10px;padding:0 22px}
  .ico{width:32px;height:32px;border-width:1.5px}
  .ico svg{width:16px;height:16px}
  .info small{font-size:9px;margin-bottom:1px}
  .info strong,.info a{font-size:11px}
  .legal{padding:10px 0 12px;font-size:10px}
}

/* Restore the established V8 mobile logo footprint despite using the uploaded SVG. */
@media(max-width:759px){.logo{width:130px}}
@media(max-width:380px){.logo{width:118px}}


/* V10: desktop rebalance only. Mobile rules above remain untouched. */
@media(min-width:760px){
  /* Give the top composition breathing room again while using the formerly empty lower area. */
  .header{height:102px;align-items:center}
  .logo{width:126px}
  .hero{padding-top:15px}
  .hero-composition{height:326px}
  .claim{top:2px;font-size:10.5px}
  .headline{top:40px;font-size:80px;line-height:.94}
  .hero-photo{top:-43px;height:390px}
  .coming{top:116px}
  .copy{top:225px;font-size:13px;line-height:1.42}

  /* Keep requested 15px extra breathing room before the grey strip. */
  .food-strip{margin-top:15px}
  .food-grid{margin-top:13px}

  /* Use the lower viewport more efficiently instead of leaving a large bottom gap. */
  .facts{margin-top:13px}
  .info{margin-top:10px;padding:10px 0}
  .info-item{padding-top:2px;padding-bottom:2px}
  .info small{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--bordeaux);margin-bottom:3px}
  .info strong,.info a{font-size:12px;line-height:1.3;font-weight:500}
  .legal{padding:8px 0 7px;font-size:10px}
}

/* V11: mobile only – phone contact is already present in the fixed order button. */
@media(max-width:759px){
  .info .info-item:first-child{display:none!important;}
}

/* V17: clearly visible warm-anthracite image toning, layout unchanged */
.hero-photo,
.food-card{isolation:isolate;}
.hero-photo::after,
.food-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:3;
}
/* Food tiles: warm darkening at top and bottom, centre stays largely natural. */
.food-card::after{
  background:linear-gradient(to bottom,
    rgba(48,45,43,.30) 0%,
    rgba(48,45,43,.16) 18%,
    rgba(48,45,43,.025) 40%,
    rgba(48,45,43,.025) 62%,
    rgba(48,45,43,.16) 82%,
    rgba(48,45,43,.34) 100%);
}
/* Hero stays slightly lighter than the four food tiles. */
.hero-photo::after{
  background:linear-gradient(to bottom,
    rgba(48,45,43,.22) 0%,
    rgba(48,45,43,.10) 20%,
    rgba(48,45,43,.015) 43%,
    rgba(48,45,43,.015) 66%,
    rgba(48,45,43,.12) 84%,
    rgba(48,45,43,.27) 100%);
}
.food-card img,.hero-photo img{position:relative;z-index:1;}


/* V24: mobile vertical rhythm optimized after +1px typography. Desktop unchanged. */
@media(max-width:759px){
  /* Keep the copy clear of the food strip despite the larger type. */
  .hero-composition{height:455px;}
  .copy{top:232px;width:64%;line-height:1.42;}
  .copy p+p{margin-top:10px;}

  /* Pull following elements upward without overlap. */
  .food-strip{margin-top:-8px;padding-top:12px;padding-bottom:12px;}
  .food-grid{margin-top:12px;gap:7px;}

  /* Slightly shallower tiles so all four photos remain fully visible above the fixed buttons. */
  .food-card{aspect-ratio:.88;}

  /* Lower content remains comfortably clear of the fixed action bar when scrolling. */
  .facts{margin-top:18px;}
  .info{margin-top:14px;}
  .legal{padding-bottom:92px;}
}
@media(max-width:380px){
  .hero-composition{height:458px;}
  .copy{top:232px;width:65%;line-height:1.40;}
  .copy p+p{margin-top:9px;}
  .food-strip{margin-top:-6px;}
  .food-grid{margin-top:11px;}
  .food-card{aspect-ratio:.90;}
}


/* V14 CONTACT FIX — verified overrides only; no other layout changes */
/* Icons are plain symbols in BOTH desktop and mobile: no circle, no border, no background. */
.info .ico{
  width:24px !important;
  height:24px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:grid !important;
  place-items:center !important;
  color:var(--bordeaux) !important;
}
.info .ico svg{width:21px !important;height:21px !important;display:block}

@media(max-width:759px){
  /* phone stays hidden because it is already present in the fixed order button */
  .info .info-item:first-child{display:none !important}

  /* Address + e-mail MUST sit next to each other, as two columns. */
  .info{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:0 !important;
    align-items:stretch !important;
    padding:18px 0 !important;
  }
  .info .info-item:nth-child(2),
  .info .info-item:nth-child(3){
    display:grid !important;
    grid-template-columns:24px minmax(0,1fr) !important;
    gap:8px !important;
    align-items:start !important;
    min-width:0 !important;
    padding:0 10px !important;
  }
  .info .info-item:nth-child(2){
    padding-left:0 !important;
    border-right:1px solid var(--line) !important;
  }
  .info .info-item:nth-child(3){padding-right:0 !important}

  .info small{
    color:var(--bordeaux) !important;
    font-size:9px !important;
    font-weight:800 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
    margin-bottom:4px !important;
  }
  /* Only icon + labels are Bordeaux. Contact values remain warm anthracite. */
  .info strong,.info a{
    color:var(--ink) !important;
    font-size:10px !important;
    line-height:1.35 !important;
    font-weight:600 !important;
    overflow-wrap:anywhere !important;
  }
}

@media(min-width:760px){
  /* Desktop remains three columns; only circular icon treatment is removed. */
  .info-item{grid-template-columns:24px 1fr !important;gap:10px !important}
}


/* V18: Mobile hero correction only.
   The gradient overlay is removed from the clipped hero container on mobile,
   so no grey field can appear outside/over the intended photo shape.
   Food-tile toning and desktop hero toning remain unchanged. */
@media(max-width:759px){
  .hero-photo::after{
    content:none !important;
    display:none !important;
    background:none !important;
  }
  .hero-photo img{
    filter:brightness(.94) contrast(1.02) saturate(.97);
  }
}


/* V19: scope image toning to the actual food tiles on mobile.
   The missing positioning context in V17/V18 caused the absolute pseudo-elements
   to tint a much larger area instead of only each image. */
.food-card{position:relative;}
@media(max-width:759px){
  body,.page{background:var(--cream) !important;}
  .food-card::after{
    position:absolute !important;
    inset:0 !important;
    border-radius:inherit;
  }
}

/* V21: Originalbilder. Layout aus V20 unverändert. */
.hero-photo img{transform:scaleX(-1);transform-origin:center center;object-position:50% 50%;}
@media (max-width:759px){.hero-photo img{object-position:50% 50%;}}


/* V22: requested refinements only */
/* Running copy now uses true black for stronger readability. */
.copy{color:#000;}

/* Desktop: restore the clearly rounded / organic hero-photo silhouette from V20. */
@media(min-width:760px){
  .hero-photo{
    right:-18px !important;
    top:-43px !important;
    width:57% !important;
    height:390px !important;
    overflow:hidden !important;
    clip-path:ellipse(74% 61% at 77% 44%) !important;
    -webkit-clip-path:ellipse(74% 61% at 77% 44%) !important;
    border-radius:50% 0 0 50% / 58% 0 0 58%;
  }
}

/* Mobile: larger asymmetric photo field to fill the open space beside the headline.
   The inward point is deliberately aimed at the short second line “wird”. */
@media(max-width:759px){
  .hero-photo{
    top:-132px !important;
    right:-54px !important;
    width:72% !important;
    height:450px !important;
    overflow:hidden !important;
    clip-path:polygon(58% 0,100% 0,100% 100%,76% 100%,58% 78%,14% 50%,55% 23%) !important;
    -webkit-clip-path:polygon(58% 0,100% 0,100% 100%,76% 100%,58% 78%,14% 50%,55% 23%) !important;
  }
  .hero-photo img{object-position:50% 50% !important;}
}
@media(max-width:380px){
  .hero-photo{
    top:-122px !important;
    right:-50px !important;
    width:71% !important;
    height:430px !important;
    clip-path:polygon(59% 0,100% 0,100% 100%,77% 100%,58% 78%,13% 50%,55% 23%) !important;
    -webkit-clip-path:polygon(59% 0,100% 0,100% 100%,77% 100%,58% 78%,13% 50%,55% 23%) !important;
  }
}


/* V23: all content text +1px. Eyebrow, headline and logo remain unchanged. */
.coming{font-size:15px;}
.copy{font-size:15px;}
.food-strip{font-size:13px;}
.info small{font-size:12px;}
.info strong,.info a{font-size:15px;}
.fact small{font-size:10px;}
.fact strong{font-size:14px;}
.legal{font-size:13px;}
.mobilebar span{font-size:14px;}
.mobilebar small{font-size:10px;}

@media(max-width:759px){
  .copy{font-size:15px !important;}
  .info small{font-size:10px !important;}
  .info strong,.info a{font-size:11px !important;}
}
@media(max-width:380px){
  .coming{font-size:14px;}
  .copy{font-size:14px !important;}
  .food-strip{font-size:12px;}
}
@media(min-width:760px){
  .coming{font-size:16px;}
  .copy{font-size:14px;}
  .food-strip{font-size:13px;}
  .fact small{font-size:9px;}
  .fact strong{font-size:12px;}
  .info small{font-size:12px;}
  .info strong,.info a{font-size:13px;}
  .legal{font-size:11px;}
}

/* Unterseiten Impressum / Datenschutz */
.legal-page{max-width:760px;padding:10px 0 60px;font-size:15px;line-height:1.6}
.legal-page h1{font-size:40px;font-weight:200;letter-spacing:-.04em;margin:0 0 24px}
.legal-page h2{font-size:17px;font-weight:700;color:var(--bordeaux);margin:30px 0 8px}
.legal-page p,.legal-page ul{margin:0 0 12px}
.legal-page ul{padding-left:20px}
.legal-page a{color:var(--bordeaux)}
.back{display:inline-block;margin-bottom:24px;font-size:13px;font-weight:600;text-decoration:none;color:var(--bordeaux)}
@media(max-width:759px){.legal-page{font-size:14px}.legal-page h1{font-size:32px}}

/* V25: Desktop-Hero mit Verlauf statt Ellipse. Mobile bleibt unverändert. */
@media(min-width:760px){
  .hero-photo{
    clip-path:none !important;
    -webkit-clip-path:none !important;
    border-radius:0 !important;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.35) 18%,#000 48%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 14%,#000 76%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.35) 18%,#000 48%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 14%,#000 76%,transparent 100%);
    mask-composite:intersect;
  }
}

/* V25: große Bildschirme – gesamte Komposition proportional vergrößern,
   damit Texte lesbar größer werden, ohne dass Bild, Kreis und Headline verrutschen. */
@media(min-width:1800px){body{zoom:1.2}}
@media(min-width:2200px){body{zoom:1.4}}
@media(min-width:2800px){body{zoom:1.7}}
@media(min-width:3400px){body{zoom:2}}

/* V26: Desktop-Buttons Speisekarte + Telefon über dem grauen Balken.
   Mobil bleibt die fixe Leiste unten, daher dort ausgeblendet. */
.desk-actions{display:none}
@media(min-width:760px){
  .desk-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:46%;margin-top:6px}
  .desk-actions a{height:52px;border-radius:4px;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:10px;line-height:1.05;transition:filter .2s ease}
  .desk-actions a:hover{filter:brightness(1.06)}
  .desk-actions .menu{background:var(--gold);color:var(--anth)}
  .desk-actions .call{background:var(--bordeaux);color:#fff}
  .desk-actions svg{width:19px;height:19px;flex:0 0 auto}
  .desk-actions .action-text{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
  .desk-actions .action-text span{font-size:14px;font-weight:800}
  .desk-actions small{font-size:10px;font-weight:650;opacity:.82}
  .food-strip{margin-top:12px !important}
}

/* V27: Mobil – Fließtext im normalen Fluss, damit der graue Balken
   immer darunter beginnt (vorher feste Höhe → Überlappung je nach Textlänge). */
@media(max-width:759px){
  .hero-composition{height:auto !important;padding-top:232px}
  .copy{position:relative !important;top:auto !important}
  .food-strip{margin-top:16px !important}
}

/* V36: Mobil – vom Kunden gewählte Variante (weicher elliptischer Rand),
   auf Wunsch nach oben bis an den Rand und nach unten über den Kreis hinaus gezogen. */
@media(max-width:759px){
  .hero-photo{
    top:-149px !important;height:500px !important;
    clip-path:none !important;-webkit-clip-path:none !important;
    -webkit-mask-image:radial-gradient(ellipse 62% 47.5% at 86% 47.5%,#000 50%,rgba(0,0,0,.4) 78%,transparent 100%);
    mask-image:radial-gradient(ellipse 62% 47.5% at 86% 47.5%,#000 50%,rgba(0,0,0,.4) 78%,transparent 100%);
  }
}
@media(max-width:380px){
  .hero-photo{top:-139px !important;height:480px !important}
}

/* V31: Desktop – Rundung wie im Original, aber mit weichem Rand (Variante C) */
@media(min-width:760px){
  .hero-photo{
    clip-path:none !important;-webkit-clip-path:none !important;
    -webkit-mask-image:radial-gradient(ellipse 76% 63% at 77% 44%,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%) !important;-webkit-mask-composite:source-over !important;
    mask-image:radial-gradient(ellipse 76% 63% at 77% 44%,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%) !important;mask-composite:add !important;
  }
}

/* V29: Makkaroni-Kachel – Bildausschnitt nach unten verschieben, damit der Teller ganz zu sehen ist */
.food-card img[src*="makkaroni"]{object-position:50% 80%}

/* V37: Öffnungszeiten als kleine Tabelle (Tag | Zeit), Reihenfolge wie Speisekarte.
   Mobil: die drei Infofelder untereinander statt 2 Spalten. */
.fact .hours{display:grid;grid-template-columns:auto auto;justify-content:start;column-gap:14px;row-gap:2px}
.fact .hours span:nth-child(even){white-space:nowrap}
@media(max-width:759px){
  .facts{grid-template-columns:1fr !important}
  .facts .fact,.facts .fact:nth-child(1),.facts .fact:nth-child(2),.facts .fact:nth-child(3){
    grid-column:auto !important;border-right:0 !important;border-bottom:1px solid var(--line) !important}
  .facts .fact:last-child{border-bottom:0 !important}
}

/* V38: Trennstrich Impressum | Datenschutz optisch mittig (3px nach rechts) */
.legal{gap:21px !important}
.legal a+a:before{margin-right:15px !important}

/* V39: Mobil – genug Abstand unter Impressum/Datenschutz, damit die feste Button-Leiste
   sie nicht verdeckt (inkl. iPhone-Home-Balken über safe-area). */
@media(max-width:759px){
  .legal{padding-bottom:calc(110px + env(safe-area-inset-bottom)) !important}
}
