/* ============================================================
   GALAXY HOSPITAL, SANGLI — Design System
   Orthopaedics · Trauma · Ozone & Hydrogen Therapy
   Brand: Galaxy Purple · Green · Gold  |  योग्य निदान · माफक खर्च
   ============================================================ */

:root {
  /* Palette drawn directly from the hospital logo:
     purple lettering · forest-green canopy · saffron sunset sky ·
     maroon tree trunk · lotus pink · ivory oval background */
  --c-primary: #5d2d90;         /* logo lettering purple */
  --c-primary-dark: #452073;
  --c-primary-darker: #2e1450;
  --c-accent: #1b7a45;          /* forest green — tree canopy */
  --c-accent-soft: #faf3e2;     /* ivory — logo oval */
  --c-accent-soft2: #f0e3c8;
  --c-teal: #166a4e;
  --c-gold: #e08a2e;            /* saffron — sunset sky */
  --c-maroon: #6d2f28;          /* tree trunk */
  --c-lotus: #f9e3ea;           /* lotus pink */
  --c-ink: #2a1e31;
  --c-body: #57505c;
  --c-muted: #7587963b;
  --c-line: #ece3d3;            /* warm hairline */
  --c-bg: #ffffff;
  --c-bg-soft: #fbf7ec;         /* ivory section background */
  --c-bg-soft2: #f5edd9;
  --shadow-sm: 0 4px 18px rgba(93, 45, 144, .07);
  --shadow-md: 0 14px 40px rgba(93, 45, 144, .10);
  --shadow-lg: 0 26px 60px rgba(46, 20, 80, .16);
  --radius: 16px;
  --radius-lg: 22px;
  --maxw: 1200px;
  --ff-head: "Plus Jakarta Sans", "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ff-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  margin: 0;
  font-family: var(--ff-body);
  color: var(--c-body);
  background: var(--c-bg);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ff-head);
  color: var(--c-ink);
  margin: 0 0 .5em;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.01em;
}

a { color: var(--c-primary); text-decoration: none; transition: color .25s, background .25s, box-shadow .25s, transform .25s; }
/* height:auto is required now that every <img> carries intrinsic width/height
   attributes (they reserve space and kill layout shift). Without it the height
   attribute wins over CSS aspect-ratio and stretches the image. More specific
   rules that set an explicit height still override this. */
img { max-width: 100%; display: block; height: auto; }
p { margin: 0 0 1rem; }
ul { margin: 0; }

.sd-container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }
.sd-section { padding: 92px 0; position: relative; }
.sd-section--soft { background: var(--c-bg-soft); }
.sd-section--tight { padding: 70px 0; }
.sd-narrow { max-width: 760px; margin: 0 auto; }

/* ---------- Section headings ---------- */
.sd-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--ff-head);
  font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--c-primary);
  background: var(--c-accent-soft);
  padding: 7px 16px; border-radius: 30px; margin-bottom: 18px;
}
.sd-eyebrow i { color: var(--c-accent); }
.sd-title { font-size: clamp(28px, 4vw, 42px); margin-bottom: 16px; }
.sd-title .hl { color: var(--c-primary); }
.sd-lead { font-size: 17px; color: var(--c-body); max-width: 640px; }
.sd-head-center { text-align: center; }
.sd-head-center .sd-lead { margin-left: auto; margin-right: auto; }

