/* Responsive layout overrides: tuned for 320px through large desktop widths. */
html,body{max-width:100%;overflow-x:clip}
.container{max-width:100%}
:is(.hero-grid,.story-grid,.experience-grid,.opening-grid,.location-grid,.contact-layout,.section-head,.footer-main,.about-grid,.values-grid,.menu-categories,.gallery-grid,.contact-cards,.process-grid,.stats-grid,.trust-grid)>*{min-width:0}
:is(h1,h2,h3,p,li,a,span,strong,address,.footer-contact,.contact-line,.menu-item,.faq-question){overflow-wrap:anywhere;word-break:normal}
.btn{max-width:100%;white-space:normal;text-align:center;line-height:1.25;padding-block:10px}
input,select,textarea,button{max-width:100%;min-width:0}
iframe{max-width:100%}

@media (max-width:1080px){
  :root{--container:min(980px,calc(100% - 32px))}
  .desktop-nav{display:none}
  .menu-toggle{display:grid;position:relative;flex:0 0 48px}
  .header-actions .btn{display:none}
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(310px,.76fr);gap:40px}
  .hero-badge{left:-16px}
  .menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-main{grid-template-columns:1.15fr 1fr 1fr}
  .footer-main>div:last-child{grid-column:2/4}
  .contact-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  :root{--container:min(760px,calc(100% - 28px));--header-h:72px}
  html{scroll-padding-top:92px}
  .section{padding:78px 0;scroll-margin-top:92px}
  .section-sm{padding:56px 0}
  .topbar .container{min-height:38px}
  .topbar-note:last-child{display:none}
  .brand{min-width:0;max-width:calc(100% - 62px)}
  .brand img{width:58px;height:58px;flex:0 0 58px}
  .brand-copy strong{font-size:1rem}
  .brand-copy span{font-size:.59rem}
  .mobile-panel{inset:calc(38px + var(--header-h)) 0 0 auto;max-height:calc(100dvh - var(--header-h));overscroll-behavior:contain}
  .section-head{display:block;margin-bottom:40px}
  .section-head p{margin-top:16px;max-width:720px}
  .section-head.center{margin-bottom:40px}
  .hero{min-height:auto;padding:46px 0 70px}
  .hero-grid,.story-grid,.experience-grid,.opening-grid,.location-grid,.contact-layout{grid-template-columns:minmax(0,1fr)}
  .hero-grid{gap:42px}
  .hero-copy{text-align:center;max-width:730px;margin-inline:auto}
  .hero-copy .eyebrow{justify-content:center}
  .hero-copy p{margin-inline:auto}
  .hero-actions,.hero-facts{justify-content:center}
  .hero-media{width:min(100%,560px);margin-inline:auto}
  .hero-badge{left:10px;bottom:22px}
  .trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .trust-item:nth-child(2n){border-right:0}
  .trust-item:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}
  .story-grid{gap:48px}
  .image-shell{width:min(100%,580px);margin-inline:auto}
  .menu-card img{height:220px}
  .opening-grid{text-align:center}
  .opening-copy p{margin-inline:auto}
  .gallery-mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-tile:first-child{grid-column:1/-1}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat:nth-child(2n){border-right:0}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}
  .contact-intro{position:static}
  .contact-layout{gap:34px}
  .footer-main{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
  .footer-main>div:last-child{grid-column:auto}
  .cta-band-grid{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:24px}
  .about-grid,.values-grid{grid-template-columns:minmax(0,1fr)}
  .menu-categories{grid-template-columns:minmax(0,1fr)}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-card img{height:420px}
}

