/* =========================================================
   Bright Smiles Dental Care - Clean Homepage Stylesheet
   Use for index.html. Keep Bootstrap loaded separately.
   ========================================================= */

/* ---------- Brand variables ---------- */
:root{
  --brand:#214A8B;
  --brand-dark:#0E2A47;
  --brand-mid:#163A6B;
  --brand-light:#EAF2FB;
  --accent:#e04423;
  --accent-dark:#b83218;
  --accent-soft:#FFF3EF;
  --soft-bg:#F5F8FC;
  --text-main:#111827;
  --text-muted:#6B7280;
  --white:#fff;
  --shadow-sm:0 10px 28px rgba(33,74,139,.08);
  --shadow-md:0 18px 50px rgba(14,42,71,.12);
  --shadow-lg:0 30px 80px rgba(14,42,71,.20);
}

/* ---------- Base ---------- */
*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:'Plus Jakarta Sans', Arial, sans-serif;
  color:var(--text-main);
  background:#fff;
  overflow-x:hidden;
}

img{
  max-width:100%;
  height:auto;
}

a{
  transition:color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease;
}

.py{
  padding:90px 0;
}

.section-label{
  display:inline-block;
  margin-bottom:1rem;
  color:var(--brand);
  font-size:1rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.services-heading{
  color:var(--brand-dark);
  font-size:clamp(2rem,4vw,3rem);
  font-weight:900;
  line-height:1.15;
  letter-spacing:-1px;
  margin-bottom:14px;
}

.services-sub{
  max-width:680px;
  margin:0 auto;
  color:var(--text-muted);
  font-size:1.02rem;
  line-height:1.75;
}

/* =========================================================
   Header / Navigation
   ========================================================= */
.bs-header{
  position:sticky;
  top:0;
  z-index:9999;
  background:#fff;
  box-shadow:0 8px 26px rgba(33,74,139,.08);
}

.bs-header-top{
  background:#fff;
}

.bs-header-inner{
  min-height:140px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.bs-logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}

.bs-logo img{
  width:294px;
  max-width:100%;
  height:auto;
  display:block;
}

.bs-header-info{
  display:flex;
  align-items:center;
  gap:28px;
  margin-left:auto;
}

.bs-contact{
  text-align:right;
  line-height:1.2;
}

.bs-contact-label{
  display:block;
  margin-bottom:4px;
  color:var(--brand);
  font-size:.75rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.bs-contact a{
  display:block;
  color:var(--brand);
  font-size:1.75rem;
  font-weight:900;
  text-decoration:none;
}

.bs-contact a:hover{
  color:var(--accent);
}

.bs-contact p{
  margin:6px 0 0;
  color:var(--brand);
  font-size:1rem;
  font-weight:700;
}

.bs-appointment-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:58px;
  padding:0 30px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  text-decoration:none;
  font-weight:900;
  box-shadow:0 12px 28px rgba(224,68,35,.28);
}

.bs-appointment-btn:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;
  transform:translateY(-2px);
}

.bs-navbar{
  background:var(--brand-dark);
}

.bs-navbar .container-fluid{
  position:relative;
}

.bs-menu > ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.bs-menu > ul > li{
  position:relative;
}

.bs-menu > ul > li > a{
  display:flex;
  align-items:center;
  min-height:58px;
  padding:0 24px;
  color:#fff;
  font-size:.92rem;
  font-weight:900;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.bs-menu > ul > li > a:hover{
  background:var(--accent);
  color:#fff;
}

.has-dropdown > a::after{
  content:"▾";
  margin-left:8px;
  font-size:.75rem;
}

.bs-menu > ul > li > a.menu-appointment{
  min-height:42px;
  margin:8px 10px;
  padding:0 22px;
  border-radius:999px;
  background:var(--accent);
  color:#fff;
  box-shadow:0 10px 24px rgba(224,68,35,.28);
}

.bs-menu > ul > li > a.menu-appointment:hover{
  background:var(--accent-dark);
  color:#fff;
  transform:translateY(-2px);
}

.bs-mega-menu{
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%) translateY(14px);
  width:min(1060px, calc(100vw - 40px));
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
  padding:30px;
  background:#fff;
  border-radius:0 0 24px 24px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  box-shadow:0 26px 70px rgba(14,42,71,.22);
  transition:.25s ease;
}

.has-dropdown:hover .bs-mega-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

.bs-service-col{
  border-right:1px solid #E5E7EB;
  padding-right:18px;
}

.bs-service-col:last-child{
  border-right:0;
}

.bs-service-col h4{
  margin-bottom:14px;
  color:var(--brand);
  font-size:.88rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.bs-service-col a{
  display:block;
  padding:8px 0;
  color:#374151;
  font-size:.9rem;
  font-weight:700;
  text-decoration:none;
}

.bs-service-col a:hover{
  color:var(--accent);
  padding-left:6px;
}

.bs-menu-toggle{
  display:none;
  flex-direction:column;
  align-items:center;
  gap:4px;
  padding:10px 12px;
  border:0;
  border-radius:14px;
  background:var(--brand);
  color:#fff;
}

.bs-menu-toggle span{
  width:24px;
  height:2px;
  display:block;
  background:#fff;
  border-radius:4px;
}

.bs-menu-toggle small{
  font-size:.65rem;
  font-weight:900;
  line-height:1;
}

/* =========================================================
   Hero
   ========================================================= */
.dental-hero-bg{
  position:relative;
  min-height:680px;
  overflow:hidden;
  background:url("../img/banner-bg.jpeg") center right/cover no-repeat;
}

.dental-hero-bg .hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(14,42,71,.92) 0%, rgba(14,42,71,.74) 42%, rgba(14,42,71,.18) 100%);
}

.hero-right-card .min-vh-hero,
.min-vh-hero{
  min-height:620px;
}

.hero-panel{
  max-width:720px;
  padding:70px 0;
  color:#fff;
}

.light-label{
  color:#7DE3F4;
}

.hero-panel h1{
  margin-bottom:22px;
  font-size:clamp(2.7rem,6vw,5.1rem);
  line-height:1.04;
  font-weight:900;
  letter-spacing:-2px;
}

.hero-panel p{
  max-width:620px;
  margin-bottom:34px;
  color:#DCEBFA;
  font-size:1.13rem;
  line-height:1.8;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.btn-hero-primary,
.btn-hero-light{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.9rem 1.7rem;
  border-radius:999px;
  font-weight:900;
  text-decoration:none;
}

.btn-hero-primary{
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  box-shadow:0 12px 28px rgba(224,68,35,.25);
}

.btn-hero-primary:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;
  transform:translateY(-2px);
}

.btn-hero-light{
  background:#fff;
  color:var(--brand);
}

.btn-hero-light:hover{
  background:var(--brand-light);
  color:var(--brand-mid);
  transform:translateY(-2px);
}

.hero-help-card-right{
  padding:32px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.55);
  border-radius:30px;
  box-shadow:0 34px 90px rgba(14,42,71,.28);
}

.help-kicker{
  display:inline-flex;
  margin-bottom:14px;
  padding:7px 13px;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hero-help-card-right h2{
  margin-bottom:20px;
  color:var(--brand-dark);
  font-size:1.75rem;
  font-weight:900;
  line-height:1.2;
}

.hero-help-list{
  display:grid;
  gap:14px;
}

.hero-help-list a{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:16px;
  border:1px solid rgba(33,74,139,.08);
  border-radius:18px;
  background:var(--soft-bg);
  color:var(--brand-dark);
  text-decoration:none;
}

.hero-help-list a:hover{
  background:#fff;
  transform:translateX(6px);
  box-shadow:0 14px 34px rgba(33,74,139,.12);
}

.hero-help-list i{
  width:46px;
  height:46px;
  min-width:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:var(--brand-light);
  color:var(--brand);
  font-size:1.15rem;
}

.hero-help-list strong{
  display:block;
  margin-bottom:4px;
  font-size:.98rem;
  font-weight:900;
}

.hero-help-list span{
  display:block;
  color:var(--text-muted);
  font-size:.82rem;
  line-height:1.45;
}

.help-main-btn{
  display:flex;
  justify-content:center;
  margin-top:20px;
  padding:.9rem 1.4rem;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(224,68,35,.25);
}

.help-main-btn:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;
  transform:translateY(-2px);
}

/* =========================================================
   Welcome
   ========================================================= */
.welcome-section{
  padding:33px 0 70px;
  background:#fff;
  text-align:center;
}

.welcome-inner{
  max-width:1180px;
  margin:0 auto;
}

.welcome-line{
  width:70%;
  height:1px;
  margin:0 auto 15px;
  background:#D8DEE8;
}

.welcome-section h2{
  margin-bottom:18px;
  color:#202020;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(2rem,4vw,3.2rem);
  font-weight:400;
}

.welcome-section h3{
  margin-bottom:28px;
  color:#9CA3AF;
  font-size:1.35rem;
  font-weight:900;
  letter-spacing:.28em;
  text-transform:uppercase;
}

.welcome-section p{
  max-width:1050px;
  margin:0 auto 20px;
  color:#111827;
  font-size:1.15rem;
  line-height:1.9;
}

.welcome-call{
  display:inline-block;
  margin-top:16px;
  color:var(--brand);
  font-size:1.35rem;
  font-weight:900;
  text-transform:uppercase;
  text-decoration:none;
}

.welcome-call:hover{
  color:var(--accent);
}

/* =========================================================
   Services
   ========================================================= */
.services-section{
  background:#f7f9fc;
}

.premium-service-style{
  background:
    radial-gradient(circle at 12% 15%, rgba(224,68,35,.10), transparent 28%),
    radial-gradient(circle at 90% 80%, rgba(33,74,139,.10), transparent 30%),
    #f7f9fc;
}

.premium-service-style .section-label{
  color:var(--accent);
}

.premium-dental-services{
  margin-top:52px;
}

.premium-dental-card{
  position:relative;
  height:100%;
  min-height:315px;
  padding:34px 30px 30px;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(135deg,rgba(224,68,35,.35),rgba(33,74,139,.18)) border-box;
  border:1px solid transparent;
  border-radius:30px;
  box-shadow:0 18px 50px rgba(14,42,71,.08);
  overflow:hidden;
  transition:all .35s ease;
}

