/* Mobile storefront layout. Loaded last to resolve legacy overrides. */
@media (max-width:900px){
 html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{min-width:0}
 .wrap{width:calc(100% - 32px)!important;max-width:100%!important}
 .headerMain{grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"brand icons" "search search"!important;min-height:0!important;padding:10px 0 12px!important;gap:8px 12px!important}
 .brandLogo{grid-area:brand!important;justify-self:start!important;justify-content:flex-start!important;width:auto!important;min-width:0!important;height:60px!important;padding:0!important}
 .brandLogo img{width:150px!important;max-width:100%!important;max-height:60px!important;object-fit:contain!important}
 .headerIcons{grid-area:icons!important;justify-self:end!important;gap:8px!important}
 .headerIcon{width:44px!important;height:44px!important}
 .headerSearch{grid-area:search!important;width:100%!important;height:48px!important;margin:0!important}
 .headerSearch input{font-size:16px!important;padding:0 54px 0 12px!important}
 .headerSearch button{top:2px!important;right:2px!important;width:42px!important;height:42px!important}
 .mainNav{overflow:hidden!important}
 .navInner{width:100%!important;min-height:48px!important;gap:22px!important;padding:0 16px!important;justify-content:flex-start!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin;overscroll-behavior-x:contain}
 .navInner a{flex:0 0 auto!important;min-height:48px!important;font-size:12px!important;white-space:nowrap!important}
 .navInner a.active:after{bottom:5px!important}
 main,.catalogMain,.detailCopy,.specGrid>*,.sectionHeading>*{min-width:0}
 .homeHero{padding:32px 0!important;min-height:0!important}
 .homeHeroInner{padding:0!important;min-height:0!important}
 .homeHero h1{font-size:clamp(32px,8.8vw,48px)!important;line-height:1.08!important;letter-spacing:-.025em!important;margin:14px 0 18px!important;overflow-wrap:break-word}
 .homeHero p{font-size:15px!important;line-height:1.6!important;max-width:100%!important;margin:0 0 20px!important}
 .homeHeroActions{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:10px!important}
 .primaryBtn,.secondaryBtn{display:flex!important;justify-content:center!important;align-items:center!important;width:100%!important;min-width:0!important;min-height:48px!important;padding:12px!important;font-size:12px!important;white-space:normal!important;text-align:center}
 .homeSection{padding:32px 0!important}
 .sectionHeading{gap:16px!important;align-items:flex-start!important;flex-wrap:wrap!important;margin-bottom:20px!important}
 .sectionHeading h2{font-size:32px!important;line-height:1.1!important}
 .sectionHeading p{font-size:14px!important;line-height:1.5!important}
 .sectionHeading>a{display:inline-flex!important;align-items:center;min-height:44px!important;font-size:12px!important}
 .categoryGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
 .categoryCard{min-width:0!important;padding:18px 14px!important}
 .categoryCard strong{font-size:24px!important;overflow-wrap:break-word}
 .categoryCard span{font-size:12px!important;line-height:1.5!important}
 .catalogPage{padding:24px 0 36px!important}
 .catalogPage:before,.catalogPage:after{display:none!important}
 .catalogHeadingRow{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;margin-bottom:20px!important;padding:0!important;min-height:0!important;background:none!important}
 .catalogTitle{font-size:32px!important;line-height:1.1!important;margin:10px 0!important;overflow-wrap:break-word}
 .catalogHeadingRow:before,.catalogHeadingRow:after{display:none!important}
 .breadcrumb,.productCrumb{font-size:12px!important;line-height:1.6!important;overflow-wrap:anywhere}
 .sortBox{width:100%!important;min-width:0!important;height:46px!important;margin:0!important;justify-self:stretch!important}
 .sortBox select{width:100%!important;height:100%!important;font-size:16px!important;padding:0 40px 0 14px!important}
 .catalogLayout{display:block!important}
 .catalogUtility{min-height:44px!important;margin-bottom:16px!important;gap:12px!important}
 .resultInfo{font-size:13px!important;line-height:1.4!important}
 .mobileFilterButton{min-height:44px!important;min-width:92px!important;font-size:13px!important;padding:10px 18px!important}
 #catalogSidebar{height:100vh!important;height:100dvh!important;max-height:100dvh!important;width:min(88vw,380px)!important;transform:translate3d(-110%,0,0)!important;visibility:hidden;pointer-events:none}
 #catalogSidebar.open{transform:translate3d(0,0,0)!important;visibility:visible;pointer-events:auto}
 #catalogSidebar .filterScrollBody{padding-bottom:calc(32px + env(safe-area-inset-bottom))!important}
 .filterClose{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;font-size:28px!important}
 .sideLinks button,.filterOptions button,.clearFilters{min-height:44px!important;font-size:15px!important;line-height:1.4!important}
 .filterLabel{font-size:13px!important}
 .filterHeading{font-size:26px!important}
 .productGrid,.featuredGrid,.relatedGrid,#featuredGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px 12px!important;grid-auto-rows:auto!important}
 .productCard{min-width:0!important;padding:0!important;contain:layout style!important;content-visibility:visible!important;transform:none!important}
 .productCard .productMedia{width:100%!important;height:auto!important;aspect-ratio:1/1!important;min-height:0!important;padding:8px!important;margin:0!important}
 .productCard .productMedia img,.productCard.sg-submersible .productMedia img{width:96%!important;height:96%!important;max-width:96%!important;max-height:96%!important;object-fit:contain!important;transform:none!important}
 .productCard .productBody{padding:14px 10px 12px!important;min-height:0!important;gap:0!important}
 .productCard .productTitle{display:block!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;overflow-wrap:break-word;min-height:0!important;height:auto!important;font-size:16px!important;line-height:1.3!important;margin-bottom:12px!important}
 .productCard .productCash{font-size:12px!important;line-height:1.45!important;min-height:0!important}
 .productCard .productBody .productAction{font-size:12px!important;line-height:1.4!important;min-height:48px!important;margin-top:14px!important;padding:10px 6px!important;gap:5px!important}
 .productActionIcon{width:16px!important;height:16px!important;flex-basis:16px!important}
 .pagination{gap:4px!important;flex-wrap:wrap!important}
 .pagination button{min-width:44px!important;min-height:44px!important}
 .productPage{padding-top:20px!important}
 .productDetail{grid-template-columns:minmax(0,1fr)!important;gap:24px!important}
 .detailMedia{width:100%!important;height:auto!important;aspect-ratio:1/1!important;min-height:0!important;max-height:420px!important;padding:16px!important}
 .detailMedia img,.productPageBody.sg-submersible-product .detailMedia img{width:96%!important;height:96%!important;max-width:96%!important;max-height:96%!important;object-fit:contain!important;transform:none!important}
 .detailTitle{font-size:32px!important;line-height:1.15!important;overflow-wrap:break-word}
 .detailMeta,.shippingTitle{font-size:13px!important}
 .deliveryBox b,.shippingCard b{font-size:14px!important}
 .deliveryBox span,.shippingCard span{font-size:13px!important;line-height:1.5!important}
 .detailAdd,.detailWhatsapp,.productHelp a{width:100%!important;min-height:48px!important;font-size:14px!important;white-space:normal!important;padding:12px!important}
 .shippingCards,.specGrid{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
 .specSection,.relatedSection{padding:30px 0!important}
 .specSection h2,.relatedSection h2{font-size:30px!important;line-height:1.2!important}
 .specList li{font-size:14px!important;gap:12px!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
 .specList li>*{min-width:0;overflow-wrap:anywhere}
 .contactPageMain{padding:30px 0!important}
 .contactIntro h1{font-size:clamp(32px,9vw,46px)!important;line-height:1.12!important}
 .contactIntro p{font-size:15px!important;line-height:1.6!important}
 .contactGrid,.infoGrid{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
 .contactCard{min-width:0!important;padding:24px 20px!important}
 .contactCard h2{font-size:30px!important;overflow-wrap:anywhere}
 .contactCard p,.infoCard p,.productHelp p{font-size:14px!important;line-height:1.6!important}
 .contactCard a{display:inline-flex!important;align-items:center!important;min-height:44px!important;font-size:13px!important}
 .infoCard b{font-size:26px!important}
 .trustGrid{grid-template-columns:minmax(0,1fr)!important;padding:24px 16px!important;gap:20px!important}
 .trustItem b{font-size:20px!important}
 .trustItem span{font-size:13px!important;line-height:1.5!important}
 .footerTop{grid-template-columns:minmax(0,1fr)!important;gap:24px!important}
 .siteFooter p,.siteFooter span,.siteFooter a{font-size:13px!important;line-height:1.6!important;overflow-wrap:anywhere}
 .siteFooter a{display:block;min-height:36px;padding:6px 0}
 .siteFooter h3{font-size:15px!important}
 .footerBottom{flex-direction:column!important;align-items:flex-start!important;gap:16px!important}
 .footerPayments{flex-wrap:wrap!important;gap:8px!important}
 .floatingWhatsapp{right:max(12px,env(safe-area-inset-right))!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:48px!important;height:48px!important}
 .siteFooter{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important}
 input,select,textarea{font-size:16px!important}
 button,a,input,select{touch-action:manipulation}
}
@media(max-width:350px){
 .wrap{width:calc(100% - 24px)!important}
 .productGrid,.featuredGrid,.relatedGrid,#featuredGrid{grid-template-columns:minmax(0,1fr)!important}
 .productCard .productMedia{aspect-ratio:4/3!important}
 .categoryGrid{grid-template-columns:minmax(0,1fr)!important}
}
@media(prefers-reduced-motion:reduce){
 .tickerTrack{animation:none!important}
 .motionReveal,.sg-scroll-reveal{opacity:1!important;transform:none!important;transition:none!important}
}

@media(max-width:900px){
 body.filters-open .catalogPage>.wrap{z-index:10003!important}
 body.filters-open .storeHeader{z-index:0!important}
 body.filters-open .floatingWhatsapp{visibility:hidden!important}
 .storeHeader .navInner{min-height:48px!important;gap:22px!important;padding:0 16px!important}
 .storeHeader .navInner a{min-height:48px!important;font-size:12px!important}
 .productCard .productBody .productAction span{flex:1 1 0!important;min-width:0!important;white-space:normal!important;overflow-wrap:normal!important}
 .productCard .productBody .productAction svg{flex:0 0 16px!important}
 .homePage .homeHero h1{font-size:clamp(32px,8.8vw,48px)!important}
 .homePage .homeHero p{font-size:15px!important}
 .homePage .homeHero .primaryBtn,.homePage .homeHero .secondaryBtn{font-size:12px!important}
 .shopPage .catalogTitle{line-height:1.1!important}
}

@media(max-width:900px){
 .homePage .homeHero .homeHeroActions .primaryBtn,.homePage .homeHero .homeHeroActions .secondaryBtn{display:flex!important;min-height:48px!important;height:auto!important;padding:12px!important;align-items:center!important;justify-content:center!important;border-radius:12px!important}
 .homeHero:before,.homeHero:after,.productPage:before,.productPage:after,.contactPageMain:before,.contactPageMain:after{display:none!important}
 .contactCard:before,.contactCard:after,.infoCard:before,.infoCard:after{display:none!important}
 .motionReveal,.sg-scroll-reveal{opacity:1!important;transform:none!important;transition:none!important}
 .productCrumb{margin:0 0 18px!important;color:#52667f!important}
 .productPage .detailTitle{line-height:1.15!important}
 .categoryGrid .categoryCard{font-size:18px!important;line-height:1.3!important;min-height:80px!important;display:flex!important;align-items:center!important;overflow-wrap:anywhere}
}

/* Balance both sides of the mobile logo so it sits at the screen center. */
@media (max-width:900px){
 .storeHeader .headerMain{
  grid-template-columns:44px minmax(0,1fr) 44px!important;
  grid-template-areas:". brand icons" "search search search"!important;
 }
 .storeHeader .headerMain .brandLogo{
  justify-self:center!important;justify-content:center!important;
  width:100%!important;max-width:150px!important;
 }
 .storeHeader .headerMain .brandLogo img{display:block!important;margin:0 auto!important}
}