@media (max-width:600px){
  :root{--container:calc(100% - 28px);--header-h:68px;--radius:22px}
  html{scroll-padding-top:84px}
  body{font-size:15px;line-height:1.62}
  .topbar{font-size:.72rem}
  .topbar .container{min-height:34px;justify-content:center;text-align:center;padding-block:3px}
  .topbar-note{gap:9px}
  .topbar .dot{width:6px;height:6px;box-shadow:0 0 0 4px rgba(115,149,31,.15)}
  .nav-wrap{height:var(--header-h);gap:10px}
  .brand{gap:9px;max-width:calc(100% - 54px)}
  .brand img{width:54px;height:54px;flex-basis:54px}
  .brand-copy{min-width:0}
  .brand-copy strong{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand-copy span{display:none}
  .menu-toggle{width:44px;height:44px;flex-basis:44px}
  .mobile-panel{inset:calc(34px + var(--header-h)) 0 0 0;width:100%;padding:20px 18px 28px;border-left:0;border-top:1px solid var(--line);box-shadow:0 24px 60px rgba(0,0,0,.55)}
  .mobile-nav a{padding:14px 4px;font-size:1.17rem}
  .mobile-actions{gap:10px;margin-top:18px}
  .mobile-actions .btn{width:100%;min-height:48px}
  .section{padding:62px 0;scroll-margin-top:84px}
  .section-sm{padding:48px 0}
  h1{font-size:clamp(2.55rem,12.5vw,3.45rem);line-height:.98;letter-spacing:-.045em}
  h2{font-size:clamp(2.05rem,9.7vw,2.85rem);line-height:1.02}
  h3{font-size:clamp(1.28rem,6.2vw,1.7rem)}
  .lead{font-size:1rem;line-height:1.65}
  .eyebrow{font-size:.68rem;letter-spacing:.14em;line-height:1.55;max-width:100%;justify-content:flex-start}
  .eyebrow:before{width:24px;flex:0 0 24px}
  .section-head{margin-bottom:30px}
  .section-head.center{margin-bottom:30px}
  .section-head.center .eyebrow{justify-content:center}
  .section-head.center p{margin-top:14px}
  .hero{padding:34px 0 58px}
  .hero:after{width:420px;height:420px;right:-285px;top:70px;box-shadow:0 0 0 45px rgba(232,176,74,.02),0 0 0 90px rgba(232,176,74,.012)}
  .hero-grid{gap:30px}
  .hero-copy{text-align:left}
  .hero-copy .eyebrow{justify-content:flex-start}
  .hero-copy p{margin:20px 0 24px}
  .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  .hero-actions .btn{width:100%;min-height:50px}
  .hero-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:24px;padding-top:20px}
  .hero-fact{width:100%;padding:11px 12px;border:1px solid var(--line-soft);border-radius:14px;background:rgba(255,255,255,.025)}
  .hero-fact i{width:34px;height:34px;flex:0 0 34px}
  .hero-media{margin-top:2px}
  .hero-frame{padding:9px;border-radius:24px}
  .hero-frame img{border-radius:16px;max-height:none}
  .hero-badge{position:relative;inset:auto;max-width:none;margin-top:10px;padding:14px 16px;text-align:center;border-radius:15px}
  .hero-badge strong{font-size:1.2rem}
  .steam{right:18px;top:-18px;transform:scale(.82);transform-origin:top right}
  .trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .trust-item{padding:18px 14px;align-items:flex-start;gap:11px}
  .trust-icon{width:38px;height:38px;flex:0 0 38px}
  .trust-item strong{font-size:.9rem;line-height:1.28}
  .trust-item span{font-size:.75rem;line-height:1.45}
  .story-grid{gap:34px}
  .image-shell{padding:9px}
  .image-shell:after{display:none}
  .story-copy h2{margin:12px 0 18px}
  .story-points{grid-template-columns:minmax(0,1fr);gap:10px;margin:24px 0}
  .story-point{padding:15px}
  .menu-grid{grid-template-columns:minmax(0,1fr);gap:15px}
  .menu-card{min-height:0;border-radius:20px}
  .menu-card .media{padding:9px}
  .menu-card img{height:auto;max-height:330px;border-radius:13px}
  .menu-card-body{padding:20px}
  .menu-note{display:grid;gap:14px;padding:18px;text-align:left}
  .menu-note .btn{width:100%}
  .experience-grid{gap:34px}
  .experience-list{margin-top:22px}
  .experience-item{grid-template-columns:42px minmax(0,1fr);gap:12px;padding:15px 0}
  .experience-item .num{font-size:1.35rem}
  .experience-media{padding:9px;border-radius:22px}
  .experience-media img{border-radius:15px}
  .opening-date{font-size:3.5rem;line-height:.92}
  .opening-date span{font-size:.7rem;margin-top:12px}
  .opening-copy h2{font-size:2.25rem}
  .opening-banner .btn{width:100%;margin-top:8px}
  .process-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .process-card{padding:22px 19px}
  .process-icon{margin-bottom:24px}
  .gallery-mosaic{grid-template-columns:minmax(0,1fr);gap:13px}
  .gallery-tile:first-child{grid-column:auto}
  .gallery-tile{padding:8px;border-radius:18px}
  .gallery-tile img,.gallery-tile:nth-child(2) img,.gallery-tile:nth-child(3) img{height:auto;max-height:480px;border-radius:12px}
  .gallery-caption{position:static;margin-top:8px;padding:12px 13px;background:#100e0a;backdrop-filter:none}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat{padding:25px 10px}
  .stat strong{font-size:2.65rem}
  .stat span{font-size:.64rem;letter-spacing:.11em}
  .location-grid{gap:16px}
  .location-card{padding:22px;border-radius:20px}
  .contact-lines{gap:11px;margin:22px 0}
  .contact-line{grid-template-columns:40px minmax(0,1fr);gap:10px;align-items:start}
  .contact-line i{width:40px;height:40px}
  .contact-line a,.contact-line strong{display:inline-block;max-width:100%}
  .map-wrap,.map-wrap iframe{min-height:310px}
  .faq-list{gap:9px}
  .faq-question{padding:17px 16px;gap:12px;align-items:flex-start;line-height:1.4}
  .faq-question span:first-child{min-width:0}
  .faq-question span:last-child{flex:0 0 auto}
  .faq-answer p{padding:0 16px 17px}
  .contact-layout{gap:26px}
  .contact-intro .direct a{align-items:flex-start}
  .form-card{padding:20px;border-radius:22px}
  .form-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .field.full{grid-column:auto}
  .field input,.field select,.field textarea{padding:12px 13px}
  .form-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
  .form-actions .btn{width:100%}
  .form-status{min-height:0}
  .cta-band-grid{gap:18px}
  .cta-band .btn{width:100%}
  .footer-main{grid-template-columns:minmax(0,1fr);padding:52px 0 34px;gap:28px}
  .footer-brand{text-align:center}
  .footer-brand img{width:118px;height:118px;margin-inline:auto}
  .footer-brand p{margin-inline:auto}
  .footer-title{margin-bottom:12px}
  .footer-links,.footer-contact{gap:8px}
  .footer-bottom{padding:17px 0;text-align:center}
  .footer-bottom .container{display:grid;gap:6px;justify-items:center}
  .floating-actions{right:max(12px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));gap:10px}
  .float-btn{width:50px;height:50px}
  .float-btn .tooltip{display:none}
  .back-top{left:max(12px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));width:44px;height:44px}
  .page-hero{padding:56px 0 48px}
  .page-hero:after{font-size:170px;right:-18px;top:-28px}
  .page-hero h1{font-size:clamp(2.35rem,11.5vw,3.2rem)}
  .page-hero p{margin-top:16px}
  .breadcrumbs{flex-wrap:wrap;gap:6px;font-size:.76rem;margin-bottom:14px}
  .about-panel,.value-card{padding:21px;border-radius:18px}
  .timeline{grid-template-columns:minmax(0,1fr);gap:12px}
  .timeline-date{font-size:1.65rem}
  .timeline-content{padding-left:15px}
  .menu-category{padding:20px;border-radius:18px}
  .menu-category-head{align-items:flex-start;gap:12px}
  .menu-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
  .availability{max-width:105px}
  .disclaimer{padding:18px;margin-bottom:24px}
  .gallery-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .gallery-card{border-radius:18px;padding:8px}
  .gallery-card img{height:auto;max-height:520px;border-radius:12px}
  .contact-cards{grid-template-columns:minmax(0,1fr);gap:12px}
  .contact-card{padding:20px;border-radius:18px}
  .contact-page .map-wrap,.contact-page .map-wrap iframe{min-height:310px}
  .prose{font-size:.97rem}
  .prose h2{margin:32px 0 12px}
  .prose h3{margin:23px 0 9px}
  .policy-meta{padding:14px 15px}
}