.premium-dental-card::before{
  content:"";
  position:absolute;
  right:-105px;
  top:-105px;
  width:210px;
  height:210px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(224,68,35,.16),transparent 68%);
}

.premium-dental-card:hover{
  transform:translateY(-10px);
  box-shadow:0 30px 80px rgba(14,42,71,.16);
}

.service-no{
  position:absolute;
  top:24px;
  right:26px;
  color:rgba(33,74,139,.07);
  font-size:3.4rem;
  font-weight:900;
  line-height:1;
}

.premium-icon{
  width:74px;
  height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
  border:1px solid rgba(224,68,35,.20);
  border-radius:24px;
  background:linear-gradient(135deg,#fff7f4,#eef7ff);
  color:var(--accent);
  font-size:1.8rem;
  box-shadow:0 14px 30px rgba(224,68,35,.10);
  transition:.35s ease;
}

.premium-dental-card:hover .premium-icon{
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  transform:rotate(-5deg) scale(1.06);
}

.service-kicker,
.premium-dental-card .service-kicker{
  display:block;
  margin-bottom:10px;
  color:var(--accent);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.premium-dental-card h3{
  max-width:85%;
  margin-bottom:12px;
  color:var(--brand-dark);
  font-size:1.6rem;
  font-weight:900;
}

.premium-dental-card p{
  margin-bottom:18px;
  color:var(--text-muted);
  font-size:1rem;
  line-height:1.75;
}

.treatment-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.treatment-list span{
  padding:7px 11px;
  border:1px solid rgba(33,74,139,.08);
  border-radius:999px;
  background:var(--soft-bg);
  color:var(--brand);
  font-size:.78rem;
  font-weight:900;
}

.premium-dental-cta{
  background:
    radial-gradient(circle at 90% 10%,rgba(255,255,255,.14),transparent 34%),
    linear-gradient(135deg,var(--brand-dark),var(--brand));
  border:none;
}

.premium-dental-cta .service-no{
  color:rgba(255,255,255,.10);
}

.premium-dental-cta .premium-icon{
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.20);
}

.premium-dental-cta .service-kicker,
.premium-dental-cta h3,
.premium-dental-cta p{
  color:#fff;
}

.premium-service-btn{
  display:inline-flex;
  margin-top:8px;
  padding:.85rem 1.45rem;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(224,68,35,.28);
}

.premium-service-btn:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;
  transform:translateY(-2px);
}

/* =========================================================
   Trust Strip
   ========================================================= */
.trust-strip{
  padding:26px 0;
  background:var(--brand-dark);
  color:#fff;
}

.trust-strip strong{
  display:block;
  font-size:1rem;
  font-weight:900;
}

.trust-strip span{
  display:block;
  margin-top:3px;
  color:#BFD7F2;
  font-size:.82rem;
}

/* =========================================================
   About / Why Choose
   ========================================================= */
.about-premium-section{
  padding:100px 0;
  background:
    radial-gradient(circle at 8% 20%, rgba(224,68,35,.08), transparent 30%),
    linear-gradient(135deg,#ffffff,var(--soft-bg));
  overflow:hidden;
}

.about-premium-image{
  position:relative;
  max-width:620px;
}

.about-premium-image::before{
  content:"";
  position:absolute;
  left:-18px;
  top:22px;
  width:100%;
  height:100%;
  border-radius:34px;
  background:var(--brand-light);
  z-index:0;
}

.about-premium-image::after{
  content:"";
  position:absolute;
  right:-20px;
  bottom:-20px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:rgba(224,68,35,.15);
  z-index:0;
}

.about-premium-image img{
  position:relative;
  z-index:1;
  width:100%;
  height:560px;
  object-fit:cover;
  border-radius:34px;
  box-shadow:0 30px 80px rgba(33,74,139,.18);
}

.image-badge{
  position:absolute;
  z-index:3;
  padding:16px 20px;
  border:1px solid rgba(33,74,139,.10);
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 42px rgba(14,42,71,.16);
}

.image-badge span{
  display:block;
  color:var(--text-muted);
  font-size:.75rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.image-badge strong{
  display:block;
  margin-top:4px;
  color:var(--brand);
  font-size:1rem;
  font-weight:900;
}

.top-badge{
  top:34px;
  right:-26px;
}

.bottom-badge{
  bottom:36px;
  left:-26px;
}

.about-premium-heading{
  margin-bottom:18px;
  color:var(--brand-dark);
  font-size:clamp(2rem,4vw,3.2rem);
  font-weight:900;
  line-height:1.12;
  letter-spacing:-1px;
}

.about-premium-text{
  margin-bottom:28px;
  color:var(--text-muted);
  font-size:1.05rem;
  line-height:1.8;
}

.about-feature-list{
  display:grid;
  gap:18px;
}

.about-feature{
  display:flex;
  gap:16px;
  padding:18px;
  border:1px solid rgba(33,74,139,.08);
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 34px rgba(33,74,139,.06);
}

.about-feature:hover{
  transform:translateX(6px);
  box-shadow:0 18px 44px rgba(33,74,139,.12);
}

.about-feature-icon{
  width:52px;
  height:52px;
  min-width:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:var(--accent-soft);
  color:var(--accent);
  font-size:1.25rem;
}

.about-feature h3{
  margin-bottom:6px;
  color:var(--brand-dark);
  font-size:1rem;
  font-weight:900;
}

.about-feature p{
  margin:0;
  color:var(--text-muted);
  font-size:1.1rem;
  line-height:1.65;
}

.about-premium-quote{
  margin-top:26px;
  padding:20px 24px;
  border-left:5px solid var(--accent);
  border-radius:0 18px 18px 0;
  background:#fff;
  box-shadow:0 12px 34px rgba(33,74,139,.06);
}

.about-premium-quote p{
  margin:0;
  color:var(--brand-dark);
  font-weight:900;
  font-style:italic;
  line-height:1.7;
}

/* =========================================================
   New Patients
   ========================================================= */
.new-patient-section{
  background:linear-gradient(135deg,var(--brand-dark),var(--brand));
  color:#fff;
}

.new-patient-section .section-label,
.new-patient-section .services-heading{
  color:#fff;
}

.new-patient-section .services-sub{
  color:#D6E7FA;
}

.patient-step{
  height:100%;
  padding:26px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:22px;
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
}

.patient-step span{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  border-radius:50%;
  background:#fff;
  color:var(--brand);
  font-weight:900;
}

.patient-step h3{
  color:#fff;
  font-size:1.05rem;
  font-weight:900;
}

.patient-step p{
  margin:0;
  color:#D6E7FA;
}

/* =========================================================
   FAQ
   ========================================================= */
.faq-section{
  background:#fff;
}

.faq-image-wrap{
  position:relative;
  overflow:hidden;
  border-radius:32px;
  box-shadow:0 28px 70px rgba(33,74,139,.16);
}

.faq-image-wrap::before{
  content:"";
  position:absolute;
  inset:18px;
  z-index:2;
  border:2px solid rgba(255,255,255,.55);
  border-radius:24px;
  pointer-events:none;
}

.faq-image-wrap img{
  width:100%;
  height:455px;
  object-fit:cover;
  display:block;
}

.faq-heading{
  margin-bottom:14px;
  color:var(--brand-dark);
  font-size:clamp(2rem,4vw,3.1rem);
  font-weight:900;
}

.faq-sub{
  max-width:640px;
  margin-bottom:28px;
  color:var(--text-muted);
  line-height:1.8;
  font-size: 1.32rem;
}

.faq-accordion{
  display:grid;
  gap:14px;
}

.faq-item{
  overflow:hidden;
  border:1px solid rgba(33,74,139,.10);
  border-radius:18px;
  background:var(--soft-bg);
  transition:.25s ease;
}

.faq-item.active{
  background:#fff;
  box-shadow:0 18px 45px rgba(33,74,139,.10);
}

.faq-question{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 22px;
  border:0;
  background:transparent;
  color:var(--brand-dark);
  font-size:1.2rem;
  font-weight:900;
  text-align:left;
  cursor:pointer;
}

.faq-question span{
  width:34px;
  height:34px;
  min-width:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--brand-light);
  color:var(--brand);
  font-size:1.25rem;
  transition:.25s ease;
}

.faq-item.active .faq-question span{
  background:var(--accent);
  color:#fff;
  font-size:0;
}

.faq-item.active .faq-question span::before{
  content:"−";
  font-size:1.25rem;
}

.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
}

.faq-answer p{
  margin:0;
  padding:0 22px 20px;
  color:var(--text-muted);
  line-height:1.75;
  font-size: 1rem;
}

.faq-item.active .faq-answer{
  max-height:240px;
}

/* =========================================================
   Contact Map
   ========================================================= */
.contact-map-premium{
  position:relative;
  min-height:680px;
  overflow:hidden;
  background:var(--soft-bg);
}

.contact-map-premium > iframe{
  width:100%;
  height:680px;
  border:0;
  display:block;
  filter:saturate(.9) contrast(.95);
}

.contact-floating-card{
  position:absolute;
  top:50%;
  right:clamp(20px,5vw,80px);
  transform:translateY(-50%);
  width:min(480px, calc(100% - 40px));
  z-index:2;
  padding:38px;
  border:1px solid rgba(33,74,139,.10);
  border-radius:30px;
  background:#fff;
  box-shadow:0 34px 90px rgba(14,42,71,.28);
}

.contact-floating-card .tag{
  color:var(--accent);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.contact-floating-card h2{
  margin:14px 0;
  color:var(--brand-dark);
  font-size:2.15rem;
  font-weight:900;
  line-height:1.15;
}

.contact-floating-card .desc{
  margin-bottom:22px;
  color:var(--text-muted);
  line-height:1.75;
}

.contact-details{
  margin-bottom:0;
}

.contact-floating-card .detail-item{
  display:flex;
  gap:14px;
  margin-top:18px;
}

.contact-floating-card .icon{
  width:46px;
  height:46px;
  min-width:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:var(--accent-soft);
  color:var(--accent);
}

.contact-floating-card h4{
  margin-bottom:4px;
  color:var(--brand-dark);
  font-size:.95rem;
  font-weight:900;
}

.contact-floating-card p,
.contact-floating-card a{
  margin:0;
  color:var(--text-muted);
  text-decoration:none;
}

.contact-floating-card a:hover{
  color:var(--brand);
}

.cta-group,
.contact-floating-card .cta-group{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.btn-primary,
.contact-floating-card .btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.8rem 1.4rem;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff;
  font-weight:900;
  text-decoration:none;
  border:0;
}

.btn-primary:hover,
.contact-floating-card .btn-primary:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;
  transform:translateY(-2px);
}

