/* v349G — Force-tighten Main services landmark block.
   User request: remove the large empty white space and let the artwork sit much
   closer to the 4 service cards, with a slight overlap hidden behind the cards. */

.home-page .home-service-routes{
  padding-bottom: 28px !important;
}

.home-page .home-service-routes::before{
  left: 50% !important;
  bottom: -18px !important;
  width: min(88vw, 1500px) !important;
  height: clamp(300px, 23vw, 380px) !important;
  transform: translateX(-50%) !important;
  background-position: center bottom !important;
  background-size: 100% auto !important;
  opacity: .76 !important;
}

.home-page .home-service-routes::after{
  left: 50% !important;
  bottom: 0 !important;
  width: min(88vw, 1500px) !important;
  height: clamp(300px, 23vw, 380px) !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.02) 16%, rgba(255,255,255,.10) 40%, rgba(255,255,255,.58) 100%) !important;
}

.home-page .home-service-routes .home-route-grid{
  margin-bottom: -8px !important;
}

@media (max-width: 980px){
  .home-page .home-service-routes{
    padding-bottom: 22px !important;
  }

  .home-page .home-service-routes::before{
    width: 94vw !important;
    height: clamp(210px, 25vw, 270px) !important;
    bottom: -14px !important;
    opacity: .68 !important;
  }

  .home-page .home-service-routes::after{
    width: 94vw !important;
    height: clamp(210px, 25vw, 270px) !important;
  }
}

@media (max-width: 640px){
  .home-page .home-service-routes{
    padding-bottom: 18px !important;
  }

  .home-page .home-service-routes::before{
    width: 96vw !important;
    height: clamp(145px, 31vw, 190px) !important;
    bottom: -8px !important;
    opacity: .60 !important;
  }

  .home-page .home-service-routes::after{
    width: 96vw !important;
    height: clamp(145px, 31vw, 190px) !important;
  }
}
