html {
            scroll-behavior: smooth;
        }

        /* Custom Loader */
        #loader {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #fff;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 9999;
        }
        .loader-spinner {
            border: 8px solid #f3f3f3;
            border-top: 8px solid #3b82f6;
            border-radius: 50%;
            width: 60px;
            height: 60px;
            animation: spin 1s linear infinite;
        }
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
        /* Scroll-to-Top Button */
        #scrollToTop {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: #3b82f6;
            color: white;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            opacity: 0;
            transition: opacity 0.3s;
            z-index: 1000;
        }
        #scrollToTop.show {
            opacity: 1;
        }
        /* Testimonial Slider */
        .testimonial-slider {
            overflow: hidden;
            position: relative;
        }
        .testimonial-slide {
            display: none;
            opacity: 0;
            transition: opacity 0.5s ease-in-out;
        }
        .testimonial-slide.active {
            display: block;
            opacity: 1;
        }
        /* WhatsApp Button */
        .whatsapp-btn {
            display: inline-flex;
            align-items: center;
            background: #25D366;
            color: white;
            padding: 10px 20px;
            border-radius: 5px;
            text-decoration: none;
        }
        .whatsapp-btn:hover {
            background: #1ebe56;
        }
        /* Navbar Styles */
        .navbar {
            transition: all 0.3s ease;
        }
        .navbar.scrolled {
            background: #a7aaad;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
          
        }
        .navbar.scrolled a{
            color: white;
        }
        .hamburger {
            display: none;
            cursor: pointer;
        }
        .hamburger div {
            width: 25px;
            height: 3px;
            background: rgb(38, 129, 199);
            margin: 5px;
            transition: all 0.3s ease;
        }
        .nav-menu {
            display: flex;
        }
        .nav-menu.active {
            display: block;
        }
        @media (max-width: 768px) {
            .hamburger {
                display: block;
            }
            .nav-menu {
                display: none;
                position: absolute;
                top: 100%;
                left: 0;
                width: 100%;
                background: #1f2937;
                flex-direction: column;
                padding: 1rem;
            }
            .nav-menu a{
                color: white;
            }
            .nav-menu.active {
                display: flex;
            }
            .hamburger.active .line1 {
                transform: rotate(-45deg) translate(-5px, 6px);
            }
            .hamburger.active .line2 {
                opacity: 0;
            }
            .hamburger.active .line3 {
                transform: rotate(45deg) translate(-5px, -6px);
            }
        }

          nav ul li a{
    color: black;
    font-size: 18px;
  }


     .btn1 {
 width: 12em;
 height: 2.3em;
 margin: 0.5em;
 background: white;
 color: black;
 border: none;
 border-radius: 0.625em;
 font-size: 20px;
 font-weight: bold;
 cursor: pointer;
 position: relative;
 z-index: 1;
 overflow: hidden;
}

#hero button:hover {
 color: rgb(248, 244, 244);
}

#hero button:after {
 content: "";
 background: rgb(21, 11, 11);
 position: absolute;
 z-index: -1;
 left: -20%;
 right: -20%;
 top: 0;
 bottom: 0;
 transform: skewX(-45deg) scale(0, 1);
 transition: all 0.5s;
}

#hero button:hover:after {
 transform: skewX(-45deg) scale(1, 1);
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
}

 .shadow-lga:hover{
    border: 2px solid blue;
  }

  /* ==============================testimonial video======================== */
    
    .testimonial-section {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background: white;
      padding: 30px;
      border-radius: 15px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
      width: 100%;
      margin: auto;
      flex-wrap: wrap;
    }

    .testimonial-content {
      flex: 1 1 45%;
      padding-right: 20px;
    }

    .testimonial-content h2 {
      font-size: 28px;
      margin-bottom: 20px;
      color: #333;
    }

    .testimonial-content p {
      font-size: 16px;
      color: #555;
      line-height: 1.6;
    }

    .video-wrapper {
      position: relative;
      flex: 1 1 45%;
      max-width: 100%;
    }

    .video-wrapper video {
      width: 100%;
      border-radius: 10px;
    }

    .video-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 10px;
      background: rgba(0,0,0,0.4);
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
    }

    .video-overlay img {
      width: 80px;
      height: 80px;
      object-fit: contain;
    }

    @media(max-width: 768px) {
      .testimonial-section {
        flex-direction: column;
      }

      .testimonial-content, .video-wrapper {
        flex: 1 1 100%;
        padding: 10px 0;
      }

      .testimonial-content {
        text-align: center;
      }
    }

    /* ===============================services image ============================ */
     .lightbox {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 150%;
    background: rgba(0,0,0,0.8);
    justify-content: center;
    align-items: center;
  }

  .lightbox img {
    width: 90%;
    height: 90%;
    border-radius: 10px;
    box-shadow: 0 0 20px #000;
  }

  .lightbox:target {
    display: flex;
  }

  .lightbox-closee {
    position: absolute;
    top: 30px;
    right: 40px;
    color: white;
    font-size: 30px;
    text-decoration: none;
    z-index: 10000;
  }

    .doctor-section {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: #fff;
      padding: 40px;
      border-radius: 15px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
      width: 90%;
      margin: auto;
      flex-wrap: wrap;
    }

    .doctor-content {
      flex: 1 1 50%;
      padding-right: 30px;
    }

    .doctor-content h2 {
      font-size: 32px;
      margin-bottom: 20px;
      color: #2c3e50;
    }

    .doctor-content p {
      font-size: 16px;
      line-height: 1.8;
      color: #555;
    }

    .doctor-image {
      flex: 1 1 45%;
    }

    .doctor-image img {
      width: 100%;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0,0,0,0.1);
    }

    @media(max-width: 768px) {
      .doctor-section {
        flex-direction: column-reverse;
        text-align: center;
      }

      .doctor-content {
        padding-right: 0;
        margin-top: 20px;
      }
    }

/* ========================whatsapp====================================== */
    .whatsapp-float {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 9999;
  background-color: #25D366;
  padding: 12px;
  border-radius: 50%;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  animation: pulse 2s infinite;
  transition: transform 0.3s ease;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

.whatsapp-float img {
  width: 38px;
  height: 35px;
}

/* Pulse animation */
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}