/* —— Hero Slider Full‑Width Reset —— */
.hero-slider-module {
  width: 100vw;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

.hero-slider-module .container {
  max-width: 100%;
  padding: 0;
}

/* —— Banner Structure —— */
.hero-slider-module .hero-banner { position: relative; }
.hero-slider-module .hero-slider { overflow: hidden; }
.hero-slider-module .hero-slider-box { position: relative; }

.hero-slider-module .hero-slider-box:after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(180deg, #151e1b 0%, rgba(21, 30, 27, 0.4) 100%);
}

/* remove default figure spacing */
.hero-slider-module .hero-slider-box figure {
  margin: 0;
  padding: 0;
}

/* —— Slide Image —— */
.hero-slider-module .hero-slider-box img {
  display: block;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  object-fit: cover;
}

/* —— Centered Text —— */
.hero-slider-module .hero-center {
  position: absolute;
  top: 50%; left: 0; right: 0;
  transform: translateY(-50%);
  z-index: 5;
}

/* —— Text Container —— */
/* uncomment & tweak as needed
.hero-slider-module .banner-data {
  max-width: 770px;
  width: 100%;
  margin: 0 auto;
}
*/

/* —— Headings & Copy —— */
.hero-slider-module .banner-data h2 {
  margin: 0 0 16px;
  font-weight: 600;
  font-size: 24px;
  line-height: 34px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
}

.hero-slider-module .banner-data h1,
.hero-slider-module .banner-data h3 {
  margin: 0 0 16px;
  font-weight: 800;
  font-size: 80px;
  line-height: 86px;
  letter-spacing: -0.03em;
  color: #fff !important;
}

.hero-slider-module .banner-data p {
  margin: 0 0 40px;
  font-weight: 500;
  font-size: 18px;
  line-height: 28px;
  letter-spacing: -0.02em;
  color: #fff;
}

/* —— Scoped Link Styles —— */
.hero-slider-module .banner-data a,
.hero-slider-module .banner-data a:link {
  margin: 0 0 40px;
  font-weight: 500;
  font-size: 18px;
  line-height: 28px;
  letter-spacing: -0.02em;
  color: #fff;
}

/* —— Button —— */
.hero-slider-module .btn-main {
  display: table;
  padding: 16px 35px;
  background: #72b6af;
  border-radius: 4px;
  font-weight: 600;
  font-size: 18px;
  color: #fff;
  text-decoration: none;
}
.hero-slider-module .btn-main i { margin-left: 10px; }
.hero-slider-module .btn-main:hover { background: #151e1b; }

/* —— Tablet & Small Laptop (≤48rem / 768px) —— */
@media (max-width: 48rem) {
  .hero-slider-module .banner-data h1 {
    font-size: 3rem; line-height: 1.2;
  }
  .hero-slider-module .banner-data h2 {
    font-size: 1.25rem; line-height: 1.3;
  }
  .hero-slider-module .banner-data p {
    font-size: 1rem; margin-bottom: 1.5rem; line-height: 1.4;
  }
  .hero-slider-module .btn-main {
    font-size: 1rem; padding: 0.75rem 1.75rem;
  }
}

/* —— Phone (≤30rem / 480px) —— */
@media (max-width: 30rem) {
  .hero-slider-module .banner-data {
    padding: 0 1rem;
  }
  .hero-slider-module .banner-data h1 {
    font-size: 2rem; line-height: 1.2;
  }
  .hero-slider-module .banner-data h2 {
    font-size: 1rem; line-height: 1.3;
  }
  .hero-slider-module .banner-data p {
    font-size: 0.875rem; margin-bottom: 1.25rem; line-height: 1.4;
  }
  .hero-slider-module .btn-main {
    font-size: 0.875rem; padding: 0.625rem 1.5rem;
  }
} /* ← Make sure this closes the media query */