.btn-outline,
.contact-floating-card .btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.8rem 1.4rem;
  border:1px solid rgba(33,74,139,.20);
  border-radius:999px;
  background:#fff;
  color:var(--brand);
  font-weight:900;
  text-decoration:none;
}

.btn-outline:hover,
.contact-floating-card .btn-outline:hover{
  background:var(--brand-light);
  color:var(--brand-mid);
  transform:translateY(-2px);
}

.trust,
.contact-floating-card .trust{
  margin-top:20px;
  color:var(--brand);
  font-size:.86rem;
  font-weight:900;
}

/* =========================================================
   Footer
   ========================================================= */
.zn-footer{
  padding:70px 0 0;
  background:var(--brand-dark);
  color:#fff;
}

.footer-brand-logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  margin-bottom:1rem;
}

.footer-brand-logo img{
  width:190px;
  height:auto;
  padding:8px 12px;
  border-radius:14px;
  background:#fff;
}

.footer-tagline{
  margin-bottom:1.5rem;
  color:#C9D8EA;
  font-size:.9rem;
  line-height:1.7;
}

.zn-cta,
.footer-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  padding:.7rem 1.5rem;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),#ff704d);
  color:#fff !important;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(224,68,35,.24);
}

.zn-cta:hover,
.footer-cta:hover{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff !important;
  transform:translateY(-2px);
}

.footer-col-title{
  margin-bottom:1.25rem;
  color:#fff;
  font-size:.95rem;
  font-weight:900;
}

.footer-links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.65rem;
}

.footer-links a,
.footer-contact-list a,
.footer-bottom-links a{
  color:#C9D8EA;
  text-decoration:none;
}

.footer-links a:hover,
.footer-contact-list a:hover,
.footer-bottom-links a:hover{
  color:#fff;
}

.footer-contact-list p{
  margin-bottom:.75rem;
  color:#C9D8EA;
  font-size:.9rem;
  line-height:1.6;
}

.footer-contact-list i{
  color:var(--accent);
}

.footer-map iframe{
  width:100%;
  height:160px;
  border:0;
  border-radius:16px;
}

.footer-bottom{
  margin-top:2.5rem;
  padding:1.5rem 0;
  border-top:1px solid rgba(255,255,255,.14);
}

.footer-copy{
  margin:0;
  color:#C9D8EA;
  font-size:.86rem;
}

.footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:1.5rem;
}

/* =========================================================
   Responsive
   ========================================================= */
@media(max-width:991px){
  .py{
    padding:70px 0;
  }

  .bs-header-inner{
    min-height:82px;
  }

  .bs-logo img{
    width:210px;
  }

  .bs-header-info{
    display:none;
  }

  .bs-menu-toggle{
    display:flex;
  }

  .bs-navbar{
    background:#fff;
  }

  .bs-menu{
    display:none;
    padding:12px 0 18px;
    border-top:1px solid #E5E7EB;
  }

  .bs-menu.open{
    display:block;
  }

  .bs-menu > ul{
    flex-direction:column;
    align-items:stretch;
  }

  .bs-menu > ul > li > a{
    min-height:48px;
    justify-content:space-between;
    padding:0 4px;
    color:var(--brand-dark);
  }

  .bs-menu > ul > li > a:hover{
    background:var(--soft-bg);
    color:var(--brand);
  }

  .bs-menu > ul > li > a.menu-appointment{
    justify-content:center;
    margin:12px 0 0;
    color:#fff;
  }

  .bs-mega-menu{
    position:static;
    width:100%;
    display:none;
    grid-template-columns:1fr;
    padding:16px;
    border-radius:18px;
    background:var(--soft-bg);
    box-shadow:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }

  .has-dropdown.open .bs-mega-menu{
    display:grid;
  }

  .has-dropdown:hover .bs-mega-menu{
    transform:none;
  }

  .bs-service-col{
    padding:0 0 12px;
    border-right:0;
    border-bottom:1px solid #E5E7EB;
  }

  .bs-service-col:last-child{
    border-bottom:0;
  }

  .dental-hero-bg{
    min-height:auto;
  }

  .dental-hero-bg .hero-overlay{
    background:rgba(14,42,71,.82);
  }

  .hero-right-card .min-vh-hero,
  .min-vh-hero{
    min-height:auto;
    padding:55px 0 45px;
  }

  .hero-panel{
    padding:0;
  }

  .hero-help-card-right{
    padding:24px;
  }

  .about-premium-section{
    padding:70px 0;
  }

  .about-premium-image img{
    height:420px;
  }

  .top-badge{
    right:16px;
  }

  .bottom-badge{
    left:16px;
  }

  .faq-image-wrap img{
    height:420px;
  }

  .contact-map-premium{
    min-height:auto;
    padding:0 16px 40px;
  }

  .contact-map-premium > iframe{
    height:360px;
    border-radius:0 0 24px 24px;
  }

  .contact-floating-card{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    width:100%;
    margin:-70px auto 0;
    padding:28px;
  }

  .contact-floating-card h2{
    font-size:1.75rem;
  }
}

@media(max-width:575px){
  .py{
    padding:60px 0;
  }

  .bs-logo img{
    width:180px;
  }

  .hero-panel h1{
    font-size:2.35rem;
    letter-spacing:-1px;
  }

  .hero-panel p{
    font-size:1rem;
  }

  .hero-actions,
  .cta-group,
  .contact-floating-card .cta-group{
    flex-direction:column;
  }

  .btn-hero-primary,
  .btn-hero-light,
  .btn-primary,
  .btn-outline,
  .contact-floating-card .btn-primary,
  .contact-floating-card .btn-outline{
    width:100%;
    text-align:center;
  }

  .welcome-section{
    padding:55px 0;
  }

  .welcome-section h3{
    font-size:.95rem;
    letter-spacing:.16em;
  }

  .welcome-section p{
    font-size:1rem;
  }

  .welcome-call{
    font-size:1.05rem;
  }

  .premium-dental-card{
    padding:30px 24px;
  }

  .premium-dental-card h3{
    max-width:100%;
    font-size:1.35rem;
  }

  .service-no{
    font-size:2.7rem;
  }

  .about-feature{
    flex-direction:column;
  }

  .image-badge{
    padding:12px 14px;
  }

  .faq-question{
    padding:18px;
  }

  .faq-answer p{
    padding:0 18px 18px;
  }

  .footer-bottom-links{
    justify-content:center;
  }
}
/* ==============================
   SMALLER HEADER
================================ */
/* Smaller desktop header */
.bs-header-inner{
  min-height:88px;
}

.bs-logo img{
  width:210px;
}



.bs-contact p{
  font-size:.8rem;
}

.bs-menu > ul > li > a{
  min-height:46px;
  padding:0 16px;
  font-size:.8rem;
}

/* Hero */
.hero-centered-card{
  position:relative;
  min-height:560px;
  margin-bottom:0;
  background:url("../img/banner-bg.jpeg") center right/cover no-repeat;
  overflow:hidden;
}

.hero-centered-card .hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      rgba(14,42,71,.92) 0%,
      rgba(14,42,71,.78) 45%,
      rgba(14,42,71,.38) 100%
    );
}

.hero-centered-inner{
  position:relative;
  z-index:2;
  min-height:560px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  padding-top:42px;
  padding-bottom:34px;
}

/* Center top text */
.hero-panel-top{
  width:100%;
  max-width:850px;
  margin:0 auto 26px;
  padding:0;
  color:#fff;
  text-align:center;
}

.hero-panel-top h1{
  max-width:820px;
  margin:0 auto 16px;
  font-size:clamp(2.4rem,5vw,3.35rem);
  line-height:1.05;
  font-weight:900;
  letter-spacing:-1.6px;
}

.hero-panel-top p{
  max-width:760px;
  margin:0 auto;
  color:#DCEBFA;
  font-size:1.02rem;
  line-height:1.65;
}

/* Quick Help horizontal card */
.hero-help-horizontal{
  width:min(1080px,100%);
  margin:0 auto;
  padding:24px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:28px;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(14px);
  box-shadow:0 26px 70px rgba(14,42,71,.26);
}

.hero-help-header{
  text-align:center;
  margin-bottom:18px;
}

.help-kicker{
  display:inline-flex;
  margin-bottom:9px;
  padding:7px 13px;
  border-radius:999px;
  background:#FFF3EF;
  color:#e04423;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hero-help-header h2{
  margin:0;
  color:#0E2A47;
  font-size:1.45rem;
  font-weight:900;
  line-height:1.2;
}

.hero-help-list-horizontal{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.hero-help-list-horizontal a{
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding:16px;
  border:1px solid rgba(33,74,139,.08);
  border-radius:18px;
  background:#F5F8FC;
  color:#0E2A47;
  text-decoration:none;
  transition:.25s ease;
}

.hero-help-list-horizontal a:hover{
  background:#fff;
  transform:translateY(-4px);
  box-shadow:0 14px 34px rgba(33,74,139,.12);
}

.hero-help-list-horizontal i{
  width:44px;
  height:44px;
  min-width:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:#EAF2FB;
  color:#214A8B;
  font-size:1.1rem;
}

.hero-help-list-horizontal strong{
  display:block;
  margin-bottom:4px;
  font-size:.93rem;
  font-weight:900;
}

.hero-help-list-horizontal span{
  display:block;
  color:#6B7280;
  font-size:.8rem;
  line-height:1.4;
}

/* Buttons inside Quick Help card */
.hero-help-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}

.help-main-btn-center,
.help-call-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.82rem 1.45rem;
  border-radius:999px;
  font-weight:900;
  text-decoration:none;
}

