:root {
    --clr-black: #3ec9c9;
    --clr-white: #ffffff;
    --clr-light-green: #b5f1cc;
    --clr-light-pink: #ffc0d9;
    --clr-light-purple: #d0bfff;
    --clr-off-white: #f0f0f0;
    --clr-light-orenge: #ffd8c0;
    --clr-light-grey-2: #f7f7f7;
    --clr-dark-black: #27d1d1;
    --clr-light-grey: #1ad4d4;
    --clr-off-grey: #f7f7f7;
    --clr-dark-grey: #e8e8e8;
    --clr-light-blue: #9fe9f6;
    --clr-blue: #ed184f;
    --clr-ppc-black: #111;
    --heading-custom-color: #ececec;
    --custom-color: #aaaaaa;
    --clr-light-brown: #ffd8c0;
  
    --icon-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M20.746 3.329a1 1 0 0 0-1.415 0l-7.294 7.294-7.294-7.294a1 1 0 1 0-1.414 1.414l7.294 7.294-7.294 7.294a1 1 0 0 0 1.414 1.415l7.294-7.295 7.294 7.295a1 1 0 0 0 1.415-1.415l-7.295-7.294 7.295-7.294a1 1 0 0 0 0-1.414Z' fill='%230F0F0F'/%3E%3C/svg%3E");
  }  
  
  /* Our Project Slider CSS */

  .sec-our-project .our-industry-slider {
    padding: 0 15px;
  }
  
  .sec-our-project .swiper-slide {
    height: auto;
    width: 100%;
  }
  
  @media only screen and (max-width: 1599px) {
    .sec-our-project .swiper-slide {
      width: 450px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .sec-our-project .swiper-slide {
      width: 90%;
    }
  }

  .sec-our-project .ind-item {
    background-color: #212121;
    /* padding: 30px; */
    /* height: 70%; */
    border: 1px solid var(--clr-dark-black);
  }
  
  /* @media only screen and (max-width: 1599px) {
    .sec-our-project .ind-item {
      padding: 20px;
    }
  } */
  
  @media only screen and (max-width: 767px) {
    .sec-our-project .ind-item {
      padding: 14px;
    }
  }
  
  .sec-our-project .ind-item .icon-wrap {
    display: flex;
    align-items: center;
    gap: 20px;
    overflow: hidden; /* Ensures no part of the zoomed image overflows */
    display: inline-block;
  }

  .hover-zoom {
    transition: transform 0.8s ease; 
    width: 100%; 
    height: auto; 
}

.hover-zoom:hover {
    transform: scale(1.1); /* Scales the image slightly on hover */
}
  
  @media only screen and (max-width: 575px) {
    .sec-our-project .ind-item .icon-wrap {
      gap: 15px;
    }
  }
  .sec-our-project .ind-item .icon {
    width: 24px;
    height: 24px;
  }
  .sec-our-project .ind-item .icon::before {
    background-color: #ffffff;
  }
  
  .sec-our-project .indus-nav-outer {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    align-items: center;
    padding-top: 10px;
  }
  
  @media only screen and (min-width: 1500px) {
    .sec-our-project .indus-nav-outer {
      max-width: 100%;
    }
  }
  
  @media only screen and (max-width: 375px) {
    .sec-our-project .indus-nav-outer {
      flex-direction: column;
      align-items: normal;
      gap: 20px;
    }
  }
  
  .sec-our-project .indus-nav {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    position: relative;
    z-index: 3;
    margin-right: 0.75rem;
  }
  
  @media only screen and (max-width: 991px) {
    .sec-our-project .indus-nav {
      margin-right: 0;
    }
  }
  
  .sec-our-project .indus-nav .indus-btn-prev,
  .sec-our-project .indus-nav .indus-btn-next {
    height: 56px;
    width: 56px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    overflow: hidden;
    -webkit-clip-path: inset(0 round 10px);
    clip-path: inset(0 round 10px);
  }
  
  @media only screen and (max-width: 1365px) {
    .sec-our-project .indus-nav .indus-btn-prev,
    .sec-our-project .indus-nav .indus-btn-next {
      height: 48px;
      width: 48px;
    }
  }
  
  .sec-our-project .indus-nav .indus-btn-prev:hover,
  .sec-our-project .indus-nav .indus-btn-next:hover {
    box-shadow: inset 0 0 0 1px #fff;
  }
  
  .sec-our-project .indus-nav .indus-btn-prev:before,
  .sec-our-project .indus-nav .indus-btn-next:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ffffff;
    top: 0;
    left: 0;
    border-radius: 30px;
    pointer-events: none;
    transform-origin: 100% 50%;
    transform: scale3d(0, 1, 1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  
  @media only screen and (max-width: 1199px) {
    .sec-our-project .indus-nav .indus-btn-prev:before,
    .sec-our-project .indus-nav .indus-btn-next:before {
      transition: none;
    }
  }
  
  .sec-our-project .indus-nav .indus-btn-prev:hover:before,
  .sec-our-project .indus-nav .indus-btn-next:hover:before {
    transform-origin: 0% 50%;
    transform: scale3d(1, 1, 1);
  }
  
  .sec-our-project .indus-nav .indus-btn-prev span,
  .sec-our-project .indus-nav .indus-btn-prev span {
    z-index: 9;
    position: relative;
    transition: color 0.3s;
  }
  
  @media only screen and (max-width: 1199px) {
    .sec-our-project .indus-nav .indus-btn-prev span,
    .sec-our-project .indus-nav .indus-btn-prev span {
      transition: none;
    }
  }
  
  .sec-our-project .indus-nav .indus-btn-prev:hover span,
  .sec-our-project .indus-nav .indus-btn-next:hover span {
    color: #252b2b;
    position: relative;
    z-index: 2;
  }