:root{
  --brand-950:#06213a;
  --brand-900:#093252;
  --brand-700:#0f5f8f;
  --brand-600:#1677ab;
  --brand-500:#2b8cc8;
  --accent:#7cc8ef;
  --sky:#ecf7fc;
  --ink:#173048;
  --muted:#5e6d7e;
  --line:#d7e5f1;
  --card:#ffffff;
  --bg:#f4f8fb;
  --shadow:0 20px 55px rgba(13,40,66,.10);
  --shadow-soft:0 12px 30px rgba(13,40,66,.08);
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
}

html{scroll-behavior:smooth}
body{
  font-family:'Inter',sans-serif;
  background:var(--bg);
  color:var(--ink);
}

a{color:var(--brand-700)}
a:hover,a:focus{text-decoration:none;color:var(--brand-500)}

.bg-white,
.bglight,
.bgf5,
.bg-white3{
  background:#fff !important;
}

.site-header,
.header-area{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(18px);
  box-shadow:0 8px 30px rgba(7,28,49,.08);
}

.top-header{
  background:linear-gradient(90deg,var(--brand-950),var(--brand-700));
  color:#fff;
  padding:10px 0 !important;
}
.top-header .container-md{
  padding-left:clamp(14px,2.8vw,32px);
  padding-right:clamp(14px,2.8vw,32px);
}
.top-header .small,
.top-header span,
.top-header i{
  color:#fff;
}
.top-header a{
  color:#fff !important;
  font-weight:700;
}
.top-header a:hover{
  color:#dff4ff !important;
}
.header-contact-info,
.top-header-social,
.footer-quick-links,
.social{
  list-style:none;
  padding-left:0;
  margin-bottom:0;
}
.header-contact-info li,
.top-header-social li,
.social li{
  display:inline-flex;
  align-items:center;
}
.header-contact-info li+li{margin-left:22px}
.header-contact-info a,
.top-header-social a,
.social a{
  color:#fff;
}

.site-nav{
  padding:14px 0;
}
.navbar-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.navbar-brand img,
.site-logo img,
.footer-logo img{
  max-height:62px;
  max-width:260px;
  width:auto;
  object-fit:contain;
}
.nav-link{
  font-weight:700;
  color:var(--ink) !important;
  padding:12px 16px !important;
}
.nav-link:hover,
.nav-link.active{
  color:var(--brand-700) !important;
}
.navbar-nav .dropdown-menu{
  border:0;
  border-radius:22px;
  box-shadow:var(--shadow);
  padding:18px;
}
.navbar-nav .dropdown-menu .nav-link{
  padding:10px 12px !important;
  border-radius:14px;
}
.navbar-nav .dropdown-menu .nav-link:hover{
  background:var(--sky);
}

.btn,
.btn-primary{
  border:0;
  border-radius:999px;
  font-weight:700;
  padding:12px 22px;
}
.btn-primary,
.btn-brand{
  background:linear-gradient(135deg,var(--brand-700),var(--brand-500));
  color:#fff;
  box-shadow:0 16px 30px rgba(15,95,143,.22);
}
.btn-primary:hover,
.btn-brand:hover{
  background:linear-gradient(135deg,var(--brand-600),var(--brand-500));
  color:#fff;
}
.btn-outline-brand{
  border:1px solid rgba(15,95,143,.24);
  color:var(--brand-700);
  background:#fff;
}
.btn-outline-brand:hover{
  background:var(--brand-700);
  color:#fff;
}
.btn-ghost-light{
  border:1px solid rgba(255,255,255,.26);
  color:#fff;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
}
.btn-ghost-light:hover{
  color:var(--brand-950);
  background:#fff;
}

