/* Çorbacı Berlin: mixed photography, September 2026. Scoped to the homepage. */
#startseite.hero{--hm-gold:#d8b779;--hm-nav:110px;--hm-photo:340px;background:#17130f!important;isolation:isolate;min-height:760px;overflow:hidden;color:#fff5e8}
#startseite.hero .nav.shell{height:110px;position:relative;z-index:6;animation:none!important;transform:none;background:#17130f;border-bottom:1px solid #ffffff18;gap:24px}
#startseite.hero .nav-brand{animation:none!important;transform:none!important}
#startseite.hero .nav-logo-crop{width:185px;height:74px}
#startseite.hero .navlinks{gap:22px}
#startseite.hero .hero-slides{top:var(--hm-nav);bottom:0;overflow:hidden;z-index:0;touch-action:pan-y pinch-zoom;background:#241b12}
#startseite.hero .hero-slides>span{display:block;position:absolute;inset:0;animation:none!important;opacity:0;background-size:cover;background-position:70% center;transform:scale(1);transition:opacity .45s ease-in-out;will-change:opacity;backface-visibility:hidden;-webkit-backface-visibility:hidden}
#startseite.hero .hero-slides>span:first-child{background-image:url('./soup-desktop.webp');opacity:1}
#startseite.hero .hero-slides>span:nth-child(2){background-image:url('./table-desktop.webp');background-position:60% center}
#startseite.hero .hero-slides>span:nth-child(3){background-image:url('./pide-desktop.webp')}
#startseite.hero .hero-slides>span:nth-child(4){background-image:url('./restaurant-desktop.webp');background-position:62% center}
#startseite.hero[data-hero-mix="ready"] .hero-slides>span[data-hm-moving="true"]{animation:hm-slow-zoom 2.45s linear both!important}
#startseite.hero.hm-paused .hero-slides>span{animation-play-state:paused!important}
#startseite.hero .shade{inset:var(--hm-nav) 0 0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(15,11,8,.94),rgba(15,11,8,.73) 36%,rgba(15,11,8,.1) 68%,rgba(15,11,8,.09)),linear-gradient(0deg,rgba(15,11,8,.85),transparent 40%)}
#startseite.hero .hero-content.shell{z-index:2;padding-top:66px;padding-bottom:137px;pointer-events:none;direction:ltr}
#startseite.hero .hero-content a,#startseite.hero .hero-content button{pointer-events:auto}
#startseite.hero .hero-content .eyebrow{font-size:12px;line-height:1.5;letter-spacing:.16em;color:var(--hm-gold);max-width:550px}
#startseite.hero .hero-content h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(42px,4.2vw,60px);font-weight:400;line-height:1.07;letter-spacing:-.035em;max-width:565px;margin:23px 0 25px;text-wrap:balance}
#startseite.hero .hero-content h1>span:last-child{color:var(--hm-gold);font-style:italic}
#startseite.hero .hero-content .lead{max-width:500px;font-size:15px;line-height:1.85;color:#e9dccb;margin:0 0 23px;text-wrap:pretty}
#startseite.hero .hero-content .rating{margin-bottom:22px;max-width:max-content}
#startseite.hero .hero-actions{max-width:580px;gap:12px;align-items:stretch}
#startseite.hero .hero-actions .btn{border-radius:5px;min-height:58px;padding:12px 18px;box-shadow:none;transition:filter .2s,transform .2s}
#startseite.hero .hero-actions .btn.red{background:var(--hm-gold)!important;color:#20170d!important;border:1px solid var(--hm-gold)!important}
#startseite.hero .hero-actions .btn.red b,#startseite.hero .hero-actions .btn.red small{color:#20170d!important}
#startseite.hero .hero-actions .btn.red .order-mark{animation:hm-order-ride 1.4s ease-in-out infinite!important}
#startseite.hero .hero-actions .phone-btn{background:#19130ab8;border:1px solid #a18a60;color:#fff5e8}
#startseite.hero .hero-actions .btn:hover{filter:brightness(1.08)}
#startseite.hero .benefits{font-size:11px;color:#dfd0b9;gap:15px;flex-wrap:wrap;max-width:570px;margin-top:25px;line-height:1.7}
#startseite.hero .hm-controls{position:absolute;z-index:4;bottom:27px;left:50%;transform:translateX(-50%);width:min(1180px,calc(100% - 48px));display:flex;align-items:center;gap:22px;direction:ltr}
#startseite.hero .hm-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px;flex:1;min-width:0}
#startseite.hero .hm-step{min-width:0;min-height:48px;padding:12px 0 7px;border:0;background:transparent;color:#e6d7c2;font:500 12px/1.4 system-ui,sans-serif;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
#startseite.hero .hm-step::before{content:'';display:block;height:2px;background:#f1dec24d;margin-bottom:12px}
#startseite.hero .hm-step[aria-pressed="true"]::before{background:var(--hm-gold)}
#startseite.hero .hm-step b{font-size:10px;font-weight:500;letter-spacing:1px;color:var(--hm-gold);margin-right:9px}
#startseite.hero .hm-step span{white-space:nowrap}
#startseite.hero .hm-pause{flex:none;width:44px;height:44px;border:1px solid #ddc5a173;background:#1a130dc7;color:#fff3e3;border-radius:50%;font:500 18px/1 system-ui,sans-serif;cursor:pointer;display:grid;place-items:center;touch-action:manipulation}
#startseite.hero .hm-step:focus-visible,#startseite.hero .hm-pause:focus-visible{outline:2px solid #f5d391;outline-offset:5px}
#startseite.hero .hm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
html[dir="rtl"] #startseite.hero .hero-content h1,html[dir="rtl"] #startseite.hero .hero-content .lead,html[dir="rtl"] #startseite.hero .eyebrow{direction:rtl;text-align:right;margin-left:0;margin-right:auto}
@keyframes hm-slow-zoom{from{transform:scale(1)}to{transform:scale(1.045)}}
@media(min-width:761px) and (max-width:1080px){#startseite.hero .navlinks{gap:12px;font-size:12px}#startseite.hero .nav-logo-crop{width:150px}#startseite.hero .hero-content h1{max-width:490px}#startseite.hero .hero-content .lead{max-width:420px}#startseite.hero .hero-actions{max-width:510px}}
@media(max-width:760px){
 #startseite.hero{--hm-nav:100px;--hm-photo:clamp(290px,76vw,460px);min-height:0!important}
 #startseite.hero .nav.shell{width:calc(100% - 32px);height:auto;min-height:100px;gap:13px;padding:14px 0;background:#17130f}
 #startseite.hero .nav-brand{flex:0 0 118px;min-width:0}
 #startseite.hero .nav-logo-crop{width:118px;height:60px}
 #startseite.hero .nav-brand-tagline{font-size:6px;letter-spacing:.12em}
 #startseite.hero .navlinks{display:none}
 #startseite.hero .mobile-nav-actions{display:flex;align-items:center;flex:1;min-width:0;max-width:calc(100% - 131px);gap:7px}
 #startseite.hero .mobile-languages{display:flex;min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:5px 3px;gap:3px}
 #startseite.hero .mobile-languages::-webkit-scrollbar{display:none}
 #startseite.hero .mobile-languages button{flex:none;min-height:36px;min-width:35px}
 #startseite.hero .mobile-menu{flex:none}
 #startseite.hero .hero-slides{top:var(--hm-nav);bottom:auto;height:var(--hm-photo)}
 #startseite.hero .hero-slides>span{background-position:58% center}
 #startseite.hero .hero-slides>span:first-child{background-image:url('./soup-mobile.webp')}
 #startseite.hero .hero-slides>span:nth-child(2){background-image:url('./table-mobile.webp');background-position:center}
 #startseite.hero .hero-slides>span:nth-child(3){background-image:url('./pide-mobile.webp');background-position:center}
 #startseite.hero .hero-slides>span:nth-child(4){background-image:url('./restaurant-mobile.webp');background-position:center}
 #startseite.hero .shade{top:var(--hm-nav);bottom:auto;height:calc(var(--hm-photo) + 1px);background:linear-gradient(0deg,#17130f 0%,rgba(23,19,15,.52) 14%,rgba(23,19,15,.02) 55%)}
 #startseite.hero .hero-content.shell{width:calc(100% - 40px);padding-top:calc(var(--hm-photo) + 100px);padding-bottom:40px;max-width:600px;pointer-events:auto}
 #startseite.hero .hero-content .eyebrow{font-size:11px;letter-spacing:.11em;line-height:1.7;margin-bottom:0}
 #startseite.hero .hero-content h1{font-size:clamp(36px,8.6vw,50px);max-width:100%;line-height:1.08;margin:17px 0 20px;letter-spacing:-.035em}
 #startseite.hero .hero-content .lead{max-width:100%;font-size:14px;line-height:1.8;margin-bottom:21px}
 #startseite.hero .hero-content .rating{margin-bottom:20px}
 #startseite.hero .hero-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;max-width:100%}
 #startseite.hero .hero-actions>.btn:first-child{grid-column:1/-1;min-height:62px}
 #startseite.hero .hero-actions>.btn{min-width:0;min-height:60px;padding:12px 9px;gap:7px;justify-content:center}
 #startseite.hero .hero-actions>.btn b{font-size:12px;white-space:normal;line-height:1.35}
 #startseite.hero .hero-actions>.btn small{font-size:10px;white-space:normal;line-height:1.45}
 #startseite.hero .hero-actions>.btn .phone-arrow{display:none}
 #startseite.hero .hero-actions>.btn .phone-icon{font-size:18px;flex:none}
 #startseite.hero .hero-actions .whatsapp-mark{width:20px;height:20px;flex:none}
 #startseite.hero .hero-actions .phone-btn{grid-column:auto!important}
 #startseite.hero .hero-actions .phone-btn b{font-size:11px;white-space:nowrap}
 #startseite.hero .benefits{font-size:11px;display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin-top:24px;line-height:1.6}
 #startseite.hero .hm-controls{width:calc(100% - 40px);max-width:600px;top:calc(var(--hm-nav) + var(--hm-photo));bottom:auto;padding:0 0 14px;border-bottom:1px solid #ffffff18;gap:12px}
 #startseite.hero .hm-steps{gap:12px}
 #startseite.hero .hm-step{font-size:11px;min-height:48px}
 #startseite.hero .hm-step b{display:block;font-size:10px;margin:0 0 3px}
 #startseite.hero .hm-step span{display:block;overflow:hidden;text-overflow:ellipsis}
 #startseite.hero .hm-step::before{margin-bottom:9px}
 #startseite.hero .hm-pause{width:44px;height:44px}
}
@media(prefers-reduced-motion:reduce){#startseite.hero .hero-slides>span,#startseite.hero[data-hero-mix="ready"] .hero-slides>span[data-hm-moving="true"]{animation:none!important;transition:none!important;transform:none!important}}
/* Keep the existing bottom actions above the iPhone home indicator. */
@supports(padding:max(0px)){
 @media(max-width:760px){
  body:has(#startseite.hero) .sticky-actions{height:calc(58px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
  body:has(#startseite.hero) .cart-button{bottom:calc(68px + var(--visual-bottom,0px) + env(safe-area-inset-bottom,0px))!important}
 }
}
@media(max-width:360px){
 #startseite.hero .hm-steps{gap:8px}
 #startseite.hero .hm-controls{gap:8px}
 #startseite.hero .hero-actions .phone-btn{gap:5px;padding-left:6px;padding-right:6px}
 #startseite.hero .hero-actions .phone-btn b{font-size:10px}
 #startseite.hero .hero-actions .phone-icon{width:23px;height:23px;font-size:14px}
}
/* Keep the photograph and headline clear; page shortcuts return below the hero. */
body:has(#startseite.hero.hm-in-view) .page-jump{visibility:hidden;pointer-events:none}

/* Requested button order and moving delivery icon. */
@keyframes hm-order-ride{0%,100%{transform:translateX(-3px) rotate(-5deg)}50%{transform:translateX(4px) rotate(5deg)}}
body:has(#startseite.hero) .sticky-actions{grid-template-columns:1fr 1.3fr 1fr}
body:has(#startseite.hero) .sticky-actions>.sticky-whatsapp{background:#25a844}
body:has(#startseite.hero) .sticky-actions>button{background:linear-gradient(135deg,#42c8f4,#159fd5)}
body:has(#startseite.hero) .sticky-actions .order-mark{animation:hm-order-ride 1.4s ease-in-out infinite}
#speisekarte .marquee-track{animation:none!important}
#speisekarte .marquee[data-hm-fluid="ready"]{overflow:hidden;scroll-snap-type:none;scroll-behavior:auto;touch-action:pan-y pinch-zoom;overscroll-behavior-x:contain}
#speisekarte .marquee-track[data-hm-fluid="ready"]{will-change:transform;backface-visibility:hidden;transition:none!important;direction:ltr}
#speisekarte .marquee-track>.dish[data-hm-drink="true"]{display:none!important}
#speisekarte .marquee[data-hm-fluid="ready"] img{-webkit-user-drag:none;user-select:none}
#speisekarte .menu-carousel-controls .hm-carousel-pause{font:500 19px/1 system-ui,sans-serif;width:44px;height:44px;min-width:44px}
@media(prefers-reduced-motion:reduce){#startseite.hero .hero-actions .btn.red .order-mark,body:has(#startseite.hero) .sticky-actions .order-mark{animation:none!important}}
@media(max-width:760px){#startseite.hero .hero-actions>.btn{height:auto!important;min-height:70px}}