:root{
       --primary:#0b3b5e;
       --accent:#2fe3ff;
       --bg:#f6f9fc;
       --text:#0b1220;
       --card:#ffffff;
     }
     
     *{margin:0;padding:0;box-sizing:border-box}
     html{scroll-behavior:smooth}
     body{
       font-family: "Poppins", sans-serif;
       background: var(--bg);
       color: var(--text);
     }
     
     /* Navbar */
     .navbar{
       position: sticky;
       top:0;
       z-index:999;
       display:flex;
       justify-content:space-between;
       align-items:center;
       padding:14px 18px;
       background: rgba(11,59,94,0.92);
       backdrop-filter: blur(10px);
       color:white;
       border-bottom:1px solid rgba(255,255,255,0.15);
     }
     .nav-left{display:flex;align-items:center;gap:12px}
     .logo-circle{
       width:42px;height:42px;border-radius:50%;
       background: linear-gradient(135deg,var(--accent),white);
       color:#0b3b5e;
       font-weight:800;
       display:grid;place-items:center;
     }
     .logo-text h3{font-size:16px;font-weight:700;line-height:1}
     .logo-text p{font-size:12px;opacity:0.9}
     
     nav ul{display:flex;gap:18px;list-style:none}
     nav ul li a{
       color:white;text-decoration:none;font-weight:600;font-size:14px;
       padding:8px 10px;border-radius:10px;
     }
     nav ul li a:hover{background:rgba(255,255,255,0.15)}
     .menu-btn{
       display:none;
       background:transparent;border:none;
       color:white;font-size:28px;cursor:pointer;
     }
     
     /* Hero */
     .hero{
       position:relative;
       min-height:82vh;
       display:flex;
       justify-content:center;
       align-items:center;
       padding:40px 18px;
       overflow:hidden;
     
       isolation: isolate;   /* ✅ IMPORTANT FIX */
     }
     .hero-bg{
       position:absolute;
       inset:0;
       z-index:-1;
     
       /* BG IMAGE - Using ImageKit.io */
       background-image:
         linear-gradient(to bottom, rgba(6,25,40,0.75), rgba(6,25,40,0.82)),
         url("https://ik.imagekit.io/nruronixtech/tr:w-1920,h-1080,q-80/prashant-clinic-assets/images/hero-bg.jpg");
     
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
     }
     .hero-content{
       max-width:1100px;
       text-align:center;
       color:white;
     }
     .hero-badge{
       display:inline-block;
       padding:10px 14px;
       border:1px solid rgba(255,255,255,0.2);
       background: rgba(255,255,255,0.10);
       border-radius:999px;
       font-size:13px;
       margin-bottom:15px;
     }
     .hero h1{
       font-size:44px;
       line-height:1.15;
       margin-bottom:14px;
       font-weight:800;
     }
     .hero h1 span{color:var(--accent)}
     .hero p{
       font-size:16px;
       opacity:0.95;
       max-width:780px;
       margin: 0 auto 22px;
     }
     .hero-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
     
     /* Buttons */
     .btn{
       display:inline-block;
       padding:12px 18px;
       text-decoration:none;
       border-radius:14px;
       font-weight:700;
       transition:.25s;
     }
     .btn.primary{background:var(--accent);color:#0b3b5e}
     .btn.primary:hover{transform:translateY(-2px)}
     .btn.outline{
       border:1px solid rgba(255,255,255,0.35);
       color:white;
       background: rgba(255,255,255,0.1);
     }
     .btn.outline:hover{transform:translateY(-2px)}
     .btn.full{width:100%;border:none;cursor:pointer}
     
     /* Stats */
     .hero-stats{
       display:grid;
       grid-template-columns:repeat(3,1fr);
       gap:14px;
       max-width:750px;
       margin:28px auto 0;
     }
     .stat{
       padding:16px;
       border-radius:18px;
       background: rgba(255,255,255,0.12);
       border:1px solid rgba(255,255,255,0.18);
     }
     .stat h3{font-size:22px;color:var(--accent)}
     .stat p{font-size:13px;opacity:0.95}
     
     /* Sections */
     .section{padding:70px 18px}
     .section.alt{background:#eef6fb}
     .section-title{text-align:center;margin-bottom:30px}
     .section-title h2{
       font-size:34px;
       font-weight:800;
       color:#0b3b5e;
     }
     .section-title p{opacity:.75;margin-top:6px}
     
     /* Doctor */
     .doctor-card{
       max-width:1100px;
       margin:auto;
       display:grid;
       grid-template-columns: 280px 1fr;
       gap:22px;
       padding:22px;
       border-radius:22px;
       background: rgba(255,255,255,0.72);
       border:1px solid rgba(255,255,255,0.9);
       box-shadow: 0 12px 30px rgba(5,15,30,0.12);
       backdrop-filter: blur(12px);
     }
     .doctor-img img{
       width:100%;
       height:300px;
       object-fit:cover;
       border-radius:18px;
     }
     .doctor-info h3{font-size:26px;font-weight:800}
     .doctor-sub{margin-top:5px;opacity:.8}
     .doctor-tags{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
     .doctor-tags span{
       font-size:12px;
       padding:7px 10px;
       border-radius:999px;
       background:#e7f9ff;
       color:#0b3b5e;
       font-weight:700;
     }
     .doctor-list{margin-top:10px;padding-left:18px;opacity:.88}
     
     /* Services */
     .services-grid{
       max-width:1100px;margin:auto;
       display:grid;
       grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
       gap:5px;
     }
     .service{
       background:white;
       padding:16px;
       border-radius:18px;
       box-shadow: 0 10px 25px rgba(4,12,20,0.07);
       border:1px solid rgba(11,59,94,0.08);
       transition:.25s;
     }
     .service:hover{transform:translateY(-4px)}
     .service h4{color:#0b3b5e;font-weight:800}
     .service p{opacity:.75;margin-top:6px;font-size:13px}
     
     /* Gallery Attractive */
     .gallery-grid{
       max-width:1100px;
       margin:auto;
       display:grid;
       grid-template-columns: repeat(3, 1fr);  /* ✅ 3 per row */
       gap:18px;
     }
     
     .gallery-item{
       position:relative;
       border-radius:22px;
       overflow:hidden;
       cursor:pointer;
       box-shadow:0 14px 30px rgba(0,0,0,0.12);
       transition:0.3s ease;
       background:white;
     }
     
     .gallery-item img{
       width:100%;
       height:240px;
       object-fit:cover;
       display:block;
       transition:0.35s ease;
     }
     
     .gallery-item:hover{
       transform:translateY(-5px);
     }
     
     .gallery-item:hover img{
       transform:scale(1.08);
     }
     
     /* Overlay text */
     .gallery-item .overlay{
       position:absolute;
       inset:0;
       display:flex;
       justify-content:center;
       align-items:center;
       font-weight:800;
       color:white;
       font-size:16px;
       opacity:0;
       transition:0.35s ease;
       background:linear-gradient(to top, rgba(0,0,0,0.65), rgba(0,0,0,0.15));
     }
     
     .gallery-item:hover .overlay{
       opacity:1;
     }
     
     
     /* Form */
     .form-card{
       max-width:950px;margin:auto;
       background:white;
       padding:22px;
       border-radius:22px;
       box-shadow:0 12px 30px rgba(5,15,30,0.10);
     }
     .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
     .input label{display:block;font-weight:700;margin:12px 0 6px;color:#0b3b5e}
     .input input,.input select,.input textarea{
       width:100%;
       padding:12px 14px;
       border-radius:14px;
       border:1px solid rgba(11,59,94,0.18);
       outline:none;
       font-family:inherit;
     }
     
     /* Contact */
     .contact-grid{
       max-width:1100px;margin:auto;
       display:grid;
       grid-template-columns: 1fr 1.1fr;
       gap:18px;
       align-items:stretch;
     }
     .contact-card{
       background:white;
       padding:22px;
       border-radius:22px;
       box-shadow:0 12px 30px rgba(5,15,30,0.10);
     }
     .contact-card a{color:#0b3b5e;font-weight:800;text-decoration:none}
     .small-buttons{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
     .mini-btn{
       padding:10px 14px;border-radius:14px;
       background:#e7f9ff;color:#0b3b5e;
       font-weight:800;text-decoration:none;
     }
     .map{
       width:100%;
       height:100%;
       min-height:320px;
       border:0;
       border-radius:22px;
       box-shadow:0 12px 30px rgba(5,15,30,0.10);
     }
     
     /* Footer */
     .footer{
       padding:18px;
       text-align:center;
       background:#0b3b5e;
       color:white;
       margin-top:40px;
     }
     
     /* Floating Buttons */
     .floating{
       position:fixed;
       right:16px;
       width:52px;height:52px;
       border-radius:18px;
       display:grid;place-items:center;
       text-decoration:none;
       font-size:20px;
       font-weight:900;
       box-shadow:0 16px 30px rgba(0,0,0,0.18);
       z-index:999;
     }
     .floating.call{bottom:88px;background:white;color:#0b3b5e}
     .floating.wa{bottom:22px;background:#25D366;color:white}
     
     /* Lightbox */
     .lightbox{
       position:fixed;
       inset:0;
       background: rgba(0,0,0,0.85);
       display:none;
       justify-content:center;
       align-items:center;
       z-index:9999;
       padding:25px;
     }
     
     .lightbox img{
       width:auto;
       max-width:95%;
       max-height:88%;
       border-radius:22px;
       box-shadow:0 20px 50px rgba(0,0,0,0.45);
     }
     
     /* Reveal animation */
     .reveal{opacity:0;transform:translateY(25px);transition:.7s ease}
     .reveal.show{opacity:1;transform:translateY(0)}
     .fade-up{opacity:0;transform:translateY(25px);animation:fadeUp .8s forwards}
     .delay-1{animation-delay:.15s}
     .delay-2{animation-delay:.30s}
     .delay-3{animation-delay:.45s}
     .delay-4{animation-delay:.60s}
     @keyframes fadeUp{
       to{opacity:1;transform:translateY(0)}
     }
     .services-section{
       padding-top: 25px !important;  /* reduce from 70px */
       padding-bottom: 45px !important;
     }
     
     .services-section .section-title{
       margin-bottom: 15px !important;  /* reduce from 30px */
     }
     .gallery-section{
       padding-top: 25px !important;   /* reduced from 70px */
       padding-bottom: 45px !important;
     }
     
     .gallery-section .section-title{
       margin-bottom: 15px !important; /* reduced from 30px */
     }
     .appointment-section{
       padding-top: 25px !important;
       padding-bottom: 45px !important;
     }
     .appointment-section .section-title{ margin-bottom: 15px !important; }
     
     .contact-section{
       padding-top: 25px !important;
       padding-bottom: 45px !important;
     }
     .contact-section .section-title{ margin-bottom: 15px !important; }
     
     /* Mobile */
     @media(max-width:900px){
       .doctor-card{grid-template-columns:1fr}
       .doctor-img img{height:260px}
     }
     @media(max-width:768px){
       nav ul{
         display:none;
         position:absolute;
         right:12px;
         top:72px;
         flex-direction:column;
         width:220px;
         gap:8px;
         padding:14px;
         border-radius:18px;
         background: rgba(11,59,94,0.97);
         border:1px solid rgba(255,255,255,0.15);
       }
       nav ul.show{display:flex}
       .menu-btn{display:block}
       .hero h1{font-size:32px}
       .hero-stats{grid-template-columns:1fr}
       .form-row{grid-template-columns:1fr}
       .contact-grid{grid-template-columns:1fr}
     }

     /* Testimonials Section (Safe) */
.testimonials-grid{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
}

.testimonial-card{
  background:#ffffff;
  padding:22px;
  border-radius:18px;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.testimonial-card p{
  font-size:14px;
  line-height:1.6;
  opacity:0.9;
}

.testimonial-card h4{
  margin-top:14px;
  font-size:15px;
  font-weight:700;
  color:#0b3b5e;
}

.testimonial-card span{
  font-size:12px;
  opacity:0.7;
}

.logo-img{
  height:60px;
  width:60px;
  object-fit:cover;
  border-radius:50%;
  border:2px solid white;
  box-shadow:0 4px 12px rgba(0,0,0,0.2);
}