/* Hero Section Mobile Fixes */

/* Default Desktop Styles */
.slider-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-bottom: 0 !important;
}

.slider-container.slider-hero-section2 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#navbarVacuum {
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Stats container fix */
.stats-container {
  top: -100px;
  z-index: 8;
}

.stats-container.page-has-hero-section-2 {
  top: 0;
}

@media (max-width: 991px) {
  /* Hero Section 2 Layout Fix */
  .slider-container.slider-hero-section2 {
    padding: 80px 0 120px 0 !important;
    margin-top: 0 !important;
  }

  .slider-container {
    padding: 60px 0 100px 0 !important;
    margin-top: 0 !important;
  }

  .slider-container .container {
    padding: 0 15px !important;
  }

  .slider-container .slider-content {
    padding: 40px 0 !important;
    margin: 0 !important;
  }

  /* Fix flex-column-reverse on mobile */
  .hero-section2.flex-column-reverse {
    flex-direction: column !important;
  }

  .hero-section2 .col-12.col-md-7.col-lg-6 {
    order: 2;
    padding: 20px 0;
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero-section2 .col-12.col-md-5.col-lg-6 {
    order: 1;
    padding: 20px 0;
    margin-bottom: 30px;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Title styling on mobile */
  .hero-section2 h1 {
    font-size: 28px !important;
    line-height: 1.5 !important;
    margin-bottom: 20px;
    word-wrap: break-word;
    word-break: break-word;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  }

  /* Description text */
  .hero-section2 .slide-hint {
    font-size: 14px !important;
    line-height: 1.8 !important;
    margin-top: 20px !important;
    word-wrap: break-word;
    word-break: break-word;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  }

  /* Video/Image container */
  .hero-section2 lottie-player,
  .hero-section2 img {
    max-width: 100% !important;
    height: auto !important;
    width: 100% !important;
    display: block;
  }

  .hero-section2 .img-cover {
    object-fit: contain;
  }

  /* Row alignment */
  .hero-section2.row {
    margin: 0 !important;
  }

  .hero-section2.align-items-center {
    align-items: flex-start !important;
  }
}

@media (max-width: 768px) {
  .slider-container.slider-hero-section2 {
    padding: 40px 0 50px 0 !important;
  }

  .slider-container {
    padding: 30px 0 40px 0 !important;
  }

  .slider-container .container {
    padding: 0 10px !important;
  }

  .slider-container .slider-content {
    padding: 30px 0 !important;
  }

  .hero-section2 h1 {
    font-size: 24px !important;
  }

  .hero-section2 .col-12.col-md-5.col-lg-6 {
    margin-bottom: 20px;
  }
}

@media (max-width: 576px) {
  .slider-container {
    padding: 30px 0 40px 0 !important;
  }

  .slider-container.slider-hero-section2 {
    padding: 40px 0 60px 0 !important;
  }

  .slider-container .container {
    padding: 0 20px !important;
  }

  .slider-container .slider-content {
    padding: 30px 20px !important;
    margin: 0 !important;
  }

  .hero-section2 h1 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin-bottom: 12px;
    padding: 0 10px !important;
  }

  .hero-section2 .slide-hint {
    font-size: 13px !important;
    line-height: 1.5 !important;
    padding: 0 10px !important;
  }

  .hero-section2 .col-12 {
    margin-bottom: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Container adjustments */
  .slider-container .container {
    padding: 0 15px !important;
  }

  .hero-section2.row {
    padding: 0 !important;
    margin: 0 !important;
  }
}

/* Responsive grid adjustments */
@media (max-width: 991px) {
  .col-12.col-md-7.col-lg-6 {
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 30px !important;
  }

  .col-12.col-md-5.col-lg-6 {
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
  }

  .col-12 {
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* Small Mobile Devices (< 576px) */
@media (max-width: 575px) {
  .slider-container.slider-hero-section2 {
    padding: 60px 0 90px 0 !important;
  }

  .slider-container {
    padding: 50px 0 80px 0 !important;
  }

  .hero-section2 h1 {
    font-size: 22px !important;
    line-height: 1.5 !important;
  }

  .hero-section2 .slide-hint {
    font-size: 13px !important;
    line-height: 1.8 !important;
  }
}

/* RTL Support */
body.rtl .hero-section2 {
  direction: rtl;
  text-align: right;
}

body.rtl .hero-section2 h1 {
  text-align: right;
}

body.rtl .hero-section2 p {
  text-align: right;
}

body.ltr .hero-section2 {
  direction: ltr;
  text-align: left;
}

body.ltr .hero-section2 h1 {
  text-align: left;
}

body.ltr .hero-section2 p {
  text-align: left;
}
