/* Mobile overflow and navigation correction */
*,*::before,*::after{box-sizing:border-box}
html,body,#root{width:100%;max-width:100%;overflow-x:hidden!important}
body{position:relative}
img,video,svg,canvas,iframe{max-width:100%;height:auto}
main,section,header,footer,nav,article,aside,div{min-width:0}

/* Prevent utility containers or long content from widening the page. */
.max-w-7xl,.max-w-6xl,.max-w-5xl,.max-w-4xl,.container{width:100%!important;max-width:100%!important}
a,p,h1,h2,h3,h4,span{overflow-wrap:anywhere}

/* Keep floating actions inside the visible phone viewport. */
a[href*="wa.me"].fixed,
[data-floating-whatsapp]{
  position:fixed!important;
  right:max(14px,env(safe-area-inset-right))!important;
  bottom:max(14px,env(safe-area-inset-bottom))!important;
  left:auto!important;
  z-index:80!important;
  margin:0!important;
  transform:none!important;
}

@media (max-width:1023px){
  header,header>div,nav,nav>div{max-width:100vw!important}
  header .max-w-7xl,header .max-w-6xl,nav .max-w-7xl,nav .max-w-6xl{
    padding-left:16px!important;padding-right:16px!important
  }
  .lux-nav{width:100%!important;max-width:100vw!important}
  .lux-nav img,.logo-image,img[src*="logo"]{max-width:150px!important;height:auto!important;object-fit:contain}

  /* Mobile menu overlays the page instead of expanding its width. */
  header [class*="fixed"][class*="inset-0"],
  nav [class*="fixed"][class*="inset-0"],
  [role="dialog"]{
    width:100vw!important;max-width:100vw!important;left:0!important;right:0!important;
  }
  header [class*="absolute"][class*="right-0"],
  nav [class*="absolute"][class*="right-0"]{
    max-width:calc(100vw - 24px)!important;right:12px!important;left:auto!important
  }

  /* Hide duplicate header WhatsApp CTA; retain the accessible floating button. */
  header a[href*="wa.me"],nav a[href*="wa.me"]{display:none!important}
  a[href*="wa.me"].fixed,[data-floating-whatsapp]{display:flex!important;width:56px!important;height:56px!important;border-radius:9999px!important}

  /* Forms and CMS controls must fit narrow screens. */
  input,textarea,select,button{max-width:100%}
  form,.grid{min-width:0}
  [class*="grid-cols-"]{max-width:100%}
}

@media (max-width:480px){
  h1{font-size:clamp(2.15rem,11vw,3.35rem)!important;line-height:1.06!important}
  h2{font-size:clamp(1.75rem,8vw,2.5rem)!important;line-height:1.12!important}
  section{overflow:hidden}
  .px-8,.px-10,.px-12{padding-left:18px!important;padding-right:18px!important}
  .gap-8,.gap-10,.gap-12{gap:20px!important}
}

/* Full logo visibility in the compact mobile header */
@media (max-width:1023px){
 .lux-nav>div>div{height:112px!important;min-height:112px!important;align-items:center!important}
 .lux-nav a[aria-label*="Personal Touch"]{height:104px!important;width:190px!important;display:flex!important;align-items:center!important;overflow:visible!important;flex-shrink:1!important}
 .lux-nav a[aria-label*="Personal Touch"] img{width:100%!important;height:100%!important;max-width:190px!important;max-height:104px!important;object-fit:contain!important;object-position:center!important;display:block!important}
 .lux-nav button.lux-quote-btn{padding:13px 16px!important;font-size:14px!important;min-width:0!important}
}
@media(max-width:420px){
 .lux-nav a[aria-label*="Personal Touch"]{width:150px!important;height:98px!important}
 .lux-nav a[aria-label*="Personal Touch"] img{max-width:150px!important;max-height:98px!important}
}
/* Definitive compact mobile header fix */
@media (max-width:1023px){
 .lux-nav>div>div{height:104px!important;min-height:104px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;gap:10px!important;padding-top:0!important;padding-bottom:0!important;overflow:visible!important}
 .lux-nav>div>div>.lux-quote-btn{display:none!important}
 .lux-nav a[aria-label="The Personal Touch home"]{width:190px!important;max-width:calc(100vw - 90px)!important;height:100px!important;overflow:visible!important;justify-self:start!important}
 .lux-nav a[aria-label="The Personal Touch home"] img{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:left center!important}
 .lux-nav button[aria-label="Open menu"],.lux-nav button[aria-label="Close menu"]{justify-self:end!important;width:48px!important;height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important}
}
@media(max-width:390px){.lux-nav a[aria-label="The Personal Touch home"]{width:165px!important}}