/*****************************
*	Hero Slider Optimizations
*	Reduced height for better viewport fit
******************************/

/* Reduce hero section height for better viewport fit */
.hero-single {
  padding-top: 100px !important;
  padding-bottom: 140px !important;
  min-height: auto !important;
}

/* Optimize hero content spacing */
.hero-single .hero-content {
  padding: 20px 0;
}

.hero-single .hero-content .hero-title {
  font-size: 56px !important;
  margin: 15px 0 !important;
  line-height: 1.2 !important;
}

.hero-single .hero-content .hero-sub-title {
  margin-bottom: 8px !important;
}

.hero-single .hero-content p {
  margin-bottom: 20px !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

/* Optimize background image display */
.hero-single {
  background-position: center center !important;
  background-size: cover !important;
  object-fit: cover !important;
}

/* Ensure hero fits within viewport on most screens */
@media (min-width: 1200px) {
  .hero-single {
    max-height: calc(100vh - 80px);
  }
}

/* Tablet optimization */
@media (max-width: 991px) {
  .hero-single {
    padding-top: 80px !important;
    padding-bottom: 100px !important;
  }
  
  .hero-single .hero-content .hero-title {
    font-size: 42px !important;
    margin: 12px 0 !important;
  }
  
  .hero-single .hero-content p {
    font-size: 15px !important;
  }
}

/* Mobile optimization */
@media (max-width: 767px) {
  .hero-single {
    padding-top: 60px !important;
    padding-bottom: 80px !important;
  }
  
  .hero-single .hero-content .hero-title {
    font-size: 32px !important;
    margin: 10px 0 !important;
  }
  
  .hero-single .hero-content p {
    font-size: 14px !important;
    margin-bottom: 15px !important;
  }
  
  .hero-single .hero-content .hero-btn {
    margin-top: 15px !important;
  }
}

/* Small mobile */
@media (max-width: 575px) {
  .hero-single {
    padding-top: 50px !important;
    padding-bottom: 60px !important;
  }
  
  .hero-single .hero-content .hero-title {
    font-size: 28px !important;
  }
}

/* Improve overlay gradient for better text readability */
.hero-single::before {
  background: linear-gradient(135deg, rgba(11, 28, 57, 0.85) 0%, rgba(11, 28, 57, 0.65) 100%) !important;
}

/* Optimize button spacing */
.hero-single .hero-content .hero-btn {
  margin-top: 20px;
}

/* Ensure smooth transitions */
.hero-single,
.hero-single .hero-content .hero-title,
.hero-single .hero-content p {
  transition: all 0.3s ease-in-out;
}

/* Better focus on content - reduce bottom padding more aggressively if needed */
@media (min-height: 600px) and (max-height: 800px) {
  .hero-single {
    padding-top: 80px !important;
    padding-bottom: 100px !important;
  }
}

/* For very short viewports */
@media (max-height: 600px) {
  .hero-single {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  
  .hero-single .hero-content .hero-title {
    font-size: 42px !important;
    margin: 10px 0 !important;
  }
  
  .hero-single .hero-content p {
    margin-bottom: 12px !important;
  }
}
