html {
  scroll-behavior: smooth;
}
section {
  scroll-margin-top: 90px; 
}

 /* navbar */
 .navbar-toggler {
   border: 5px solid rgb(122, 7, 179) !important;
   border-radius: 50% !important;
   padding: 0.25rem;
   width: 50px;
   height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .navbar-toggler-icon {
   filter: invert(0.8);
 }

 .gallery-img {
   cursor: pointer;
   transition: 0.3s;
   border-radius: 8px;
 }

 .gallery-img:hover {
   box-shadow: 0 8px 30px rgba(24, 24, 24, 0.8);
   transform: scale(1.05);
   border-radius: 5px;
   filter: brightness(0.5);
   transform: scale(1.05);
 }

 .modal-content {
   background: transparent;
   border: none;
 }

 .modal-img {
   width: 100%;
   border-radius: 10px;
 }

 .btn-close {
   background-color: white !important;
   border-radius: 50%;
   opacity: 1;
   padding: 8px;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
   z-index: 1055;
 }

 /* devider */
 .custom-hr {
   width: 200px;
   height: 15px;
   background-color: hsl(280, 81%, 52%);
   border: none;
   border-radius: 3px;
   text-align: center;
 }

 /* font */
 h2,
 h3,
 h4 {
   font-family: 'Merriweather', serif;
   color: #2d4d1f;
 }

 p,
 li {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
 }

 .navbar .nav-link:hover {
   color: #ee2020 !important;
   /* hover color */
 }

 /* fixed btn */
 .fab-container {
   position: fixed;
   bottom: 20px;
   right: 20px;
   z-index: 1050;
 }

 .fab-btn {
   width: 55px;
   height: 55px;
   border-radius: 50%;
   background-color: #eb8f2e;
   color: #f9f9f9;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 22px;
   box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
 }
 /* model */
 .modal-content {
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
 }
 .object-fit-cover {
   object-fit: cover;
 }
 .btn-light {
   border-radius: 50px;
   padding: 10px 25px;
 }
.service-box {
  color: #fff;
  border-radius: 8px;
  padding: 20px;
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.service-box::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: conic-gradient(from 0deg,
      rgba(255, 65, 108, 0.4),
      rgba(255, 196, 0, 0.4),
      rgba(0, 200, 255, 0.4),
      rgba(255, 65, 108, 0.4));
  border-radius: 50%;
  animation: waveRotate 6s linear infinite;
  opacity: 0;
  z-index: -1;
  transition: opacity 0.4s ease;
}

.service-box:hover {
  background: linear-gradient(135deg, #2bd5ff, #ff416c);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3);
}

.service-box:hover::after {
  opacity: 1;
}

@keyframes waveRotate {
  0% {
    transform: rotate(0deg) scale(1);
  }
  100% {
    transform: rotate(360deg) scale(1.2);
  }
}

 /* circle positioon abslute */
 .circle {
   position: absolute;
   top: -30px;
   left: -30px;
   width: 100px;
   height: 100px;
   border: 10px solid #fa0303;
   box-shadow: 0 4px 10px rgba(238, 12, 12, 0.2);
 }

 /* video */

 /* footer icone */
 .footer-link {
   color: #ccc;
   text-decoration: none;
   display: block;
   margin-bottom: 6px;
   transition: color 0.3s;
 }

 .footer-link:hover {
   color: #e70a0a;
   padding-left: 5px;
 }
 .social-icon {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   background: transparent;
   border: 2px solid #fff;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.4s ease;
   text-decoration: none;
 }

 .social-icon:hover {
   background: #fff;
   color: #000;
   transform: rotate(360deg);
 }

 /* fixed btn */
 .bg-purple {
   background-color: #fe4763 !important;
 }

 .social-icon-hide {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background: transparent;
   border: 2px solid #fff;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.4s ease;
   text-decoration: none;
 }

 .social-icon-hide:hover {
   background: #fff;
   color: #000;
   transform: rotate(360deg);
 }