/* ---------- Buttons ---------- */
.sd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--ff-head); font-weight: 600; font-size: 15px;
  padding: 14px 28px; border-radius: 50px; border: 2px solid transparent;
  cursor: pointer; line-height: 1; text-align: center;
}
.sd-btn--primary { background: var(--c-primary); color: #fff; box-shadow: 0 10px 24px rgba(93,45,144,.28); }
.sd-btn--primary:hover { background: var(--c-primary-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 16px 30px rgba(93,45,144,.34); }
.sd-btn--wa { background: #25d366; color: #fff; box-shadow: 0 10px 24px rgba(37,211,102,.32); }
.sd-btn--wa:hover { background: #1eb858; color: #fff; transform: translateY(-2px); }
.sd-btn--ghost { background: transparent; color: var(--c-primary); border-color: var(--c-accent-soft2); }
.sd-btn--ghost:hover { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.sd-btn--light { background: #fff; color: var(--c-primary); }
.sd-btn--light:hover { background: var(--c-accent-soft); color: var(--c-primary-dark); transform: translateY(-2px); }
.sd-btn--lg { padding: 17px 34px; font-size: 16px; }

.sd-header { position: sticky; top: 0; z-index: 1000; background: #fff; box-shadow: 0 2px 18px rgba(64,21,80,.07); transition: box-shadow .3s; }
.sd-header.is-stuck { box-shadow: 0 6px 26px rgba(64,21,80,.13); }
.sd-header__in { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 0; }

.sd-brand { display: inline-flex; align-items: center; gap: 12px; }
.sd-brand__mark { width: 52px; height: 52px; flex: 0 0 auto; object-fit: contain; }
.sd-brand__tx { display: flex; flex-direction: column; line-height: 1.1; }
.sd-brand__tx b { font-family: var(--ff-head); font-size: 21px; font-weight: 800; color: var(--c-primary-dark); letter-spacing: -.01em; }
.sd-brand__tx span { font-size: 11.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-accent); }

.sd-nav { display: flex; align-items: center; gap: 4px; }
.sd-nav a {
  font-family: var(--ff-head); font-weight: 600; font-size: 15px; color: var(--c-ink);
  padding: 10px 13px; border-radius: 10px; position: relative; white-space: nowrap;
}
.sd-nav a:hover, .sd-nav a.active { color: var(--c-primary); background: var(--c-accent-soft); }

.sd-header__cta { display: flex; align-items: center; gap: 12px; }
.sd-burger { display: none; width: 46px; height: 46px; border: none; border-radius: 12px; background: var(--c-accent-soft); color: var(--c-primary); font-size: 20px; cursor: pointer; }

/* mobile drawer — wrapped in a fixed, viewport-sized clip layer so the
   off-canvas panel never extends the page width (prevents horizontal scroll) */
.sd-offcanvas { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 1100; }
.sd-drawer { position: absolute; top: 0; right: 0; bottom: 0; width: min(360px, 86vw); background: #fff; z-index: 2; transform: translateX(100%); transition: transform .35s ease; box-shadow: -20px 0 60px rgba(64,21,80,.2); display: flex; flex-direction: column; padding: 22px; overflow-y: auto; pointer-events: auto; }
.sd-drawer.is-open { transform: translateX(0); }
.sd-drawer__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.sd-drawer__close { width: 42px; height: 42px; border: none; background: var(--c-bg-soft); border-radius: 10px; font-size: 18px; color: var(--c-ink); cursor: pointer; }
.sd-drawer nav { display: flex; flex-direction: column; }
.sd-drawer nav a { font-family: var(--ff-head); font-weight: 600; color: var(--c-ink); padding: 13px 8px; border-bottom: 1px solid var(--c-line); }
.sd-drawer nav a:hover, .sd-drawer nav a.active { color: var(--c-primary); }
.sd-drawer__cta { margin-top: 22px; display: flex; flex-direction: column; gap: 12px; }
.sd-drawer__contact { margin-top: 22px; font-size: 14px; display: flex; flex-direction: column; gap: 12px; }
.sd-drawer__contact a { display: flex; gap: 12px; align-items: flex-start; color: var(--c-body); }
.sd-drawer__contact i { color: var(--c-accent); margin-top: 3px; }
.sd-overlay { position: absolute; inset: 0; background: rgba(45,15,58,.5); opacity: 0; visibility: hidden; transition: .3s; z-index: 1; pointer-events: auto; }
.sd-overlay.is-open { opacity: 1; visibility: visible; }

/* ============================================================
   HERO (home)
   ============================================================ */
.sd-hero { position: relative; background: linear-gradient(120deg, #2e1450 0%, #5d2d90 55%, #7d3fae 100%); color: #fff; overflow: hidden; }
.sd-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(27,122,69,.4), transparent 45%), radial-gradient(circle at 12% 90%, rgba(224,138,46,.25), transparent 40%); }
.sd-hero__grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 50px; align-items: center; padding: 70px 0 84px; }
.sd-hero h1 { color: #fff; font-size: clamp(32px, 5vw, 54px); font-weight: 800; margin: 22px 0 18px; }
.sd-hero h1 .hl { color: #ffbe62; }
.sd-hero__sub { color: #e9d6f2; font-size: 18px; max-width: 560px; margin-bottom: 26px; }
.sd-hero__trust { list-style: none; padding: 0; margin: 0 0 30px; display: flex; flex-wrap: wrap; gap: 12px 22px; }
.sd-hero__trust li { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; font-size: 14.5px; color: #f4ebf8; }
.sd-hero__trust i { color: #7bd39a; font-size: 16px; }
.sd-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.sd-hero__call { display: inline-flex; align-items: center; gap: 12px; color: #fff; }
.sd-hero__call .ic { width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.14); display: grid; place-items: center; font-size: 17px; }
.sd-hero__call small { display: block; font-size: 12.5px; color: #d8c2e6; }
.sd-hero__call strong { font-family: var(--ff-head); font-size: 18px; }

.sd-hero__visual { position: relative; }
.sd-hero__photo { width: 100%; border-radius: 24px; box-shadow: 0 30px 70px rgba(0,0,0,.4); border: 5px solid rgba(255,255,255,.12); object-fit: cover; aspect-ratio: 4/3.4; }
.sd-hero__caption { margin-top: 14px; text-align: center; display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; font-family: var(--ff-head); font-weight: 600; font-size: 14.5px; letter-spacing: .2px; color: #f4ebf8; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 9px 18px; }
.sd-hero__caption i { color: #ffbe62; font-size: 15px; }
.sd-hero__wave { position: absolute; left: 0; right: 0; bottom: -1px; line-height: 0; }
.sd-hero__wave svg { width: 100%; height: 60px; display: block; }

/* ---------- Stat strip ---------- */
.sd-stats { background: #fff; margin-top: -1px; }
.sd-stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 46px 0; }
.sd-stat { text-align: center; padding: 10px; position: relative; }
.sd-stat:not(:last-child)::after { content: ""; position: absolute; right: -12px; top: 14%; height: 72%; width: 1px; background: var(--c-line); }
.sd-stat .n { font-family: var(--ff-head); font-size: 40px; font-weight: 800; color: var(--c-primary); line-height: 1; }
.sd-stat .n .plus { color: var(--c-accent); }
.sd-stat .l { font-weight: 600; color: var(--c-ink); margin-top: 8px; font-size: 15px; }
.sd-stat .ic { color: var(--c-accent); font-size: 22px; margin-bottom: 10px; }

/* ============================================================
   ABOUT
   ============================================================ */
.sd-about__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.sd-about__media { position: relative; }
.sd-about__media img.main { width: 100%; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); object-fit: cover; aspect-ratio: 4/4.4; }
.sd-about__media .accent-img { position: absolute; bottom: -28px; right: -22px; width: 46%; border-radius: 16px; border: 6px solid #fff; box-shadow: var(--shadow-lg); object-fit: cover; aspect-ratio: 4/3; }
.sd-about__media .estab { position: absolute; top: 22px; left: -22px; background: var(--c-primary); color: #fff; border-radius: 16px; padding: 14px 20px; box-shadow: var(--shadow-md); text-align: center; }
.sd-about__media .estab b { font-family: var(--ff-head); font-size: 26px; display: block; line-height: 1; }
.sd-about__media .estab span { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.sd-feat-list { list-style: none; padding: 0; margin: 22px 0 28px; display: grid; gap: 14px; }
.sd-feat-list li { display: flex; gap: 13px; align-items: flex-start; }
.sd-feat-list i { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-primary); display: grid; place-items: center; font-size: 12px; margin-top: 3px; }
.sd-feat-list b { color: var(--c-ink); }

/* values pills */
.sd-values { display: flex; flex-wrap: wrap; gap: 14px; }
.sd-value { display: inline-flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--c-line); border-radius: 50px; padding: 10px 20px; font-family: var(--ff-head); font-weight: 700; color: var(--c-primary-dark); box-shadow: var(--shadow-sm); }
.sd-value i { color: var(--c-teal); }

/* ============================================================
   DIVISIONS / FEATURE CARDS
   ============================================================ */
.sd-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.sd-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
.sd-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }

/* compact service card */
.sd-service {
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius);
  padding: 28px 24px; box-shadow: var(--shadow-sm); height: 100%;
  transition: transform .3s, box-shadow .3s; position: relative; overflow: hidden;
}
.sd-service::after { content: ""; position: absolute; left: 0; top: 0; height: 4px; width: 0; background: linear-gradient(90deg, var(--c-accent), var(--c-primary)); transition: width .35s; }
.sd-service:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.sd-service:hover::after { width: 100%; }
.sd-service__ic { width: 56px; height: 56px; border-radius: 16px; background: var(--c-accent-soft); color: var(--c-primary); display: grid; place-items: center; font-size: 24px; margin-bottom: 18px; transition: .3s; }
.sd-service:hover .sd-service__ic { background: var(--c-primary); color: #fff; }
.sd-service h3 { font-size: 19px; margin-bottom: 9px; }
.sd-service p { font-size: 14.5px; margin: 0; }

/* ============================================================
   WHY US / FEATURE STRIP
   ============================================================ */
.sd-why { background: linear-gradient(120deg, #5c2070, #5d2d90); color: #fff; position: relative; overflow: hidden; }
.sd-why::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 90% 10%, rgba(27,122,69,.35), transparent 40%); }
.sd-why .sd-title, .sd-why h3 { color: #fff; }
.sd-why .sd-eyebrow { background: rgba(255,255,255,.12); color: #ecdcf6; }
.sd-why__grid { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 14px; }
.sd-why__item { display: flex; gap: 16px; align-items: flex-start; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); padding: 22px; transition: background .3s; }
.sd-why__item:hover { background: rgba(255,255,255,.11); }
.sd-why__item .ic { flex: 0 0 auto; width: 50px; height: 50px; border-radius: 14px; background: rgba(255,255,255,.12); color: #e6c4f2; display: grid; place-items: center; font-size: 21px; }
.sd-why__item h4 { color: #fff; font-size: 17px; margin-bottom: 6px; }
.sd-why__item p { color: #e3d0ee; font-size: 14.5px; margin: 0; }

/* circular doctor card (photos cropped from team row) */
.sd-docc { text-align: center; padding: 8px; }
.sd-docc__img { width: 178px; height: 178px; margin: 0 auto 18px; border-radius: 50%; background: #fff; border: 2px dashed var(--c-accent); padding: 7px; box-shadow: var(--shadow-sm); overflow: hidden; display: grid; place-items: center; transition: transform .3s, box-shadow .3s; }
.sd-docc:hover .sd-docc__img { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.sd-docc__img img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; object-position: top center; border-radius: 50%; }
.sd-docc h3 { font-size: 19px; margin-bottom: 5px; }
.sd-docc__role { color: var(--c-primary); font-weight: 600; font-size: 14px; font-family: var(--ff-head); }
.sd-docc__qual { font-size: 13px; color: var(--c-body); margin: 6px 0 0; }
.sd-footer__community .sd-btn { width: 100%; }
.sd-profile__media .card, .sd-profile__card-wide { margin-top: 18px; background: var(--c-primary); color: #fff; border-radius: var(--radius); padding: 22px; }
.sd-profile__media .card h4, .sd-profile__card-wide h4 { color: #fff; font-size: 16px; }
.sd-profile__media .card ul, .sd-profile__card-wide ul { list-style: none; padding: 0; margin: 10px 0 0; font-size: 14px; }
.sd-profile__media .card li, .sd-profile__card-wide li { display: flex; gap: 10px; padding: 6px 0; color: #ecdcf4; }
.sd-profile__media .card i, .sd-profile__card-wide i { color: #e6c4f2; margin-top: 4px; }

/* ============================================================
   GALLERY
   ============================================================ */
.sd-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.sd-gallery__item { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 4/3; box-shadow: var(--shadow-sm); display: block; }
.sd-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.sd-gallery__item:hover img { transform: scale(1.08); }
.sd-gallery__item::after { content: "\f00e"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 26px; background: linear-gradient(180deg, rgba(64,21,80,0), rgba(64,21,80,.65)); opacity: 0; transition: opacity .35s; }
.sd-gallery__item:hover::after { opacity: 1; }
.sd-gallery__cap { position: absolute; left: 14px; bottom: 12px; z-index: 2; color: #fff; font-family: var(--ff-head); font-weight: 600; font-size: 14px; text-shadow: 0 2px 8px rgba(0,0,0,.5); opacity: 0; transform: translateY(8px); transition: .35s; }
.sd-gallery__item:hover .sd-gallery__cap { opacity: 1; transform: translateY(0); }

/* ============================================================
   BEFORE & AFTER — cinematic case marquee (home page)
   ============================================================ */
.gx-ba { background: linear-gradient(160deg, var(--c-primary-darker) 0%, var(--c-primary-dark) 140%); color: #fff; padding: 88px 0 78px; overflow: hidden; position: relative; }
.gx-ba::before { content: ""; position: absolute; top: -120px; right: -100px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(224,138,46,.30), transparent 70%); pointer-events: none; }
.gx-ba::after { content: ""; position: absolute; bottom: -140px; left: -90px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(27,122,69,.28), transparent 70%); pointer-events: none; }
.gx-ba .sd-eyebrow { background: rgba(255,255,255,.12); color: #f6eed9; }
.gx-ba .sd-eyebrow i { color: var(--c-gold); }
.gx-ba .sd-title { color: #fff; }
.gx-ba .sd-title .hl { color: #ffbe62; }
.gx-ba .sd-lead { color: #e3d6f0; }
.gx-ba .sd-lead .sd-mr { color: #cdbce4; }
.gx-marquee { position: relative; margin-top: 48px;
  mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.gx-marquee__track { display: flex; width: max-content; animation: gx-scroll 70s linear infinite; will-change: transform; }
.gx-marquee:hover .gx-marquee__track { animation-play-state: paused; }
.gx-marquee__track img { height: 380px; width: auto; margin-right: 24px; border-radius: 18px;
  border: 1px solid rgba(255,255,255,.16); box-shadow: 0 24px 60px rgba(0,0,0,.35); }
@keyframes gx-scroll { to { transform: translateX(calc(-100% / 3)); } }
.gx-ba__tags { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 38px; position: relative; }
.gx-ba__tags span { font-family: var(--ff-head); font-weight: 600; font-size: 13px; letter-spacing: .02em;
  padding: 8px 16px; border-radius: 30px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.16); color: #f3ead9; }
.gx-ba__tags i { color: var(--c-gold); margin-right: 7px; }
.gx-ba__cta { text-align: center; margin-top: 36px; position: relative; }
@media (max-width: 700px) {
  .gx-ba { padding: 62px 0 56px; }
  .gx-marquee { margin-top: 34px; }
  .gx-marquee__track img { height: 235px; margin-right: 14px; border-radius: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .gx-marquee__track { animation: none; }
  .gx-marquee { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
}

/* responsive 3-column list (fracture list etc.) */
.gx-3col { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 30px; }
@media (max-width: 900px) { .gx-3col { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .gx-3col { grid-template-columns: 1fr; } }

/* gallery category headings + video grids (gallery / testimonial / patient-care) */
.gx-cat { font-size: 20px; margin: 0 0 18px; display: flex; align-items: center; gap: 10px; color: var(--c-ink); }
.gx-cat i { color: var(--c-primary); }
.gx-video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.gx-video-grid figure { margin: 0; background: #fff; border: 1px solid var(--c-line); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow-sm); }
.gx-video-grid video { width: 100%; height: 300px; object-fit: contain; background: #0d0d12; display: block; }
.gx-video-grid figcaption { padding: 11px 14px; font-size: 13.5px; font-weight: 600; color: var(--c-ink); font-family: var(--ff-head); }
.sd-cert .zoom { display: block; text-align: center; color: var(--c-primary); font-size: 12px; font-weight: 600; margin-top: 6px; }

/* ============================================================
   PATIENT CARE
   ============================================================ */
.sd-pc-card { background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius-lg); padding: 28px 26px; box-shadow: var(--shadow-sm); height: 100%; }
.sd-pc-card h3 { font-size: 20px; display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.sd-pc-ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, var(--c-accent), var(--c-primary)); color: #fff; display: grid; place-items: center; font-size: 19px; }
.sd-pc-lang { font-family: var(--ff-head); font-weight: 700; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--c-primary); background: var(--c-accent-soft); display: inline-block; padding: 4px 13px; border-radius: 20px; margin: 16px 0 10px; }
.sd-pc-card .sd-feat-list { margin: 0; }
.sd-pc-promo { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; background: linear-gradient(120deg, var(--c-accent-soft), #fff); border: 1px solid var(--c-line); border-radius: var(--radius-lg); padding: 30px 32px; box-shadow: var(--shadow-sm); }
.sd-pc-promo__ic { flex: 0 0 auto; width: 64px; height: 64px; border-radius: 16px; background: linear-gradient(135deg, var(--c-accent), var(--c-primary)); color: #fff; display: grid; place-items: center; font-size: 26px; box-shadow: var(--shadow-md); }
.sd-pc-promo__body { flex: 1 1 320px; }
.sd-pc-promo__body h3 { font-size: 22px; margin-bottom: 8px; }
.sd-pc-promo__body p { margin: 0; font-size: 15px; }
.sd-pc-promo .sd-btn { flex: 0 0 auto; }
@media (max-width: 560px) { .sd-pc-promo { padding: 26px 22px; } .sd-pc-promo .sd-btn { width: 100%; } }

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.sd-quote { background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius-lg); padding: 30px 28px; box-shadow: var(--shadow-sm); height: 100%; display: flex; flex-direction: column; position: relative; }
.sd-quote::before { content: "\201C"; font-family: Georgia, serif; position: absolute; top: 6px; right: 24px; font-size: 90px; line-height: 1; color: var(--c-accent-soft2); }
.sd-quote__stars { color: var(--c-gold); margin-bottom: 14px; font-size: 14px; }
.sd-quote p { font-size: 15.5px; color: var(--c-ink); font-style: italic; flex: 1 1 auto; }
.sd-quote__by { display: flex; align-items: center; gap: 13px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--c-line); }
.sd-quote__av { width: 52px; height: 52px; flex: 0 0 auto; border-radius: 50%; background: linear-gradient(135deg, var(--c-accent), var(--c-primary)); color: #fff; display: grid; place-items: center; font-family: var(--ff-head); font-weight: 700; font-size: 18px; overflow: hidden; }
.sd-quote__av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.sd-quote__by b { display: block; color: var(--c-ink); font-family: var(--ff-head); font-size: 15px; }
.sd-quote__by span { font-size: 13px; color: var(--c-body); }

/* ============================================================
   FAQ
   ============================================================ */
.sd-faq { max-width: 860px; margin: 0 auto; }
.sd-faq__item { background: #fff; border: 1px solid var(--c-line); border-radius: 14px; margin-bottom: 14px; overflow: hidden; box-shadow: var(--shadow-sm); }
.sd-faq__q { width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 20px 56px 20px 22px; font-family: var(--ff-head); font-weight: 600; font-size: 16.5px; color: var(--c-ink); position: relative; }
.sd-faq__q::after { content: "\f067"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-primary); display: grid; place-items: center; font-size: 12px; transition: .3s; }
.sd-faq__item.is-open .sd-faq__q { color: var(--c-primary); }
.sd-faq__item.is-open .sd-faq__q::after { content: "\f068"; background: var(--c-primary); color: #fff; }
.sd-faq__a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.sd-faq__a p { padding: 0 22px 22px; margin: 0; font-size: 15px; }

/* ============================================================
   CONTACT
   ============================================================ */
.sd-contact__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: start; }
.sd-info-card { background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 22px; display: flex; gap: 16px; box-shadow: var(--shadow-sm); margin-bottom: 16px; transition: transform .3s, box-shadow .3s; }
.sd-info-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.sd-info-card .ic { flex: 0 0 auto; width: 50px; height: 50px; border-radius: 14px; background: var(--c-accent-soft); color: var(--c-primary); display: grid; place-items: center; font-size: 20px; }
.sd-info-card h4 { font-size: 16px; margin-bottom: 4px; }
.sd-info-card p, .sd-info-card a { font-size: 14.5px; margin: 0; color: var(--c-body); display: block; }
.sd-info-card a:hover { color: var(--c-primary); }
.sd-map { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); border: 1px solid var(--c-line); margin-top: 22px; }
.sd-map iframe { width: 100%; height: 340px; border: 0; display: block; }

/* ============================================================
   PAGE HERO (inner pages) + breadcrumb
   ============================================================ */
.sd-pagehero { background: linear-gradient(120deg, #2e1450, #5d2d90 70%); color: #fff; position: relative; overflow: hidden; padding: 64px 0 70px; text-align: center; }
.sd-pagehero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 85% 15%, rgba(27,122,69,.4), transparent 45%); }
.sd-pagehero h1 { color: #fff; font-size: clamp(30px, 4.5vw, 46px); position: relative; }
.sd-crumb { position: relative; display: inline-flex; gap: 10px; align-items: center; margin-top: 12px; font-size: 14.5px; color: #ecdcf4; }
.sd-crumb a { color: #fff; }
.sd-crumb i { font-size: 9px; color: #e6c4f2; }

/* ============================================================
   CTA BANNER
   ============================================================ */
.sd-cta { background: linear-gradient(120deg, #5d2d90, #1b7a45); border-radius: var(--radius-lg); padding: 50px; color: #fff; text-align: center; position: relative; overflow: hidden; box-shadow: var(--shadow-lg); }
.sd-cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 15% 20%, rgba(255,255,255,.18), transparent 35%); }
.sd-cta h2 { color: #fff; font-size: clamp(26px, 3.5vw, 38px); position: relative; }
.sd-cta p { color: #efe1f6; max-width: 600px; margin: 0 auto 26px; position: relative; }
.sd-cta__btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; position: relative; }

/* ============================================================
   FOOTER
   ============================================================ */
.sd-footer { background: var(--c-primary-darker); color: #c9b7d4; padding: 70px 0 0; }
.sd-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 38px; padding-bottom: 46px; }
.sd-footer h4 { color: #fff; font-size: 17px; margin-bottom: 20px; }
.sd-footer .sd-brand__mark { background: #fff; border-radius: 12px; padding: 6px; width: 58px; height: 58px; }
.sd-footer .sd-brand__tx b { color: #fff; }
.sd-footer .sd-brand__tx span { color: #e6c4f2; }
.sd-footer__about p { font-size: 14.5px; margin: 18px 0; color: #b6a2c6; }
.sd-footer__links { list-style: none; padding: 0; display: grid; gap: 11px; }
.sd-footer__links a { color: #c9b7d4; font-size: 14.5px; display: inline-flex; align-items: center; gap: 9px; }
.sd-footer__links a i { font-size: 10px; color: var(--c-accent); }
.sd-footer__links a:hover { color: #fff; padding-left: 4px; }
.sd-footer__contact { list-style: none; padding: 0; display: grid; gap: 15px; }
.sd-footer__contact li { display: flex; gap: 12px; font-size: 14.5px; color: #c9b7d4; align-items: flex-start; }
.sd-footer__contact i { color: var(--c-accent); margin-top: 4px; }
.sd-footer__contact a { color: #c9b7d4; }
.sd-footer__contact a:hover { color: #fff; }
.sd-footer__social { display: flex; gap: 10px; margin-top: 20px; }
.sd-footer__social a { width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.08); color: #ecdcf4; display: grid; place-items: center; font-size: 15px; }
.sd-footer__social a:hover { background: var(--c-accent); color: #fff; transform: translateY(-3px); }
.sd-footer__bar { border-top: 1px solid rgba(255,255,255,.1); padding: 20px 0; display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; font-size: 13.5px; color: #a894bd; }
.sd-footer__bar a { color: #ecdcf4; }

/* ============================================================
   FLOATING WHATSAPP + scroll top
   ============================================================ */
.sd-wa { position: fixed; right: 22px; bottom: 24px; z-index: 900; display: inline-flex; align-items: center; gap: 10px; background: #25d366; color: #fff; padding: 12px 20px 12px 16px; border-radius: 50px; box-shadow: 0 14px 30px rgba(37,211,102,.4); font-family: var(--ff-head); font-weight: 600; font-size: 15px; }
.sd-wa i { font-size: 22px; }
.sd-wa:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 18px 36px rgba(37,211,102,.5); }
.sd-wa__pulse { position: absolute; left: 8px; width: 38px; height: 38px; border-radius: 50%; background: #25d366; opacity: .55; animation: sdpulse 1.8s infinite; z-index: -1; }
@keyframes sdpulse { 0% { transform: scale(1); opacity: .55; } 100% { transform: scale(2.2); opacity: 0; } }
.sd-top { position: fixed; right: 24px; bottom: 90px; z-index: 899; width: 44px; height: 44px; border-radius: 50%; background: var(--c-primary); color: #fff; border: none; display: grid; place-items: center; cursor: pointer; opacity: 0; visibility: hidden; transition: .3s; box-shadow: var(--shadow-md); }
.sd-top.is-show { opacity: 1; visibility: visible; }
.sd-top:hover { background: var(--c-primary-dark); }

/* ---------- preloader ---------- */
@keyframes sddraw { 0% { stroke-dashoffset: 340; } 55% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -340; } }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .sd-footer__grid { grid-template-columns: 1fr 1fr; gap: 30px; }
}
@media (max-width: 1150px) {
  /* 8-item nav no longer fits comfortably — switch to burger early */
  .sd-nav { display: none; }
  .sd-burger { display: grid; place-items: center; }
}
@media (max-width: 991px) {
  .sd-section { padding: 64px 0; }
  .sd-nav, .sd-header__cta .sd-btn { display: none; }
  .sd-burger { display: grid; place-items: center; }
  .sd-hero__grid { grid-template-columns: 1fr; gap: 30px; padding: 50px 0 70px; }
  .sd-hero__visual { max-width: 460px; margin: 0 auto; }
  .sd-about__grid, .sd-profile, .sd-contact__grid { grid-template-columns: 1fr; gap: 34px; }
  .sd-about__media { max-width: 460px; margin: 0 auto; }
  .sd-grid-3, .sd-grid-4, .sd-grid-5, .sd-why__grid, .sd-accred { grid-template-columns: repeat(3, 1fr); }
  .sd-grid-3, .sd-grid-4, .sd-why__grid, .sd-accred { grid-template-columns: repeat(2, 1fr); }
  .sd-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 28px 12px; }
  .sd-stat:nth-child(2)::after { display: none; }
  .sd-gallery { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  body { font-size: 15px; }
  .sd-section { padding: 52px 0; }
  .sd-grid-3, .sd-grid-2, .sd-grid-4, .sd-why__grid, .sd-accred, .sd-gallery, .sd-form .row2 { grid-template-columns: 1fr; }
  .sd-stats__grid { grid-template-columns: 1fr 1fr; }
  .sd-stat::after { display: none !important; }
  .sd-topbar__info span:not(.keep), .sd-topbar { display: none; }
  .sd-cta { padding: 36px 24px; }
  .sd-about__media .accent-img { right: 0; }
  .sd-wa__label { display: none; }
  .sd-wa { padding: 14px; }
}


/* ============================================================
   GALAXY — Bilingual (Marathi) helpers & brand tweaks
   ============================================================ */
[lang="mr"], .sd-mr {
  font-family: "Noto Sans Devanagari", var(--ff-body);
  line-height: 1.9;
}
.sd-mr { color: var(--c-body); }
.sd-mr--muted { color: #7a6f84; font-size: .96em; }
.sd-pc-lang { display:inline-block; font-family: var(--ff-head); font-size:12px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color: var(--c-primary);
  background: var(--c-accent-soft); border-radius:20px; padding:3px 12px; margin:14px 0 8px; }
/* Devanagari brand line under logo */
.sd-brand__tx span.mr { font-family:"Noto Sans Devanagari", var(--ff-head); font-weight:600; }
/* Wide cases band */
.sd-caseband { border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-md); border:1px solid var(--c-line); }
.sd-caseband img { width:100%; display:block; }
/* Aim ribbon */
.sd-aim { background: linear-gradient(120deg,#2e1450,#5d2d90); color:#fff; border-radius:var(--radius-lg);
  padding:34px 40px; text-align:center; box-shadow:var(--shadow-lg); position:relative; overflow:hidden; }
.sd-aim h3 { color:#ffbe62; font-size:14px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px; }
.sd-aim p { font-size:18px; margin:0; }
.sd-aim [lang="mr"] { font-size:19px; }

/* ============================================================
   FOOTER — layout hardening + mobile redesign
   ------------------------------------------------------------
   The 4-column grid (1.4fr 1fr 1fr 1.3fr) had no responsive
   override. Grid `fr` tracks take min-content as their automatic
   minimum, so the long email/address strings pushed the grid
   wider than the viewport on phones and the last column was
   clipped off-screen. Fixed at the root: min-width:0 on the
   tracks + wrappable long strings + real breakpoints.
   ============================================================ */
.sd-footer__grid > * { min-width: 0; }
.sd-footer__contact li,
.sd-footer__contact a,
.sd-footer__about p { overflow-wrap: anywhere; }
.sd-footer .sd-brand { max-width: 100%; }
.sd-footer .sd-brand__tx { min-width: 0; }
.sd-footer .sd-brand__tx b { font-size: 19px; }

/* replaces the inline flex styles that used to sit on this element */
.sd-footer__bar-in { display: flex; justify-content: space-between; align-items: center;
  gap: 14px; flex-wrap: wrap; width: 100%;
  /* The back-to-top button is fixed at the right edge, so the bar's right-hand
     text runs under it at any viewport narrower than the container max-width.
     Reserve the space at every width rather than chasing breakpoints:
     20px .sd-container gutter (this rule overrides it) + 66px clearance. */
  padding-right: 86px; }
/* The fixed Book-Appointment button is bottom-right at EVERY width and was
   sitting on top of the footer tagline once you scrolled to the page bottom.
   Reserve room underneath the bar so it can never cover the text. */
.sd-footer__bar { padding-bottom: 92px; }

@media (max-width: 991px) {
  .sd-footer { padding-top: 56px; }
  .sd-footer__grid { grid-template-columns: 1fr 1fr; gap: 34px 28px; padding-bottom: 36px; }
  .sd-footer__about { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
  .sd-footer { padding-top: 44px; }
  /* one column, each block separated by a hairline so the footer stays scannable */
  .sd-footer__grid { grid-template-columns: 1fr; gap: 0; padding-bottom: 6px; }
  .sd-footer__grid > * { padding: 22px 0; border-top: 1px solid rgba(255,255,255,.09); }
  .sd-footer__grid > *:first-child { padding-top: 0; border-top: 0; }
  .sd-footer h4 { font-size: 16px; margin-bottom: 12px; }
  .sd-footer__about p { margin: 14px 0 0; }
  /* short labels sit 2-up so the link lists don't run a mile down the page */
  .sd-footer__links { gap: 2px; }
  .sd-footer__links--2col { grid-template-columns: 1fr 1fr; column-gap: 18px; }
  .sd-footer__links a { padding: 8px 0; }          /* ~40px tap target */
  .sd-footer__contact { gap: 4px; }
  .sd-footer__contact li { padding: 7px 0; }
  .sd-footer__social { margin-top: 16px; }
  .sd-footer__social a { width: 44px; height: 44px; }  /* min. touch target */
  /* stack the two bar lines; right clearance is inherited from the 991 rule */
  .sd-footer__bar-in { flex-direction: column; align-items: flex-start; gap: 6px; }
  .sd-footer__bar { padding: 18px 0 96px; }
}

/* ================= Scroll reveal (replaces aos.css) =================
   Hidden start-state applies only when JS is on (html.js) and the viewport is
   >=640px — mirroring the old AOS `disable: innerWidth < 640`. Without JS the
   content is simply visible, so a script failure can never blank the page. */
@media (min-width: 640px) {
  html.js [data-aos] { opacity: 0; transition-property: opacity, transform; transition-duration: .7s; transition-timing-function: cubic-bezier(.4, 0, .2, 1); }
  html.js [data-aos="fade-up"]    { transform: translate3d(0, 100px, 0); }
  html.js [data-aos="fade-left"]  { transform: translate3d(100px, 0, 0); }
  html.js [data-aos="fade-right"] { transform: translate3d(-100px, 0, 0); }
  html.js [data-aos="zoom-in"]    { transform: scale(.6); }
  html.js [data-aos].aos-animate  { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  html.js [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; transition-delay: 0ms !important; }
}

/* ================= Lightbox (replaces jQuery + Magnific Popup) ================= */
.sd-lb { position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center; background: rgba(11, 4, 16, .92); padding: 24px; opacity: 0; transition: opacity .25s ease; }
.sd-lb.is-open { display: flex; opacity: 1; }
.sd-lb__fig { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.sd-lb__img { max-width: min(1100px, 92vw); max-height: 82vh; width: auto; height: auto; border-radius: 10px; box-shadow: 0 24px 70px rgba(0, 0, 0, .6); background: #1b0c24; }
.sd-lb__cap { color: #f1e6f7; font-family: var(--ff-head); font-size: 15px; text-align: center; max-width: 92vw; }
.sd-lb__close, .sd-lb__nav { position: absolute; background: rgba(255, 255, 255, .12); color: #fff; border: 0; cursor: pointer; border-radius: 50%; display: grid; place-items: center; transition: background .2s; -webkit-tap-highlight-color: transparent; }
.sd-lb__close:hover, .sd-lb__nav:hover, .sd-lb__close:focus-visible, .sd-lb__nav:focus-visible { background: rgba(255, 255, 255, .28); outline: none; }
.sd-lb__close { top: 16px; right: 16px; width: 46px; height: 46px; font-size: 30px; line-height: 1; }
.sd-lb__nav { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; font-size: 22px; }
.sd-lb__prev { left: 18px; }
.sd-lb__next { right: 18px; }
.sd-lb__nav[hidden] { display: none; }
@media (max-width: 640px) {
  .sd-lb { padding: 12px; }
  .sd-lb__img { max-height: 74vh; }
  .sd-lb__nav { width: 44px; height: 44px; font-size: 18px; }
  .sd-lb__prev { left: 8px; }
  .sd-lb__next { right: 8px; }
  .sd-lb__close { top: 10px; right: 10px; width: 40px; height: 40px; font-size: 26px; }
}

/* Inline contact links (phone / WhatsApp / email in body copy) are the primary
   conversion action on mobile but render only ~17px tall. Give them a comfortable
   touch height without disturbing the surrounding layout. */
@media (max-width: 767px) {
  a[href^="tel:"]:not([class]),
  a[href^="mailto:"]:not([class]),
  a[href*="api.whatsapp.com"]:not([class]) { display: inline-block; padding-block: 6px; }
}