html{width:100%;min-height:100%;overflow-y:scroll;scrollbar-gutter:stable both-edges;overflow-x:hidden}
*{box-sizing:border-box}
:root{--blue:#113b93;--orange:#ff5a00;--deep-orange:#c83b16;--yellow:#ffd84a;--cream:#fff8e6;--charcoal:#171717;--muted:#5f554d;--card:rgba(255,255,255,.88);--stroke:rgba(255,255,255,.62)}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--charcoal);min-height:100svh;overflow-x:hidden;background:#171717;padding-bottom:0}
body:before{content:"";position:fixed;inset:0;z-index:-5;background:linear-gradient(90deg,rgba(23,23,23,.78),rgba(17,59,147,.24) 45%,rgba(255,90,0,.15)),url("sushima-bg-food.webp") center/cover no-repeat;transform:scale(1.02)}
body:after{content:"";position:fixed;inset:0;z-index:-4;background:radial-gradient(circle at 50% 13%,rgba(255,248,230,.96) 0 15%,rgba(255,248,230,.74) 36%,transparent 63%),linear-gradient(180deg,rgba(255,248,230,.18),rgba(255,216,74,.08) 50%,rgba(17,59,147,.16));backdrop-filter:blur(7px) saturate(1.05);pointer-events:none}
.bg-sushima-photo{position:fixed;right:clamp(-220px,-12vw,-80px);bottom:clamp(-140px,-10vh,-40px);width:min(760px,58vw);aspect-ratio:1.5/1;z-index:-2;background:url("sushima-bg-sign.webp") center/cover no-repeat;border-radius:44px;transform:rotate(-5deg);opacity:.18;filter:blur(1px) saturate(1.1)}
.bg-sushi{position:fixed;inset:0;z-index:-3;pointer-events:none;overflow:hidden}.bg-sushi:before,.bg-sushi:after{content:"";position:absolute;border-radius:999px;filter:blur(58px);opacity:.45}.bg-sushi:before{width:38vw;height:38vw;left:-10vw;top:46vh;background:rgba(255,90,0,.22)}.bg-sushi:after{width:36vw;height:36vw;right:-8vw;top:-9vh;background:rgba(17,59,147,.32)}
.app-header{position:fixed;top:0;left:0;right:0;z-index:60;display:grid;grid-template-columns:62px 1fr auto;align-items:center;gap:12px;padding:18px 28px;background:transparent;border:0;box-shadow:none;pointer-events:none}.hamburger{pointer-events:auto;width:52px;height:52px;border:0;border-radius:18px;background:var(--orange);display:grid;place-content:center;gap:5px;cursor:pointer;box-shadow:0 12px 26px rgba(255,90,0,.22)}.hamburger span{display:block;width:22px;height:2px;background:#fff;border-radius:9px}.app-logo{display:none}.lang-pills{pointer-events:auto;display:flex;gap:5px;background:rgba(255,248,230,.74);border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:5px;box-shadow:0 12px 28px rgba(0,0,0,.08);backdrop-filter:blur(18px)}.lang-pills a{text-decoration:none;color:var(--blue);font-weight:950;font-size:12px;padding:8px 10px;border-radius:999px}.lang-pills a.active{background:var(--blue);color:#fff}
.fullscreen-menu{position:fixed;inset:0;background:rgba(17,59,147,.94);z-index:80;display:none;place-items:center;text-align:center;padding:24px;backdrop-filter:blur(18px)}.fullscreen-menu.open{display:grid}.menu-close{position:absolute;top:22px;right:22px;width:52px;height:52px;border:0;border-radius:999px;background:var(--orange);color:#fff;font-size:32px;line-height:1}.menu-logo{width:min(280px,70vw);margin-bottom:28px}.fullscreen-menu nav{display:grid;gap:10px}.fullscreen-menu a{color:#fff;text-decoration:none;font-size:clamp(30px,6vw,58px);font-weight:950;letter-spacing:-.06em}.fullscreen-menu a:hover{color:var(--yellow)}
.page-shell{width:100%;max-width:100vw;margin:0;padding:30px 18px 40px;min-height:100svh;display:flex;align-items:flex-start;justify-content:center;overflow-x:clip}.order-card{width:min(760px,100%);background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding:0}.content-card{width:min(940px,100%);margin-top:88px;background:rgba(255,248,230,.88);border:1px solid rgba(255,255,255,.62);border-radius:32px;padding:clamp(22px,4vw,42px);box-shadow:0 30px 90px rgba(0,0,0,.18);backdrop-filter:blur(20px)}.center-logo{display:block;width:min(255px,66vw);margin:0 auto 24px;filter:drop-shadow(0 18px 25px rgba(0,0,0,.16))}
h1{font-size:clamp(42px,7vw,76px);line-height:.88;margin:0 0 14px;text-align:center;letter-spacing:-.06em;font-weight:950;color:var(--deep-orange);text-shadow:0 14px 36px rgba(255,248,230,.55)}h2{font-size:clamp(25px,4vw,42px);color:var(--deep-orange);letter-spacing:-.04em;text-align:center}.subtitle,.helper{font-size:clamp(15px,2.2vw,18px);max-width:650px;text-align:center;color:#4b4035;margin:0 auto 22px;line-height:1.45;font-weight:650}.tabs{width:min(500px,100%);display:grid;grid-template-columns:1fr 1fr;background:rgba(255,255,255,.62);border:1px solid var(--stroke);border-radius:22px;padding:7px;box-shadow:0 24px 70px rgba(0,0,0,.13);backdrop-filter:blur(22px);margin:0 auto 20px}.tab{border:0;background:transparent;border-radius:17px;font-weight:950;font-size:15px;padding:14px;cursor:pointer;color:var(--blue);transition:.18s ease}.tab.active{background:var(--orange);color:#fff;box-shadow:0 10px 24px rgba(255,90,0,.24)}.panel{width:min(720px,100%);margin:0 auto}.hidden{display:none}.searchbox{position:relative;display:grid;grid-template-columns:1fr auto;gap:10px;background:rgba(255,248,230,.86);border:1px solid var(--stroke);border-radius:26px;padding:10px;box-shadow:0 26px 80px rgba(0,0,0,.16);backdrop-filter:blur(20px)}input,textarea,select{font-size:17px;border:1px solid rgba(17,59,147,.12);background:rgba(255,255,255,.94);border-radius:18px;padding:17px;outline:none;min-width:0;width:100%}textarea{min-height:130px;resize:vertical}input:focus,textarea:focus,select:focus{border-color:rgba(255,90,0,.75);box-shadow:0 0 0 4px rgba(255,90,0,.12)}button,.branch-card a,.result a,.site-form button{background:var(--orange);color:#fff;border:0;border-radius:18px;padding:0 22px;font-weight:950;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:56px;cursor:pointer;transition:.18s ease}.suggestions{position:absolute;left:10px;right:10px;top:calc(100% + 8px);background:rgba(255,255,255,.96);border:1px solid rgba(17,59,147,.08);border-radius:22px;box-shadow:0 28px 80px rgba(0,0,0,.20);max-height:min(42vh,360px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;z-index:20;scrollbar-gutter:stable;display:none}.suggestions.open{display:block}.suggestion{padding:15px 17px;border-bottom:1px solid rgba(20,20,20,.06);cursor:pointer;font-weight:850}.suggestion small{display:block;color:#655e56;font-weight:650;margin-top:3px}.suggestion.outside{opacity:.38;filter:grayscale(1)}.result{margin-top:16px}.result-card,.branch-card{background:rgba(255,248,230,.88);border:1px solid var(--stroke);border-radius:26px;padding:20px;box-shadow:0 26px 75px rgba(0,0,0,.12);backdrop-filter:blur(20px)}.result-card h3,.branch-card h3{margin:0 0 8px;color:var(--blue);font-size:22px;letter-spacing:-.03em}.result-card p,.branch-card p{margin:0 0 15px;color:#544d45;line-height:1.4}.branch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.branch-card{display:flex;flex-direction:column;justify-content:space-between;min-height:166px}.branch-card.disabled{opacity:.45;filter:grayscale(.8)}.page-content{font-size:18px;line-height:1.68;color:#312d29}.page-content a{color:var(--orange);font-weight:900}.site-form{display:grid;gap:12px;margin-top:22px}.site-form label{font-weight:900;color:var(--blue)}.consent{display:flex;gap:10px;align-items:flex-start}.consent input{width:auto;margin-top:6px}.form-note{padding:14px;border-radius:16px;margin:18px 0;font-weight:900}.form-note.ok{background:#e7fff0;color:#126b38}.form-note.err{background:#ffe0e0;color:#8b1111}.social-row{display:flex;flex-wrap:wrap;gap:8px}.social-row a{font-size:13px;background:var(--blue);min-height:0;padding:8px 10px;border-radius:999px}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.gallery-grid figure{margin:0;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.10)}.gallery-grid img{width:100%;height:200px;object-fit:cover;display:block}.gallery-grid figcaption{padding:12px;font-weight:900;color:var(--blue)}.bottom-nav{display:none}footer{background:var(--blue);color:#fff;text-align:center;padding:18px;font-size:14px}.mode-takeaway .delivery-only{display:none!important}
@media(max-width:720px){body{padding-bottom:78px}body:before{background:linear-gradient(180deg,rgba(255,248,230,.84),rgba(255,216,74,.30),rgba(17,59,147,.20)),url("sushima-bg-food.webp") center/cover no-repeat}body:after{backdrop-filter:blur(5px)}.bg-sushima-photo{display:none}.app-header{position:sticky;grid-template-columns:52px 1fr;gap:8px;padding:10px 12px;background:rgba(255,248,230,.84);border-bottom:1px solid rgba(255,255,255,.62);backdrop-filter:blur(18px);pointer-events:auto}.hamburger{width:48px;height:48px;border-radius:16px}.app-logo{display:block;justify-self:start}.app-logo img{display:block;width:min(168px,48vw)}.lang-pills{grid-column:1/3;justify-self:center;margin-top:4px}.lang-pills a{padding:7px 12px}.page-shell{padding:18px 12px 24px;min-height:auto;display:block}.order-card{width:100%;padding:0}.center-logo{display:none}.content-card{margin-top:12px;border-radius:26px;padding:20px 14px}h1{font-size:42px}.searchbox{grid-template-columns:1fr;padding:9px;border-radius:22px}button{width:100%}.branch-grid{grid-template-columns:1fr}.suggestions{max-height:44svh;left:9px;right:9px}.fullscreen-menu a{font-size:38px}.page-content{font-size:16px}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(4,1fr);background:var(--blue);border-top:3px solid var(--orange);box-shadow:0 -18px 50px rgba(0,0,0,.16);padding:7px max(8px,env(safe-area-inset-left)) calc(7px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right))}.bottom-nav a{text-decoration:none;color:#fff;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:950;border-radius:16px;padding:8px 4px}.bottom-nav span{font-size:20px}.bottom-nav b{font-size:11px}footer{padding-bottom:calc(18px + env(safe-area-inset-bottom))}}
/* v28 layout/menu polish */
body:before{
background:
linear-gradient(90deg,rgba(23,23,23,.70),rgba(255,248,230,.28) 42%,rgba(255,90,0,.12)),
url("sushima-bg-food.webp") center center/cover no-repeat !important;
}
body:after{
backdrop-filter:blur(5px) saturate(1.03) !important;
}
.app-header{
grid-template-columns:62px 1fr 290px !important;
pointer-events:auto !important;
}
.lang-pills{
width:auto !important;
max-width:290px !important;
justify-self:end !important;
}
.lang-pills a{
color:var(--blue) !important;
}
.lang-pills a.active{
background:var(--blue) !important;
color:#fff !important;
}
.app-logo{display:none!important}
.center-logo{
margin-top:12px !important;
width:min(250px,62vw) !important;
}
.order-card{padding-top:0!important}
h1{color:var(--deep-orange)!important}
.tabs .tab{color:var(--blue)!important}
.tabs .tab.active{background:var(--orange)!important;color:#fff!important}
.bottom-nav{
background:rgba(255,248,230,.96)!important;
border-top:2px solid rgba(255,90,0,.45)!important;
}
.bottom-nav a{
color:var(--deep-orange)!important;
font-size:12px!important;
padding:12px 4px!important;
}
.bottom-nav span{display:none!important}
.bottom-nav b{
font-size:12px!important;
letter-spacing:-.01em;
}
@media(max-width:720px){
body:before{
background:
linear-gradient(180deg,rgba(255,248,230,.86),rgba(255,248,230,.45),rgba(17,59,147,.18)),
url("sushima-bg-food.webp") center center/cover no-repeat !important;
}
.app-header{
grid-template-columns:52px 1fr auto !important;
padding:10px 12px !important;
gap:10px !important;
}
.hamburger{
grid-column:1!important;
grid-row:1!important;
}
.app-logo{
display:block!important;
grid-column:2!important;
grid-row:1!important;
justify-self:center!important;
}
.app-logo img{
width:min(155px,42vw)!important;
}
.lang-pills{
grid-column:3!important;
grid-row:1!important;
justify-self:end!important;
margin-top:0!important;
gap:1px!important;
padding:3px!important;
background:rgba(255,248,230,.82)!important;
max-width:none!important;
}
.lang-pills a{
font-size:10px!important;
padding:6px 7px!important;
}
.page-shell{
padding-top:16px!important;
}
.center-logo{
display:none!important;
}
.bottom-nav{
display:grid!important;
grid-template-columns:repeat(4,1fr)!important;
background:rgba(255,248,230,.97)!important;
border-top:2px solid rgba(255,90,0,.45)!important;
}
.bottom-nav a{
color:var(--deep-orange)!important;
font-size:12px!important;
padding:12px 2px!important;
}
.bottom-nav b{
font-size:12px!important;
}
}
/* v29 minimal menu + white fullscreen drawer */
.fullscreen-menu{
background:rgba(255,248,230,.96)!important;
color:var(--blue)!important;
}
.fullscreen-menu.open{display:grid!important}
.menu-logo{
filter:drop-shadow(0 12px 24px rgba(17,59,147,.12))!important;
}
.fullscreen-menu nav{
width:min(520px,92vw)!important;
gap:12px!important;
}
.fullscreen-menu nav a{
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:58px!important;
padding:12px 18px!important;
border-radius:20px!important;
background:var(--orange)!important;
color:#fff!important;
font-size:clamp(20px,4vw,30px)!important;
letter-spacing:-.02em!important;
box-shadow:0 16px 34px rgba(255,90,0,.18)!important;
}
.fullscreen-menu nav a:hover{
background:var(--blue)!important;
color:#fff!important;
}
.menu-close{
background:var(--blue)!important;
}
footer{
background:transparent!important;
color:#fff8e6!important;
text-shadow:0 2px 10px rgba(0,0,0,.45)!important;
}
.sushima-sections{
display:grid;
gap:22px;
margin-top:26px;
}
.mini-section{
background:rgba(255,255,255,.55);
border:1px solid rgba(255,255,255,.65);
border-radius:24px;
padding:18px;
}
@media(max-width:720px){
.bottom-nav{
background:#fff!important;
border-top:0!important;
gap:7px!important;
padding:8px max(8px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right))!important;
box-shadow:0 -18px 45px rgba(0,0,0,.16)!important;
}
.bottom-nav a{
background:#fff!important;
color:var(--blue)!important;
border:1px solid rgba(17,59,147,.12)!important;
box-shadow:0 8px 20px rgba(17,59,147,.10)!important;
border-radius:16px!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
min-height:48px!important;
justify-content:center!important;
}
.bottom-nav span{display:none!important}
.bottom-nav b{
text-transform:uppercase!important;
font-size:10.5px!important;
}
}
/* v30 professional UI polish */
:root{
--brand-yellow:#ffd84a;
--clean-white:#ffffff;
--soft-white:rgba(255,255,255,.94);
--input-border:#d9dee8;
--input-focus:rgba(255,90,0,.16);
}
.content-card,
.result-card,
.branch-card,
.mini-section{
background:var(--soft-white)!important;
border:1px solid rgba(255,255,255,.86)!important;
}
.content-card{
box-shadow:0 28px 90px rgba(17,59,147,.13)!important;
}
.content-card::before{
content:"";
display:block;
width:84px;
height:6px;
border-radius:999px;
margin:0 auto 20px;
background:linear-gradient(90deg,var(--brand-yellow),var(--orange));
}
.page-content{
color:#2b2f36!important;
}
.site-form{
display:grid!important;
gap:18px!important;
margin-top:28px!important;
}
.site-form label{
display:grid!important;
gap:8px!important;
margin:0!important;
font-size:14px!important;
line-height:1.25!important;
font-weight:850!important;
color:var(--blue)!important;
letter-spacing:.01em!important;
}
.site-form input,
.site-form textarea,
.site-form select{
width:100%!important;
min-height:54px!important;
border:1px solid var(--input-border)!important;
background:#fff!important;
border-radius:16px!important;
padding:15px 16px!important;
font-size:16px!important;
line-height:1.35!important;
color:#1f2937!important;
box-shadow:0 8px 22px rgba(17,59,147,.045)!important;
}
.site-form textarea{
min-height:150px!important;
padding-top:16px!important;
}
.site-form input::placeholder,
.site-form textarea::placeholder{
color:#7b8494!important;
}
.site-form input:focus,
.site-form textarea:focus,
.site-form select:focus{
border-color:var(--orange)!important;
box-shadow:0 0 0 4px var(--input-focus),0 10px 26px rgba(17,59,147,.06)!important;
}
.site-form .consent{
grid-template-columns:24px 1fr!important;
align-items:flex-start!important;
gap:10px!important;
color:#374151!important;
font-weight:700!important;
background:#fff9df!important;
padding:14px 16px!important;
border-radius:16px!important;
border:1px solid rgba(255,216,74,.55)!important;
}
.site-form .consent input{
width:18px!important;
min-height:18px!important;
height:18px!important;
padding:0!important;
margin:2px 0 0!important;
box-shadow:none!important;
}
.site-form button{
margin-top:4px!important;
min-height:58px!important;
border-radius:18px!important;
background:linear-gradient(135deg,var(--orange),#e84a12)!important;
box-shadow:0 16px 34px rgba(255,90,0,.24)!important;
}
.order-card .tabs,
.searchbox{
border:1px solid rgba(255,216,74,.62)!important;
}
.tabs{
background:rgba(255,255,255,.80)!important;
}
.tab.active{
background:linear-gradient(135deg,var(--orange),#e84a12)!important;
}
.searchbox{
background:rgba(255,255,255,.90)!important;
}
footer{
color:#ffffff!important;
background:transparent!important;
text-shadow:0 2px 10px rgba(0,0,0,.42)!important;
}
.bottom-nav{
border-top:3px solid var(--brand-yellow)!important;
}
.bottom-nav a{
border-top:3px solid transparent!important;
}
.bottom-nav a:hover{
border-top-color:var(--orange)!important;
}
@media(max-width:720px){
.content-card{
background:#fff!important;
box-shadow:0 18px 50px rgba(17,59,147,.12)!important;
}
.site-form{
gap:16px!important;
}
.site-form label{
font-size:13.5px!important;
}
.site-form input,
.site-form textarea,
.site-form select{
min-height:52px!important;
border-radius:15px!important;
padding:14px 15px!important;
}
}
/* v31 Sushima yellow mobile header + content polish */
@media(max-width:720px){
body:before{
background:
linear-gradient(180deg,rgba(255,216,74,.92) 0%,rgba(255,216,74,.62) 28%,rgba(255,248,230,.38) 58%,rgba(17,59,147,.18) 100%),
url("sushima-bg-food.webp") center center/cover no-repeat !important;
}
body:after{
background:
radial-gradient(circle at 50% 8%,rgba(255,216,74,.62) 0 18%,rgba(255,248,230,.35) 42%,transparent 68%),
linear-gradient(180deg,rgba(255,216,74,.28),rgba(255,255,255,.06)) !important;
backdrop-filter:blur(4px) saturate(1.08)!important;
}
.app-header{
background:linear-gradient(135deg,rgba(255,216,74,.96),rgba(255,248,230,.78))!important;
border-bottom:1px solid rgba(255,255,255,.7)!important;
box-shadow:0 12px 34px rgba(17,59,147,.12)!important;
}
.lang-pills{
background:rgba(255,255,255,.72)!important;
}
.order-card,
.content-card{
background:rgba(255,255,255,.94)!important;
}
.content-card::before{
background:linear-gradient(90deg,var(--brand-yellow),var(--orange))!important;
}
}
.sushima-brand-links{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:12px;
margin:22px 0;
}
.sushima-brand-links a{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
min-height:52px;
padding:12px 16px;
border-radius:18px;
background:#fff;
border:1px solid rgba(17,59,147,.12);
color:var(--blue)!important;
font-weight:950;
text-decoration:none;
box-shadow:0 12px 28px rgba(17,59,147,.08);
}
.sushima-brand-links a:hover{
background:var(--brand-yellow);
}
.video-note{
background:#fff9df;
border:1px solid rgba(255,216,74,.6);
border-radius:18px;
padding:14px 16px;
color:#4b4035;
font-weight:750;
margin:16px 0;
}
/* v32 mobile polished: desktop-like smooth, simple, clean, with soft yellow accents */
@media(max-width:720px){
body{
padding-bottom:76px!important;
background:#111!important;
}
body:before{
background:
linear-gradient(180deg,rgba(255,248,230,.80) 0%,rgba(255,248,230,.54) 34%,rgba(255,216,74,.20) 58%,rgba(17,59,147,.20) 100%),
url("sushima-bg-food.webp") center center/cover no-repeat!important;
transform:scale(1.01)!important;
}
body:after{
background:
radial-gradient(circle at 50% 10%,rgba(255,216,74,.24) 0 18%,rgba(255,255,255,.16) 42%,transparent 68%),
linear-gradient(180deg,rgba(255,255,255,.08),rgba(17,59,147,.10))!important;
backdrop-filter:blur(6px) saturate(1.02)!important;
}
.bg-sushi:before,
.bg-sushi:after{
opacity:.22!important;
}
.app-header{
position:sticky!important;
top:0!important;
grid-template-columns:48px 1fr auto!important;
gap:10px!important;
padding:10px 14px!important;
min-height:72px!important;
background:rgba(255,255,255,.54)!important;
border-bottom:1px solid rgba(255,255,255,.58)!important;
box-shadow:0 10px 34px rgba(17,59,147,.09)!important;
backdrop-filter:blur(18px)!important;
}
.hamburger{
width:48px!important;
height:48px!important;
border-radius:16px!important;
background:var(--orange)!important;
box-shadow:0 10px 22px rgba(255,90,0,.20)!important;
}
.app-logo{
display:block!important;
justify-self:center!important;
margin:0!important;
}
.app-logo img{
width:min(178px,48vw)!important;
max-height:52px!important;
object-fit:contain!important;
}
.lang-pills{
grid-column:auto!important;
grid-row:auto!important;
justify-self:end!important;
margin:0!important;
display:flex!important;
gap:2px!important;
padding:4px!important;
background:rgba(255,255,255,.76)!important;
border:1px solid rgba(255,255,255,.72)!important;
border-radius:999px!important;
box-shadow:0 8px 20px rgba(17,59,147,.08)!important;
backdrop-filter:blur(16px)!important;
}
.lang-pills a{
font-size:10px!important;
line-height:1!important;
padding:7px 7px!important;
min-width:28px!important;
text-align:center!important;
color:var(--blue)!important;
}
.lang-pills a.active{
background:var(--blue)!important;
color:#fff!important;
}
.page-shell{
display:block!important;
padding:18px 14px 24px!important;
min-height:auto!important;
}
.order-card{
width:100%!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
}
.center-logo{
display:none!important;
}
.order-card h1{
font-size:clamp(40px,13vw,58px)!important;
line-height:.88!important;
margin:18px auto 12px!important;
max-width:92vw!important;
color:var(--deep-orange)!important;
text-shadow:0 12px 26px rgba(255,255,255,.40)!important;
}
.subtitle,
.helper{
font-size:15px!important;
line-height:1.42!important;
max-width:92vw!important;
margin-left:auto!important;
margin-right:auto!important;
color:#3f372f!important;
text-shadow:0 1px 8px rgba(255,255,255,.32)!important;
}
.tabs{
width:100%!important;
max-width:520px!important;
margin:18px auto 18px!important;
padding:6px!important;
border-radius:20px!important;
background:rgba(255,255,255,.70)!important;
border:1px solid rgba(255,216,74,.45)!important;
box-shadow:0 18px 50px rgba(17,59,147,.10)!important;
backdrop-filter:blur(18px)!important;
}
.tab{
min-height:54px!important;
padding:12px 10px!important;
border-radius:16px!important;
font-size:16px!important;
color:var(--blue)!important;
}
.tab.active{
background:linear-gradient(135deg,var(--orange),#ea4b12)!important;
color:#fff!important;
box-shadow:0 10px 24px rgba(255,90,0,.18)!important;
}
.panel{
width:100%!important;
max-width:560px!important;
}
.searchbox{
width:100%!important;
grid-template-columns:1fr!important;
gap:10px!important;
padding:10px!important;
border-radius:22px!important;
background:rgba(255,255,255,.76)!important;
border:1px solid rgba(255,216,74,.42)!important;
box-shadow:0 20px 55px rgba(17,59,147,.12)!important;
backdrop-filter:blur(18px)!important;
}
.searchbox input{
min-height:58px!important;
border-radius:18px!important;
background:#fff!important;
border:1px solid rgba(17,59,147,.10)!important;
box-shadow:none!important;
font-size:16px!important;
}
.searchbox button,
#checkBtn{
width:100%!important;
min-height:58px!important;
border-radius:18px!important;
background:linear-gradient(135deg,var(--orange),#ea4b12)!important;
box-shadow:0 12px 26px rgba(255,90,0,.22)!important;
}
.content-card{
margin-top:12px!important;
padding:20px 16px!important;
border-radius:26px!important;
background:rgba(255,255,255,.92)!important;
border:1px solid rgba(255,255,255,.78)!important;
box-shadow:0 20px 55px rgba(17,59,147,.13)!important;
backdrop-filter:blur(18px)!important;
}
.content-card::before{
width:72px!important;
height:5px!important;
margin-bottom:18px!important;
background:linear-gradient(90deg,var(--brand-yellow),var(--orange))!important;
}
footer{
background:transparent!important;
color:#fff!important;
padding:20px 16px 92px!important;
font-size:13px!important;
text-shadow:0 2px 10px rgba(0,0,0,.55)!important;
}
.bottom-nav{
left:10px!important;
right:10px!important;
bottom:10px!important;
grid-template-columns:repeat(4,1fr)!important;
gap:7px!important;
padding:7px!important;
background:rgba(255,255,255,.86)!important;
border:1px solid rgba(255,255,255,.75)!important;
border-top:1px solid rgba(255,255,255,.75)!important;
border-radius:22px!important;
box-shadow:0 -8px 35px rgba(17,59,147,.16),0 12px 30px rgba(0,0,0,.10)!important;
backdrop-filter:blur(18px)!important;
}
.bottom-nav a{
min-height:48px!important;
border-radius:16px!important;
background:#fff!important;
border:1px solid rgba(17,59,147,.08)!important;
box-shadow:0 8px 18px rgba(17,59,147,.07)!important;
color:var(--blue)!important;
text-transform:uppercase!important;
letter-spacing:.035em!important;
padding:8px 3px!important;
}
.bottom-nav b{
font-size:10px!important;
font-weight:950!important;
white-space:nowrap!important;
}
.bottom-nav span{
display:none!important;
}
}
@media(max-width:390px){
.app-header{
grid-template-columns:46px 1fr auto!important;
gap:7px!important;
padding:9px 10px!important;
}
.app-logo img{
width:min(150px,42vw)!important;
}
.lang-pills a{
font-size:9.5px!important;
min-width:24px!important;
padding:6px 5px!important;
}
.order-card h1{
font-size:38px!important;
}
.bottom-nav b{
font-size:9.4px!important;
}
}
/* v33 mobile footer/menu polish + interaction states */
a, button, .tab, .hamburger, .bottom-nav a, .fullscreen-menu nav a, .branch-card a, .result a{
transition:transform .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease, filter .18s ease!important;
}
a:hover, button:hover, .tab:hover, .hamburger:hover, .bottom-nav a:hover, .fullscreen-menu nav a:hover, .branch-card a:hover, .result a:hover{
transform:translateY(-1px) scale(1.018)!important;
filter:brightness(1.035)!important;
}
a:active, button:active, .tab:active, .hamburger:active, .bottom-nav a:active, .fullscreen-menu nav a:active{
transform:scale(.985)!important;
}
.fullscreen-menu{
background:#ffffff!important;
color:var(--blue)!important;
}
.fullscreen-menu nav a{
background:var(--orange)!important;
color:#fff!important;
}
.fullscreen-menu nav a:hover{
background:#e84a12!important;
box-shadow:0 18px 38px rgba(255,90,0,.24)!important;
}
.menu-close{
background:var(--blue)!important;
color:#fff!important;
}
@media(max-width:720px){
.hamburger{
width:42px!important;
height:42px!important;
border-radius:14px!important;
gap:4px!important;
}
.hamburger span{
width:19px!important;
}
.app-header{
grid-template-columns:42px 1fr auto!important;
}
.app-logo img{
width:min(168px,47vw)!important;
}
.bottom-nav{
background:var(--blue)!important;
border:1px solid rgba(255,255,255,.18)!important;
border-top:3px solid var(--brand-yellow)!important;
box-shadow:0 -8px 35px rgba(17,59,147,.24),0 12px 30px rgba(0,0,0,.12)!important;
}
.bottom-nav a{
background:rgba(255,255,255,.08)!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.14)!important;
box-shadow:none!important;
}
.bottom-nav a:hover{
background:rgba(255,216,74,.18)!important;
color:#fff!important;
border-color:rgba(255,216,74,.55)!important;
}
.bottom-nav b{
color:#fff!important;
}
}
@media(max-width:390px){
.hamburger{
width:40px!important;
height:40px!important;
border-radius:13px!important;
}
.app-header{
grid-template-columns:40px 1fr auto!important;
}
.app-logo img{
width:min(150px,41vw)!important;
}
}
/* v35 professional links, reduced radius, gallery/branch polish */
:root{
--radius-xl:20px;
--radius-lg:16px;
--radius-md:12px;
}
/* reduce excessive corner rounding */
.content-card,
.order-card,
.result-card,
.branch-card,
.mini-section,
.gallery-grid figure,
.youtube-block,
.searchbox,
.tabs,
.site-form input,
.site-form textarea,
.site-form select,
.bottom-nav,
.bottom-nav a{
border-radius:var(--radius-lg)!important;
}
.hamburger,
.tab,
button,
.branch-card a,
.result a,
.site-form button,
.fullscreen-menu nav a{
border-radius:var(--radius-md)!important;
}
/* convert messy inline social links into professional button grid */
.sushima-brand-links{
display:grid!important;
grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;
gap:12px!important;
margin:24px 0!important;
}
.sushima-brand-links a,
.page-content a.social-button{
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:50px!important;
padding:12px 15px!important;
border-radius:14px!important;
background:linear-gradient(135deg,var(--blue),#0b2d75)!important;
color:#fff!important;
text-decoration:none!important;
font-weight:950!important;
line-height:1.2!important;
box-shadow:0 12px 26px rgba(17,59,147,.16)!important;
border:1px solid rgba(255,255,255,.16)!important;
}
.sushima-brand-links a:hover,
.page-content a.social-button:hover{
background:linear-gradient(135deg,var(--orange),#e84a12)!important;
color:#fff!important;
transform:translateY(-1px) scale(1.015)!important;
}
/* keep ordinary text links clean */
.page-content p a:not(.social-button){
color:var(--orange)!important;
font-weight:850!important;
text-underline-offset:4px!important;
}
/* branch hero image support */
.branch-card .branch-image{
width:100%;
aspect-ratio:16/9;
border-radius:14px;
object-fit:cover;
display:block;
margin:0 0 14px;
background:#f3f4f6;
box-shadow:0 12px 28px rgba(17,59,147,.08);
}
.branch-card h3{
margin-top:0!important;
}
.branch-card .branch-actions{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:12px;
}
.branch-card .branch-actions a{
min-height:40px!important;
padding:8px 12px!important;
font-size:13px!important;
border-radius:12px!important;
}
/* gallery richer layout */
.gallery-grid{
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(210px,1fr))!important;
gap:16px!important;
}
.gallery-grid figure{
position:relative;
overflow:hidden;
border:1px solid rgba(17,59,147,.08);
background:#fff;
}
.gallery-grid img{
transition:transform .24s ease, filter .24s ease;
}
.gallery-grid figure:hover img{
transform:scale(1.04);
filter:saturate(1.08);
}
.gallery-grid figcaption{
background:#fff;
color:var(--blue)!important;
}
.gallery-grid a{
text-decoration:none!important;
color:inherit!important;
}
@media(max-width:720px){
.content-card,
.result-card,
.branch-card,
.mini-section{
border-radius:18px!important;
}
.bottom-nav{
border-radius:18px!important;
}
.bottom-nav a{
border-radius:13px!important;
}
.sushima-brand-links{
grid-template-columns:1fr 1fr!important;
gap:9px!important;
}
.sushima-brand-links a{
min-height:46px!important;
font-size:13px!important;
padding:10px!important;
}
}
/* v36 corporate color balance + Firmen Event */
:root{
--button-primary:var(--blue);
--button-secondary:#ffffff;
--button-accent:var(--brand-yellow);
}
/* reduce too much orange */
.sushima-brand-links a,
.page-content a.social-button,
.branch-card a,
.result a,
.site-form button,
.fullscreen-menu nav a{
background:linear-gradient(135deg,var(--blue),#0b2d75)!important;
color:#fff!important;
box-shadow:0 12px 26px rgba(17,59,147,.16)!important;
}
.sushima-brand-links a:hover,
.page-content a.social-button:hover,
.branch-card a:hover,
.result a:hover,
.site-form button:hover,
.fullscreen-menu nav a:hover{
background:linear-gradient(135deg,#1649ad,var(--blue))!important;
box-shadow:0 16px 32px rgba(17,59,147,.22)!important;
}
.tab.active,
#checkBtn{
background:linear-gradient(135deg,var(--orange),#e84a12)!important;
}
.content-card::before{
background:linear-gradient(90deg,var(--brand-yellow),var(--blue))!important;
}
.hamburger{
background:var(--orange)!important;
}
.event-hero{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:22px;
align-items:center;
margin:10px 0 28px;
}
.event-intro{
background:#fff;
border:1px solid rgba(17,59,147,.08);
border-radius:16px;
padding:22px;
box-shadow:0 16px 35px rgba(17,59,147,.08);
}
.event-intro h2{
text-align:left!important;
margin:0 0 10px!important;
color:var(--blue)!important;
}
.event-intro p{
margin:0 0 12px;
line-height:1.6;
}
.event-points{
display:grid;
gap:10px;
margin-top:16px;
}
.event-point{
background:#fff9df;
border:1px solid rgba(255,216,74,.55);
border-radius:14px;
padding:12px 14px;
font-weight:850;
color:#374151;
}
.event-visual{
min-height:280px;
border-radius:18px;
background:
linear-gradient(180deg,rgba(17,59,147,.05),rgba(255,90,0,.08)),
url("sushima-bg-food.webp") center/cover no-repeat;
box-shadow:0 20px 55px rgba(0,0,0,.14);
border:1px solid rgba(255,255,255,.8);
}
.event-form-title{
text-align:left!important;
color:var(--deep-orange)!important;
margin-top:30px!important;
}
.site-form.firmen-event-form{
background:#fff;
border:1px solid rgba(17,59,147,.08);
border-radius:18px;
padding:22px;
box-shadow:0 16px 45px rgba(17,59,147,.08);
}
.site-form .form-grid-2{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
}
@media(max-width:720px){
.event-hero{
grid-template-columns:1fr;
gap:14px;
}
.event-visual{
min-height:190px;
}
.event-intro,
.site-form.firmen-event-form{
padding:16px;
border-radius:16px;
}
.site-form .form-grid-2{
grid-template-columns:1fr;
gap:14px;
}
}
/* v41 - Sushima yellow header strip + Instagram button + yellow fullscreen menu */
html, body{
margin:0!important;
padding-left:0!important;
overflow-x:hidden!important;
width:100%!important;
}
body::before,
body::after{
left:0!important;
right:0!important;
width:100vw!important;
}
:root{
--sushima-yellow:#ffd84a;
}
.app-header{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
width:100%!important;
min-height:72px!important;
display:grid!important;
grid-template-columns:58px auto 1fr auto auto!important;
align-items:center!important;
gap:12px!important;
padding:10px 24px!important;
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
border-bottom:1px solid rgba(255,255,255,.55)!important;
box-shadow:0 12px 35px rgba(17,59,147,.10)!important;
backdrop-filter:none!important;
pointer-events:auto!important;
z-index:70!important;
}
.app-header .hamburger{
position:static!important;
grid-column:1!important;
width:46px!important;
height:46px!important;
border-radius:13px!important;
background:var(--blue)!important;
box-shadow:0 10px 22px rgba(17,59,147,.18)!important;
}
.app-header .hamburger span{
width:20px!important;
height:2px!important;
}
.app-header .app-logo{
display:block!important;
grid-column:2!important;
justify-self:start!important;
margin:0!important;
}
.app-header .app-logo img{
display:block!important;
width:min(190px,28vw)!important;
max-height:54px!important;
object-fit:contain!important;
filter:drop-shadow(0 8px 14px rgba(17,59,147,.14))!important;
}
.app-header .lang-pills{
grid-column:4!important;
justify-self:end!important;
position:static!important;
max-width:none!important;
margin:0!important;
background:rgba(255,255,255,.62)!important;
border:1px solid rgba(255,255,255,.74)!important;
box-shadow:0 8px 18px rgba(17,59,147,.08)!important;
}
.instagram-header-btn{
grid-column:5!important;
width:43px!important;
height:43px!important;
border-radius:999px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
background:rgba(255,255,255,.72)!important;
border:1px solid rgba(255,255,255,.85)!important;
box-shadow:0 8px 18px rgba(17,59,147,.10)!important;
color:var(--blue)!important;
text-decoration:none!important;
transition:transform .18s ease, background .18s ease, color .18s ease!important;
}
.instagram-header-btn svg{
width:22px!important;
height:22px!important;
fill:currentColor!important;
}
.instagram-header-btn:hover{
transform:translateY(-1px) scale(1.04)!important;
background:var(--blue)!important;
color:#fff!important;
}
.page-shell{
padding-top:96px!important;
}
.order-card .center-logo{
display:none!important;
}
/* fullscreen hamburger menu becomes expanded yellow header */
.fullscreen-menu{
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
color:var(--blue)!important;
}
.fullscreen-menu.open{
display:grid!important;
}
.fullscreen-menu .menu-logo{
width:min(185px,48vw)!important;
margin-bottom:22px!important;
filter:drop-shadow(0 10px 18px rgba(17,59,147,.16))!important;
}
.fullscreen-menu nav{
width:min(520px,92vw)!important;
gap:11px!important;
}
.fullscreen-menu nav a{
background:rgba(255,255,255,.76)!important;
color:var(--blue)!important;
border:1px solid rgba(255,255,255,.82)!important;
box-shadow:0 12px 26px rgba(17,59,147,.10)!important;
}
.fullscreen-menu nav a:hover{
background:var(--blue)!important;
color:#fff!important;
transform:translateY(-1px) scale(1.018)!important;
}
.menu-close{
background:var(--blue)!important;
color:#fff!important;
}
@media(max-width:720px){
.app-header{
position:sticky!important;
min-height:70px!important;
grid-template-columns:42px 1fr auto auto!important;
gap:8px!important;
padding:9px 10px!important;
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
box-shadow:0 10px 28px rgba(17,59,147,.12)!important;
}
.app-header .hamburger{
width:40px!important;
height:40px!important;
border-radius:12px!important;
}
.app-header .hamburger span{
width:18px!important;
}
.app-header .app-logo{
grid-column:2!important;
justify-self:start!important;
}
.app-header .app-logo img{
width:min(158px,39vw)!important;
max-height:48px!important;
}
.app-header .lang-pills{
grid-column:3!important;
gap:1px!important;
padding:3px!important;
}
.app-header .lang-pills a{
font-size:9.5px!important;
min-width:23px!important;
padding:6px 5px!important;
}
.instagram-header-btn{
grid-column:4!important;
width:36px!important;
height:36px!important;
}
.instagram-header-btn svg{
width:19px!important;
height:19px!important;
}
.page-shell{
padding-top:18px!important;
}
.fullscreen-menu{
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
}
.fullscreen-menu .menu-logo{
width:min(155px,44vw)!important;
margin-bottom:18px!important;
}
}
@media(max-width:390px){
.app-header{
grid-template-columns:38px 1fr auto auto!important;
gap:6px!important;
padding:8px 8px!important;
}
.app-header .hamburger{
width:38px!important;
height:38px!important;
}
.app-header .app-logo img{
width:min(138px,36vw)!important;
}
.instagram-header-btn{
width:34px!important;
height:34px!important;
}
}
/* v43 fullscreen alignment + brand-yellow polish */
:root{
--sushima-yellow:#fed501;
--brand-yellow:#fed501;
}
/* remove unwanted side gap */
html,body{
margin:0!important;
padding:0!important;
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
body::before,body::after{
left:0!important;
right:0!important;
width:100vw!important;
max-width:100vw!important;
}
*{box-sizing:border-box!important}
/* order page: prevent body scrollbar, keep suggestions/results inside visual area */
body.page-order{
height:100dvh!important;
overflow:hidden!important;
}
body.page-order .page-shell{
height:calc(100dvh - 76px)!important;
min-height:0!important;
overflow:hidden!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
padding-top:86px!important;
padding-bottom:18px!important;
}
body.page-order .order-card{
max-height:calc(100dvh - 110px)!important;
overflow:visible!important;
}
body.page-order footer{
display:none!important;
}
/* Header spacing + yellow strip */
.app-header{
left:0!important;
right:0!important;
width:100%!important;
padding-left:38px!important;
padding-right:38px!important;
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
border-bottom:1px solid rgba(255,255,255,.65)!important;
}
.app-header .hamburger{
margin-left:0!important;
}
.app-header .app-logo img{
width:min(190px,28vw)!important;
max-height:54px!important;
object-fit:contain!important;
}
.instagram-header-btn{
width:43px!important;
height:43px!important;
border-radius:999px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
background:rgba(255,255,255,.76)!important;
border:1px solid rgba(255,255,255,.88)!important;
box-shadow:0 8px 18px rgba(17,59,147,.10)!important;
color:var(--blue)!important;
text-decoration:none!important;
}
.instagram-header-btn svg{
width:22px!important;
height:22px!important;
fill:currentColor!important;
}
.instagram-header-btn:hover{
background:var(--blue)!important;
color:#fff!important;
transform:translateY(-1px) scale(1.04)!important;
}
/* Fullscreen menu should feel like expanded yellow header and be perfectly centered */
.fullscreen-menu{
inset:0!important;
width:100vw!important;
height:100dvh!important;
padding:24px!important;
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
display:none!important;
place-items:center!important;
text-align:center!important;
overflow:hidden!important;
}
.fullscreen-menu.open{
display:grid!important;
}
.fullscreen-menu > *{
margin-left:auto!important;
margin-right:auto!important;
}
.fullscreen-menu .menu-logo{
width:min(150px,36vw)!important;
max-height:70px!important;
object-fit:contain!important;
margin:0 auto 20px!important;
display:block!important;
filter:drop-shadow(0 10px 18px rgba(17,59,147,.14))!important;
}
.fullscreen-menu nav{
width:min(520px,90vw)!important;
display:grid!important;
gap:10px!important;
margin:0 auto!important;
}
.fullscreen-menu nav a{
width:100%!important;
background:rgba(255,255,255,.78)!important;
color:var(--blue)!important;
border:1px solid rgba(255,255,255,.85)!important;
box-shadow:0 12px 26px rgba(17,59,147,.10)!important;
}
.fullscreen-menu nav a:hover{
background:var(--blue)!important;
color:#fff!important;
}
.menu-close{
position:absolute!important;
top:24px!important;
right:30px!important;
background:var(--blue)!important;
color:#fff!important;
}
/* Result area overlays instead of pushing page down */
#result:not(:empty){
position:relative!important;
z-index:20!important;
margin-top:14px!important;
}
body.page-order #result:not(:empty){
max-width:560px!important;
margin-left:auto!important;
margin-right:auto!important;
}
.suggestions.open{
z-index:100!important;
}
/* Über Sushima video embeds fit full width cleanly */
.youtube-block{
width:100%!important;
max-width:960px!important;
margin:24px auto!important;
aspect-ratio:16/9!important;
border-radius:16px!important;
overflow:hidden!important;
}
.youtube-block iframe{
width:100%!important;
height:100%!important;
}
@media(max-width:720px){
body.page-order{
overflow:hidden!important;
}
body.page-order .page-shell{
height:calc(100dvh - 70px)!important;
padding-top:16px!important;
padding-left:12px!important;
padding-right:12px!important;
align-items:center!important;
}
.app-header{
padding-left:14px!important;
padding-right:14px!important;
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779)!important;
}
.app-header .app-logo img{
width:min(150px,38vw)!important;
}
.instagram-header-btn{
width:36px!important;
height:36px!important;
}
.instagram-header-btn svg{
width:19px!important;
height:19px!important;
}
.fullscreen-menu{
padding:18px!important;
place-items:center!important;
}
.fullscreen-menu .menu-logo{
width:min(132px,34vw)!important;
margin-bottom:16px!important;
}
.fullscreen-menu nav{
width:min(420px,88vw)!important;
}
.menu-close{
top:18px!important;
right:18px!important;
}
body.page-order .order-card{
max-height:calc(100dvh - 110px)!important;
}
}
@media(max-width:390px){
.app-header{
padding-left:10px!important;
padding-right:10px!important;
}
.app-header .app-logo img{
width:min(132px,35vw)!important;
}
}
/* v48 polish: favicon-ready, address modal suggestions, close button, branch inactive compact */
.suggestions-backdrop{
position:fixed!important;
inset:0!important;
background:rgba(17,24,39,.34)!important;
backdrop-filter:blur(2px)!important;
opacity:0!important;
pointer-events:none!important;
transition:opacity .18s ease!important;
z-index:88!important;
}
.suggestions-backdrop.open{
opacity:1!important;
pointer-events:auto!important;
}
body.suggestions-active .searchbox{
position:relative!important;
z-index:110!important;
box-shadow:0 24px 70px rgba(17,59,147,.24)!important;
}
.suggestions.floating-up,
#suggestions.floating-up{
position:fixed!important;
right:auto!important;
top:auto!important;
margin:0!important;
transform:none!important;
z-index:120!important;
border-radius:18px!important;
overflow:auto!important;
background:rgba(255,255,255,.96)!important;
border:1px solid rgba(255,255,255,.88)!important;
box-shadow:0 24px 80px rgba(0,0,0,.26)!important;
backdrop-filter:blur(16px)!important;
padding:8px!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
width:100%!important;
display:block!important;
text-align:left!important;
padding:14px 16px!important;
border:0!important;
border-bottom:1px solid rgba(17,59,147,.08)!important;
background:#fff!important;
color:#111827!important;
cursor:pointer!important;
border-radius:12px!important;
margin:0 0 6px!important;
}
.suggestions.floating-up .suggestion:hover,
#suggestions.floating-up .suggestion:hover{
background:#fff7cc!important;
transform:translateY(-1px)!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
display:block!important;
font-size:16px!important;
line-height:1.25!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small{
display:block!important;
margin-top:4px!important;
color:#4b5563!important;
font-weight:700!important;
}
.suggestions.floating-up .suggestion.outside,
#suggestions.floating-up .suggestion.outside{
opacity:.54!important;
}
/* hamburger close button: no background, orange X only, safer spacing */
.menu-close{
background:transparent!important;
box-shadow:none!important;
border:0!important;
color:#d23b13!important;
font-size:38px!important;
width:54px!important;
height:54px!important;
line-height:1!important;
top:26px!important;
right:34px!important;
}
.menu-close:hover{
background:transparent!important;
color:#a72808!important;
transform:scale(1.08)!important;
}
/* fullscreen menu centered on mobile/desktop */
.fullscreen-menu{
display:none!important;
place-items:center!important;
text-align:center!important;
}
.fullscreen-menu.open{
display:grid!important;
}
.fullscreen-menu nav{
margin-left:auto!important;
margin-right:auto!important;
}
/* inactive future branches compact but visible */
.branch-card.inactive,
.branch-card:not(:has(a[target])) {
transform:scale(.96)!important;
opacity:.72!important;
min-height:auto!important;
padding:16px!important;
}
.branch-card.inactive h3,
.branch-card:not(:has(a[target])) h3{
font-size:18px!important;
margin-bottom:6px!important;
}
.branch-card.inactive p,
.branch-card:not(:has(a[target])) p{
font-size:14px!important;
margin:4px 0!important;
}
.branch-card.inactive::after,
.branch-card:not(:has(a[target]))::after{
content:"Bald verfügbar / Coming soon / Prossimamente / Bientôt disponible";
display:inline-flex;
margin-top:10px;
padding:7px 10px;
border-radius:999px;
background:rgba(254,213,1,.35);
color:var(--blue);
font-size:12px;
font-weight:900;
}
@media(max-width:720px){
.suggestions.floating-up,
#suggestions.floating-up{
border-radius:20px!important;
padding:8px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
font-size:15px!important;
}
.menu-close{
top:18px!important;
right:18px!important;
font-size:34px!important;
}
}
/* v49 centered address modal */
.suggestions.floating-up,
#suggestions.floating-up{
position:fixed!important;
left:50%!important;
top:50%!important;
bottom:auto!important;
transform:translate(-50%,-50%)!important;
width:min(760px,92vw)!important;
max-width:92vw!important;
max-height:min(62vh,560px)!important;
padding:14px!important;
border-radius:24px!important;
overflow:auto!important;
z-index:140!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
padding:18px 20px!important;
border-radius:16px!important;
margin-bottom:10px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
font-size:18px!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small{
font-size:13px!important;
}
body.suggestions-active .hero-content,
body.suggestions-active .page-shell,
body.suggestions-active .order-card{
filter:blur(2px)!important;
}
body.suggestions-active .searchbox{
filter:none!important;
z-index:145!important;
}
@media(max-width:720px){
.suggestions.floating-up,
#suggestions.floating-up{
width:min(94vw,520px)!important;
max-height:58vh!important;
border-radius:22px!important;
padding:10px!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
padding:15px 16px!important;
margin-bottom:8px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
font-size:15px!important;
line-height:1.3!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small{
font-size:12px!important;
}
}
/* v50 modal visibility fix: no parent blur, stronger card design */
body.suggestions-active .hero-content,
body.suggestions-active .page-shell,
body.suggestions-active .order-card{
filter:none!important;
}
.suggestions-backdrop{
z-index:990!important;
background:rgba(9,18,42,.52)!important;
backdrop-filter:blur(4px)!important;
}
body.suggestions-active .searchbox{
position:relative!important;
z-index:1005!important;
background:rgba(255,255,255,.94)!important;
border-radius:24px!important;
padding:10px!important;
box-shadow:0 28px 90px rgba(0,0,0,.30)!important;
}
.suggestions.floating-up,
#suggestions.floating-up{
z-index:1010!important;
left:50%!important;
top:50%!important;
bottom:auto!important;
transform:translate(-50%,-50%)!important;
width:min(780px,92vw)!important;
max-height:min(64vh,560px)!important;
background:
linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,248,218,.96))!important;
border:2px solid rgba(254,213,1,.65)!important;
border-radius:24px!important;
box-shadow:0 34px 110px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.8)!important;
padding:14px!important;
backdrop-filter:none!important;
filter:none!important;
}
.suggestions.floating-up::before,
#suggestions.floating-up::before{
content:"Adresse auswählen";
display:block;
padding:8px 10px 14px;
color:var(--blue);
font-size:18px;
font-weight:950;
text-align:center;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
background:#fff!important;
border:1px solid rgba(17,59,147,.10)!important;
box-shadow:0 8px 22px rgba(17,59,147,.08)!important;
}
.suggestions.floating-up .suggestion:hover,
#suggestions.floating-up .suggestion:hover{
background:#fff7cc!important;
border-color:rgba(254,213,1,.9)!important;
}
@media(max-width:720px){
body.suggestions-active .searchbox{
border-radius:22px!important;
padding:8px!important;
}
.suggestions.floating-up,
#suggestions.floating-up{
width:92vw!important;
max-height:56vh!important;
top:52%!important;
border-radius:22px!important;
padding:10px!important;
}
.suggestions.floating-up::before,
#suggestions.floating-up::before{
font-size:16px!important;
padding:6px 8px 10px!important;
}
}
/* v51 mobile-first address chooser: app-style bottom-safe center sheet */
.suggestions-backdrop{
z-index:5000!important;
background:rgba(8,14,32,.58)!important;
backdrop-filter:blur(5px)!important;
}
.suggestions.floating-up,
#suggestions.floating-up{
z-index:5010!important;
position:fixed!important;
left:50%!important;
top:50%!important;
bottom:auto!important;
transform:translate(-50%,-50%)!important;
width:min(720px,90vw)!important;
max-height:min(58vh,520px)!important;
overflow:auto!important;
background:linear-gradient(180deg,#ffffff,#fff8dc)!important;
border:2px solid rgba(254,213,1,.85)!important;
border-radius:22px!important;
box-shadow:0 34px 110px rgba(0,0,0,.42)!important;
filter:none!important;
backdrop-filter:none!important;
}
body.suggestions-active .hero-content,
body.suggestions-active .page-shell,
body.suggestions-active .order-card,
body.suggestions-active .app-header,
body.suggestions-active .bottom-nav{
filter:blur(4px)!important;
}
body.suggestions-active .searchbox{
filter:none!important;
}
.suggestions.floating-up::before,
#suggestions.floating-up::before{
content:"Adresse auswählen";
position:sticky;
top:0;
z-index:2;
display:block;
margin:-14px -14px 10px;
padding:15px 18px;
text-align:center;
font-weight:950;
color:var(--blue);
background:linear-gradient(135deg,var(--sushima-yellow),#ffe779);
border-bottom:1px solid rgba(17,59,147,.10);
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
background:#fff!important;
color:#111827!important;
border:1px solid rgba(17,59,147,.10)!important;
box-shadow:0 8px 22px rgba(17,59,147,.08)!important;
border-radius:15px!important;
padding:16px 18px!important;
margin:0 0 10px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
font-size:17px!important;
line-height:1.28!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small{
font-size:12px!important;
margin-top:5px!important;
}
@media(max-width:720px){
.suggestions-backdrop{
background:rgba(8,14,32,.62)!important;
backdrop-filter:blur(5px)!important;
}
.suggestions.floating-up,
#suggestions.floating-up{
left:50%!important;
top:44%!important;
bottom:auto!important;
transform:translate(-50%,-50%)!important;
width:calc(100vw - 28px)!important;
max-width:520px!important;
max-height:calc(100dvh - 250px)!important;
min-height:220px!important;
border-radius:24px!important;
padding:10px!important;
padding-bottom:12px!important;
box-shadow:0 24px 80px rgba(0,0,0,.45)!important;
}
.suggestions.floating-up::before,
#suggestions.floating-up::before{
margin:-10px -10px 10px!important;
padding:14px 14px!important;
font-size:16px!important;
border-radius:22px 22px 0 0!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
padding:14px 14px!important;
border-radius:15px!important;
margin-bottom:9px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong{
font-size:15px!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small{
font-size:11.5px!important;
}
body.suggestions-active .bottom-nav{
opacity:.28!important;
pointer-events:none!important;
}
}
@media(max-width:390px){
.suggestions.floating-up,
#suggestions.floating-up{
top:42%!important;
width:calc(100vw - 22px)!important;
max-height:calc(100dvh - 235px)!important;
}
}
/* v52 takeaway header overlap + inactive branch card polish + branch CTA buttons */
body.mode-takeaway.page-order .page-shell,
body.mode-takeaway .page-shell{
padding-top:118px!important;
align-items:flex-start!important;
overflow:auto!important;
}
body.mode-takeaway.page-order{
overflow:auto!important;
}
body.mode-takeaway .order-card{
margin-top:22px!important;
max-height:none!important;
overflow:visible!important;
}
body.mode-takeaway .order-card h1{
margin-top:0!important;
}
body.mode-takeaway .branch-grid{
padding-bottom:42px!important;
}
.branch-card.inactive,
.branch-card:not(:has(a[target])){
border-radius:18px!important;
padding:18px!important;
margin:0!important;
opacity:.72!important;
background:rgba(255,255,255,.72)!important;
border:1px solid rgba(255,255,255,.72)!important;
box-shadow:0 12px 32px rgba(17,59,147,.08)!important;
transform:none!important;
}
.branch-card.inactive::after,
.branch-card:not(:has(a[target]))::after{
content:"Bald verfügbar";
display:inline-flex!important;
margin-top:12px!important;
padding:8px 12px!important;
border-radius:999px!important;
background:rgba(254,213,1,.42)!important;
color:var(--blue)!important;
font-size:12px!important;
font-weight:950!important;
line-height:1.1!important;
}
html[lang="en"] .branch-card.inactive::after,
html[lang="en"] .branch-card:not(:has(a[target]))::after{content:"Coming soon";}
html[lang="it"] .branch-card.inactive::after,
html[lang="it"] .branch-card:not(:has(a[target]))::after{content:"Prossimamente";}
html[lang="fr"] .branch-card.inactive::after,
html[lang="fr"] .branch-card:not(:has(a[target]))::after{content:"Bientôt disponible";}
.branch-direct-actions{
display:flex!important;
gap:10px!important;
flex-wrap:wrap!important;
margin:13px 0 8px!important;
}
.branch-direct-actions a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:40px!important;
padding:9px 13px!important;
border-radius:12px!important;
background:var(--blue)!important;
color:#fff!important;
text-decoration:none!important;
font-size:13px!important;
font-weight:900!important;
box-shadow:0 8px 18px rgba(17,59,147,.14)!important;
}
.branch-direct-actions a:hover{
transform:translateY(-1px) scale(1.02)!important;
background:var(--orange)!important;
}
@media(max-width:720px){
body.mode-takeaway.page-order .page-shell,
body.mode-takeaway .page-shell{
height:auto!important;
min-height:calc(100dvh - 70px)!important;
overflow:auto!important;
padding-top:28px!important;
padding-bottom:118px!important;
align-items:flex-start!important;
}
body.mode-takeaway .order-card{
margin-top:0!important;
width:100%!important;
}
body.mode-takeaway .order-card h1{
font-size:clamp(42px,12vw,64px)!important;
line-height:.92!important;
margin-top:10px!important;
}
body.mode-takeaway .branch-grid{
gap:12px!important;
padding-bottom:28px!important;
}
.branch-card.inactive,
.branch-card:not(:has(a[target])){
border-radius:18px!important;
padding:15px!important;
transform:none!important;
}
.branch-direct-actions{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:8px!important;
}
.branch-direct-actions a{
width:100%!important;
min-height:42px!important;
font-size:12px!important;
}
}
/* v53: disable modal overlay, normal centered address dropdown */
.suggestions-backdrop,
.suggestions-backdrop.open{
display:none!important;
opacity:0!important;
pointer-events:none!important;
backdrop-filter:none!important;
background:transparent!important;
}
body.suggestions-active .hero-content,
body.suggestions-active .page-shell,
body.suggestions-active .order-card,
body.suggestions-active .app-header,
body.suggestions-active .bottom-nav{
filter:none!important;
opacity:1!important;
}
body.suggestions-active .searchbox{
position:relative!important;
z-index:3000!important;
filter:none!important;
background:rgba(255,255,255,.94)!important;
border-radius:20px!important;
box-shadow:0 18px 46px rgba(17,59,147,.18)!important;
}
/* dropdown stays connected to the search area, centered and always above content */
.suggestions.floating-up,
#suggestions.floating-up,
.suggestions.open,
#suggestions.open{
position:absolute!important;
left:50%!important;
top:calc(100% + 12px)!important;
bottom:auto!important;
transform:translateX(-50%)!important;
width:100%!important;
max-width:720px!important;
max-height:320px!important;
overflow:auto!important;
z-index:3100!important;
padding:8px!important;
margin:0!important;
background:rgba(255,255,255,.98)!important;
border:2px solid rgba(254,213,1,.72)!important;
border-radius:18px!important;
box-shadow:0 24px 64px rgba(0,0,0,.24)!important;
backdrop-filter:none!important;
filter:none!important;
}
.suggestions.floating-up::before,
#suggestions.floating-up::before{
display:none!important;
content:none!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion,
.suggestions.open .suggestion,
#suggestions.open .suggestion{
width:100%!important;
display:block!important;
text-align:left!important;
padding:14px 16px!important;
margin:0 0 8px!important;
border-radius:14px!important;
background:#fff!important;
border:1px solid rgba(17,59,147,.09)!important;
box-shadow:0 6px 16px rgba(17,59,147,.06)!important;
color:#111827!important;
cursor:pointer!important;
}
.suggestions.floating-up .suggestion:hover,
#suggestions.floating-up .suggestion:hover,
.suggestions.open .suggestion:hover,
#suggestions.open .suggestion:hover{
background:#fff7cc!important;
border-color:rgba(254,213,1,.92)!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong,
.suggestions.open .suggestion strong,
#suggestions.open .suggestion strong{
display:block!important;
font-size:16px!important;
line-height:1.25!important;
}
.suggestions.floating-up .suggestion small,
#suggestions.floating-up .suggestion small,
.suggestions.open .suggestion small,
#suggestions.open .suggestion small{
display:block!important;
margin-top:4px!important;
font-size:12px!important;
color:#4b5563!important;
font-weight:750!important;
}
@media(max-width:720px){
body.suggestions-active .searchbox{
z-index:3000!important;
border-radius:18px!important;
}
.suggestions.floating-up,
#suggestions.floating-up,
.suggestions.open,
#suggestions.open{
position:absolute!important;
left:50%!important;
top:calc(100% + 10px)!important;
transform:translateX(-50%)!important;
width:calc(100vw - 44px)!important;
max-width:none!important;
max-height:260px!important;
border-radius:18px!important;
padding:7px!important;
box-shadow:0 18px 46px rgba(0,0,0,.22)!important;
}
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion,
.suggestions.open .suggestion,
#suggestions.open .suggestion{
padding:13px 14px!important;
margin-bottom:7px!important;
}
.suggestions.floating-up .suggestion strong,
#suggestions.floating-up .suggestion strong,
.suggestions.open .suggestion strong,
#suggestions.open .suggestion strong{
font-size:14.5px!important;
}
}
/* v54 professional address dropdown + stable hero spacing */
/* Stable page height / vertical rhythm: delivery and takeaway same position */
body.page-order .page-shell{
height:auto!important;
min-height:calc(100dvh - 76px)!important;
overflow:visible!important;
align-items:flex-start!important;
justify-content:center!important;
padding-top:120px!important;
padding-bottom:80px!important;
}
body.page-order .order-card{
margin-top:0!important;
max-height:none!important;
overflow:visible!important;
}
body.page-order .order-card h1{
margin-top:0!important;
}
/* search wrapper must be the stacking context */
.searchbox{
position:relative!important;
z-index:50!important;
overflow:visible!important;
}
/* Professional dropdown: appears below the search bar, not clipped */
.suggestions,
#suggestions,
.suggestions.open,
#suggestions.open,
.suggestions.floating-up,
#suggestions.floating-up{
position:absolute!important;
top:calc(100% + 12px)!important;
left:0!important;
right:0!important;
bottom:auto!important;
transform:none!important;
width:100%!important;
max-width:none!important;
max-height:300px!important;
overflow-y:auto!important;
overflow-x:hidden!important;
z-index:99999!important;
display:none;
padding:10px!important;
margin:0!important;
border-radius:20px!important;
background:rgba(255,255,255,.98)!important;
border:2px solid rgba(254,213,1,.85)!important;
box-shadow:0 22px 65px rgba(0,0,0,.24)!important;
backdrop-filter:blur(10px)!important;
scrollbar-gutter:stable both-edges!important;
}
.suggestions.open,
#suggestions.open{
display:block!important;
}
/* remove modal/header labels from previous versions */
.suggestions::before,
#suggestions::before,
.suggestions.floating-up::before,
#suggestions.floating-up::before{
content:none!important;
display:none!important;
}
.suggestions .suggestion,
#suggestions .suggestion,
.suggestions.open .suggestion,
#suggestions.open .suggestion,
.suggestions.floating-up .suggestion,
#suggestions.floating-up .suggestion{
display:block!important;
width:100%!important;
text-align:left!important;
padding:15px 16px!important;
margin:0 0 8px!important;
border-radius:15px!important;
background:#fff!important;
color:#111827!important;
border:1px solid rgba(17,59,147,.10)!important;
box-shadow:0 6px 16px rgba(17,59,147,.06)!important;
cursor:pointer!important;
transition:background .16s ease, transform .16s ease, border-color .16s ease!important;
}
.suggestions .suggestion:hover,
#suggestions .suggestion:hover{
background:#fff7cc!important;
border-color:rgba(254,213,1,.95)!important;
transform:translateY(-1px)!important;
}
.suggestions .suggestion strong,
#suggestions .suggestion strong{
display:block!important;
font-size:16px!important;
line-height:1.25!important;
color:#111827!important;
}
.suggestions .suggestion small,
#suggestions .suggestion small{
display:block!important;
margin-top:4px!important;
font-size:12px!important;
font-weight:750!important;
color:#4b5563!important;
}
.suggestions .suggestion.outside,
#suggestions .suggestion.outside{
opacity:.55!important;
}
/* no modal/backdrop behavior */
.suggestions-backdrop,
.suggestions-backdrop.open{
display:none!important;
}
body.suggestions-active .hero-content,
body.suggestions-active .page-shell,
body.suggestions-active .order-card,
body.suggestions-active .app-header,
body.suggestions-active .bottom-nav{
filter:none!important;
opacity:1!important;
}
body.suggestions-active .searchbox{
z-index:99990!important;
filter:none!important;
}
/* enough room below when dropdown is open */
body.suggestions-active.page-order .page-shell{
padding-bottom:360px!important;
}
@media(max-width:720px){
body.page-order .page-shell{
min-height:calc(100dvh - 70px)!important;
height:auto!important;
overflow:visible!important;
align-items:flex-start!important;
padding-top:34px!important;
padding-left:14px!important;
padding-right:14px!important;
padding-bottom:118px!important;
}
body.page-order .order-card{
margin-top:0!important;
width:100%!important;
}
body.page-order .order-card h1{
margin-top:0!important;
font-size:clamp(48px,13vw,68px)!important;
line-height:.92!important;
}
body.page-order.mode-takeaway .page-shell,
body.mode-takeaway.page-order .page-shell{
padding-top:34px!important;
}
.searchbox{
z-index:99990!important;
}
.suggestions,
#suggestions,
.suggestions.open,
#suggestions.open,
.suggestions.floating-up,
#suggestions.floating-up{
position:absolute!important;
top:calc(100% + 10px)!important;
left:0!important;
right:0!important;
width:100%!important;
max-height:min(300px,38dvh)!important;
border-radius:18px!important;
padding:8px!important;
box-shadow:0 18px 46px rgba(0,0,0,.22)!important;
}
.suggestions .suggestion,
#suggestions .suggestion{
padding:13px 14px!important;
border-radius:14px!important;
margin-bottom:7px!important;
}
.suggestions .suggestion strong,
#suggestions .suggestion strong{
font-size:14.5px!important;
}
body.suggestions-active.page-order .page-shell{
padding-bottom:430px!important;
}
}
/* v55: address results open upward and always above everything */
.searchbox{
position:relative!important;
z-index:2147483000!important;
overflow:visible!important;
}
body.suggestions-active .searchbox{
position:relative!important;
z-index:2147483000!important;
}
/* Dropdown opens upward from the search box */
.suggestions,
#suggestions,
.suggestions.open,
#suggestions.open{
position:absolute!important;
left:0!important;
right:0!important;
top:auto!important;
bottom:calc(100% + 12px)!important;
transform:none!important;
width:100%!important;
max-width:none!important;
max-height:330px!important;
overflow-y:auto!important;
overflow-x:hidden!important;
z-index:2147483100!important;
display:none;
padding:10px!important;
margin:0!important;
border-radius:20px!important;
background:rgba(255,255,255,.98)!important;
border:2px solid rgba(254,213,1,.85)!important;
box-shadow:0 22px 68px rgba(0,0,0,.28)!important;
backdrop-filter:blur(12px)!important;
scrollbar-gutter:stable!important;
}
.suggestions.open,
#suggestions.open{
display:block!important;
}
/* kill old modal/downward behaviors */
.suggestions.floating-up,
#suggestions.floating-up{
position:absolute!important;
left:0!important;
right:0!important;
top:auto!important;
bottom:calc(100% + 12px)!important;
transform:none!important;
width:100%!important;
max-height:330px!important;
z-index:2147483100!important;
}
.suggestions::before,
#suggestions::before,
.suggestions.floating-up::before,
#suggestions.floating-up::before{
display:none!important;
content:none!important;
}
/* Sushima blue transparent scrollbar */
.suggestions,
#suggestions{
scrollbar-width:thin!important;
scrollbar-color:var(--blue) transparent!important;
}
.suggestions::-webkit-scrollbar,
#suggestions::-webkit-scrollbar{
width:8px!important;
}
.suggestions::-webkit-scrollbar-track,
#suggestions::-webkit-scrollbar-track{
background:transparent!important;
}
.suggestions::-webkit-scrollbar-thumb,
#suggestions::-webkit-scrollbar-thumb{
background:var(--blue)!important;
border-radius:999px!important;
border:2px solid transparent!important;
background-clip:content-box!important;
}
.suggestions::-webkit-scrollbar-thumb:hover,
#suggestions::-webkit-scrollbar-thumb:hover{
background:#0d2f7d!important;
background-clip:content-box!important;
}
/* address result items */
.suggestions .suggestion,
#suggestions .suggestion{
width:100%!important;
display:block!important;
text-align:left!important;
padding:14px 16px!important;
margin:0 0 8px!important;
border-radius:15px!important;
background:#fff!important;
color:#111827!important;
border:1px solid rgba(17,59,147,.10)!important;
box-shadow:0 6px 16px rgba(17,59,147,.06)!important;
cursor:pointer!important;
}
.suggestions .suggestion:hover,
#suggestions .suggestion:hover{
background:#fff7cc!important;
border-color:rgba(254,213,1,.95)!important;
transform:translateY(-1px)!important;
}
/* Make sure enough area exists above input on desktop/mobile */
body.page-order .page-shell{
padding-top:142px!important;
padding-bottom:80px!important;
overflow:visible!important;
}
body.page-order .order-card{
overflow:visible!important;
}
body.suggestions-active.page-order .page-shell{
padding-bottom:80px!important;
}
@media(max-width:720px){
.suggestions,
#suggestions,
.suggestions.open,
#suggestions.open,
.suggestions.floating-up,
#suggestions.floating-up{
bottom:calc(100% + 10px)!important;
max-height:min(300px,36dvh)!important;
border-radius:18px!important;
padding:8px!important;
box-shadow:0 18px 48px rgba(0,0,0,.25)!important;
}
.suggestions::-webkit-scrollbar,
#suggestions::-webkit-scrollbar{
width:6px!important;
}
body.page-order .page-shell{
padding-top:52px!important;
padding-bottom:118px!important;
overflow:visible!important;
}
body.page-order .order-card{
overflow:visible!important;
}
.suggestions .suggestion,
#suggestions .suggestion{
padding:13px 14px!important;
margin-bottom:7px!important;
}
}
/* v56 scroll attention to matched branch */
#result.result-highlight .result-card{
animation:sushimaResultPulse 1.25s ease;
}
@keyframes sushimaResultPulse{
0%{transform:scale(.985); box-shadow:0 0 0 0 rgba(254,213,1,.0);}
35%{transform:scale(1.012); box-shadow:0 0 0 8px rgba(254,213,1,.28);}
100%{transform:scale(1); box-shadow:0 0 0 0 rgba(254,213,1,.0);}
}
/* v57: search box must never appear over fullscreen hamburger menu */
.fullscreen-menu{
z-index:2147483600!important;
}
.fullscreen-menu.open{
z-index:2147483600!important;
}
.fullscreen-menu.open ~ *,
body:has(.fullscreen-menu.open) .searchbox,
body:has(.fullscreen-menu.open) #suggestions,
body:has(.fullscreen-menu.open) .suggestions{
pointer-events:none!important;
}
/* When menu is open, hide ordering search UI completely */
body.menu-open .searchbox,
body.menu-open #suggestions,
body.menu-open .suggestions,
body.menu-open .suggestions-backdrop{
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
z-index:1!important;
}
/* keep menu buttons clickable and above all */
body.menu-open .fullscreen-menu,
body.menu-open .fullscreen-menu *{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
}
/* close button clean and above menu content */
body.menu-open .menu-close{
z-index:2147483700!important;
}
/* v58: mobile can scroll after selecting address / branch result */
html,
body{
overscroll-behavior-y:auto!important;
}
body.page-order{
height:auto!important;
min-height:100dvh!important;
overflow-y:auto!important;
overflow-x:hidden!important;
position:relative!important;
}
body.page-order .page-shell{
height:auto!important;
min-height:calc(100dvh - 70px)!important;
overflow:visible!important;
align-items:flex-start!important;
}
body.page-order .order-card{
max-height:none!important;
overflow:visible!important;
}
#result,
#result .result-card{
position:relative!important;
z-index:20!important;
}
@media(max-width:720px){
body.page-order{
height:auto!important;
min-height:100dvh!important;
overflow-y:auto!important;
-webkit-overflow-scrolling:touch!important;
touch-action:pan-y!important;
}
body.page-order .page-shell{
height:auto!important;
min-height:calc(100dvh - 70px)!important;
overflow:visible!important;
padding-bottom:150px!important;
}
body.page-order .order-card{
max-height:none!important;
overflow:visible!important;
}
body.page-order #result:not(:empty){
margin-bottom:160px!important;
}
body.suggestions-active.page-order{
overflow-y:auto!important;
}
body.suggestions-active.page-order .page-shell{
padding-bottom:430px!important;
}
body:not(.suggestions-active).page-order .page-shell{
padding-bottom:150px!important;
}
}
/* v59 mobile app style address chooser */
.suggestions-backdrop{
position:fixed!important;
inset:0!important;
z-index:9000!important;
background:rgba(7,13,31,.58)!important;
backdrop-filter:blur(4px)!important;
opacity:0!important;
pointer-events:none!important;
transition:opacity .18s ease!important;
}
.suggestions-backdrop.open{
opacity:1!important;
pointer-events:auto!important;
}
body.suggestions-active{
overflow:hidden!important;
touch-action:none!important;
}
body.suggestions-active .bottom-nav{
opacity:.22!important;
pointer-events:none!important;
}
body.suggestions-active .page-shell,
body.suggestions-active .app-header{
filter:blur(2.5px)!important;
}
#suggestions.address-sheet,
.suggestions.address-sheet{
position:fixed!important;
z-index:9010!important;
left:50%!important;
top:50%!important;
right:auto!important;
bottom:auto!important;
transform:translate(-50%,-50%)!important;
width:min(720px,90vw)!important;
max-height:min(58vh,520px)!important;
overflow:auto!important;
padding:12px!important;
background:linear-gradient(180deg,#ffffff 0%,#fff9df 100%)!important;
border:2px solid rgba(254,213,1,.88)!important;
border-radius:24px!important;
box-shadow:0 36px 120px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.9)!important;
backdrop-filter:none!important;
filter:none!important;
opacity:1!important;
}
#suggestions.address-sheet::before,
.suggestions.address-sheet::before{
content:"Adresse auswählen";
position:sticky;
top:-12px;
z-index:2;
display:block;
margin:-12px -12px 12px!important;
padding:16px 18px!important;
text-align:center!important;
color:var(--blue)!important;
font-size:18px!important;
line-height:1.2!important;
font-weight:950!important;
background:linear-gradient(135deg,var(--sushima-yellow,#fed501),#ffe779)!important;
border-radius:22px 22px 0 0!important;
border-bottom:1px solid rgba(17,59,147,.10)!important;
}
#suggestions.address-sheet .suggestion,
.suggestions.address-sheet .suggestion{
width:100%!important;
display:block!important;
text-align:left!important;
margin:0 0 10px!important;
padding:16px 18px!important;
border:1px solid rgba(17,59,147,.10)!important;
border-radius:16px!important;
background:#fff!important;
color:#111827!important;
box-shadow:0 10px 24px rgba(17,59,147,.08)!important;
cursor:pointer!important;
transition:transform .15s ease, background .15s ease, border-color .15s ease!important;
}
#suggestions.address-sheet .suggestion:hover,
.suggestions.address-sheet .suggestion:hover{
transform:translateY(-1px)!important;
background:#fff7cc!important;
border-color:rgba(254,213,1,.9)!important;
}
#suggestions.address-sheet .suggestion strong,
.suggestions.address-sheet .suggestion strong{
display:block!important;
font-size:17px!important;
line-height:1.28!important;
font-weight:950!important;
color:#111827!important;
}
#suggestions.address-sheet .suggestion small,
.suggestions.address-sheet .suggestion small{
display:block!important;
margin-top:5px!important;
font-size:12px!important;
color:#4b5563!important;
font-weight:800!important;
}
#suggestions.address-sheet .suggestion.outside,
.suggestions.address-sheet .suggestion.outside{
opacity:.56!important;
}
#result{
scroll-margin-top:120px!important;
scroll-margin-bottom:140px!important;
}
.result-card{
margin-bottom:110px!important;
}
@media(max-width:720px){
body.suggestions-active .app-header{
filter:blur(2px)!important;
}
#suggestions.address-sheet,
.suggestions.address-sheet{
top:43%!important;
width:calc(100vw - 28px)!important;
max-width:520px!important;
max-height:calc(100dvh - 255px)!important;
min-height:210px!important;
padding:10px!important;
border-radius:24px!important;
}
#suggestions.address-sheet::before,
.suggestions.address-sheet::before{
top:-10px!important;
margin:-10px -10px 10px!important;
padding:14px 14px!important;
font-size:16px!important;
border-radius:22px 22px 0 0!important;
}
#suggestions.address-sheet .suggestion,
.suggestions.address-sheet .suggestion{
padding:14px 14px!important;
margin-bottom:9px!important;
border-radius:15px!important;
}
#suggestions.address-sheet .suggestion strong,
.suggestions.address-sheet .suggestion strong{
font-size:15px!important;
}
#suggestions.address-sheet .suggestion small,
.suggestions.address-sheet .suggestion small{
font-size:11.5px!important;
}
.result-card{
margin-bottom:135px!important;
}
}
@media(max-width:390px){
#suggestions.address-sheet,
.suggestions.address-sheet{
top:41%!important;
width:calc(100vw - 22px)!important;
max-height:calc(100dvh - 245px)!important;
}
}
/* v60 clear address modal: modal must not inherit blur */
body.suggestions-active .page-shell,
body.suggestions-active .order-card,
body.suggestions-active .hero-content,
body.suggestions-active .app-header,
body.suggestions-active .bottom-nav,
body.suggestions-active .searchbox{
filter:none!important;
}
.suggestions-backdrop{
z-index:8900!important;
background:rgba(7,13,31,.48)!important;
backdrop-filter:blur(3px)!important;
}
#suggestions.address-sheet,
.suggestions.address-sheet,
#suggestions.open,
.suggestions.open{
filter:none!important;
backdrop-filter:none!important;
opacity:1!important;
z-index:9100!important;
background:#fff!important;
color:#111827!important;
border:2px solid rgba(254,213,1,.9)!important;
box-shadow:0 32px 95px rgba(0,0,0,.38)!important;
}
#suggestions.address-sheet::before,
.suggestions.address-sheet::before{
filter:none!important;
backdrop-filter:none!important;
}
#suggestions.address-sheet .suggestion,
.suggestions.address-sheet .suggestion{
filter:none!important;
backdrop-filter:none!important;
opacity:1!important;
background:#fff!important;
color:#111827!important;
}
#suggestions.address-sheet .suggestion strong,
.suggestions.address-sheet .suggestion strong,
#suggestions.address-sheet .suggestion small,
.suggestions.address-sheet .suggestion small{
filter:none!important;
opacity:1!important;
}
@media(max-width:720px){
body.suggestions-active .bottom-nav{
opacity:.18!important;
}
}
/* v61 real blur fix: modal is moved to body; only page blurs, modal stays sharp */
body.suggestions-active .page-shell,
body.suggestions-active .app-header,
body.suggestions-active .bottom-nav,
body.suggestions-active .bg-sushi,
body.suggestions-active .bg-sushima-photo{
filter:blur(4px)!important;
}
body.suggestions-active #suggestions,
body.suggestions-active .suggestions.address-sheet,
body > #suggestions.address-sheet{
filter:none!important;
backdrop-filter:none!important;
-webkit-filter:none!important;
opacity:1!important;
z-index:99999!important;
isolation:isolate!important;
transform:translate(-50%,-50%) translateZ(0)!important;
will-change:transform!important;
}
body > #suggestions.address-sheet *,
body.suggestions-active #suggestions *{
filter:none!important;
backdrop-filter:none!important;
-webkit-filter:none!important;
text-shadow:none!important;
}
body > #suggestions.address-sheet{
background:#ffffff!important;
border:2px solid rgba(254,213,1,.95)!important;
box-shadow:0 35px 100px rgba(0,0,0,.48)!important;
}
.suggestions-backdrop{
z-index:99990!important;
backdrop-filter:none!important;
background:rgba(8,14,32,.58)!important;
}
/* v62 FINAL: no blur anywhere; sharp address modal above plain dark overlay */
body.suggestions-active,
body.suggestions-active *,
body.suggestions-active *::before,
body.suggestions-active *::after{
filter:none!important;
-webkit-filter:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
text-shadow:none!important;
}
.suggestions-backdrop{
position:fixed!important;
inset:0!important;
z-index:99000!important;
opacity:0!important;
pointer-events:none!important;
background:rgba(8,14,32,.56)!important;
filter:none!important;
-webkit-filter:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
transition:opacity .16s ease!important;
}
.suggestions-backdrop.open{
opacity:1!important;
pointer-events:auto!important;
}
body > #suggestions.address-sheet,
body > .suggestions.address-sheet,
#suggestions.address-sheet{
position:fixed!important;
z-index:99010!important;
left:50%!important;
top:23vh!important;
bottom:auto!important;
right:auto!important;
transform:translateX(-50%)!important;
width:min(720px,90vw)!important;
max-height:min(58vh,520px)!important;
overflow:auto!important;
background:#ffffff!important;
color:#111827!important;
opacity:1!important;
filter:none!important;
-webkit-filter:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
border:2px solid rgba(254,213,1,.95)!important;
border-radius:24px!important;
padding:12px!important;
box-shadow:0 34px 100px rgba(0,0,0,.48)!important;
text-rendering:geometricPrecision!important;
-webkit-font-smoothing:antialiased!important;
}
body > #suggestions.address-sheet::before,
#suggestions.address-sheet::before{
content:"Adresse auswählen"!important;
position:sticky!important;
top:-12px!important;
z-index:2!important;
display:block!important;
margin:-12px -12px 12px!important;
padding:16px 18px!important;
text-align:center!important;
color:var(--blue)!important;
font-size:18px!important;
line-height:1.2!important;
font-weight:950!important;
background:linear-gradient(135deg,var(--sushima-yellow,#fed501),#ffe779)!important;
border-radius:22px 22px 0 0!important;
border-bottom:1px solid rgba(17,59,147,.12)!important;
filter:none!important;
}
body > #suggestions.address-sheet .suggestion,
#suggestions.address-sheet .suggestion{
width:100%!important;
display:block!important;
text-align:left!important;
padding:16px 18px!important;
margin:0 0 10px!important;
background:#fff!important;
color:#111827!important;
border:1px solid rgba(17,59,147,.12)!important;
border-radius:16px!important;
box-shadow:0 8px 18px rgba(17,59,147,.08)!important;
opacity:1!important;
filter:none!important;
-webkit-filter:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body > #suggestions.address-sheet .suggestion strong,
#suggestions.address-sheet .suggestion strong{
display:block!important;
color:#111827!important;
font-size:17px!important;
line-height:1.28!important;
font-weight:950!important;
opacity:1!important;
filter:none!important;
}
body > #suggestions.address-sheet .suggestion small,
#suggestions.address-sheet .suggestion small{
display:block!important;
margin-top:5px!important;
color:#374151!important;
font-size:12px!important;
font-weight:800!important;
opacity:1!important;
filter:none!important;
}
body > #suggestions.address-sheet .suggestion:hover,
#suggestions.address-sheet .suggestion:hover{
background:#fff7cc!important;
border-color:rgba(254,213,1,.95)!important;
}
body.suggestions-active .bottom-nav{
opacity:.22!important;
pointer-events:none!important;
}
@media(max-width:720px){
body > #suggestions.address-sheet,
#suggestions.address-sheet{
top:22vh!important;
width:calc(100vw - 28px)!important;
max-width:520px!important;
max-height:calc(100dvh - 260px)!important;
border-radius:24px!important;
padding:10px!important;
}
body > #suggestions.address-sheet::before,
#suggestions.address-sheet::before{
top:-10px!important;
margin:-10px -10px 10px!important;
padding:14px 14px!important;
font-size:16px!important;
border-radius:22px 22px 0 0!important;
}
body > #suggestions.address-sheet .suggestion,
#suggestions.address-sheet .suggestion{
padding:14px!important;
border-radius:15px!important;
}
body > #suggestions.address-sheet .suggestion strong,
#suggestions.address-sheet .suggestion strong{
font-size:15px!important;
}
}
/* v69 CMS engine frontend blocks */
.cms-gallery-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
gap:16px;
margin:24px 0;
}
.cms-gallery-grid a{text-decoration:none;color:inherit}
.cms-gallery-grid figure{
margin:0;
background:#fff;
border-radius:var(--cms-radius,18px);
overflow:hidden;
box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));
border:1px solid rgba(17,59,147,.08);
}
.cms-gallery-grid img{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
display:block;
}
.cms-gallery-grid figcaption{
padding:10px 12px;
font-weight:800;
color:var(--blue);
}
.cms-video{
width:100%;
max-width:980px;
margin:28px auto;
aspect-ratio:16/9;
border-radius:var(--cms-radius,18px);
overflow:hidden;
box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));
background:#000;
}
.cms-video iframe{width:100%;height:100%;display:block}
.cms-btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:46px;
padding:12px 20px;
border-radius:var(--cms-radius,16px);
background:linear-gradient(135deg,var(--orange),#ff8a1f);
color:#fff!important;
text-decoration:none!important;
font-weight:950;
box-shadow:var(--cms-button-depth,0 8px 0 #b93708, 0 18px 32px rgba(255,90,0,.28));
transform:translateY(0);
transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.cms-btn:hover{
transform:translateY(-2px);
filter:saturate(1.05);
}
.cms-branch-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:18px;
margin:24px 0;
}
.cms-branch-card{
background:var(--cms-section-bg,#fff);
border-radius:var(--cms-radius,18px);
box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));
padding:18px;
border:1px solid rgba(17,59,147,.08);
}
.cms-branch-card img{
width:100%;
aspect-ratio:16/9;
object-fit:cover;
border-radius:calc(var(--cms-radius,18px) - 4px);
margin-bottom:12px;
}
.cms-branch-card h3{margin:0 0 8px;color:var(--blue)}
.cms-branch-card.inactive{opacity:.72;transform:scale(.97)}
.cms-branch-card small{
display:inline-block;
background:rgba(254,213,1,.35);
color:var(--blue);
border-radius:999px;
padding:7px 10px;
font-weight:900;
}
.page-content img{
max-width:100%;
height:auto;
border-radius:var(--cms-radius,16px);
}
.page-content .align-center{text-align:center}
.page-content .lead{font-size:1.18em;line-height:1.65;color:#374151}
/* v70 CMS frontend */
.cms-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin:24px 0}
.cms-gallery-grid a{text-decoration:none;color:inherit}
.cms-gallery-grid figure{margin:0;background:#fff;border-radius:var(--cms-radius,18px);overflow:hidden;box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));border:1px solid rgba(17,59,147,.08)}
.cms-gallery-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.cms-gallery-grid figcaption{padding:10px 12px;font-weight:800;color:var(--blue)}
.cms-video{width:100%;max-width:980px;margin:28px auto;aspect-ratio:16/9;border-radius:var(--cms-radius,18px);overflow:hidden;box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));background:#000}
.cms-video iframe{width:100%;height:100%;display:block}
.cms-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 20px;border-radius:var(--cms-radius,16px);background:linear-gradient(135deg,var(--orange),#ff8a1f);color:#fff!important;text-decoration:none!important;font-weight:950;box-shadow:var(--cms-button-depth,0 8px 0 #b93708,0 18px 32px rgba(255,90,0,.28));transition:transform .18s ease,filter .18s ease}
.cms-btn:hover{transform:translateY(-2px);filter:saturate(1.05)}
.cms-branch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin:24px 0}
.cms-branch-card{background:var(--cms-section-bg,#fff);border-radius:var(--cms-radius,18px);box-shadow:var(--cms-shadow,0 16px 40px rgba(17,59,147,.16));padding:18px;border:1px solid rgba(17,59,147,.08)}
.cms-branch-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--cms-radius,18px) - 4px);margin-bottom:12px}
.cms-branch-card h3{margin:0 0 8px;color:var(--blue)}
.cms-branch-card.inactive{opacity:.72;transform:scale(.97)}
.cms-branch-card small{display:inline-block;background:rgba(254,213,1,.35);color:var(--blue);border-radius:999px;padding:7px 10px;font-weight:900}
.page-content img{max-width:100%;height:auto;border-radius:var(--cms-radius,16px)}
/* v71 front visual polish: 3D header/buttons/footer */
.app-header{
background:linear-gradient(135deg,var(--sushima-yellow,#fed501) 0%,#ffe779 55%,#ffc400 100%)!important;
box-shadow:0 7px 0 rgba(190,145,0,.32),0 20px 42px rgba(17,59,147,.18)!important;
border-bottom:1px solid rgba(255,255,255,.65)!important;
}
.mode-tabs button,
.searchbox button,
.result-card a,
.order-card .btn,
button.btn,
a.btn{
background:linear-gradient(135deg,var(--orange,#ff5a00),#ff8a1f)!important;
box-shadow:0 7px 0 #b93708,0 18px 32px rgba(255,90,0,.28)!important;
font-weight:950!important;
border:0!important;
text-shadow:0 1px 0 rgba(0,0,0,.15)!important;
}
.mode-tabs button:hover,
.searchbox button:hover,
.result-card a:hover,
.order-card .btn:hover{
transform:translateY(-2px)!important;
}
.site-footer,.copyright,footer{
color:#ffffff!important;
}
.desktop-footer,.site-footer{
background:rgba(17,59,147,.92)!important;
border-top:1px solid rgba(255,255,255,.18)!important;
}
/* v73 branches icon actions + food menu page */
.icon-actions{display:flex!important;gap:10px!important;margin:12px 0!important}
.icon-btn{
width:44px!important;height:44px!important;border-radius:16px!important;
display:inline-flex!important;align-items:center!important;justify-content:center!important;
background:linear-gradient(135deg,#113b93,#1d4ed8)!important;color:#fff!important;
text-decoration:none!important;font-size:22px!important;font-weight:950!important;
box-shadow:0 5px 0 #09245f,0 14px 24px rgba(17,59,147,.22)!important;
transition:transform .16s ease,filter .16s ease!important;
}
.icon-btn:hover{transform:translateY(-2px)!important;filter:saturate(1.1)!important}
.food-menu-page .menu-branch-links{margin:28px 0;padding:22px;border-radius:var(--cms-radius,18px);background:#fff;box-shadow:var(--cms-shadow)}
.menu-link-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.menu-link-card{display:grid;gap:4px;padding:18px;border-radius:18px;background:linear-gradient(135deg,#fff,#fff8db);border:1px solid rgba(254,213,1,.75);text-decoration:none!important;box-shadow:0 12px 28px rgba(17,59,147,.09)}
.menu-link-card strong{color:var(--blue);font-size:18px}
.menu-link-card span{color:#4b5563;font-weight:700}
.food-menu-groups{display:grid;gap:24px;margin-top:28px}
.food-menu-group{background:#fff;border-radius:var(--cms-radius,18px);box-shadow:var(--cms-shadow);padding:22px;border:1px solid rgba(17,59,147,.08)}
.food-menu-group-head h2{margin:0;color:var(--deep-orange)}
.food-menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:18px}
.food-menu-item{display:grid;grid-template-columns:96px 1fr;gap:14px;background:#f8fbff;border:1px solid #e5edf7;border-radius:18px;padding:12px}
.food-menu-item img{width:96px;height:96px;border-radius:14px;object-fit:cover}
.food-menu-item h3{margin:0 0 6px;color:var(--blue)}
.food-menu-item p{margin:0 0 8px;color:#4b5563}
.food-price{color:var(--orange);font-size:18px}
@media(max-width:560px){.food-menu-item{grid-template-columns:1fr}.food-menu-item img{width:100%;height:auto;aspect-ratio:16/9}}
/* v75 branch icon buttons mobile fix */
.branch-direct-actions.icon-actions{
display:flex!important;
gap:8px!important;
margin:12px 0!important;
align-items:center!important;
justify-content:flex-start!important;
flex-wrap:nowrap!important;
}
.branch-direct-actions.icon-actions .icon-btn{
flex:0 0 42px!important;
width:42px!important;
height:42px!important;
min-width:42px!important;
max-width:42px!important;
padding:0!important;
border-radius:14px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
background:linear-gradient(135deg,#0f172a,#334155)!important;
color:#fff!important;
text-decoration:none!important;
font-size:0!important;
box-shadow:0 5px 0 #020617,0 14px 24px rgba(15,23,42,.22)!important;
line-height:1!important;
}
.branch-direct-actions.icon-actions .icon-btn.map::before{
content:"↗";
font-size:20px;
font-weight:950;
}
.branch-direct-actions.icon-actions .icon-btn.phone::before{
content:"☎";
font-size:18px;
font-weight:950;
}
.branch-direct-actions.icon-actions .icon-btn:hover{
transform:translateY(-2px)!important;
background:linear-gradient(135deg,#111827,#475569)!important;
}
@media(max-width:720px){
.branch-direct-actions.icon-actions{
justify-content:flex-start!important;
}
.branch-direct-actions.icon-actions .icon-btn{
width:40px!important;height:40px!important;min-width:40px!important;max-width:40px!important;
border-radius:13px!important;
}
}
/* v75 food menu portfolio gallery */
.food-menu-item .food-gallery{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:6px;
margin-top:10px;
}
.food-menu-item .food-gallery img{
width:100%;
aspect-ratio:1/1;
object-fit:cover;
border-radius:10px;
}
.food-menu-item.has-gallery{
grid-template-columns:1fr;
}
.food-menu-item.has-gallery > img{
width:100%;
height:auto;
aspect-ratio:16/9;
}
/* v77 hamburger final: transparent giant one-line menu items */
.fullscreen-menu nav a,
.fullscreen-menu .menu-link,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
background:transparent!important;
background-color:transparent!important;
background-image:none!important;
box-shadow:none!important;
text-shadow:none!important;
border:0!important;
border-radius:0!important;
border-bottom:1px solid rgba(17,59,147,.38)!important;
outline:0!important;
color:var(--blue,#113b93)!important;
width:min(820px,84vw)!important;
max-width:820px!important;
margin:0 auto!important;
padding:clamp(22px,3.2vh,42px) 6px!important;
min-height:auto!important;
height:auto!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
font-size:clamp(42px,6.2vw,88px)!important;
line-height:.92!important;
font-weight:950!important;
letter-spacing:-.07em!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
text-decoration:none!important;
text-transform:none!important;
transform:scale(1)!important;
transition:transform .18s ease,color .18s ease,border-color .18s ease!important;
}
.fullscreen-menu nav a:hover,
.fullscreen-menu a:hover,
#fullMenu nav a:hover,
#fullMenu a:hover{
background:transparent!important;
background-color:transparent!important;
background-image:none!important;
box-shadow:none!important;
transform:scale(1.045)!important;
color:var(--deep-orange,#c83b16)!important;
border-bottom-color:rgba(200,59,22,.85)!important;
}
.fullscreen-menu nav a.active,
#fullMenu nav a.active{
background:transparent!important;
color:var(--deep-orange,#c83b16)!important;
border-bottom-color:var(--deep-orange,#c83b16)!important;
}
.fullscreen-menu nav,
#fullMenu nav{
gap:0!important;
padding-top:clamp(34px,6vh,80px)!important;
padding-bottom:clamp(48px,8vh,96px)!important;
}
@media(max-width:720px){
.fullscreen-menu nav a,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
width:88vw!important;
padding:clamp(24px,4.4vh,38px) 4px!important;
font-size:clamp(40px,12.5vw,64px)!important;
letter-spacing:-.075em!important;
line-height:.9!important;
}
}
@media(max-width:390px){
.fullscreen-menu nav a,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
width:90vw!important;
font-size:clamp(34px,11.2vw,52px)!important;
padding:22px 3px!important;
}
}
/* v78 hamburger menu proportion fix */
.fullscreen-menu,
#fullMenu{
overflow-y:auto!important;
overflow-x:hidden!important;
}
.fullscreen-menu nav,
#fullMenu nav{
width:100%!important;
max-width:860px!important;
margin:0 auto!important;
padding:clamp(24px,4.5vh,58px) 18px clamp(32px,5vh,70px)!important;
gap:0!important;
box-sizing:border-box!important;
}
.fullscreen-menu nav a,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
width:100%!important;
max-width:820px!important;
min-height:auto!important;
padding:clamp(16px,2.15vh,28px) 8px!important;
font-size:clamp(34px,4.7vw,66px)!important;
line-height:.96!important;
letter-spacing:-.055em!important;
border-bottom:1px solid rgba(255,245,166,.58)!important;
color:var(--blue,#113b93)!important;
background:transparent!important;
background-color:transparent!important;
background-image:none!important;
box-shadow:none!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.fullscreen-menu nav a:hover,
.fullscreen-menu a:hover,
#fullMenu nav a:hover,
#fullMenu a:hover{
transform:scale(1.025)!important;
color:var(--deep-orange,#c83b16)!important;
border-bottom-color:rgba(255,248,198,.9)!important;
background:transparent!important;
box-shadow:none!important;
}
.fullscreen-menu .menu-logo,
#fullMenu .menu-logo{
max-width:150px!important;
width:min(150px,36vw)!important;
height:auto!important;
margin:clamp(16px,3vh,34px) auto clamp(18px,3vh,32px)!important;
}
.fullscreen-menu .menu-close,
#fullMenu .menu-close,
.menu-close{
top:22px!important;
right:24px!important;
}
@media(max-width:720px){
.fullscreen-menu nav,
#fullMenu nav{
max-width:100%!important;
padding:20px 24px 90px!important;
}
.fullscreen-menu nav a,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
width:100%!important;
max-width:100%!important;
padding:clamp(17px,3.1vh,26px) 4px!important;
font-size:clamp(31px,9.2vw,48px)!important;
line-height:.95!important;
letter-spacing:-.06em!important;
border-bottom-color:rgba(255,245,166,.62)!important;
}
.fullscreen-menu .menu-logo,
#fullMenu .menu-logo{
width:min(132px,38vw)!important;
margin:18px auto 18px!important;
}
}
@media(max-width:390px){
.fullscreen-menu nav,
#fullMenu nav{
padding-left:18px!important;
padding-right:18px!important;
}
.fullscreen-menu nav a,
.fullscreen-menu a,
#fullMenu nav a,
#fullMenu a{
font-size:clamp(28px,8.6vw,40px)!important;
padding:16px 2px!important;
letter-spacing:-.055em!important;
}
}