/* HERO BACKGROUND IMAGE - RESPONSIVE */
.home.hero-bg,
#home.hero-bg {
  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
    url("/assets/images/hero/homepage/hero-mobile.webp");
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: #333;
  min-height: 100vh !important;
  height: 100vh !important;
  width: 100vw !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
@media (max-width: 767px) {
  #home.hero-bg {
    padding-top: 60px !important;
  }
}
@media (min-width: 768px) {
  #home.hero-bg {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
      url("/assets/images/hero/homepage/hero-tablet.webp");
  }
  .md\:text-6xl {
    font-size: 3.75rem !important;
  }
  #home .md\:text-6xl {
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.5) !important;
  }
}
@media (min-width: 1024px) and (max-width: 1366px) {
  #home.hero-bg {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
      url("/assets/images/hero/homepage/hero-tablet.webp");
  }
}
@media (min-width: 1280px) {
  #home.hero-bg {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
      url("/assets/images/hero/homepage/hero.webp");
  }
}

.hero-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.lg\:text-3xl {
  font-size: 2.25rem !important;
  line-height: 2.25rem !important;
}
#home .lg\:text-8xl {
  text-shadow: 0 5px 10px rgba(0, 0, 0, 0.5) !important;
}
.text-4xl {
  font-size: 2.25rem !important;
}
#home .text-4xl {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) !important;
}
@media (min-width: 640px) {
  #home .sm\:text-5xl {
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.5) !important;
  }
}
.leading-tight {
  line-height: 1.25 !important;
}
/* --- End Inlined Hero Section Styles --- */

/* HERO SECTION DIMENSION CONTROLS */
#home.hero-bg {
  /* These important flags override any conflicting styles */
  background-repeat: no-repeat !important;
  min-height: 100vh !important;
}

/* Hero background image sizing */
#home.hero-bg .hero-bg-img,
.hero-bg-img {
  width: 100vw !important;
  height: 100vh !important;
  min-width: 100vw !important;
  min-height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* General hero image sizing for reuse elsewhere */
.hero-bg-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.cbp-hero {
  margin-bottom: 1.5rem;
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1.2;
}
@media (min-width: 640px) {
  .cbp-hero {
    font-size: 3rem;
  }
}
@media (min-width: 1050px) {
  .cbp-hero {
    font-size: 3.75rem;
  }
}
.hero-tagline {
  color: #fff;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
  font-size: 1.75rem;
}
@media (min-width: 640px) {
  .hero-tagline {
    font-size: 2rem;
  }
}
@media (min-width: 1030px) {
  .hero-tagline {
    font-size: 3rem;
  }
}
/* Hero Stats Styling */
.stats-h3 {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  line-height: 1.1;
  color: #fff;
}

@media (min-width: 640px) {
  .stats-h3 {
    font-size: 1.75rem;
  }
}

@media (min-width: 1030px) {
  .stats-h3 {
    font-size: 2.25rem;
  }
}

.stats-desc {
  font-size: 0.875rem;
  opacity: 0.9;
  line-height: 1.2;
  color: #fff;
}

@media (min-width: 640px) {
  .stats-desc {
    font-size: 1rem;
  }
}

/* Hero Stats Layout Options */
.hero-stats-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  max-width: 64rem;
  margin: 0 auto;
}

@media (min-width: 640px) {
  .hero-stats-container {
    gap: 1.5rem;
  }
}

/* Force 2x2 grid layout */
.stats-grid-2x2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  max-width: 32rem;
  margin: 0 auto;
}

@media (min-width: 640px) {
  .stats-grid-2x2 {
    gap: 1.5rem;
  }
}

/* Force 1x4 row layout */
.stats-grid-1x4 {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  overflow-x: auto;
  max-width: 64rem;
  margin: 0 auto;
}

@media (min-width: 640px) {
  .stats-grid-1x4 {
    gap: 1.5rem;
  }
}

@media (max-width: 639px) {
  .stats-grid-1x4 {
    flex-wrap: wrap;
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Stats Layout Responsive Breakpoint at 650px */
@media (min-width: 600px) {
  .stats-single-row {
    display: block !important;
  }

  .stats-paired-rows {
    display: none !important;
  }
}

@media (max-width: 649px) {
  .stats-single-row {
    display: none !important;
  }

  .stats-paired-rows {
    display: flex !important;
  }
}