/* Advanced Desktop Full Resolution Fix */
@media screen and (min-width: 992px) {
  /* Targets both the main hero and any slider wrappers forcing a height */
  .hero, 
  .hero .swiper-container, 
  .hero .swiper-wrapper, 
  .hero .swiper-slide {
    height: auto !important;
    max-height: none !important;
  }

  .hero .hero-content {
    /* 1. Reset standard rigid layout dimensions */
    padding: 0 !important;
    height: auto !important;
    max-height: none !important;
    
    /* 2. Scale the container proportionally to the width of the screen */
    /* This creates a fluid block matching standard high-res banner ratios */
    min-height: 500px !important; 
    
    /* 3. Force the layout engine to favor viewing the entire image asset */
    background-size: 100% 100% !important; /* Stretches the image to fill the container perfectly */
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
}
/* Mobile Responsive Hero Banner Fix */
@media screen and (max-width: 991px) {
  .hero .hero-content {
    /* Changes padding so the background doesn't stretch out too high on mobile */
    padding: 100px 0 60px !important; 
    
    /* Forces the full width image to fit inside the screen without cropping */
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    
    /* Ensures the container height auto-adjusts to the image */
    height: auto !important;
    min-height: 250px !important; 
  }
}
