/* BALOKA V12 — edge-to-edge hero like modern national F&B brand homepages.
   Only home-page presentation changes. Images, pricing, transactions and APIs remain unchanged. */
:root {--baloka-navy:#102e4e;--baloka-gold:#cc8f43;}
html,body{max-width:100%;overflow-x:clip;}
html body header.top{width:100%;background:var(--baloka-navy)!important;}
html body header.top .wrap.nav,
html body header.top .nav{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  margin:0 auto!important;
  padding-left:clamp(18px,3vw,58px)!important;
  padding-right:clamp(18px,3vw,58px)!important;
}
html body .hero{
  width:100%!important;
  max-width:none!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
  background:#fff9f0!important;
}
html body .hero::before,html body .hero::after{
  content:none!important;
  display:none!important;
}
html body .hero .hero-grid{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
}
html body .hero .bl-v8-hero{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:#fff9f0!important;
}
html body .hero .bl-v8-hero>img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  border:0!important;
  border-radius:0!important;
}
html body .hero .bl-v8-mobile{display:none!important;}
html body .hero .bl-v8-hotspot{
  display:block!important;
  left:6.8%!important;
  top:49.9%!important;
  width:22.1%!important;
  height:8.5%!important;
}
html body #menu{padding-top:35px!important;scroll-margin-top:86px!important;}
@media(min-width:721px){
  html body .top .nav {min-height:74px!important;}
}
@media(max-width:720px){
  html body header.top .wrap.nav,
  html body header.top .nav{
    padding:10px 14px 8px!important;
  }
  html body .hero .hero-grid{width:100%!important;}
  html body .hero .bl-v8-hero{display:flex!important;flex-direction:column!important;}
  html body .hero .bl-v8-hero>img{
    order:2!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:1/1!important;
    object-fit:cover!important;
    object-position:right center!important;
  }
  html body .hero .bl-v8-mobile{
    display:block!important;
    order:1!important;
    padding:22px 18px 20px!important;
  }
  html body .hero .bl-v8-hotspot{display:none!important;}
  html body #menu{padding-top:26px!important;scroll-margin-top:118px!important;}
}