.help-main-btn-center{
  background:linear-gradient(135deg,#e04423,#ff704d);
  color:#fff;
  box-shadow:0 12px 28px rgba(224,68,35,.25);
}

.help-main-btn-center:hover{
  color:#fff;
  background:linear-gradient(135deg,#b83218,#e04423);
  transform:translateY(-2px);
}

.help-call-btn{
  background:#fff;
  color:#214A8B;
  border:1px solid rgba(33,74,139,.18);
}

.help-call-btn:hover{
  background:#EAF2FB;
  color:#0E2A47;
  transform:translateY(-2px);
}

/* Tablet */
@media(max-width:991px){
  .bs-header-inner{
    min-height:76px;
  }

  .bs-logo img{
    width:180px;
  }

  .hero-centered-card,
  .hero-centered-inner{
    min-height:auto;
  }

  .hero-centered-inner{
    padding-top:42px;
    padding-bottom:36px;
  }

  .hero-panel-top{
    margin-bottom:24px;
  }

  .hero-help-list-horizontal{
    grid-template-columns:1fr;
  }

  .hero-help-horizontal{
    padding:22px;
  }
}

/* Mobile */
@media(max-width:575px){
  .hero-centered-inner{
    padding-top:34px;
    padding-bottom:30px;
  }

  .hero-panel-top h1{
    font-size:2.05rem;
    letter-spacing:-1px;
  }

  .hero-panel-top p{
    font-size:.95rem;
    line-height:1.6;
  }

  .hero-help-horizontal{
    padding:20px;
    border-radius:22px;
  }

  .hero-help-header h2{
    font-size:1.25rem;
  }

  .hero-help-list-horizontal a{
    padding:15px;
  }

  .hero-help-actions{
    flex-direction:column;
  }

  .help-main-btn-center,
  .help-call-btn{
    width:100%;
  }
}

/* =========================================================
   FIX DESKTOP DROPDOWN / MEGA MENU POSITION
   Prevent first submenu from going off-screen
========================================================= */

@media (min-width: 992px) {

  .bs-navbar .container-fluid {
    position: relative;
  }

  .bs-menu > ul > li {
    position: static;
  }

  .bs-mega-menu {
    left: 50%;
    right: auto;
    top: 100%;
    transform: translateX(-50%) translateY(14px);
    width: min(1060px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
  }

  .has-dropdown:hover .bs-mega-menu {
    transform: translateX(-50%) translateY(0);
  }

}


/* ================= ABOUT US SMALL HERO ================= */

.about-small-hero {
  padding: 90px 0 70px;
  background:
    linear-gradient(135deg, rgba(7, 45, 67, 0.92), rgba(7, 73, 96, 0.86)),
    url("../img/banner-bg.jpeg") center/cover no-repeat;
  color: #fff;
  position: relative;
}

.about-small-hero-inner {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}

.about-small-hero .section-label {
  color: #ffb15c;
  margin-bottom: 14px;
  display: inline-block;
}

.about-small-hero h1 {
  font-size: clamp(2.1rem, 4vw, 3rem);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -1px;
  margin-bottom: 18px;
}

.about-small-hero p {
  max-width: 720px;
  margin: 0 auto 28px;
  font-size: 1.08rem;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.9);
}

.about-small-hero-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}


/* ================= ABOUT PATH CARDS ================= */

.about-path-section {
  padding: 80px 0;
  background: #f8fbfc;
}

.about-path-heading {
  max-width: 760px;
  margin: 0 auto 42px;
}

.about-path-heading h2 {
  font-size: clamp(2rem, 4vw, 2.75rem);
  line-height: 1.15;
  font-weight: 850;
  color: #12384a;
  margin-bottom: 14px;
}

.about-path-heading p {
  font-size: 1.04rem;
  line-height: 1.75;
  color: #5c6f7a;
  margin-bottom: 0;
}

.about-path-card {
  height: 100%;
  background: #ffffff;
  border-radius: 28px;
  padding: 34px 30px;
  border: 1px solid rgba(18, 56, 74, 0.08);
  box-shadow: 0 18px 45px rgba(18, 56, 74, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  position: relative;
  overflow: hidden;
}

.about-path-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 60px rgba(18, 56, 74, 0.13);
}

.about-path-featured {
  background: linear-gradient(145deg, #ffffff, #fff7ee);
  border-color: rgba(239, 137, 45, 0.2);
}

.about-path-icon {
  width: 64px;
  height: 64px;
  border-radius: 20px;
  background: #fff1df;
  color: #e8791a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.55rem;
  margin-bottom: 22px;
}

.about-path-kicker {
  display: block;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #e8791a;
  margin-bottom: 10px;
}

.about-path-card h3 {
  font-size: 1.55rem;
  line-height: 1.25;
  font-weight: 850;
  color: #12384a;
  margin-bottom: 14px;
}

.about-path-card p {
  color: #5c6f7a;
  line-height: 1.75;
  font-size: 0.98rem;
  margin-bottom: 24px;
}

.about-path-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #12384a;
  font-weight: 800;
  text-decoration: none;
}

.about-path-link span {
  transition: transform 0.2s ease;
}

.about-path-link:hover span {
  transform: translateX(4px);
}


/* ================= MOBILE FIXES ================= */

@media (max-width: 767px) {
  .about-small-hero {
    padding: 70px 0 55px;
  }

  .about-small-hero h1 {
    font-size: 2rem;
  }

  .about-small-hero p {
    font-size: 1rem;
  }

  .about-small-hero-actions {
    flex-direction: column;
  }

  .about-small-hero-actions a {
    width: 100%;
    text-align: center;
  }

  .about-path-section {
    padding: 60px 0;
  }

  .about-path-card {
    padding: 28px 24px;
    border-radius: 22px;
  }
}


/* =========================================================
   SMALL ABOUT US DROPDOWN
========================================================= */

@media (min-width: 992px) {

  .about-dropdown {
    position: relative !important;
  }

  .about-dropdown-menu {
    width: 280px;
    min-width: 280px;
    display: block;
    left: 50%;
    transform: translateX(-50%) translateY(14px);
    padding: 18px 22px;
    border-radius: 0 0 20px 20px;
  }

  .about-dropdown:hover .about-dropdown-menu {
    transform: translateX(-50%) translateY(0);
  }

  .about-dropdown-menu .bs-service-col {
    border-right: 0;
    padding-right: 0;
  }

  .about-dropdown-menu .bs-service-col a {
    padding: 10px 0;
  }

}


/* =========================================================
   FINAL DESKTOP DROPDOWN FIX
   Services = large mega menu
   About Us = small dropdown
========================================================= */

@media (min-width: 992px) {

  /* Keep navbar as positioning area */
  .bs-navbar .container-fluid {
    position: relative;
  }

  /* Main menu items */
  .bs-menu > ul > li {
    position: relative;
  }

  /* =========================
     SERVICES MEGA MENU
  ========================= */

  .services-dropdown {
    position: static !important;
  }

  .services-mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    width: min(1060px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
    transform: translateX(-50%) translateY(14px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    padding: 30px;
    background: #fff;
    border-radius: 0 0 24px 24px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    box-shadow: 0 26px 70px rgba(14,42,71,.22);
    z-index: 10000;
  }

  .services-dropdown:hover .services-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  /* =========================
     ABOUT SMALL DROPDOWN
  ========================= */

  .about-dropdown {
    position: relative !important;
  }

  .about-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 260px;
    padding: 14px 0;
    background: #fff;
    border-radius: 0 0 18px 18px;
    box-shadow: 0 22px 55px rgba(14,42,71,.20);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px);
    transition: .25s ease;
    z-index: 10000;
  }

  .about-dropdown:hover .about-submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .about-submenu a {
    display: block;
    padding: 12px 22px;
    color: #374151;
    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
  }

  .about-submenu a:hover {
    color: #e04423;
    background: #FFF3EF;
    padding-left: 28px;
  }
}


@media (min-width: 992px) {

  .bs-navbar {
    overflow: visible;
  }

  .bs-navbar .container-fluid {
    position: relative;
    overflow: visible;
  }

  .bs-menu,
  .bs-menu > ul,
  .bs-menu > ul > li {
    overflow: visible;
  }

  .bs-menu > ul > li {
    position: relative;
  }

  /* Services large dropdown */
  .services-dropdown {
    position: static !important;
  }

  .services-mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    width: min(1060px, calc(100vw - 40px));
    max-width: calc(100vw - 40px);
    transform: translateX(-50%) translateY(14px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    padding: 30px;
    background: #fff;
    border-radius: 0 0 24px 24px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    box-shadow: 0 26px 70px rgba(14,42,71,.22);
    z-index: 10000;
  }

  .services-dropdown:hover .services-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  /* About small dropdown */
  .about-dropdown {
    position: relative !important;
  }

  .about-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 260px;
    padding: 14px 0;
    background: #fff;
    border-radius: 0 0 18px 18px;
    box-shadow: 0 22px 55px rgba(14,42,71,.20);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px);
    transition: .25s ease;
    z-index: 10000;
  }

  .about-dropdown:hover .about-submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .about-submenu a {
    display: block;
    padding: 12px 22px;
    color: #374151;
    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
  }

  .about-submenu a:hover {
    color: #e04423;
    background: #FFF3EF;
    padding-left: 28px;
  }
}

/* Mobile dropdown support for About submenu */
@media (max-width: 991px) {

  .about-submenu {
    display: none;
    padding: 12px 16px;
    background: #F5F8FC;
    border-radius: 16px;
  }

  .about-dropdown.open .about-submenu {
    display: block;
  }

  .about-submenu a {
    display: block;
    padding: 10px 0;
    color: #374151;
    font-weight: 800;
    text-decoration: none;
  }

  .about-submenu a:hover {
    color: #e04423;
  }
}
/* =========================================================
   FINAL ABOUT + SERVICES DROPDOWN FIX
   Put this at the VERY BOTTOM of style1.css
========================================================= */

/* Hide About submenu by default */
.about-submenu {
  display: none;
}

/* Desktop dropdown behavior */
@media (min-width: 992px) {

  .bs-navbar,
  .bs-navbar .container-fluid,
  .bs-menu,
  .bs-menu > ul,
  .bs-menu > ul > li {
    overflow: visible !important;
  }

  .bs-menu > ul > li {
    position: relative;
  }

  /* Services large dropdown */
  .services-dropdown {
    position: static !important;
  }

  .services-mega-menu {
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    width: min(1060px, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
    transform: translateX(-50%) translateY(14px) !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
    padding: 30px !important;
    background: #fff !important;
    border-radius: 0 0 24px 24px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    box-shadow: 0 26px 70px rgba(14,42,71,.22) !important;
    z-index: 99999 !important;
  }

  .services-dropdown:hover .services-mega-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
  }

  /* About small dropdown */
  .about-dropdown {
    position: relative !important;
  }

  .about-submenu {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 260px !important;
    padding: 14px 0 !important;
    background: #fff !important;
    border-radius: 0 0 18px 18px !important;
    box-shadow: 0 22px 55px rgba(14,42,71,.20) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(12px) !important;
    transition: .25s ease !important;
    z-index: 99999 !important;
  }

  .about-dropdown:hover .about-submenu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  .about-submenu a {
    display: block !important;
    padding: 12px 22px !important;
    color: #374151 !important;
    background: #fff !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  .about-submenu a:hover {
    color: #e04423 !important;
    background: #FFF3EF !important;
    padding-left: 28px !important;
  }
}