.hero-shell{
  position:relative;
  overflow:hidden;
  border-radius:40px;
  background:
    radial-gradient(circle at top right, rgba(124,200,239,.35), transparent 30%),
    linear-gradient(135deg,#ffffff 0%, #eef7fc 45%, #ffffff 100%);
  box-shadow:var(--shadow);
}
.hero-shell::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(120deg, rgba(9,50,82,.95), rgba(9,50,82,.55)), url('../images/info-image/WhatsApp Image 2026-08-04 at 11.49.22.jpeg');
  background-size:cover;
  background-position:center;
  opacity:.06;
  pointer-events:none;
}
.hero-grid,
.contact-grid,
.treatment-page-grid{
  display:grid;
  gap:30px;
}
.hero-grid{
  grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
  align-items:stretch;
}
.hero-copy{
  position:relative;
  z-index:1;
  padding:24px 6px 24px 14px;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(15,95,143,.08);
  color:var(--brand-700);
  font-weight:700;
  letter-spacing:.02em;
}
.eyebrow::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--brand-500);
}
.hero-copy h1,
.page-hero h1{
  font-size:clamp(2.3rem,4vw,4.5rem);
  line-height:1.02;
  letter-spacing:-.04em;
  margin:18px 0 16px;
}
.hero-copy p,
.page-hero p,
.section-lead,
.content-copy p{
  color:var(--muted);
  font-size:1.05rem;
  line-height:1.75;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.hero-section{
  padding-bottom:132px;
}
.hero-slider-shell{
  position:relative;
}
.hero-slider{
  overflow:hidden;
  border-radius:40px;
  box-shadow:var(--shadow);
  background:#071f36;
}
.hero-slide{
  position:relative;
  min-height:640px;
  padding:64px;
  display:flex;
  align-items:flex-end;
  background-size:cover;
  background-position:center;
}
.hero-slide::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(124,200,239,.34), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
.hero-slide__content{
  position:relative;
  z-index:1;
  max-width:min(640px,100%);
  color:#fff;
}
.eyebrow--light{
  background:rgba(255,255,255,.14);
  color:#fff;
}
.eyebrow--light::before{
  background:#9edcff;
}
.hero-slide__content h1{
  font-size:clamp(2.6rem,5vw,5.2rem);
  line-height:1;
  letter-spacing:-.05em;
  margin:20px 0 18px;
  color:#fff;
}
.hero-slide__content p{
  max-width:600px;
  color:rgba(255,255,255,.88);
  font-size:1.08rem;
  line-height:1.78;
}
.hero-slide__highlights{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}
.hero-slide__highlights span{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:11px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-weight:700;
}
.hero-slide__highlights span::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:#7cc8ef;
}
.hero-slider__indicators{
  right:auto;
  bottom:146px;
  left:64px;
  margin:0;
  justify-content:flex-start;
}
.hero-slider__indicators li{
  width:12px;
  height:12px;
  margin:0 10px 0 0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.35);
  opacity:1;
}
.hero-slider__indicators .active{
  background:#fff;
  box-shadow:0 0 0 6px rgba(255,255,255,.15);
}
.hero-slider__control{
  top:auto;
  bottom:54px;
  width:54px;
  height:54px;
  opacity:1;
  border-radius:50%;
  background:rgba(255,255,255,.14);
}
.hero-slider__control span{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  color:#fff;
  font-size:1rem;
}
.hero-slider__control.carousel-control-prev{
  right:126px;
  left:auto;
}
.hero-slider__control.carousel-control-next{
  right:64px;
}
.hero-slider__cards{
  position:absolute;
  right:34px;
  bottom:-86px;
  left:34px;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.hero-feature-card{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:22px;
  border:1px solid rgba(215,229,241,.9);
  border-radius:26px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(16px);
  box-shadow:0 24px 60px rgba(13,40,66,.14);
}
.hero-feature-card__icon{
  flex:0 0 auto;
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--brand-700),var(--brand-500));
  color:#fff;
  font-size:1.05rem;
}
.hero-feature-card h3{
  font-size:1.02rem;
  margin-bottom:7px;
}
.hero-feature-card p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}
.hero-media{
  position:relative;
  z-index:1;
  display:grid;
  gap:18px;
}
.hero-poster{
  border-radius:28px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-soft);
}
.hero-poster img,
.gallery-card img,
.treatment-card__media img,
.doctor-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.hero-poster img{min-height:220px}
.hero-badges{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.hero-badges--standalone{
  margin-top:0;
}
.mini-card,
.info-card,
.treatment-card,
.doctor-card,
.gallery-card,
.contact-panel,
.appointment-card,
.trust-card,
.faq-item{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
}
.mini-card{
  padding:16px 18px;
}
.mini-card h3,
.info-card h3,
.trust-card h3{
  font-size:1rem;
  margin-bottom:6px;
}
.mini-card p,
.info-card p,
.trust-card p{
  color:var(--muted);
  margin-bottom:0;
  font-size:.95rem;
}
.appointment-card{
  position:relative;
  padding:28px;
  overflow:hidden;
}
.appointment-card::before{
  content:'';
  position:absolute;
  inset:auto -40px -60px auto;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(124,200,239,.34), transparent 70%);
}
.appointment-card .form-label,
.contact-panel .form-label{
  font-size:.9rem;
  font-weight:700;
  color:var(--ink);
  margin-bottom:8px;
}
.form-control,
.custom-select,
.appointment-card select,
.appointment-card textarea,
.contact-panel input,
.contact-panel textarea{
  border-radius:16px;
  border:1px solid #cdddea;
  min-height:50px;
  box-shadow:none;
  background:#fff;
}
.form-control:focus,
.custom-select:focus,
.appointment-card select:focus,
.appointment-card textarea:focus,
.contact-panel input:focus,
.contact-panel textarea:focus{
  border-color:var(--brand-500);
  box-shadow:0 0 0 .2rem rgba(45,140,200,.12);
}
.appointment-card textarea,
.contact-panel textarea{min-height:130px}

