::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar-track {
  background: #434857;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(to top, #00AEEF, #003366);
  border-radius: 5px;
}

html {
  scroll-padding-top: 80px;
}

#about,
#service,
#client,
#why-us,
#certificate,
#contact {
  padding-top: 80px;
}

.fs-18 {
  font-size: 18px !important;
}
.fs-15 {
  font-size: 15px !important;
}

.fs-20 {
  font-size: 20px !important;
}

.justify {
  text-align: justify !important;
}

/* .g-5 {
  gap: 25px;
} */

.box-bg-animate {
  width: 156px;
  height: 156px;
  border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bs-secondary);
  background: var(--bs-primary);
  animation-name: icon-animat;
  animation-duration: 5s;
  animation-delay: 1s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  transition: 0.5s;
}

.categories-carousel .owl-nav .owl-prev,
.categories-carousel .owl-nav .owl-next {
  position: absolute;
  top: -65px;
  padding: 10px 35px;
  color: var(--bs-white);
  background: var(--bs-primary);
  border-radius: 50px;
  transition: 0.5s;
}

.categories-carousel .owl-nav .owl-prev {
  left: 0 !important;
}

.categories-carousel .owl-nav .owl-next {
  right: 0;
}

.categories-carousel .owl-nav .owl-prev:hover,
.categories-carousel .owl-nav .owl-next:hover {
  background: var(--bs-secondary);
  color: var(--bs-white);
}


.whatsapp-float {
      position: fixed;
      bottom: 40px;
      left: 20px;
      z-index: 9999;
    }

    .whatsapp-float a {
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: #25d366;
      color: white;
      width: 60px;
      height: 60px;
      border-radius: 50%;
      text-align: center;
      font-size: 30px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
      animation: popupLoop 2s ease-in-out infinite;
      text-decoration: none;
      transition: transform 0.3s;
    }

    .whatsapp-float a:hover {
      transform: scale(1.1);
    }

    @keyframes popupLoop {
      0%, 100% {
        transform: scale(1);
      }
      50% {
        transform: scale(1.15);
      }
    }
    
        /* Tooltip Styling */
    .whatsapp-float a::after {
      content: "💬 Chat with us on WhatsApp";
      position: absolute;
      left: 70px;
      white-space: nowrap;
      background-color: #333;
      color: #fff;
      padding: 8px 12px;
      border-radius: 6px;
      font-size: 14px;
      opacity: 0;
      pointer-events: none;
      transform: translateY(-50%);
      top: 50%;
      transition: 0.3s ease;
    }

    .whatsapp-float a:hover::after {
      opacity: 1;
    }