/* Mobile behavior */
@media (max-width: 991px) {

  .about-submenu {
    display: none;
    padding: 12px 16px;
    background: #F5F8FC;
    border-radius: 16px;
  }

  .about-dropdown.open .about-submenu {
    display: block;
  }

  .about-submenu a {
    display: block;
    padding: 10px 0;
    color: #374151;
    font-weight: 800;
    text-decoration: none;
  }
}

/* =========================================================
   PREMIUM FOOTER
========================================================= */

.bs-premium-footer {
  position: relative;
  background:
    radial-gradient(circle at 8% 10%, rgba(224, 68, 35, .12), transparent 28%),
    radial-gradient(circle at 90% 20%, rgba(33, 74, 139, .18), transparent 32%),
    linear-gradient(135deg, #0E2A47 0%, #102f52 55%, #082039 100%);
  color: #fff;
  overflow: hidden;
}

.bs-premium-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: .35;
  pointer-events: none;
}

.bs-footer-main {
  position: relative;
  z-index: 1;
  padding: 82px 0 58px;
}

.footer-brand-card {
  max-width: 430px;
}

.footer-logo {
  display: inline-flex;
  align-items: center;
  padding: 12px 16px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(0,0,0,.22);
  margin-bottom: 24px;
}

.footer-logo img {
  width: 225px;
  height: auto;
  display: block;
}

.footer-brand-text {
  max-width: 380px;
  color: #D7E6F7;
  font-size: 1rem;
  line-height: 1.75;
  margin-bottom: 24px;
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: #EAF2FB;
  font-size: .96rem;
  line-height: 1.55;
  margin-bottom: 14px;
}

.footer-contact-item i {
  color: #ff704d;
  margin-top: 4px;
  min-width: 18px;
}

.footer-contact-item a {
  color: #EAF2FB;
  text-decoration: none;
  font-weight: 800;
}

.footer-contact-item a:hover {
  color: #fff;
}

.footer-call-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: .9rem 1.7rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #e04423, #ff704d);
  color: #fff;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 16px 34px rgba(224, 68, 35, .28);
}

.footer-call-btn:hover {
  color: #fff;
  background: linear-gradient(135deg, #b83218, #e04423);
  transform: translateY(-2px);
}


/* Footer Columns */

.footer-column h3,
.footer-hours-card h3 {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 900;
  margin-bottom: 20px;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 13px;
}

.footer-links li {
  margin: 0;
}

.footer-links a {
  color: #D7E6F7;
  text-decoration: none;
  font-size: .98rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.footer-links a::before {
  content: "›";
  color: #ff704d;
  font-size: 1.2rem;
  line-height: 1;
}

.footer-links a:hover {
  color: #fff;
  transform: translateX(4px);
}


/* Hours Card */

.footer-hours-card {
  padding: 28px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 28px;
  background: rgba(255,255,255,.07);
  backdrop-filter: blur(14px);
  box-shadow: 0 28px 70px rgba(0,0,0,.18);
}

.footer-card-label {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,112,77,.14);
  color: #ffb39f;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.footer-hours-list {
  display: grid;
  gap: 0;
  margin-bottom: 22px;
}

.footer-hour-row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.11);
}

.footer-hour-row span {
  color: #D7E6F7;
  font-size: .92rem;
  font-weight: 600;
}

.footer-hour-row strong {
  color: #fff;
  font-size: .92rem;
  font-weight: 900;
  text-align: right;
  white-space: nowrap;
}

.footer-mini-map {
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 42px rgba(0,0,0,.22);
}

.footer-mini-map iframe {
  width: 100%;
  height: 170px;
  border: 0;
  display: block;
}


/* Bottom Bar */

.bs-footer-bottom {
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 22px 0;
  background: rgba(0,0,0,.12);
}

.footer-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.footer-bottom-inner p {
  margin: 0;
  color: #C9D8EA;
  font-size: .9rem;
}

.footer-bottom-links {
  display: flex;
  align-items: center;
  gap: 28px;
}

.footer-bottom-links a {
  color: #D7E6F7;
  text-decoration: none;
  font-size: .9rem;
  font-weight: 700;
}

.footer-bottom-links a:hover {
  color: #fff;
}


/* Responsive */

@media (max-width: 991px) {
  .bs-footer-main {
    padding: 68px 0 46px;
  }

  .footer-hours-card {
    max-width: 520px;
  }
}

@media (max-width: 575px) {
  .footer-logo img {
    width: 190px;
  }

  .footer-hours-card {
    padding: 22px;
    border-radius: 22px;
  }

  .footer-hour-row {
    flex-direction: column;
    gap: 3px;
  }

  .footer-hour-row strong {
    text-align: left;
    white-space: normal;
  }

  .footer-bottom-inner {
    flex-direction: column;
    text-align: center;
  }

  .footer-bottom-links {
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
  }
}

/* =========================================================
   ABOUT DR. JHANDI PAGE - SECTION DIFFERENTIATION
   Keep content same, improve visual separation
========================================================= */

/* ---------- Intro section: clean white editorial style ---------- */

.dr-intro-section {
  padding: 82px 0 78px;
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  text-align: center;
}

.dr-intro-section .welcome-inner {
  max-width: 980px;
}

.dr-intro-section .welcome-line {
  width: 180px;
  height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--brand));
  border-radius: 999px;
  margin-bottom: 22px;
}

.dr-intro-section h2 {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
  color: var(--brand-dark);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -1px;
}

.dr-intro-section p {
  max-width: 900px;
  color: #374151;
}


/* ---------- Doctor bio section: premium split section ---------- */

.dr-bio-section {
  position: relative;
  padding: 95px 0;
  background:
    radial-gradient(circle at 10% 20%, rgba(224,68,35,.10), transparent 28%),
    linear-gradient(135deg, #f5f9ff 0%, #ffffff 55%, #fff7f2 100%);
}

.dr-bio-section .about-premium-image img {
  height: 520px;
  object-fit: cover;
  border-radius: 34px;
}

.dr-bio-section .about-premium-heading {
  color: var(--brand-dark);
}

.dr-bio-section .about-premium-text {
  font-size: 1.05rem;
  color: #4b5563;
}

.dr-bio-section .about-premium-quote {
  background: #ffffff;
  border-left: 6px solid var(--accent);
}


/* ---------- Care philosophy cards: soft blue/orange card area ---------- */

.dr-care-section {
  padding: 92px 0;
  background:
    radial-gradient(circle at 12% 18%, rgba(224,68,35,.12), transparent 26%),
    radial-gradient(circle at 88% 80%, rgba(33,74,139,.14), transparent 28%),
    #f3f7fb;
}

.dr-care-section .services-heading {
  color: var(--brand-dark);
}

.dr-care-section .premium-dental-card {
  background: #ffffff;
  border: 1px solid rgba(33,74,139,.08);
  box-shadow: 0 18px 45px rgba(14,42,71,.08);
}

.dr-care-section .premium-dental-card:nth-child(1) .premium-icon,
.dr-care-section .col-lg-4:nth-child(1) .premium-icon {
  background: #fff3ef;
  color: var(--accent);
}

.dr-care-section .col-lg-4:nth-child(2) .premium-icon {
  background: #eaf2fb;
  color: var(--brand);
}

.dr-care-section .col-lg-4:nth-child(3) .premium-icon {
  background: #f1f8f4;
  color: #2f7d55;
}


/* ---------- Patient needs section: framed story block ---------- */

.dr-patients-section {
  padding: 88px 0;
  background: #ffffff;
}

.dr-patients-section .welcome-inner {
  max-width: 1050px;
  padding: 48px 52px;
  border-radius: 32px;
  background:
    linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid rgba(33,74,139,.10);
  box-shadow: 0 22px 60px rgba(14,42,71,.08);
}

.dr-patients-section .welcome-line {
  width: 120px;
  height: 3px;
  background: var(--accent);
  border-radius: 999px;
}

.dr-patients-section h2 {
  color: var(--brand-dark);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-weight: 900;
  letter-spacing: -1px;
}

.dr-patients-section p {
  max-width: 900px;
  color: #374151;
}


/* ---------- Final CTA: make it clearly different ---------- */

.dr-final-cta {
  padding: 90px 0;
  background:
    linear-gradient(135deg, rgba(14,42,71,.94), rgba(33,74,139,.92)),
    url("../img/banner-bg.jpeg") center/cover no-repeat;
  color: #ffffff;
}

.dr-final-cta .welcome-line {
  width: 140px;
  height: 3px;
  background: #ff704d;
  border-radius: 999px;
}

.dr-final-cta .section-label {
  color: #ffb39f;
}

.dr-final-cta h2 {
  color: #ffffff;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-weight: 900;
  letter-spacing: -1px;
}

.dr-final-cta p {
  color: #dceafa;
}

.dr-final-cta .welcome-call {
  margin-top: 22px;
  padding: .95rem 1.8rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), #ff704d);
  color: #ffffff;
  font-size: 1rem;
  text-transform: none;
  box-shadow: 0 16px 34px rgba(224,68,35,.28);
}

.dr-final-cta .welcome-call:hover {
  color: #ffffff;
  background: linear-gradient(135deg, var(--accent-dark), var(--accent));
  transform: translateY(-2px);
}


/* ---------- Mobile improvements ---------- */

@media (max-width: 767px) {
  .dr-intro-section,
  .dr-bio-section,
  .dr-care-section,
  .dr-patients-section,
  .dr-final-cta {
    padding: 60px 0;
  }

  .dr-patients-section .welcome-inner {
    padding: 34px 24px;
    border-radius: 24px;
  }

  .dr-bio-section .about-premium-image img {
    height: 390px;
  }
}