.section-shell{
  padding:88px 0;
}
.section-title{
  max-width:780px;
  margin:0 auto 34px;
  text-align:center;
}
.section-title h2,
.section-title h1{
  font-size:clamp(1.8rem,2.8vw,3rem);
  letter-spacing:-.03em;
  margin-bottom:12px;
}
.section-title p,
.section-lead{
  max-width:740px;
  margin:0 auto;
}

.card-grid{
  display:grid;
  gap:22px;
}
.treatment-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.treatment-card{
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.treatment-card:hover,
.doctor-card:hover,
.gallery-card:hover,
.trust-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 60px rgba(13,40,66,.14);
}
.treatment-card__media{
  aspect-ratio:4/3;
  overflow:hidden;
}
.treatment-card__body,
.doctor-card__body,
.gallery-card__body,
.contact-panel,
.trust-card{
  padding:22px;
}
.treatment-card__body h3,
.doctor-card__body h3,
.gallery-card__body h3{
  font-size:1.08rem;
  margin-bottom:8px;
}
.treatment-card__body p,
.doctor-card__body p,
.gallery-card__body p{
  color:var(--muted);
  margin-bottom:16px;
}

.doctor-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.doctor-card__media{
  aspect-ratio:4/5;
}
.doctor-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:12px 0 0;
}
.doctor-meta span,
.badge-soft{
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border-radius:999px;
  background:var(--sky);
  color:var(--brand-700);
  font-size:.85rem;
  font-weight:700;
}

.trust-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.trust-card{
  display:flex;
  gap:16px;
  align-items:flex-start;
}
.trust-icon{
  width:50px;
  height:50px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--brand-700),var(--brand-500));
  color:#fff;
  flex:0 0 auto;
}

.faq-list{
  display:grid;
  gap:14px;
}
.faq-item{
  overflow:hidden;
}
.faq-item summary{
  list-style:none;
  cursor:pointer;
  padding:22px 24px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:'+';
  font-size:1.5rem;
  line-height:1;
  color:var(--brand-700);
}
.faq-item[open] summary::after{content:'–'}
.faq-item .faq-answer{
  padding:0 24px 22px;
  color:var(--muted);
  line-height:1.75;
}

.gallery-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.gallery-card{
  overflow:hidden;
  cursor:pointer;
  border:0;
  padding:0;
  width:100%;
  text-align:left;
  background:transparent;
}
.gallery-card__media{
  aspect-ratio:4/3;
  overflow:hidden;
}

