/* MACASPECS mobile navigation + touch optimisation */
@media (max-width: 820px) {
  .site-header{position:sticky;top:0;z-index:1000;display:flex!important;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px!important}
  .site-header .brand{font-size:17px!important;line-height:1.05}
  .site-header .brand span{font-size:7px!important;letter-spacing:.18em}
  .site-header nav{display:none!important;position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid #e7e2d9;box-shadow:0 12px 25px rgba(0,0,0,.08);padding:8px 18px}
  .site-header.nav-open nav{display:flex!important;flex-direction:column;gap:0}
  .site-header nav a{padding:14px 4px!important;border-bottom:1px solid #eee;text-decoration:none}
  .site-header .header-btn{display:none!important}
  .mobile-menu-btn{display:flex!important;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid #ddd7cc;background:#fff;border-radius:5px;font-size:22px;cursor:pointer}
  .mobile-menu-btn span,.mobile-menu-btn span:before,.mobile-menu-btn span:after{display:block;width:18px;height:2px;background:#111;content:"";position:relative}
  .mobile-menu-btn span:before{position:absolute;top:-6px}.mobile-menu-btn span:after{position:absolute;top:6px}
  .mobile-menu-btn.open span{background:transparent}.mobile-menu-btn.open span:before{top:0;transform:rotate(45deg)}.mobile-menu-btn.open span:after{top:0;transform:rotate(-45deg)}
  .contact-hero,.booking-hero,.catalogue-hero{padding-left:5%!important;padding-right:5%!important}
  .contact-wrap,.booking-shell,.catalogue-wrap{padding-left:14px!important;padding-right:14px!important}
  button,.btn,.filter-btn,.date-btn,.time{min-height:44px}
}
@media (min-width:821px){.mobile-menu-btn{display:none!important}}
@media (max-width:520px){
  .field-grid{grid-template-columns:1fr!important}
  .field.full{grid-column:auto!important}
  .actions{flex-direction:column}
  .actions .btn,.actions button{width:100%;box-sizing:border-box;text-align:center}
  .service-grid{grid-template-columns:1fr!important}
  .choice{grid-template-columns:1fr!important}
  .times{grid-template-columns:repeat(2,1fr)!important}
  .catalogue-controls{align-items:stretch}
  .catalogue-controls input,.catalogue-controls select{width:100%;min-width:0;box-sizing:border-box}
  .filter-btn{flex:1}
  .frame-actions{grid-template-columns:1fr!important}
  .mapbox{height:250px!important}
}