/* =========================================================
   WHY CHOOSE US - PREMIUM UNIQUE LAYOUT
========================================================= */

.why-premium-hero {
  position: relative;
  padding: 45px 0;
  background:
    radial-gradient(circle at 8% 15%, rgba(224,68,35,.16), transparent 30%),
    linear-gradient(135deg, #0E2A47 0%, #173f70 58%, #214A8B 100%);
  color: #fff;
  overflow: hidden;
}

.why-premium-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
}

.why-eyebrow,
.why-section-label {
  display: inline-flex;
  margin-bottom: 14px;
  color: #e04423;
  font-size: 1.2rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.why-premium-hero h1 {
  max-width: 760px;
  margin-bottom: 20px;
  font-size: clamp(2.4rem, 5vw, 3.5rem);
  line-height: 1.03;
  font-weight: 950;
  letter-spacing: -2px;
}

.why-premium-hero p {
  max-width: 680px;
  color: #DCEBFA;
  font-size: 1.12rem;
  line-height: 1.75;
  margin-bottom: 30px;
}

.why-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.why-btn-primary,
.why-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .95rem 1.7rem;
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none;
}

.why-btn-primary {
  background: linear-gradient(135deg, var(--accent), #ff704d);
  color: #fff;
  box-shadow: 0 18px 36px rgba(224,68,35,.28);
}

.why-btn-primary:hover {
  color: #fff;
  background: linear-gradient(135deg, var(--accent-dark), var(--accent));
  transform: translateY(-2px);
}

.why-btn-secondary {
  background: #fff;
  color: var(--brand);
}

.why-btn-secondary:hover {
  background: var(--brand-light);
  color: var(--brand-dark);
  transform: translateY(-2px);
}

.why-btn-secondary.light {
  background: rgba(255,255,255,.12);
  color: #fff;
  border: 1px solid rgba(255,255,255,.35);
}

.why-btn-secondary.light:hover {
  background: #fff;
  color: var(--brand);
}

.why-hero-card {
  position: relative;
  z-index: 2;
  padding: 34px;
  border-radius: 30px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(16px);
  box-shadow: 0 32px 80px rgba(0,0,0,.22);
}

.why-hero-card span {
  display: block;
  margin-bottom: 18px;
  color: #fff;
  font-weight: 900;
  font-size: 1.15rem;
}

.why-hero-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}

.why-hero-card li {
  position: relative;
  padding-left: 30px;
  color: #EAF2FB;
  font-weight: 700;
  line-height: 1.5;
}

.why-hero-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #ffb39f;
  font-weight: 900;
}


/* Editorial Intro */

.why-editorial-intro {
  padding: 86px 0;
  background: #fff;
}

.why-editorial-inner {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

.why-editorial-inner h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.12;
  font-weight: 950;
  letter-spacing: -1px;
  margin-bottom: 22px;
}

.why-editorial-inner p {
  max-width: 900px;
  margin: 0 auto 18px;
  color: #374151;
  font-size: 1.08rem;
  line-height: 1.85;
}


/* Reason Grid */

.why-reason-grid-section {
  padding: 92px 0;
  background:
    radial-gradient(circle at 12% 20%, rgba(224,68,35,.10), transparent 28%),
    radial-gradient(circle at 85% 80%, rgba(33,74,139,.12), transparent 30%),
    #f5f8fc;
}

.why-section-heading {
  max-width: 820px;
  margin: 0 auto 52px;
}

.why-section-heading h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3.1rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -1px;
  margin-bottom: 14px;
}

.why-section-heading p {
  color: var(--text-muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.why-reason-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.why-reason-card {
  position: relative;
  min-height: 290px;
  padding: 30px;
  border-radius: 28px;
  background: #fff;
  border: 1px solid rgba(33,74,139,.08);
  box-shadow: 0 18px 50px rgba(14,42,71,.08);
  overflow: hidden;
  transition: .3s ease;
}

.why-reason-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 70px rgba(14,42,71,.15);
}

.why-card-large {
  grid-row: span 2;
  background:
    linear-gradient(135deg, #fff 0%, #fff7f2 100%);
}

.why-card-dark {
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.14), transparent 34%),
    linear-gradient(135deg, var(--brand-dark), var(--brand));
}

.why-card-dark h3,
.why-card-dark p,
.why-card-dark .why-card-number {
  color: #fff;
}

.why-card-number {
  position: absolute;
  top: 22px;
  right: 24px;
  color: rgba(33,74,139,.08);
  font-size: 3rem;
  font-weight: 950;
}

.why-card-icon {
  width: 66px;
  height: 66px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  border-radius: 22px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 1.5rem;
}

.why-reason-card h3 {
  color: var(--brand-dark);
  font-size: 1.35rem;
  font-weight: 950;
  line-height: 1.25;
  margin-bottom: 12px;
}

.why-reason-card p {
  color: var(--text-muted);
  line-height: 1.72;
  margin: 0;
}


/* Comparison Section */

.why-comparison-section {
  padding: 95px 0;
  background: #fff;
}

.why-comparison-section h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.14;
  font-weight: 950;
  letter-spacing: -1px;
  margin-bottom: 18px;
}

.why-comparison-section p {
  color: #4b5563;
  line-height: 1.8;
  font-size: 1.05rem;
}

.why-comparison-card {
  padding: 28px;
  border-radius: 30px;
  background: #f8fbff;
  border: 1px solid rgba(33,74,139,.10);
  box-shadow: 0 24px 65px rgba(14,42,71,.08);
}

.why-comparison-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  padding: 22px 0;
  border-bottom: 1px solid rgba(33,74,139,.10);
}

.why-comparison-row:last-child {
  border-bottom: 0;
}

.why-comparison-row strong {
  display: block;
  color: var(--brand-dark);
  margin-bottom: 8px;
  font-weight: 950;
}

.why-comparison-row p {
  margin: 0;
  font-size: .96rem;
}


/* Doctor Feature */

.why-doctor-feature {
  padding: 95px 0;
  background:
    linear-gradient(135deg, #f5f9ff 0%, #ffffff 55%, #fff7f2 100%);
}

.why-doctor-card {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 46px;
  align-items: center;
  padding: 44px;
  border-radius: 36px;
  background: #fff;
  border: 1px solid rgba(33,74,139,.10);
  box-shadow: 0 30px 80px rgba(14,42,71,.12);
}

.why-doctor-photo {
  min-height: 420px;
  border-radius: 30px;
  background:
    linear-gradient(135deg, #eaf2fb, #fff3ef);
  overflow: hidden;
}

.why-doctor-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.why-doctor-content h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -1px;
  margin-bottom: 18px;
}

.why-doctor-content p {
  color: #4b5563;
  font-size: 1.04rem;
  line-height: 1.8;
}

.why-text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--brand);
  font-weight: 950;
  text-decoration: none;
}

.why-text-link:hover {
  color: var(--accent);
}


/* Values Banner */

.why-values-banner {
  padding: 92px 0;
  background:
    linear-gradient(135deg, rgba(14,42,71,.94), rgba(33,74,139,.91)),
    url("../img/banner-bg.jpeg") center/cover no-repeat;
  color: #fff;
}

.why-values-inner {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

.why-values-inner h2 {
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -1px;
  margin-bottom: 18px;
}

.why-values-inner p {
  max-width: 780px;
  margin: 0 auto 28px;
  color: #DCEBFA;
  font-size: 1.08rem;
  line-height: 1.8;
}

.why-value-pills {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}

.why-value-pills span {
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  font-weight: 900;
}


/* Callout */

.why-callout-section {
  padding: 90px 0;
  background: #fff;
}

.why-callout-box {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 42px;
  align-items: center;
  padding: 42px;
  border-radius: 34px;
  background: #f8fbff;
  border: 1px solid rgba(33,74,139,.10);
}

.why-callout-box h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 950;
  line-height: 1.12;
}

.why-callout-box p {
  color: #4b5563;
  line-height: 1.75;
}

.why-callout-list {
  display: grid;
  gap: 14px;
}

.why-callout-list div {
  padding: 18px 20px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(14,42,71,.06);
}

.why-callout-list strong {
  display: block;
  color: var(--brand-dark);
  font-weight: 950;
  margin-bottom: 6px;
}

.why-callout-list span {
  color: var(--text-muted);
  line-height: 1.6;
}


/* Final CTA */

.why-final-premium-cta {
  padding: 92px 0;
  background:
    radial-gradient(circle at 10% 20%, rgba(224,68,35,.16), transparent 30%),
    linear-gradient(135deg, #0E2A47 0%, #214A8B 100%);
}

.why-final-card {
  max-width: 980px;
  margin: 0 auto;
  padding: 52px;
  border-radius: 36px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.20);
  backdrop-filter: blur(16px);
  color: #fff;
  text-align: center;
}

.why-final-card h2 {
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -1px;
  margin-bottom: 18px;
}

.why-final-card p {
  max-width: 820px;
  margin: 0 auto 18px;
  color: #DCEBFA;
  line-height: 1.8;
}

.why-final-card .why-hero-actions {
  justify-content: center;
  margin-top: 28px;
}


/* Responsive */