.page-hero{
  padding:44px 0 24px;
}
.page-hero__shell{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  background:linear-gradient(135deg, #fff, #eef6fb);
  box-shadow:var(--shadow);
}
.page-hero__shell::after{
  content:'';
  position:absolute;
  inset:0;
  background-image:url('../images/info-image/WhatsApp Image 2026-08-04 at 12.16.29.jpeg');
  background-size:cover;
  background-position:center;
  opacity:.05;
}
.page-hero__content{
  position:relative;
  z-index:1;
  padding:36px;
}

.contact-grid{
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
}
.contact-list{
  display:grid;
  gap:14px;
  margin-top:22px;
}
.contact-pill{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:16px 18px;
  border-radius:18px;
  background:var(--sky);
  color:inherit;
  text-decoration:none;
}
.contact-pill:hover{color:inherit}
.contact-pill i{
  font-size:1.1rem;
  color:var(--brand-700);
}
.map-shell{
  margin-top:30px;
  border-radius:28px;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:#fff;
}
.map-shell iframe{
  display:block;
  width:100%;
  min-height:420px;
  border:0;
}

.footer-area{
  background:linear-gradient(180deg,var(--brand-950),#081b2d);
  color:#dce8f3;
  padding-top:72px;
}
.footer-area .container-md{
  padding-left:clamp(14px,2.8vw,32px);
  padding-right:clamp(14px,2.8vw,32px);
}
.footer-area a{color:#fff}
.footer-area .trust-card{
  background:rgba(255,255,255,.98);
}
.footer-area .trust-card h3{
  color:var(--ink);
}
.footer-area .trust-card p{
  color:var(--muted);
}
.footer-area .trust-card a{
  color:var(--brand-900);
  font-weight:700;
}
.footer-area .trust-card a:hover{
  color:var(--brand-600);
}
.footer-area .logo{
  margin-bottom:28px;
}
.footer-quick-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 18px;
}
.footer-quick-links a{
  color:#dce8f3;
}
.copyright-area{
  border-top:1px solid rgba(255,255,255,.08);
  margin-top:30px;
  background:transparent !important;
}

.makeappo,
.whatsapp-btn{
  position:fixed;
  left:18px;
  z-index:1030;
  box-shadow:var(--shadow);
}
.makeappo{
  bottom:92px;
  width:auto;
  min-width:60px;
  height:60px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--brand-700),var(--brand-500));
}
.makeappo a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 18px;
  height:60px;
  color:#fff !important;
  font-weight:700;
}
.makeappo svg{flex:0 0 auto}
.makeappo span{
  position:static !important;
  margin-left:0 !important;
  background:transparent !important;
  visibility:visible !important;
  opacity:1 !important;
  padding:0 !important;
}
.whatsapp-btn{
  bottom:18px;
  width:auto;
  min-width:60px;
  height:60px;
  border-radius:999px;
  background:#25d366;
}
.whatsapp-btn a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
}
.whatsapp-btn svg{
  width:28px;
}

.go-top{
  right:18px !important;
  bottom:18px !important;
  background:linear-gradient(135deg,var(--brand-700),var(--brand-500)) !important;
}
.go-top::before{background:linear-gradient(135deg,var(--brand-500),var(--accent)) !important}

.hero-copy .badge-soft,
.page-hero .badge-soft{
  margin-bottom:12px;
}

@media (max-width: 1199.98px){
  .hero-section{
    padding-bottom:88px;
  }
  .hero-slider__cards{
    position:relative;
    right:auto;
    bottom:auto;
    left:auto;
    margin-top:22px;
    grid-template-columns:1fr;
  }
  .treatment-grid,
  .gallery-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .doctor-grid,
  .trust-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 767.98px){
  .section-shell{
    padding:68px 0;
  }
  .hero-section{
    padding-bottom:68px;
  }
  .hero-shell,
  .page-hero__shell{
    border-radius:28px;
  }
  .hero-slider{
    border-radius:28px;
  }
  .hero-slide{
    min-height:540px;
    padding:28px 24px 108px;
    align-items:flex-end;
  }
  .hero-slide__content h1{
    font-size:clamp(2rem,10vw,3.2rem);
  }
  .hero-slide__content p{
    font-size:1rem;
  }
  .hero-slider__indicators{
    left:24px;
    bottom:68px;
  }
  .hero-slider__control{
    width:46px;
    height:46px;
    bottom:20px;
  }
  .hero-slider__control span{
    width:46px;
    height:46px;
  }
  .hero-slider__control.carousel-control-prev{
    right:78px;
  }
  .hero-slider__control.carousel-control-next{
    right:24px;
  }
  .hero-copy,
  .page-hero__content{
    padding:24px;
  }
  .hero-badges{
    grid-template-columns:1fr;
  }
  .hero-slide__highlights{
    gap:10px;
  }
  .hero-slide__highlights span{
    width:100%;
    justify-content:center;
  }
  .hero-feature-card{
    padding:18px;
  }
  .footer-quick-links{
    justify-content:flex-start;
  }
  .top-header{
    padding:8px 0 !important;
  }
  .footer-area{
    padding-top:56px;
  }
  .makeappo,
  .whatsapp-btn{
    left:12px;
  }
  .makeappo{
    width:56px;
    min-width:56px;
    height:56px;
    border-radius:50%;
  }
  .makeappo a{
    justify-content:center;
    width:56px;
    height:56px;
    padding:0;
  }
  .makeappo span{
    display:none;
  }
  .go-top{
    right:12px !important;
  }
}

@media (max-width: 575.98px){
  .treatment-grid,
  .gallery-grid{
    grid-template-columns:1fr;
  }
  .hero-actions{
    flex-direction:column;
  }
  .appointment-card{
    padding:20px;
  }
}