@media (max-width:420px){
  :root{--container:calc(100% - 24px)}
  .topbar{font-size:.68rem}
  .topbar-note{gap:7px}
  .brand-copy strong{font-size:.86rem}
  .hero-copy{text-align:left}
  .trust-grid{grid-template-columns:minmax(0,1fr)}
  .trust-item{border-right:0!important;border-bottom:1px solid var(--line-soft)!important}
  .trust-item:last-child{border-bottom:0!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .menu-item{grid-template-columns:minmax(0,1fr)}
  .availability{text-align:left;max-width:none}
  .opening-date{font-size:3.1rem}
}

@media (max-width:360px){
  :root{--container:calc(100% - 20px)}
  .topbar{font-size:.65rem}
  .topbar .dot{display:none}
  .brand img{width:50px;height:50px;flex-basis:50px}
  .brand-copy strong{font-size:.81rem}
  .menu-toggle{width:42px;height:42px;flex-basis:42px}
  .mobile-panel{padding-inline:14px}
  h1{font-size:2.38rem}
  h2{font-size:2rem}
  .btn{padding-inline:15px}
  .hero-badge{padding:13px}
  .form-card{padding:17px}
  .location-card{padding:18px}
  .contact-card{padding:18px}
  .floating-actions{right:10px}
  .back-top{left:10px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal,.stagger>*{opacity:1!important;transform:none!important}
}

/* =========================================================
   Critical mobile overflow + navigation fix
   Prevents sideways page dragging and keeps quick actions visible.
   ========================================================= */
html{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
  overscroll-behavior-x:none;
}
body{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden !important;
  overscroll-behavior-x:none;
  touch-action:pan-y pinch-zoom;
}
body > *{max-width:100%}

/* Keep the closed menu inside the viewport instead of translating it
   outside the page, which caused a wide horizontal scroll area. */
.mobile-panel{
  top:calc(38px + var(--header-h));
  right:0;
  bottom:0;
  left:auto;
  width:min(420px,100%);
  max-width:100%;
  height:auto;
  max-height:none;
  transform:translate3d(0,-10px,0);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  overflow-x:hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;
  will-change:opacity,transform;
}
.mobile-panel.open{
  transform:translate3d(0,0,0);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.mobile-nav{width:100%;min-width:0}
.mobile-nav a{
  display:flex;
  align-items:center;
  width:100%;
  min-width:0;
  min-height:54px;
  overflow-wrap:anywhere;
}
.mobile-actions,.mobile-actions .btn{width:100%;min-width:0}
body.menu-open{
  overflow:hidden !important;
  overscroll-behavior:contain;
}
body.menu-open .floating-actions,
body.menu-open .back-top{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

/* Accessible spam field: visually hidden without positioning it
   thousands of pixels outside the viewport. */
.honeypot{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
  border:0 !important;
  left:auto !important;
}

/* Keep floating call and WhatsApp controls pinned inside the screen. */
.floating-actions{
  right:18px;
  right:calc(18px + env(safe-area-inset-right,0px));
  bottom:20px;
  bottom:calc(20px + env(safe-area-inset-bottom,0px));
  width:56px;
  max-width:56px;
  transform:translateZ(0);
  transition:opacity .2s ease,visibility .2s ease;
}
.float-btn{
  flex:0 0 auto;
  max-width:100%;
  transform:translateZ(0);
}
.float-btn .tooltip{max-width:calc(100vw - 100px)}
.back-top{
  left:18px;
  left:calc(18px + env(safe-area-inset-left,0px));
  bottom:20px;
  bottom:calc(20px + env(safe-area-inset-bottom,0px));
}

@media (max-width:600px){
  .site-header{background:#0b0b09 !important;backdrop-filter:none}
  .mobile-panel{
    top:calc(34px + var(--header-h));
    right:0;
    bottom:0;
    left:0;
    width:auto;
    max-width:none;
    padding:16px 16px calc(24px + env(safe-area-inset-bottom,0px));
    border-left:0;
    border-top:1px solid var(--line);
    border-radius:0;
    box-shadow:0 24px 60px rgba(0,0,0,.58);
    background:#0c0c09;
  }
  .mobile-nav a{font-size:1.12rem;padding:12px 4px;min-height:50px}
  .mobile-actions{margin-top:16px;gap:10px}
  .floating-actions{
    right:12px;
    right:calc(12px + env(safe-area-inset-right,0px));
    bottom:14px;
    bottom:calc(14px + env(safe-area-inset-bottom,0px));
    width:50px;
    max-width:50px;
  }
  .float-btn{width:50px;height:50px}
  .float-btn:before{inset:-4px}
  .back-top{
    left:12px;
    left:calc(12px + env(safe-area-inset-left,0px));
    bottom:14px;
    bottom:calc(14px + env(safe-area-inset-bottom,0px));
  }
}

@media (max-width:360px){
  .mobile-panel{padding-inline:12px}
  .floating-actions{
    right:10px;
    right:calc(10px + env(safe-area-inset-right,0px));
  }
  .back-top{
    left:10px;
    left:calc(10px + env(safe-area-inset-left,0px));
  }
}

/* Decorative pseudo-elements must be positioned and clipped by their own sections. */
.hero,.opening-banner{position:relative;overflow:hidden;isolation:isolate}
main,.site-footer,.cta-band,.topbar,.site-header{max-width:100%;overflow-x:clip}
@media (max-width:1080px){
  .site-header{background:#0b0b09 !important}
}
/* Visibility changes immediately; only opacity and movement animate. */
.mobile-panel{transition:opacity .22s ease,transform .22s ease}
.mobile-panel.open{transition:opacity .22s ease,transform .22s ease}