:root{
  --navy:#073a77;
  --navy-dark:#052a5a;
  --green:#118a2f;
  --green-dark:#087026;
  --light:#f5fbff;
  --text:#182335;
  --muted:#657285;
  --border:#dce9f5;
  --shadow:0 15px 45px rgba(7,58,119,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  background:#fff;
  overflow-x:hidden;
}
a{text-decoration:none}
img{max-width:100%}

/* Top Bar */
.topbar{
  background:var(--navy-dark);
  color:#fff;
  font-size:.9rem;
  padding:.45rem 0;
}
.topbar a{color:#fff}
.social-links a{
  width:28px;height:28px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.12);
  transition:.25s ease;
}
.social-links a:hover{
  background:var(--green);
  transform:translateY(-2px);
}

/* Header */
.main-header{
  z-index:1040;
  box-shadow:0 5px 20px rgba(8,43,86,.08);
}
.navbar{padding:.75rem 0}
.navbar-brand{min-width:280px}
.brand-icon{
  width: 60px;
  height: 60px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  /* border:3px solid var(--navy); */
  color:var(--green);
  font-size:1.45rem;
  flex:0 0 auto;
}
.brand-icon.small{width:42px;height:42px;font-size:1.1rem;border-color:#fff}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-text strong{color:var(--navy);font-size:1.28rem}
.brand-text small{color:var(--green);font-weight:700;margin-top:.35rem}
.nav-link{
  color:#13213a!important;
  font-weight:700;
  position:relative;
  padding:.65rem .8rem!important;
}
.nav-link:not(.dropdown-toggle):after{
  content:"";
  position:absolute;
  left:.8rem;right:.8rem;bottom:0;
  height:2px;background:var(--green);
  transform:scaleX(0);
  transform-origin:left;
  transition:.25s ease;
}
.nav-link:hover,.nav-link.active{color:var(--green)!important}
.nav-link:not(.dropdown-toggle):hover:after,.nav-link:not(.dropdown-toggle).active:after{transform:scaleX(1)}
.btn-appointment,.btn-main{
  background:linear-gradient(135deg,var(--green),#0aa33d);
  color:#fff;
  border:0;
  border-radius:50px;
  padding:.78rem 1.25rem;
  font-weight:700;
  box-shadow:0 10px 25px rgba(17,138,47,.2);
  transition:.3s ease;
}
.btn-appointment:hover,.btn-main:hover{
  color:#fff;
  transform:translateY(-3px);
  box-shadow:0 14px 30px rgba(17,138,47,.28);
}

/* Hero */
.hero-section{
  position:relative;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.95),rgba(255,255,255,.25) 34%,transparent 35%),
    linear-gradient(110deg,#edf8ff 0%,#f9fcff 48%,#dff1ff 100%);
}
.hero-content{min-height:590px;padding-top:2.5rem;padding-bottom:4.5rem}
.eyebrow,.section-kicker{
  color:var(--green);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.hero-section h1{
  color:var(--navy);
  font-weight:800;
  font-size:clamp(2.5rem,5vw,4.5rem);
  line-height:.98;
  margin:.75rem 0 1.25rem;
}
.hero-section h1 span{color:var(--green)}
.hero-lead{font-size:1.2rem;max-width:520px;color:#26384d}
.hero-specialities{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  max-width:620px;
  margin-top:2rem;
}
.hero-specialities div{
  text-align:center;
  padding:.8rem;
  border-right:1px solid #c6d8e7;
}
.hero-specialities div:last-child{border-right:0}
.hero-specialities i{
  display:block;
  color:var(--navy);
  font-size:2rem;
  margin-bottom:.5rem;
  transition:.3s ease;
}
.hero-specialities div:hover i{color:var(--green);transform:translateY(-4px) scale(1.08)}
.hero-specialities span{font-size:.85rem;font-weight:700}
.doctor-visual{
  position:relative;
  min-height:490px;
  display:flex;align-items:flex-end;justify-content:center;
}
.doctor-img{
  max-height:500px;
  object-fit:contain;
  filter:drop-shadow(0 15px 25px rgba(4,49,97,.13));
}
.doctor-info-card{
  position:absolute;
  right:0;bottom:15px;
  width:min(390px,92%);
  background:linear-gradient(135deg,var(--navy),var(--navy-dark));
  color:#fff;
  border-radius:18px;
  padding:1.35rem 1.45rem;
  box-shadow:var(--shadow);
  transition:.3s ease;
}
.doctor-info-card:hover{transform:translateY(-5px)}
.doctor-info-card h2{margin:0 0 .45rem;font-size:1.85rem}
.doctor-info-card p{margin:.15rem 0}
.doctor-info-card strong{color:#a7ff4a}
.carousel-arrow{
  width:44px;height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;background:var(--green);color:#fff;
}
.carousel-control-prev,.carousel-control-next{width:5%}
.carousel-indicators [data-bs-target]{background-color:var(--green)}
.hero-medical-icon{
  width:280px;height:280px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:9rem;color:var(--green);
  background:rgba(255,255,255,.65);
  box-shadow:var(--shadow);
}

/* Timing */
.timing-wrap{
  margin-top:-55px;
  position:relative;
  z-index:6;
}
.timing-card{
  background:#fff;
  border-radius:22px;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
  overflow:hidden;
  position:relative;
}
.timing-heading{
  position:absolute;
  top:0;left:85px;
  transform:translateY(-50%);
  background:var(--navy);
  color:#fff;
  border-radius:30px;
  padding:.55rem 1.35rem;
  font-weight:800;
}
.timing-item{
  min-height:125px;
  padding:2rem 2.2rem 1.2rem;
  display:flex;gap:1rem;align-items:center;
}
.timing-item i{font-size:2.5rem;color:#f3b31b}
.timing-item:nth-child(2) i{color:var(--green)}
.timing-item span{display:block;color:var(--green);font-weight:800}
.timing-item strong{display:block;color:var(--navy);font-size:1.15rem}
.timing-cta{
  height:100%;
  min-height:125px;
  padding:1.5rem 2rem;
  background:linear-gradient(135deg,var(--green),#009f34);
  color:#fff;
  display:flex;align-items:center;justify-content:center;gap:1rem;
  transition:.3s ease;
}
.timing-cta:hover{color:#fff;filter:brightness(1.05)}
.timing-cta i{font-size:2.8rem}
.timing-cta strong,.timing-cta small{display:block}
.timing-cta small{font-size:1rem}

/* Common */
.section-pad{padding:75px 0}
.section-title{
  color:var(--navy);
  font-weight:800;
  margin:.3rem 0 1rem;
}
.section-text{color:var(--muted);font-size:1.02rem;line-height:1.8}
.about-image-wrap{
  border-radius:20px;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:#eef8ff;
}
.about-image-wrap img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  object-position:top center;
  transition:.4s ease;
}
.about-image-wrap:hover img{transform:scale(1.035)}
.feature-card{
  height:135px;
  border:1px solid var(--border);
  border-radius:16px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  background:#fff;
  box-shadow:0 8px 25px rgba(6,50,99,.06);
  transition:.3s ease;
}
.feature-card i{font-size:2rem;color:var(--green);margin-bottom:.65rem}
.feature-card:hover{
  transform:translateY(-7px);
  box-shadow:0 18px 35px rgba(6,50,99,.12);
  border-color:#a8d6bb;
}

/* Services */
.services-section{background:#fbfdff}
.service-card{
  height:180px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  padding:1rem;
  box-shadow:0 7px 20px rgba(6,50,99,.05);
  transition:.3s ease;
}
.service-card:hover{
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 18px 35px rgba(6,50,99,.13);
}
.service-card i{font-size:2.5rem;margin-bottom:.75rem;transition:.3s ease}
.service-card:hover i{transform:scale(1.12)}
.service-card h3{font-size:.95rem;font-weight:800;margin:0}
.service-card p{font-size:.8rem;margin:.2rem 0 0;color:var(--muted)}
.red{color:#dc2430}.purple{color:#7040ad}.navy{color:var(--navy)}.pink{color:#d95470}.blue{color:#1664be}
.services-control{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border:0;border-radius:50%;
  background:var(--green);color:#fff;z-index:2;
  box-shadow:0 10px 20px rgba(17,138,47,.18);
}
.services-control.prev{left:-22px}
.services-control.next{right:-22px}

/* Why */
.why-strip{
  background:linear-gradient(90deg,#eef8f4,#f7fbff);
  border-top:1px solid #e3eef6;
  border-bottom:1px solid #e3eef6;
  padding:28px 0;
}
.why-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
}
.why-grid div{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  column-gap:.7rem;
  align-items:center;
  padding:0 1rem;
  border-right:1px solid #cfe0ea;
}
.why-grid div:last-child{border-right:0}
.why-grid i{grid-row:1/3;color:var(--green);font-size:2rem}
.why-grid strong{color:var(--navy)}
.why-grid span{font-size:.8rem}

/* Testimonials */
.testimonial-card{
  height:100%;
  border:1px solid var(--border);
  border-radius:16px;
  padding:1.4rem;
  background:#fff;
  box-shadow:0 8px 22px rgba(6,50,99,.05);
  position:relative;
  transition:.3s ease;
}
.testimonial-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.quote{color:var(--green);font-size:1.6rem}
.testimonial-card p{color:#4e5a6c;min-height:90px}
.stars{color:#ffb400;letter-spacing:.08em;margin:.7rem 0}
.testimonial-card strong,.testimonial-card small{display:block}
.testimonial-card strong{color:var(--navy)}

/* Footer */
.footer{
  background:linear-gradient(135deg,#062f68,#041f48);
  color:#d8e7f7;
  padding:50px 0 15px;
}
.footer h3{font-size:1rem;margin:0;color:#fff}
.footer h4{
  color:#a7ff4a;
  text-transform:uppercase;
  font-size:.9rem;
  letter-spacing:.04em;
  margin-bottom:1rem;
}
.footer p{font-size:.85rem;margin:.2rem 0}
.footer a{color:#d8e7f7}
.footer a:hover{color:#fff}
.footer-links,.contact-list{list-style:none;padding:0;margin:0}
.footer-links li{margin:.45rem 0}
.footer-links a:before{content:"›";color:#75dc53;margin-right:.55rem}
.contact-list li{display:flex;gap:.7rem;margin:.55rem 0}
.contact-list i{color:#74d851;margin-top:.2rem}
.footer-social{display:flex;gap:.6rem}
.footer-social a{
  width:38px;height:38px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);
  transition:.25s ease;
}
.footer-social a:hover{background:var(--green);transform:translateY(-3px)}
.footer-bottom{
  margin-top:2rem;padding-top:1rem;
  border-top:1px solid rgba(255,255,255,.15);
  display:flex;justify-content:space-between;gap:1rem;
  font-size:.8rem;
}
.footer-bottom div{display:flex;gap:.7rem}

/* Floating WhatsApp */
.whatsapp-widget{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:1050;
  display:flex;
  align-items:center;
  filter:drop-shadow(0 12px 25px rgba(0,0,0,.18));
  transition:.3s ease;
}
.wa-copy{
  background:#fff;
  min-width:190px;
  padding:.75rem 1.4rem .75rem 1rem;
  border-radius:16px 0 0 16px;
  color:#252c38;
  border:1px solid #e3e8ee;
  border-right:0;
}
.wa-copy strong,.wa-copy small{display:block}
.wa-copy strong{font-size:.92rem}
.wa-copy small{color:#7b8492;font-size:.75rem;margin-top:.15rem}
.wa-icon{
  width:66px;height:66px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  margin-left:-10px;
  background:#19c75c;
  color:#fff;
  border:4px solid #fff;
  font-size:2rem;
}
.whatsapp-widget:hover{
  transform:translateY(-5px);
}
.whatsapp-widget:hover .wa-icon{
  animation:pulseWa 1.1s infinite;
}
@keyframes pulseWa{
  0%,100%{box-shadow:0 0 0 0 rgba(25,199,92,.3)}
  50%{box-shadow:0 0 0 12px rgba(25,199,92,0)}
}

/* Responsive */
@media (max-width:991.98px){
  .navbar-brand{min-width:0}
  .brand-text strong{font-size:1.08rem}
  .brand-text small{font-size:.72rem}
  .btn-appointment{margin-top:.75rem}
  .hero-content{min-height:auto;padding:2.5rem 0 6rem}
  .doctor-visual{min-height:420px}
  .why-grid{grid-template-columns:repeat(3,1fr);gap:1rem}
  .why-grid div{border-right:0}
  .services-control.prev{left:5px}
  .services-control.next{right:5px}
}

@media (max-width:767.98px){
  .top-contact{font-size:.8rem}
  .topbar .container{justify-content:center!important}
  .navbar-brand{gap:.6rem!important}
  .brand-icon{width:42px;height:42px}
  .hero-section h1{font-size:2.7rem}
  .hero-specialities{grid-template-columns:repeat(2,1fr)}
  .hero-specialities div:nth-child(2){border-right:0}
  .doctor-info-card{right:50%;transform:translateX(50%);bottom:0}
  .doctor-info-card:hover{transform:translate(50%,-5px)}
  .timing-wrap{margin-top:-35px}
  .timing-heading{left:50%;transform:translate(-50%,-50%);white-space:nowrap}
  .timing-item{padding:2rem 1.4rem 1rem}
  .section-pad{padding:55px 0}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .footer-bottom{flex-direction:column;text-align:center;align-items:center}
  .wa-copy{display:none}
  .wa-icon{margin-left:0}
}

@media (max-width:575.98px){
  .hero-section h1{font-size:2.3rem}
  .doctor-visual{min-height:390px}
  .doctor-info-card h2{font-size:1.45rem}
  .why-grid{grid-template-columns:1fr 1fr}
  .why-grid div{padding:.75rem .4rem}
  .service-card{height:165px}
}


/* ==========================================================
   CORRECTIONS: MULTI-PAGE / HERO BG / DROPDOWN / WHATSAPP / MODAL
   ========================================================== */

/* About Us dropdown */
/* Keep About Us dropdown arrow visible */
.navbar .dropdown-toggle::after{
  display:inline-block!important;
  margin-left:.38rem!important;
  vertical-align:.16em!important;
  content:""!important;
  border-top:.36em solid currentColor!important;
  border-right:.36em solid transparent!important;
  border-bottom:0!important;
  border-left:.36em solid transparent!important;
  position:static!important;
  width:0!important;height:0!important;
  background:none!important;
  transform:none!important;
}

.dropdown-menu{
  border:0;
  border-radius:14px;
  padding:.6rem;
  box-shadow:0 18px 45px rgba(5,42,90,.16);
}
.dropdown-item{
  border-radius:9px;
  padding:.68rem .8rem;
  font-weight:600;
  color:#172333;
  transition:.22s ease;
}
.dropdown-item i{color:var(--green);width:20px}
.dropdown-item:hover{
  background:#edf8f2;
  color:var(--green);
  transform:translateX(3px);
}
@media (min-width:992px){
  .about-dropdown:hover>.dropdown-menu{
    display:block;
    margin-top:0;
    animation:dropFade .22s ease;
  }
  .about-dropdown>.dropdown-toggle:active{pointer-events:none}
}
@keyframes dropFade{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* Hero slider background images */
.hero-bg-slide{
  min-height:590px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  position:relative;
}
.hero-bg-overlay{
  position:absolute;
  inset:0;
  z-index:0;
}
.hero-bg-overlay.light{
  background:linear-gradient(90deg,rgba(243,250,255,.98) 0%,rgba(239,248,255,.92) 50%,rgba(226,242,252,.72) 100%);
}
.hero-bg-overlay.dark{
  background:linear-gradient(90deg,rgba(4,34,75,.86) 0%,rgba(4,34,75,.68) 55%,rgba(4,34,75,.28) 100%);
}
.hero-bg-slide .hero-content{
  position:relative;
  z-index:2;
}
.hero-bg-slide.text-white .eyebrow{color:#a8ff72}
.hero-bg-slide .doctor-img{
  max-height:505px;
}

/* Make timing CTA work as a button */
button.timing-cta{
  font-family:inherit;
  text-align:left;
  cursor:pointer;
}

/* Appointment popup */
.appointment-modal{
  border:0;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 25px 75px rgba(4,39,83,.26);
}
.appointment-modal .modal-header{
  background:linear-gradient(135deg,#eff8ff,#f4fbf6);
  border-bottom:1px solid #e6eef5;
  padding:1.2rem 1.35rem;
}
.modal-kicker{
  color:var(--green);
  font-weight:800;
  letter-spacing:.05em;
}
.appointment-modal .modal-title{
  color:var(--navy);
  font-weight:800;
}
.appointment-modal .modal-body{padding:1.35rem}
.appointment-modal .form-control,
.appointment-modal .form-select{
  border-radius:11px;
  padding:.78rem .9rem;
  border-color:#d7e4ef;
}
.appointment-modal .form-control:focus,
.appointment-modal .form-select:focus{
  border-color:#66ba80;
  box-shadow:0 0 0 .2rem rgba(17,138,47,.12);
}

/* Correct WhatsApp widget */
.whatsapp-widget{
  position:fixed!important;
  right:20px!important;
  bottom: 60px!important;
  z-index:1080!important;
  display:flex!important;
  align-items:center!important;
  text-decoration:none!important;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.18));
}
.wa-copy{
  min-width:195px;
  background:#fff;
  border:1px solid #e3e9ef;
  border-right:0;
  border-radius:15px 0 0 15px;
  padding:.72rem 1.35rem .72rem 1rem;
}
.wa-copy strong,.wa-copy small{display:block}
.wa-copy strong{color:#202734;font-size:.92rem}
.wa-copy small{color:#778190;font-size:.74rem;margin-top:.16rem}
.wa-icon{
  width:66px!important;
  height:66px!important;
  border-radius:50%!important;
  margin-left:-10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#20c766!important;
  color:#fff!important;
  border:4px solid #fff!important;
  font-size:2rem!important;
  animation:waPulseFixed 1.7s infinite;
}
@keyframes waPulseFixed{
  0%,100%{box-shadow:0 0 0 0 rgba(32,199,102,.28)}
  50%{box-shadow:0 0 0 13px rgba(32,199,102,0)}
}

/* Interior pages */
.inner-hero{
  padding:90px 0;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(4,42,90,.94),rgba(7,58,119,.82)),
    url('https://images.unsplash.com/photo-1579684385127-1ef15d508118?auto=format&fit=crop&w=1800&q=80') center/cover;
}
.inner-hero .section-kicker{color:#a7ff75}
.inner-hero h1{font-weight:800;font-size:clamp(2.3rem,5vw,4.1rem);margin:.35rem 0 .7rem}
.inner-hero p{font-size:1.1rem;max-width:650px;margin:0;opacity:.92}
.inner-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:1.5rem;
  box-shadow:0 10px 28px rgba(7,58,119,.07);
  transition:.3s ease;
}
.inner-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.inner-card h4{color:var(--navy);font-weight:800}
.inner-card i{color:var(--green)}
.inner-icon{font-size:2.4rem;margin-bottom:1rem}
.timing-big{font-size:3rem;color:#f3b31b;margin-bottom:.7rem}
.timing-big.green{color:var(--green)}
.page-service{height:190px}

/* Responsive fixes */
@media (max-width:991.98px){
  .hero-bg-slide{min-height:auto}
}
@media (max-width:767.98px){
  .hero-bg-overlay.light{
    background:rgba(243,250,255,.93);
  }
  .wa-copy{display:none!important}
  .wa-icon{margin-left:0!important;width:60px!important;height:60px!important}
}

/* Why Choose Us Hover Animation - Fixed */
.why-grid > div{
  position:relative;
  transition:transform .32s ease, box-shadow .32s ease, background-color .32s ease, border-color .32s ease;
  border-radius:14px;
  cursor:default;
}
.why-grid > div i,
.why-grid > div strong,
.why-grid > div span{
  transition:transform .32s ease, color .32s ease, background-color .32s ease;
}
.why-grid > div:hover{
  background:#fff;
  transform:translateY(-8px);
  box-shadow:0 14px 34px rgba(7,58,119,.14);
  z-index:2;
}
.why-grid > div:hover i{
  transform:scale(1.16) rotate(-4deg);
  color:#0b8f32;
}
.why-grid > div:hover strong{
  color:#0b8f32;
}
.why-grid > div:hover span{
  color:#073a77;
}

@media (hover:none){
  .why-grid > div:hover{transform:none;box-shadow:none;background:transparent}
}

/* ==========================================================
   Mobile Horizontal Scroll Fix
   ========================================================== */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}

body{
  position:relative;
}

img,
svg,
video,
iframe{
  max-width:100%;
}

@media (max-width:767.98px){
  .container,
  .container-fluid{
    max-width:100%;
  }

  .services-slider,
  .services-wrap,
  .hero-section,
  .inner-hero,
  .footer,
  .main-header{
    overflow-x:hidden;
  }

  .services-control.prev{left:8px!important;}
  .services-control.next{right:8px!important;}

  .whatsapp-widget{
    right:14px!important;
    max-width:calc(100vw - 28px);
  }

  .timing-heading{
    max-width:calc(100vw - 30px);
    white-space:normal;
    text-align:center;
  }
}