/* Hafiza Movers and Packers — lightweight frontend performance + motion layer */
html{scroll-behavior:smooth;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
img,video{max-width:100%}

/* Let the browser skip layout/paint work for off-screen page blocks. */
main>section:not(:first-child),
.services-section,.content-section,.content-faq,.location-section,.guide-section,
.browse-row,.knowledge-hub,.custom-footer{content-visibility:auto;contain-intrinsic-size:auto 560px}

/* Smooth blocks/cards without expensive filter animations. */
.service-tile,.browse-subcard,.hm2-service-card,.hm2-other-card,.hm2-included-card,
.hm2-guide-card,.hm2-video-card,.review-card,.content-card,.tool-panel,.faq-list details,
.location-card,.guide-card,.card{
  transform:translateZ(0);
  backface-visibility:hidden;
  transition:transform .22s cubic-bezier(.2,.7,.25,1),box-shadow .22s ease,border-color .22s ease,background-color .22s ease;
}
@media (hover:hover) and (pointer:fine){
  .service-tile:hover,.browse-subcard:hover,.hm2-service-card:hover,.hm2-other-card:hover,
  .hm2-included-card:hover,.hm2-guide-card:hover,.hm2-video-card:hover,.review-card:hover,
  .content-card:hover,.tool-panel:hover,.location-card:hover,.guide-card:hover{
    transform:translate3d(0,-3px,0);
  }
}

/* JS-driven reveal uses the Web Animations API; this class only hints compositing. */
.hm-motion-block{will-change:transform,opacity}
.hm-motion-done{will-change:auto}

/* Mobile stability and easier form interaction. */
@media (max-width:768px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  img,video,iframe,svg{max-width:100%}
  input,select,textarea{font-size:16px!important}
  button,a{touch-action:manipulation}
  .container,.hm2-container,.services-container,.content-shell>.container{max-width:100%}
  main>section:not(:first-child),.services-section,.content-section,.location-section,.guide-section,
  .browse-row,.knowledge-hub,.custom-footer{contain-intrinsic-size:auto 760px}
  /* Reduce costly decoration on smaller GPUs while keeping the same design. */
  .service-tile,.browse-subcard,.hm2-service-card,.hm2-other-card,.hm2-included-card,
  .hm2-guide-card,.hm2-video-card,.review-card,.content-card,.tool-panel,.location-card,.guide-card{
    box-shadow:0 8px 24px rgba(15,23,42,.08)
  }
}

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