@media (max-width: 991px) {
  .why-premium-hero,
  .why-editorial-intro,
  .why-reason-grid-section,
  .why-comparison-section,
  .why-doctor-feature,
  .why-values-banner,
  .why-callout-section,
  .why-final-premium-cta {
    padding: 70px 0;
  }

  .why-reason-grid {
    grid-template-columns: 1fr 1fr;
  }

  .why-card-large {
    grid-row: auto;
  }

  .why-doctor-card {
    grid-template-columns: 1fr;
  }

  .why-callout-box {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .why-premium-hero h1 {
    font-size: 2.3rem;
  }

  .why-hero-actions {
    flex-direction: column;
  }

  .why-btn-primary,
  .why-btn-secondary {
    width: 100%;
  }

  .why-reason-grid {
    grid-template-columns: 1fr;
  }

  .why-comparison-row {
    grid-template-columns: 1fr;
  }

  .why-doctor-card,
  .why-callout-box,
  .why-final-card {
    padding: 28px 22px;
    border-radius: 26px;
  }

  .why-doctor-photo {
    min-height: 320px;
  }
}

/* =========================================================
   PREMIUM REASONS TO CHOOSE US BOXES
   Replace/override only the reason cards
========================================================= */


.why-section-heading {
  max-width: 820px;
  margin: 0 auto 58px;
}

.why-section-heading .why-section-label {
  color: var(--accent);
}

.why-section-heading h2 {
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3.15rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -1.2px;
}

.why-section-heading p {
  max-width: 680px;
  margin: 0 auto;
  color: #5f6f7b;
  font-size: 1.05rem;
  line-height: 1.75;
}



/* Icon */
.why-card-icon {
  width: 72px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  border-radius: 24px;
  background: linear-gradient(135deg, #fff3ef, #eef7ff);
  color: var(--accent);
  font-size: 1.55rem;
  box-shadow: 0 16px 34px rgba(224, 68, 35, .13);
  position: relative;
  z-index: 2;
  transition: transform .3s ease, background .3s ease, color .3s ease;
}

.why-reason-card:hover .why-card-icon {
  transform: rotate(-5deg) scale(1.06);
  background: linear-gradient(135deg, var(--accent), #ff704d);
  color: #ffffff;
}

/* Text */
.why-reason-card h3 {
  position: relative;
  z-index: 2;
  color: var(--brand-dark);
  font-size: 1.42rem;
  font-weight: 950;
  line-height: 1.25;
  margin-bottom: 14px;
  max-width: 90%;
}

.why-reason-card p {
  position: relative;
  z-index: 2;
  color: #5f6f7b;
  font-size: .98rem;
  line-height: 1.75;
  margin: 0;
}

/* Featured first card */
.why-card-large {
  grid-row: span 2;
  padding: 42px 34px;
  background:
    radial-gradient(circle at 88% 10%, rgba(224,68,35,.14), transparent 34%),
    linear-gradient(145deg, #ffffff 0%, #fff8f4 100%);
}

.why-card-large .why-card-icon {
  width: 82px;
  height: 82px;
  font-size: 1.8rem;
}

.why-card-large h3 {
  font-size: 1.85rem;
}

/* Dark final card */
.why-card-dark {
  background:
    radial-gradient(circle at 88% 10%, rgba(255,255,255,.14), transparent 34%),
    linear-gradient(135deg, var(--brand-dark), var(--brand));
  border: 1px solid rgba(255,255,255,.12);
}

.why-card-dark::before {
  background: radial-gradient(circle, rgba(255,255,255,.13), transparent 68%);
}

.why-card-dark::after {
  background: linear-gradient(90deg, #ff704d, #ffffff);
}

.why-card-dark .why-card-number {
  color: rgba(255,255,255,.12);
}

.why-card-dark .why-card-icon {
  background: rgba(255,255,255,.14);
  color: #ffffff;
  box-shadow: none;
}

.why-card-dark h3,
.why-card-dark p {
  color: #ffffff;
}

.why-card-dark p {
  color: #dceafa;
}

/* Responsive */
@media (max-width: 991px) {
  .why-reason-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .why-card-large {
    grid-row: auto;
  }
}

@media (max-width: 575px) {
  .why-reason-grid-section {
    padding: 70px 0;
  }

  .why-reason-grid {
    grid-template-columns: 1fr;
  }

  .why-reason-card,
  .why-card-large {
    min-height: auto;
    padding: 30px 24px;
    border-radius: 26px;
  }

  .why-card-large h3 {
    font-size: 1.45rem;
  }

  .why-card-number {
    font-size: 2.8rem;
  }
}


/* =========================================================
   WHY CHOOSE US - NEW PREMIUM BALANCED REASON CARDS
   No numbers, no big empty card, balanced 6-card grid
========================================================= */

.why-choice-section {
  position: relative;
  padding: 100px 0;
  background:
    radial-gradient(circle at 8% 12%, rgba(224,68,35,.10), transparent 28%),
    radial-gradient(circle at 92% 84%, rgba(33,74,139,.10), transparent 30%),
    linear-gradient(180deg, #f8fbff 0%, #ffffff 50%, #f5f8fc 100%);
  overflow: hidden;
}

.why-choice-section::before {
  content: "";
  position: absolute;
  left: 7%;
  top: 80px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(224,68,35,.08);
}

.why-choice-section::after {
  content: "";
  position: absolute;
  right: 8%;
  bottom: 70px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(33,74,139,.08);
}

.why-choice-section .container-fluid {
  position: relative;
  z-index: 2;
}

.why-choice-heading {
  max-width: 820px;
  margin: 0 auto 56px;
}

.why-choice-heading .why-section-label {
  color: var(--accent);
}

.why-choice-heading h2 {
  margin-bottom: 16px;
  color: var(--brand-dark);
  font-size: clamp(2rem, 4vw, 3.15rem);
  line-height: 1.12;
  font-weight: 950;
  letter-spacing: -1.2px;
}

.why-choice-heading p {
  max-width: 680px;
  margin: 0 auto;
  color: #5f6f7b;
  font-size: 1.05rem;
  line-height: 1.75;
}

/* Balanced grid */
.why-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}

/* Card design */
.why-choice-card {
  position: relative;
  min-height: 300px;
  padding: 34px 30px 32px;
  border-radius: 30px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(33,74,139,.10);
  box-shadow: 0 18px 45px rgba(14,42,71,.08);
  overflow: hidden;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.why-choice-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(224,68,35,.06), transparent 38%),
    linear-gradient(315deg, rgba(33,74,139,.06), transparent 42%);
  opacity: 0;
  transition: opacity .28s ease;
}

.why-choice-card::after {
  content: "";
  position: absolute;
  left: 30px;
  top: 0;
  width: 58px;
  height: 5px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, var(--accent), #ff704d);
}

.why-choice-card:hover {
  transform: translateY(-8px);
  border-color: rgba(224,68,35,.22);
  box-shadow: 0 28px 70px rgba(14,42,71,.15);
}

.why-choice-card:hover::before {
  opacity: 1;
}

/* Icon */
.why-choice-icon {
  position: relative;
  z-index: 2;
  width: 68px;
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  border-radius: 22px;
  background: linear-gradient(135deg, #fff3ef, #eef7ff);
  color: var(--accent);
  font-size: 1.45rem;
  box-shadow: 0 14px 30px rgba(224,68,35,.12);
  transition: transform .28s ease, background .28s ease, color .28s ease;
}

.why-choice-card:hover .why-choice-icon {
  transform: rotate(-4deg) scale(1.05);
  background: linear-gradient(135deg, var(--accent), #ff704d);
  color: #fff;
}

/* Text */
.why-choice-card h3 {
  position: relative;
  z-index: 2;
  margin-bottom: 14px;
  color: var(--brand-dark);
  font-size: 1.35rem;
  line-height: 1.25;
  font-weight: 950;
}

.why-choice-card p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: #5f6f7b;
  font-size: 1rem;
  line-height: 1.75;
}

/* Sixth card accent, but same size */
.why-choice-card-accent {
  background:
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 34%),
    linear-gradient(135deg, var(--brand-dark), var(--brand));
  border-color: rgba(255,255,255,.12);
}

.why-choice-card-accent::after {
  background: linear-gradient(90deg, #ff704d, #ffffff);
}

.why-choice-card-accent .why-choice-icon {
  background: rgba(255,255,255,.14);
  color: #fff;
  box-shadow: none;
}

.why-choice-card-accent h3 {
  color: #fff;
}

.why-choice-card-accent p {
  color: #dceafa;
}

.why-choice-card-accent:hover .why-choice-icon {
  background: #fff;
  color: var(--brand);
}

/* Responsive */
@media (max-width: 991px) {
  .why-choice-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .why-choice-card {
    min-height: 280px;
  }
}

@media (max-width: 575px) {
  .why-choice-section {
    padding: 70px 0;
  }

  .why-choice-grid {
    grid-template-columns: 1fr;
  }

  .why-choice-card {
    min-height: auto;
    padding: 30px 24px;
    border-radius: 26px;
  }
}

/* =========================================================
   GLOBAL INNER PAGE SECTION DIFFERENTIATION
   Stronger section contrast for About, Doctor, Office, Why pages
   Add at VERY BOTTOM of style1.css
========================================================= */


/* =========================================================
   ABOUT US PAGE
========================================================= */

.about-welcome-section {
  background: #ffffff !important;
  padding: 85px 0 !important;
}

.about-card-section,
.about-path-section {
  background:
    radial-gradient(circle at 10% 15%, rgba(224,68,35,.11), transparent 26%),
    linear-gradient(180deg, #eef6ff 0%, #f8fbff 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(33,74,139,.08);
  border-bottom: 1px solid rgba(33,74,139,.08);
}

.about-path-card,
.about-nav-card {
  background: #ffffff !important;
  border: 1px solid rgba(33,74,139,.12) !important;
  box-shadow: 0 22px 58px rgba(14,42,71,.10) !important;
}

.about-local-section {
  background:
    linear-gradient(180deg, #fff8f4 0%, #ffffff 100%) !important;
  padding: 90px 0 !important;
  border-top: 1px solid rgba(224,68,35,.10);
}

.about-final-cta {
  background:
    radial-gradient(circle at 12% 20%, rgba(224,68,35,.22), transparent 30%),
    linear-gradient(135deg, #071f38 0%, #0E2A47 48%, #214A8B 100%) !important;
  padding: 88px 0 !important;
}


/* =========================================================
   ABOUT DR. JHANDI PAGE
========================================================= */

.dr-intro-section {
  background: #ffffff !important;
  padding: 88px 0 !important;
}

.dr-bio-section {
  background:
    radial-gradient(circle at 10% 18%, rgba(224,68,35,.12), transparent 28%),
    linear-gradient(135deg, #eef6ff 0%, #ffffff 55%, #fff7f2 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(33,74,139,.08);
  border-bottom: 1px solid rgba(33,74,139,.08);
}

.dr-care-section {
  background:
    radial-gradient(circle at 90% 18%, rgba(224,68,35,.12), transparent 26%),
    linear-gradient(180deg, #fff8f4 0%, #fffdfb 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(224,68,35,.10);
  border-bottom: 1px solid rgba(224,68,35,.10);
}

.dr-care-section .premium-dental-card {
  background: #ffffff !important;
  border: 1px solid rgba(224,68,35,.14) !important;
  box-shadow: 0 20px 50px rgba(14,42,71,.09) !important;
}

.dr-patients-section {
  background: #ffffff !important;
  padding: 95px 0 !important;
}

.dr-patients-section .welcome-inner {
  max-width: 1050px;
  padding: 50px 54px;
  border-radius: 34px;
  background:
    linear-gradient(135deg, #f8fbff 0%, #ffffff 55%, #fff7f2 100%) !important;
  border: 1px solid rgba(33,74,139,.12);
  box-shadow: 0 28px 75px rgba(14,42,71,.12);
}

.dr-final-cta {
  background:
    linear-gradient(135deg, rgba(7,31,56,.96), rgba(33,74,139,.92)),
    url("../img/banner-bg.jpeg") center/cover no-repeat !important;
  padding: 95px 0 !important;
}


/* =========================================================
   WHY CHOOSE US PAGE
========================================================= */

.why-editorial-intro {
  background: #ffffff !important;
  padding: 90px 0 !important;
}

.why-choice-section,
.why-reason-grid-section {
  background:
    radial-gradient(circle at 10% 18%, rgba(224,68,35,.12), transparent 24%),
    linear-gradient(180deg, #eef6ff 0%, #f7fbff 100%) !important;
  padding: 100px 0 !important;
  border-top: 1px solid rgba(33,74,139,.08);
  border-bottom: 1px solid rgba(33,74,139,.08);
}

.why-choice-card,
.why-reason-card {
  background: #ffffff !important;
  border: 1px solid rgba(33,74,139,.12) !important;
  box-shadow: 0 22px 58px rgba(14,42,71,.10) !important;
}

.why-choice-card-accent,
.why-card-dark {
  background:
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 34%),
    linear-gradient(135deg, #0E2A47, #214A8B) !important;
  border-color: rgba(255,255,255,.12) !important;
}

.why-comparison-section {
  background: #ffffff !important;
  padding: 95px 0 !important;
}

.why-comparison-card {
  background:
    linear-gradient(135deg, #f8fbff 0%, #ffffff 60%, #fff7f2 100%) !important;
  border: 1px solid rgba(33,74,139,.12) !important;
  box-shadow: 0 28px 75px rgba(14,42,71,.12) !important;
}

.why-doctor-feature {
  background:
    radial-gradient(circle at 90% 18%, rgba(224,68,35,.12), transparent 26%),
    linear-gradient(180deg, #fff8f4 0%, #fffdfb 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(224,68,35,.10);
  border-bottom: 1px solid rgba(224,68,35,.10);
}

.why-values-banner {
  background:
    linear-gradient(135deg, rgba(7,31,56,.96), rgba(33,74,139,.92)),
    url("../img/banner-bg.jpeg") center/cover no-repeat !important;
  padding: 95px 0 !important;
}

.why-callout-section {
  background: #ffffff !important;
  padding: 95px 0 !important;
}

.why-callout-box {
  background:
    linear-gradient(135deg, #eef6ff 0%, #ffffff 60%, #fff7f2 100%) !important;
  border: 1px solid rgba(33,74,139,.12) !important;
  box-shadow: 0 28px 75px rgba(14,42,71,.12) !important;
}

.why-final-premium-cta {
  background:
    radial-gradient(circle at 10% 20%, rgba(224,68,35,.22), transparent 30%),
    linear-gradient(135deg, #071f38 0%, #0E2A47 45%, #214A8B 100%) !important;
  padding: 95px 0 !important;
}


/* =========================================================
   MUSKEGON DENTAL OFFICE / OUR OFFICE PAGE
========================================================= */

.office-intro-section {
  background: #ffffff !important;
  padding: 88px 0 !important;
}

.office-experience-section {
  background:
    radial-gradient(circle at 10% 18%, rgba(224,68,35,.12), transparent 28%),
    linear-gradient(135deg, #eef6ff 0%, #ffffff 55%, #fff7f2 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(33,74,139,.08);
  border-bottom: 1px solid rgba(33,74,139,.08);
}

.office-expect-section {
  background:
    linear-gradient(135deg, rgba(7,31,56,.96), rgba(33,74,139,.92)) !important;
  padding: 90px 0 !important;
}

.office-gallery-section {
  background:
    linear-gradient(180deg, #fff8f4 0%, #ffffff 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(224,68,35,.10);
  border-bottom: 1px solid rgba(224,68,35,.10);
}

.office-local-section {
  background: #ffffff !important;
  padding: 95px 0 !important;
}

.office-local-section .welcome-inner {
  max-width: 1050px;
  padding: 50px 54px;
  border-radius: 34px;
  background:
    linear-gradient(135deg, #f8fbff 0%, #ffffff 55%, #fff7f2 100%) !important;
  border: 1px solid rgba(33,74,139,.12);
  box-shadow: 0 28px 75px rgba(14,42,71,.12);
}

.office-more-section {
  background:
    radial-gradient(circle at 12% 20%, rgba(33,74,139,.10), transparent 26%),
    linear-gradient(180deg, #eef6ff 0%, #f8fbff 100%) !important;
  padding: 95px 0 !important;
  border-top: 1px solid rgba(33,74,139,.08);
}

.office-final-cta {
  background:
    radial-gradient(circle at 10% 20%, rgba(224,68,35,.22), transparent 30%),
    linear-gradient(135deg, #071f38 0%, #0E2A47 45%, #214A8B 100%) !important;
  padding: 95px 0 !important;
}


/* =========================================================
   SHARED STRONG SECTION DIVIDERS
========================================================= */

.about-card-section,
.about-path-section,
.dr-bio-section,
.dr-care-section,
.why-choice-section,
.why-reason-grid-section,
.why-doctor-feature,
.office-experience-section,
.office-gallery-section,
.office-more-section {
  position: relative;
}

.about-card-section::before,
.about-path-section::before,
.dr-bio-section::before,
.dr-care-section::before,
.why-choice-section::before,
.why-reason-grid-section::before,
.why-doctor-feature::before,
.office-experience-section::before,
.office-gallery-section::before,
.office-more-section::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: min(720px, 82%);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(224,68,35,.38), transparent);
}


/* =========================================================
   MOBILE SPACING
========================================================= */

@media (max-width: 575px) {
  .about-welcome-section,
  .about-card-section,
  .about-path-section,
  .about-local-section,
  .about-final-cta,
  .dr-intro-section,
  .dr-bio-section,
  .dr-care-section,
  .dr-patients-section,
  .dr-final-cta,
  .why-editorial-intro,
  .why-choice-section,
  .why-reason-grid-section,
  .why-comparison-section,
  .why-doctor-feature,
  .why-values-banner,
  .why-callout-section,
  .why-final-premium-cta,
  .office-intro-section,
  .office-experience-section,
  .office-expect-section,
  .office-gallery-section,
  .office-local-section,
  .office-more-section,
  .office-final-cta {
    padding: 68px 0 !important;
  }

  .dr-patients-section .welcome-inner,
  .office-local-section .welcome-inner {
    padding: 32px 24px;
    border-radius: 26px;
  }
}


/* =========================================================
   APPOINTMENT MODAL
========================================================= */

.bs-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(7, 31, 56, 0.72);
  backdrop-filter: blur(10px);
}

.bs-modal-overlay.active {
  display: flex;
}

.bs-modal-box {
  position: relative;
  width: min(760px, 100%);
  max-height: 92vh;
  overflow-y: auto;
  padding: 38px;
  border-radius: 32px;
  background: #ffffff;
  border: 1px solid rgba(33, 74, 139, 0.12);
  box-shadow: 0 36px 100px rgba(0, 0, 0, 0.28);
}

.bs-modal-close {
  position: absolute;
  top: 18px;
  right: 20px;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: #f5f8fc;
  color: #0E2A47;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
}

.bs-modal-close:hover {
  background: #fff3ef;
  color: #e04423;
}

.bs-modal-header {
  margin-bottom: 24px;
}

.bs-modal-label {
  display: inline-flex;
  margin-bottom: 10px;
  color: #e04423;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.bs-modal-header h2 {
  color: #0E2A47;
  font-size: clamp(1.9rem, 4vw, 2.7rem);
  font-weight: 950;
  line-height: 1.12;
  margin-bottom: 12px;
}

.bs-modal-header p {
  color: #5f6f7b;
  line-height: 1.7;
  margin: 0;
}

.form-hidden-field {
  position: absolute;
  left: -9999px;
  visibility: hidden;
}

.bs-modal-form label {
  display: block;
  color: #0E2A47;
  font-weight: 900;
  margin-bottom: 8px;
}

.bs-modal-form label span {
  color: #e04423;
}

.bs-modal-form input,
.bs-modal-form select,
.bs-modal-form textarea {
  width: 100%;
  min-height: 52px;
  padding: 12px 15px;
  border: 1px solid rgba(33, 74, 139, .16);
  border-radius: 16px;
  background: #f8fbff;
  color: #111827;
  font-family: inherit;
  outline: none;
}

.bs-modal-form textarea {
  min-height: 120px;
  resize: vertical;
}

.bs-modal-form input:focus,
.bs-modal-form select:focus,
.bs-modal-form textarea:focus {
  border-color: #e04423;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(224, 68, 35, .08);
}

.bs-modal-consent {
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
  color: #4b5563 !important;
  font-weight: 600 !important;
  line-height: 1.6;
}

.bs-modal-consent input {
  width: auto;
  min-height: auto;
  margin-top: 5px;
}

.bs-modal-submit {
  margin-top: 24px;
  padding: .95rem 1.8rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #e04423, #ff704d);
  color: #ffffff;
  font-weight: 950;
  box-shadow: 0 16px 34px rgba(224, 68, 35, .26);
  cursor: pointer;
}

.bs-modal-submit:hover {
  background: linear-gradient(135deg, #b83218, #e04423);
  transform: translateY(-2px);
}

.bs-modal-submit:disabled {
  opacity: .7;
  cursor: not-allowed;
}

.bs-modal-message {
  margin-top: 18px;
  font-weight: 800;
}

.bs-modal-message.success {
  color: #1f7a4d;
}

.bs-modal-message.error {
  color: #b83218;
}

body.modal-open {
  overflow: hidden;
}

@media (max-width: 575px) {
  .bs-modal-overlay {
    padding: 14px;
  }

  .bs-modal-box {
    padding: 30px 22px;
    border-radius: 24px;
  }
}
#appointmentModal.bs-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none !important;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(7, 31, 56, 0.72);
  backdrop-filter: blur(10px);
}

#appointmentModal.bs-modal-overlay.active {
  display: flex !important;
}