.industries_we_serve-bottom {
  bottom: -40px;
  z-index: 3 !important;
}

.industries_we_serve .heading-container {
  padding-bottom: clamp(0rem, -1.1607rem + 4.7619vw, 3.125rem);
}

.industry-box {
  position: relative;
  overflow: hidden;
  height: clamp(11.3125rem, 8.2482rem + 12.5714vw, 19.5625rem);
  background: var(--color-4);
  border-radius: 30px;
  padding: clamp(13px, 8.9143px + 1.0476vw, 24px)
    clamp(15px, 11.6571px + 0.8571vw, 24px)
    clamp(16px, 11.4286px + 1.1429vw, 28px)
    clamp(15px, 11.6571px + 0.8571vw, 24px);
  display: flex;
  flex-direction: column;
  transition: all 0.4s ease;
}

.industry-box::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 0;
}

/* Hover without image */
.industry-box:hover::before {
  opacity: 1;
  background: #00b1ac;
}

/* Hover with image */
.industry-box.has-bg-image:hover::before {
  opacity: 1;
  background:
    linear-gradient(rgba(0, 177, 172, 0.85), rgba(0, 177, 172, 0.85)),
    var(--bg-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Keep content above overlay */
.industry-box > * {
  position: relative;
  z-index: 1;
}

/* Optional: make text/icons white on hover */
.industry-box:hover .box-content,
.industry-box:hover .box-content *,
.industry-box:hover .svg {
  color: #fff;
}

.industry-box:hover .svg img {
  filter: brightness(0) invert(1);
}

.industry-box p {
  margin-bottom: 0;
}

.industry-box .svg {
  width: 60px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.industry-box .svg img {
  width: 100%;
  height: 100%;
}

.box-content {
  color: var(--color-2);
}

/* .industry-box .box-content{
    max-width: 70%;
} */

@media (max-width: 768px) {
  .industry-box::before {
    display: none;
  }

  .industry-box:hover {
    background: var(--color-4);
  }

  .industry-box.has-bg-image:hover::before {
    opacity: 0;
    background: none;
  }

  .industry-box:hover .box-content,
  .industry-box:hover .box-content *,
  .industry-box:hover .svg {
    color: inherit;
  }

  .industry-box:hover .svg img {
    filter: none;
  }
}

/* RWD  */
@media (max-width: 768px) {
  .industry-box .svg,
  .industry-box .svg svg {
    width: 35px;
    height: 28px;
  }
  .industry-box {
    color: var(--color-2);
  }
  .industry-box br {
    display: none;
  }
}
