/* ========================================================================== 
   Anand Clinic — Unified Frontend Design System
   Clean refactor: one source of truth for public pages + admin essentials.
   ========================================================================== */

:root {
  --ac-primary: #0789d6;
  --ac-primary-strong: #006fb8;
  --ac-primary-dark: #075a91;
  --ac-navy: #073d65;
  --ac-cyan: #20c7cb;
  --ac-pink: #ff5a9f;
  --ac-text: #46677f;
  --ac-muted: #6d889b;
  --ac-border: #dbeaf3;
  --ac-border-strong: #c9e1ef;
  --ac-surface: #ffffff;
  --ac-surface-soft: #f6fbfe;
  --ac-surface-blue: #edf8fe;
  --ac-surface-pink: #fff6fa;
  --ac-footer: #075a89;
  --ac-footer-dark: #064e78;
  --ac-success: #0d9c71;
  --ac-shadow-xs: 0 4px 14px rgba(11, 84, 129, 0.06);
  --ac-shadow-sm: 0 8px 24px rgba(11, 84, 129, 0.08);
  --ac-shadow-md: 0 16px 42px rgba(8, 81, 129, 0.12);
  --ac-shadow-lg: 0 26px 70px rgba(8, 81, 129, 0.16);
  --ac-radius-sm: 10px;
  --ac-radius: 16px;
  --ac-radius-lg: 24px;
  --ac-container: 1240px;
  --ac-header-height: 78px;
  --ac-transition: 180ms ease;
}

/* Base ------------------------------------------------------------------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--ac-text);
  background: #fff;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
main { min-height: 55vh; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: rgba(7, 137, 214, 0.16); color: var(--ac-navy); }
.container { width: min(calc(100% - 48px), var(--ac-container)); margin-inline: auto; }
.section { padding: 78px 0; }
.desktop-only { display: inline; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  color: var(--ac-navy);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.025em;
}
p { margin-top: 0; }

/* Shared labels and buttons --------------------------------------------- */
.eyebrow,
.v4-eyebrow {
  display: block;
  margin-bottom: 8px;
  color: var(--ac-primary);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.11em;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
}
.eyebrow.left,
.v4-eyebrow.left { text-align: left; }

.primary-btn,
.nav-cta,
.v4-btn,
.btn {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 800;
  line-height: 1;
  transition: transform var(--ac-transition), box-shadow var(--ac-transition), background var(--ac-transition), border-color var(--ac-transition);
}
.primary-btn,
.nav-cta,
.v4-btn.primary,
.btn {
  color: #fff;
  background: linear-gradient(135deg, var(--ac-primary), #0aa4e8);
  box-shadow: 0 10px 24px rgba(7, 137, 214, 0.22);
}
.primary-btn,
.v4-btn { padding: 13px 22px; font-size: 13px; }
.nav-cta { padding: 12px 20px; font-size: 13px; white-space: nowrap; }
.v4-btn.small { min-height: 40px; padding: 11px 18px; font-size: 12px; }
.v4-btn.outline {
  color: var(--ac-primary-strong);
  background: #fff;
  border: 1px solid #92d0ef;
  box-shadow: none;
}
.primary-btn:hover,
.nav-cta:hover,
.v4-btn:hover,
.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(7, 137, 214, 0.25);
}
.v4-btn.outline:hover { border-color: var(--ac-primary); box-shadow: var(--ac-shadow-xs); }
.primary-btn.full { width: 100%; }

/* Top bar --------------------------------------------------------------- */
.topbar {
  position: relative;
  z-index: 1002;
  color: #fff;
  background: linear-gradient(90deg, #0769a6 0%, #0b91cd 100%);
  font-size: 11px;
  font-weight: 600;
}
.topbar-inner {
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.topbar-left,
.topbar-right { display: flex; align-items: center; gap: 14px; }
.topbar-right a { color: #fff; opacity: 0.96; }
.topbar-right a:hover { opacity: 1; text-decoration: underline; }
.top-sep { padding-left: 14px; border-left: 1px solid rgba(255, 255, 255, 0.34); }
.mini-heart { font-size: 13px; }
.social-dot {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 50%;
  font-size: 9px;
  line-height: 1;
}

/* Header and navigation ------------------------------------------------- */
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  height: var(--ac-header-height);
  background: rgba(255, 255, 255, 0.97);
  border-bottom: 1px solid rgba(210, 230, 241, 0.86);
  box-shadow: 0 4px 22px rgba(5, 76, 118, 0.055);
  backdrop-filter: blur(12px);
}
.nav {
  height: var(--ac-header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.brand-reference { display: block; width: 220px; }
.brand-reference img { width: 100%; height: 56px; object-fit: contain; object-position: left center; }
.menu { display: flex; align-items: center; justify-content: flex-end; gap: 4px; }
.menu > a:not(.nav-cta) {
  position: relative;
  height: var(--ac-header-height);
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  color: #174f73;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  transition: color var(--ac-transition);
}
.menu > a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  left: 13px;
  right: 13px;
  bottom: 13px;
  height: 2px;
  border-radius: 99px;
  background: var(--ac-primary);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--ac-transition);
}
.menu > a:not(.nav-cta):hover,
.menu > a:not(.nav-cta).active { color: var(--ac-primary-strong); }
.menu > a:not(.nav-cta):hover::after,
.menu > a:not(.nav-cta).active::after { transform: scaleX(1); }
.menu-btn {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid var(--ac-border-strong);
  border-radius: 11px;
  color: var(--ac-primary-strong);
  background: #fff;
  font-size: 21px;
  cursor: pointer;
}

/* Home: hero ------------------------------------------------------------ */
.home-v4 { color: var(--ac-text); }
.v4-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #edf9ff 0%, #e9f7fe 45%, #f9fdff 100%);
  border-bottom: 1px solid #e2f0f7;
}
.v4-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 22% 26%, rgba(255, 255, 255, 0.85) 0, rgba(255, 255, 255, 0) 34%),
    linear-gradient(90deg, rgba(255,255,255,.2), transparent 55%);
}
.v4-hero-grid {
  position: relative;
  z-index: 1;
  min-height: 520px;
  display: grid;
  grid-template-columns: minmax(0, 47%) minmax(0, 53%);
  align-items: stretch;
}
.v4-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 54px 42px 52px 0;
}
.v4-trust {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  margin-bottom: 16px;
  padding: 7px 12px;
  border: 1px solid #bee6f8;
  border-radius: 999px;
  color: #1786be;
  background: rgba(224, 246, 255, 0.9);
  font-size: 11px;
  font-weight: 800;
}
.v4-hero-copy h1 {
  margin-bottom: 18px;
  color: #07578e;
  font-size: clamp(48px, 4.5vw, 67px);
  line-height: 0.98;
  letter-spacing: -0.048em;
}
.v4-hero-copy h1 span { color: #0a8fda; }
.v4-hero-copy > p {
  max-width: 560px;
  margin-bottom: 24px;
  color: #345f7a;
  font-size: 16px;
  line-height: 1.7;
}
.v4-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.v4-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 34px;
}
.v4-benefits > div { display: flex; align-items: center; gap: 10px; color: #345d77; font-size: 12px; font-weight: 700; }
.v4-benefits b {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  border-radius: 50%;
  color: var(--ac-primary);
  background: #fff;
  box-shadow: var(--ac-shadow-sm);
  font-size: 15px;
}
.v4-hero-image {
  min-height: 520px;
  background-image: linear-gradient(90deg, #e9f7fe 0%, rgba(233,247,254,0.15) 18%, rgba(255,255,255,0) 46%), url('../uploads/reference-hero-right.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* Home: services -------------------------------------------------------- */
.v4-services { padding: 72px 0 78px; background: #fff; }
.v4-services h2 {
  margin: 0 0 10px;
  text-align: center;
  color: #0a5588;
  font-size: clamp(31px, 3vw, 42px);
}
.v4-services h2 span { color: var(--ac-primary); }
.v4-section-copy {
  max-width: 760px;
  margin: 0 auto 30px;
  color: var(--ac-muted);
  text-align: center;
  font-size: 14px;
}
.v4-service-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.v4-service-panel {
  padding: 20px;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius);
  box-shadow: var(--ac-shadow-xs);
}
.v4-service-panel.pink-panel { background: linear-gradient(135deg, #fff7fb 0%, #fff 75%); border-color: #f1dbe6; }
.v4-service-panel.blue-panel { background: linear-gradient(135deg, #f1faff 0%, #fff 75%); }
.v4-service-head { min-height: 54px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.v4-service-title { display: flex; align-items: flex-start; gap: 12px; }
.v4-service-title i {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  border-radius: 50%;
  font-style: normal;
  font-size: 17px;
}
.v4-service-title i.pink { color: var(--ac-pink); background: #ffe5f0; }
.v4-service-title i.blue { color: var(--ac-primary); background: #ddf3ff; }
.v4-service-title h3 { margin: 0 0 3px; color: #0b5688; font-size: 17px; letter-spacing: -0.015em; }
.v4-service-title p { margin: 0; color: var(--ac-muted); font-size: 11px; }
.v4-service-head > a { margin-top: 5px; color: var(--ac-primary); font-size: 10px; font-weight: 800; white-space: nowrap; }
.v4-mini-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.v4-mini {
  min-height: 118px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 7px;
  border: 1px solid #e2edf4;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.93);
  text-align: center;
  box-shadow: 0 2px 7px rgba(11, 84, 129, 0.025);
  transition: transform var(--ac-transition), box-shadow var(--ac-transition), border-color var(--ac-transition);
}
.v4-mini:hover { transform: translateY(-3px); border-color: #c6e3f2; box-shadow: var(--ac-shadow-sm); }
.v4-mini > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 17px;
}
.v4-mini > span.pink { color: var(--ac-pink); background: #ffe7f1; }
.v4-mini > span.blue { color: var(--ac-primary); background: #e2f5ff; }
.v4-mini strong { color: #275a7a; font-size: 11px; line-height: 1.35; }

/* Home: doctors --------------------------------------------------------- */
.v4-doctors { padding: 64px 0; background: linear-gradient(90deg, #f3fbff 0%, #edf8fe 100%); }
.v4-doctors-grid { display: grid; grid-template-columns: minmax(250px, 0.34fr) minmax(0, 0.66fr); gap: 42px; align-items: center; }
.v4-doctors-intro h2,
.v4-facility-copy h2,
.v4-testimonial-intro h2,
.v4-faq-intro h2,
.v4-contact-intro h2 { margin: 0 0 12px; color: #07578e; font-size: clamp(28px, 2.4vw, 36px); }
.v4-doctors-intro p,
.v4-facility-copy > p,
.v4-testimonial-intro p,
.v4-faq-intro p,
.v4-contact-intro p { margin-bottom: 18px; color: #58778c; font-size: 13px; }
.v4-doctor-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.v4-doctor-card {
  overflow: hidden;
  border: 1px solid var(--ac-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--ac-shadow-xs);
  transition: transform var(--ac-transition), box-shadow var(--ac-transition);
}
.v4-doctor-card:hover { transform: translateY(-4px); box-shadow: var(--ac-shadow-md); }
.v4-doc-photo { height: 190px; overflow: hidden; background: #eef6fa; }
.v4-doc-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.v4-doc-body { min-height: 106px; padding: 14px 14px 16px; }
.v4-doc-body h3 { margin: 0 0 4px; color: #0a5a8d; font-size: 13px; letter-spacing: -0.01em; }
.v4-doc-body p { margin: 0 0 4px; color: #1983be; font-size: 10px; line-height: 1.35; }
.v4-doc-body small { color: #7892a3; font-size: 9px; }

/* Home: facilities ------------------------------------------------------ */
.v4-facilities { padding: 64px 0; background: #fff; }
.v4-facility-grid { display: grid; grid-template-columns: minmax(0, 56%) minmax(0, 44%); gap: 34px; align-items: center; }
.v4-facility-icons { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
.v4-facility-icons > div {
  min-height: 106px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 7px;
  border: 1px solid var(--ac-border);
  border-radius: 12px;
  background: #fff;
  text-align: center;
  box-shadow: var(--ac-shadow-xs);
}
.v4-facility-icons span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--ac-primary);
  background: #e2f5ff;
  font-size: 17px;
}
.v4-facility-icons b { color: #2d607f; font-size: 10px; line-height: 1.25; }
.v4-facility-photo { position: relative; min-height: 280px; overflow: hidden; border-radius: 16px; box-shadow: var(--ac-shadow-sm); }
.v4-facility-photo img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; object-position: center; }
.v4-facility-photo > span {
  position: absolute;
  right: 0;
  bottom: 18px;
  min-width: 166px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 13px 18px;
  border-radius: 999px 0 0 999px;
  color: #fff;
  background: linear-gradient(135deg, #087bc1, #0a9bdf);
  box-shadow: 0 12px 30px rgba(4, 102, 159, 0.25);
  font-size: 13px;
}
.v4-facility-photo > span b { font-size: 10px; line-height: 1.25; }

/* Home: testimonials ---------------------------------------------------- */
.v4-testimonials { padding: 58px 0; background: linear-gradient(90deg, #edf8fe 0%, #e8f6fd 100%); }
.v4-testimonial-grid { display: grid; grid-template-columns: minmax(230px, 0.32fr) minmax(0, 0.68fr); gap: 42px; align-items: center; }
.v4-testimonial-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.v4-testimonial-cards article {
  position: relative;
  min-height: 170px;
  padding: 22px 20px 18px;
  border: 1px solid var(--ac-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--ac-shadow-xs);
}
.v4-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  margin-bottom: 10px;
  border-radius: 50%;
  color: #0d78b8;
  background: #ddf3fe;
  font-size: 12px;
  font-weight: 800;
}
.v4-testimonial-cards p { min-height: 54px; margin: 0 0 8px; color: #466d86; font-size: 11px; line-height: 1.55; }
.v4-testimonial-cards b { display: block; color: #1786c2; font-size: 10px; }
.v4-stars { margin-top: 4px; color: #ffb72c; font-size: 11px; letter-spacing: 0.08em; }

/* Home: FAQ ------------------------------------------------------------- */
.v4-faq { padding: 62px 0; background: #fff; }
.v4-faq-grid { display: grid; grid-template-columns: minmax(210px, 0.28fr) minmax(0, 0.48fr) minmax(220px, 0.24fr); gap: 28px; align-items: start; }
.v4-faq-list { display: grid; gap: 9px; }
.faq-item { overflow: hidden; border: 1px solid var(--ac-border); border-radius: 10px; background: #fff; box-shadow: 0 2px 7px rgba(10, 86, 134, 0.025); }
.faq-q {
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 14px;
  border: 0;
  color: #295e7e;
  background: #fff;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.faq-q span { color: var(--ac-primary); font-size: 16px; font-weight: 700; }
.faq-a { display: none; padding: 0 14px 14px; color: #648296; font-size: 11px; line-height: 1.6; }
.faq-item.active { border-color: #bee0f1; box-shadow: var(--ac-shadow-xs); }
.faq-item.active .faq-q { color: var(--ac-primary-dark); background: #f9fdff; }
.faq-item.active .faq-a { display: block; }
.v4-question-card {
  display: flex;
  gap: 13px;
  padding: 20px;
  border: 1px solid #deedf5;
  border-radius: 14px;
  background: linear-gradient(135deg, #f1faff, #eaf7fd);
}
.v4-question-card > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  border-radius: 50%;
  color: var(--ac-primary);
  background: #dff3fe;
  font-size: 17px;
}
.v4-question-card b { color: #245d7f; font-size: 12px; }
.v4-question-card p { margin: 4px 0 12px; color: #67849a; font-size: 10px; }
.v4-question-card a { display: inline-flex; color: #fff; background: var(--ac-primary); border-radius: 999px; padding: 9px 14px; font-size: 10px; font-weight: 800; }

/* Home: contact strip --------------------------------------------------- */
.v4-contact-strip { padding: 30px 0; border-top: 1px solid #e5f0f6; background: #fff; }
.v4-contact-grid { display: grid; grid-template-columns: 1.35fr repeat(3, 1fr) 1.05fr; gap: 20px; align-items: center; }
.v4-contact-intro h2 { margin-bottom: 5px; font-size: 24px; }
.v4-contact-intro p { margin: 0; font-size: 10px; line-height: 1.55; }
.v4-contact-item {
  min-width: 0;
  min-height: 70px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding-left: 16px;
  border-left: 1px solid #e3edf4;
}
.v4-contact-item > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  border-radius: 50%;
  color: var(--ac-primary);
  background: #e0f4fe;
  font-size: 15px;
}
.v4-contact-item b { display: block; margin-bottom: 2px; color: #2b6281; font-size: 10px; }
.v4-contact-item a,
.v4-contact-item p { display: block; overflow-wrap: anywhere; margin: 0; color: #285a78; font-size: 9px; font-weight: 700; line-height: 1.45; }
.v4-contact-item small { display: block; margin-top: 3px; color: #7892a4; font-size: 8px; }
.v4-contact-actions { display: grid; gap: 8px; }
.v4-contact-actions .v4-btn { width: 100%; min-height: 40px; padding: 10px 13px; font-size: 10px; }

/* Inner page hero ------------------------------------------------------- */
.inner-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.95), rgba(255,255,255,0) 34%),
    linear-gradient(100deg, #eef9ff 0%, #e8f7fe 56%, #f8fcff 100%);
  border-bottom: 1px solid #dfedf5;
}
.inner-hero-grid { min-height: 350px; display: grid; grid-template-columns: minmax(0, 52%) minmax(0, 48%); align-items: center; gap: 28px; }
.inner-hero h1 { margin-bottom: 12px; color: #07578e; font-size: clamp(42px, 4vw, 56px); }
.inner-hero p { margin-bottom: 18px; color: #50748b; font-size: 16px; }
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; color: #6d8798; font-size: 12px; }
.breadcrumb a { color: var(--ac-primary); font-weight: 700; }
.breadcrumb b { color: #315f79; }
.inner-hero-image { height: 350px; display: flex; align-items: flex-end; justify-content: flex-end; overflow: hidden; }
.inner-hero-image img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.inner-hero-image.wide img,
.services-hero .inner-hero-image img { object-fit: cover; object-position: center; border-radius: 0; }

/* Inner content / CMS content ------------------------------------------ */
.inner-content-section { padding: 78px 0; background: #fff; }
.page-content,
.ref-page-content { color: var(--ac-text); font-size: 15px; line-height: 1.75; }
.page-content > h2:first-child,
.ref-page-content > h2:first-child { margin-top: 0; }
.ref-page-content h2 { margin: 36px 0 14px; color: #07578e; font-size: clamp(28px, 2.7vw, 38px); }
.ref-page-content h3 { color: #0b5e91; font-size: 19px; }
.ref-page-content p { margin-bottom: 16px; color: #56768b; }
.ref-page-content ul,
.ref-page-content ol { padding-left: 22px; }
.ref-page-content li { margin-bottom: 8px; }
.ref-page-content img { border-radius: var(--ac-radius); box-shadow: var(--ac-shadow-sm); }
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr); gap: 48px; align-items: center; }
.split > img { width: 100%; max-height: 440px; object-fit: cover; }
.grid { display: grid; gap: 22px; }
.grid.g3,
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.card {
  overflow: hidden;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius);
  background: #fff;
  box-shadow: var(--ac-shadow-xs);
}
.card > img { width: 100%; height: 220px; object-fit: cover; border-radius: 0; box-shadow: none; }
.card .pad,
.pad { padding: 22px; }
.card h3 { margin-bottom: 8px; }
.card p:last-child { margin-bottom: 0; }

/* About mission strip --------------------------------------------------- */
.mission-strip { padding: 34px 0; background: linear-gradient(90deg, #f1faff, #eaf7fd); border-block: 1px solid #deedf5; }
.mission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.mission-grid > div { display: flex; gap: 14px; padding: 22px; border: 1px solid var(--ac-border); border-radius: 14px; background: rgba(255,255,255,.85); }
.mission-icon { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 44px; border-radius: 50%; color: var(--ac-primary); background: #dff3fe; }
.mission-grid small { color: var(--ac-primary); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.mission-grid p { margin: 4px 0 0; color: #56768b; font-size: 13px; }
.simple-cta { padding: 34px 0; background: linear-gradient(135deg, #075c91, #078bd3); color: #fff; }
.simple-cta .container { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.simple-cta small { display: block; margin-bottom: 6px; color: #bdeaff; font-size: 11px; font-weight: 800; letter-spacing: .09em; }
.simple-cta h2 { margin: 0; color: #fff; font-size: clamp(23px, 2.4vw, 32px); }
.simple-cta .primary-btn { color: #077dbf; background: #fff; box-shadow: none; }

/* Services page --------------------------------------------------------- */
.services-title { margin: 0 0 8px; color: #07578e; font-size: clamp(32px, 3vw, 42px); }
.services-lead { max-width: 720px; margin-bottom: 30px; color: #668399; }
.service-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.overview-service-card {
  overflow: hidden;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius);
  background: #fff;
  box-shadow: var(--ac-shadow-xs);
  transition: transform var(--ac-transition), box-shadow var(--ac-transition);
}
.overview-service-card:hover { transform: translateY(-4px); box-shadow: var(--ac-shadow-md); }
.overview-image { height: 220px; overflow: hidden; background: #eef7fb; }
.overview-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 300ms ease; }
.overview-service-card:hover .overview-image img { transform: scale(1.035); }
.overview-body { padding: 22px; }
.overview-body > span { display: block; margin-bottom: 7px; color: var(--ac-primary); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.overview-body h3 { margin-bottom: 9px; color: #0a5a8d; font-size: 19px; }
.overview-body p { min-height: 48px; margin-bottom: 14px; color: #637f93; font-size: 13px; }
.overview-body a { color: var(--ac-primary); font-size: 12px; font-weight: 800; }
.services-bottom-cta { overflow: hidden; background: linear-gradient(100deg, #edf8fe, #dff2fc); }
.services-bottom-cta .container { min-height: 210px; display: grid; grid-template-columns: minmax(0, 1fr) 230px auto; gap: 30px; align-items: center; }
.services-bottom-cta small { display: block; margin-bottom: 7px; color: var(--ac-primary); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.services-bottom-cta h2 { max-width: 620px; margin: 0; color: #07578e; font-size: clamp(25px, 2.4vw, 34px); }
.services-bottom-cta img { align-self: end; width: 220px; max-height: 205px; object-fit: contain; object-position: bottom; }

/* Contact page ---------------------------------------------------------- */
.contact-section { padding: 76px 0; }
.contact-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); gap: 58px; align-items: start; }
.contact-details h2 { margin-bottom: 10px; color: #07578e; font-size: clamp(30px, 3vw, 40px); }
.contact-details > p { margin-bottom: 28px; color: #668399; }
.contact-item { display: flex; align-items: flex-start; gap: 14px; margin: 16px 0; }
.contact-item > span { width: 46px; height: 46px; display: grid; place-items: center; flex: 0 0 46px; border-radius: 50%; color: var(--ac-primary); background: #e1f4fe; font-size: 18px; }
.contact-item b { display: block; margin-bottom: 2px; color: #245e80; font-size: 13px; }
.contact-item a,
.contact-item p { margin: 0; color: #466b83; font-size: 13px; }
.contact-item small { display: block; margin-top: 3px; color: #849aa9; font-size: 11px; }
.contact-form,
.form {
  display: grid;
  gap: 13px;
  padding: 30px;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-lg);
  background: #fff;
  box-shadow: var(--ac-shadow-md);
}
.contact-form h3,
.form h2 { margin-bottom: 6px; color: #07578e; font-size: 25px; }
.contact-form input,
.contact-form textarea,
.form input,
.form textarea,
.form select {
  width: 100%;
  border: 1px solid #d6e8f2;
  border-radius: 10px;
  outline: 0;
  color: #315f79;
  background: #fbfdff;
  transition: border-color var(--ac-transition), box-shadow var(--ac-transition), background var(--ac-transition);
}
.contact-form input,
.form input,
.form select { min-height: 48px; padding: 11px 13px; }
.contact-form textarea,
.form textarea { min-height: 145px; resize: vertical; padding: 12px 13px; }
.contact-form input:focus,
.contact-form textarea:focus,
.form input:focus,
.form textarea:focus,
.form select:focus { border-color: #83ccec; background: #fff; box-shadow: 0 0 0 4px rgba(7,137,214,.09); }
.form label { margin-top: 4px; color: #315f79; font-size: 12px; }
.notice { padding: 12px 14px; border: 1px solid #bce8d7; border-radius: 10px; color: #087a58; background: #ebfbf5; font-size: 13px; }
.contact-map-section { padding: 0 0 76px; }
.contact-map-section iframe { display: block; overflow: hidden; border-radius: var(--ac-radius); box-shadow: var(--ac-shadow-sm); }

/* Footer ---------------------------------------------------------------- */
.ref-footer { color: #d9edf8; background: linear-gradient(180deg, var(--ac-footer), var(--ac-footer-dark)); }
.footer-grid { display: grid; grid-template-columns: 1.45fr .85fr 1fr 1fr; gap: 54px; padding-top: 48px; padding-bottom: 44px; }
.footer-brand { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.footer-brand img { width: 44px; height: 44px; object-fit: contain; }
.footer-brand span { display: flex; flex-direction: column; line-height: 1.1; }
.footer-brand strong { color: #fff; font-size: 18px; }
.footer-brand small { margin-top: 4px; color: #75dbe0; font-size: 9px; font-weight: 700; }
.footer-about p { max-width: 330px; color: #bcd8e8; font-size: 11px; line-height: 1.7; }
.footer-grid h3 { margin-bottom: 14px; color: #fff; font-size: 13px; letter-spacing: 0; }
.footer-grid > div:not(.footer-about) > a { display: block; width: max-content; max-width: 100%; margin: 6px 0; color: #d6eaf5; font-size: 11px; transition: color var(--ac-transition), transform var(--ac-transition); }
.footer-grid > div:not(.footer-about) > a:hover { color: #fff; transform: translateX(2px); }
.footer-social { display: flex; gap: 8px; margin-bottom: 14px; }
.footer-social span { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; color: #fff; font-size: 10px; }
.footer-contact { color: #c8e0ed; font-size: 10px; line-height: 1.8; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.13); }
.footer-bottom .container { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #bcd6e5; font-size: 9px; }
.float-whatsapp {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 999;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 2px solid rgba(255,255,255,.9);
  border-radius: 50%;
  color: #fff;
  background: #24c66c;
  box-shadow: 0 10px 28px rgba(22, 146, 78, .28);
  font-size: 20px;
}

/* Admin essentials ------------------------------------------------------ */
.admin-page { background: #f5f9fc; }
.admin-page .header { position: sticky; }
.admin-header .nav > b { color: #07578e; font-size: 18px; }
.admin-page main.section { padding: 42px 0 70px; }
.admin-page h1 { margin-bottom: 24px; color: #07578e; }
.admin-page .grid.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-page .card { min-height: 140px; }
.admin-page .card .pad { padding: 24px; }
.admin-page .split { grid-template-columns: minmax(360px, .8fr) minmax(0, 1.2fr); align-items: start; }
.admin-table { width: 100%; border-collapse: collapse; border: 1px solid var(--ac-border); background: #fff; box-shadow: var(--ac-shadow-xs); }
.admin-table th,
.admin-table td { padding: 12px 13px; border-bottom: 1px solid #e5eff5; text-align: left; vertical-align: top; font-size: 12px; }
.admin-table th { color: #1f5a7d; background: #eef8fd; font-weight: 800; }
.admin-table a { color: var(--ac-primary-strong); font-weight: 700; }
.admin-login { min-height: 100vh; background: linear-gradient(135deg, #eaf8ff, #f8fcff); }
.admin-login .section { min-height: 100vh; display: grid; place-items: center; }
.admin-login .form { width: 100%; }
.mint { background: #edf9f7; }

/* Tablet --------------------------------------------------------------- */
@media (max-width: 1100px) {
  :root { --ac-container: 960px; }
  .container { width: min(calc(100% - 40px), var(--ac-container)); }
  .brand-reference { width: 190px; }
  .menu > a:not(.nav-cta) { padding-inline: 9px; font-size: 12px; }
  .menu > a:not(.nav-cta)::after { left: 9px; right: 9px; }
  .nav-cta { padding-inline: 15px; font-size: 12px; }

  .v4-hero-grid { min-height: 470px; }
  .v4-hero-image { min-height: 470px; }
  .v4-hero-copy h1 { font-size: 52px; }
  .v4-benefits { gap: 14px; }
  .v4-doctors-grid { grid-template-columns: 1fr; gap: 28px; }
  .v4-doctors-intro { max-width: 680px; }
  .v4-doc-photo { height: 180px; }
  .v4-facility-grid { grid-template-columns: 1fr; }
  .v4-facility-photo { min-height: 320px; }
  .v4-facility-photo img { min-height: 320px; }
  .v4-testimonial-grid { grid-template-columns: 1fr; gap: 24px; }
  .v4-testimonial-intro { max-width: 650px; }
  .v4-faq-grid { grid-template-columns: minmax(200px,.34fr) minmax(0,.66fr); }
  .v4-question-card { grid-column: 1 / -1; }
  .v4-contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4-contact-intro { grid-column: 1 / -1; }
  .v4-contact-actions { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4-contact-item { border-left: 0; padding-left: 0; }

  .service-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-grid { gap: 36px; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; gap: 36px; }
  .footer-grid > div:last-child { grid-column: auto; }
}

/* Mobile navigation + tablet portrait ---------------------------------- */
@media (max-width: 900px) {
  :root { --ac-header-height: 68px; }
  body { font-size: 14px; }
  .topbar-right .social-dot { display: none; }
  .topbar-right a:last-of-type { display: none; }
  .header { height: var(--ac-header-height); }
  .nav { height: var(--ac-header-height); }
  .brand-reference { width: 172px; }
  .brand-reference img { height: 50px; }
  .menu-btn { display: inline-grid; place-items: center; margin-left: auto; }
  .menu {
    position: absolute;
    top: calc(var(--ac-header-height) - 1px);
    right: 20px;
    left: 20px;
    display: none;
    padding: 10px;
    border: 1px solid var(--ac-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--ac-shadow-lg);
  }
  .menu.open { display: grid; }
  .menu > a:not(.nav-cta) {
    height: auto;
    min-height: 44px;
    padding: 10px 13px;
    border-radius: 9px;
    font-size: 13px;
  }
  .menu > a:not(.nav-cta)::after { display: none; }
  .menu > a:not(.nav-cta):hover,
  .menu > a:not(.nav-cta).active { background: #f1f9fd; }
  .menu .nav-cta { width: 100%; margin-top: 6px; }

  .v4-hero-grid { min-height: 0; grid-template-columns: 1fr; }
  .v4-hero-copy { padding: 48px 0 38px; }
  .v4-hero-copy h1 { font-size: clamp(44px, 10vw, 58px); }
  .v4-hero-image { min-height: 390px; margin-inline: -20px; background-position: center; }
  .v4-service-panels { grid-template-columns: 1fr; }
  .v4-doctor-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4-doc-photo { height: 230px; }
  .v4-facility-icons { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v4-testimonial-cards { grid-template-columns: 1fr; }
  .v4-testimonial-cards article { min-height: 0; }
  .v4-testimonial-cards p { min-height: 0; }
  .v4-faq-grid { grid-template-columns: 1fr; }
  .v4-question-card { grid-column: auto; }

  .inner-hero-grid { min-height: 0; grid-template-columns: 1fr; padding-top: 48px; }
  .inner-hero-image { height: 300px; }
  .split { grid-template-columns: 1fr; gap: 28px; }
  .grid.g3,
  .g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mission-grid { grid-template-columns: 1fr; }
  .service-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .services-bottom-cta .container { grid-template-columns: 1fr 180px; padding-top: 32px; }
  .services-bottom-cta .primary-btn { grid-column: 1 / -1; width: max-content; margin-bottom: 30px; }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .admin-header .menu { right: 20px; left: 20px; }
  .admin-page .split { grid-template-columns: 1fr; }
  .admin-page .grid.g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Phones ---------------------------------------------------------------- */
@media (max-width: 640px) {
  .container { width: min(calc(100% - 28px), var(--ac-container)); }
  .section { padding: 58px 0; }
  .desktop-only { display: none; }
  .topbar { font-size: 9px; }
  .topbar-inner { min-height: 28px; gap: 8px; }
  .topbar-left { gap: 8px; }
  .topbar-right { gap: 0; }
  .topbar-right a { font-size: 0; }
  .topbar-right a:first-child::before { content: "☎ Call"; font-size: 9px; }
  .top-sep { padding-left: 8px; }
  .brand-reference { width: 154px; }
  .menu { right: 14px; left: 14px; }

  .v4-hero-copy { padding: 38px 0 30px; }
  .v4-trust { font-size: 9px; }
  .v4-hero-copy h1 { margin-bottom: 16px; font-size: 42px; }
  .v4-hero-copy > p { font-size: 14px; }
  .v4-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .v4-btn { padding-inline: 15px; }
  .v4-benefits { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 26px; }
  .v4-hero-image { min-height: 290px; margin-inline: -14px; }

  .v4-services { padding: 56px 0 60px; }
  .v4-services h2 { font-size: 30px; }
  .v4-section-copy { font-size: 12px; }
  .v4-service-panel { padding: 16px; }
  .v4-service-head { align-items: flex-start; }
  .v4-service-head > a { display: none; }
  .v4-service-title h3 { font-size: 15px; }
  .v4-mini-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4-mini { min-height: 110px; }

  .v4-doctors,
  .v4-facilities,
  .v4-testimonials,
  .v4-faq { padding: 52px 0; }
  .v4-doctor-list { grid-template-columns: 1fr; gap: 14px; }
  .v4-doctor-card { display: grid; grid-template-columns: 132px 1fr; }
  .v4-doc-photo { height: 150px; }
  .v4-doc-body { min-height: 150px; display: flex; flex-direction: column; justify-content: center; }
  .v4-facility-icons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v4-facility-photo,
  .v4-facility-photo img { min-height: 240px; }
  .v4-testimonial-cards { gap: 12px; }
  .v4-contact-grid { grid-template-columns: 1fr; }
  .v4-contact-intro { grid-column: auto; }
  .v4-contact-actions { grid-column: auto; grid-template-columns: 1fr; }
  .v4-contact-item { min-height: 0; }

  .inner-hero h1 { font-size: 38px; }
  .inner-hero p { font-size: 14px; }
  .inner-hero-grid { padding-top: 38px; }
  .inner-hero-image { height: 240px; }
  .inner-content-section { padding: 56px 0; }
  .ref-page-content h2 { font-size: 28px; }
  .grid.g3,
  .g3 { grid-template-columns: 1fr; }
  .card > img { height: 210px; }
  .mission-grid > div { padding: 18px; }
  .simple-cta .container { align-items: flex-start; flex-direction: column; }

  .service-overview-grid { grid-template-columns: 1fr; }
  .overview-image { height: 210px; }
  .services-bottom-cta .container { grid-template-columns: 1fr; padding-top: 34px; text-align: left; }
  .services-bottom-cta img { width: 180px; justify-self: end; }
  .services-bottom-cta .primary-btn { grid-column: auto; margin: 0 0 30px; }

  .contact-section { padding: 56px 0; }
  .contact-form,
  .form { padding: 20px; border-radius: 16px; }
  .contact-map-section { padding-bottom: 56px; }
  .footer-grid { grid-template-columns: 1fr; gap: 26px; padding-top: 38px; padding-bottom: 34px; }
  .footer-about p { max-width: none; }
  .footer-bottom .container { min-height: 70px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; }
  .float-whatsapp { right: 14px; bottom: 14px; width: 44px; height: 44px; }

  .admin-page .grid.g3 { grid-template-columns: 1fr; }
  .admin-page main.section { padding: 28px 0 50px; }
}

/* Secondary public utility pages --------------------------------------- */
.page-hero { padding: 58px 0; background: linear-gradient(100deg, #eef9ff, #e7f6fd); border-bottom: 1px solid #dfedf5; }
.page-hero h1 { margin: 0; color: #07578e; font-size: clamp(36px, 3.5vw, 50px); }
.card.doctor > img { height: 290px; object-fit: cover; object-position: top center; }
.card.doctor strong { display: block; margin: -2px 0 10px; color: var(--ac-primary); font-size: 12px; }
.card.doctor p { color: #637f93; font-size: 13px; }
.ok { color: var(--ac-success); }

/* ========================================================================== 
   V8 Full Content Architecture — reference-site detail integration
   ========================================================================== */
.secondary-btn {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  border: 1px solid #8bc8e8;
  border-radius: 999px;
  color: var(--ac-primary-strong);
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  transition: transform var(--ac-transition), box-shadow var(--ac-transition), border-color var(--ac-transition);
}
.secondary-btn:hover { transform: translateY(-2px); border-color: var(--ac-primary); box-shadow: var(--ac-shadow-xs); }
.secondary-btn.light { color: #fff; border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.08); }
.inner-kicker { display: inline-block; margin-bottom: 12px; color: var(--ac-primary); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.inner-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }

.ac-section-heading { margin-bottom: 32px; }
.ac-section-heading.centered { max-width: 760px; margin-inline: auto; text-align: center; }
.ac-section-heading.centered p { margin: 0 auto; }
.ac-section-heading h2,
.ac-copy-block h2,
.ac-map-heading h2 { margin: 0 0 12px; color: #07578e; font-size: clamp(30px, 3vw, 42px); }
.ac-section-heading p,
.ac-copy-block p,
.ac-map-heading p { color: #617d90; }
.split-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.split-heading > div { max-width: 760px; }

.ac-two-col { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); gap: 58px; align-items: center; }
.ac-two-col.reverse { grid-template-columns: minmax(360px, .95fr) minmax(0, 1.05fr); }
.ac-copy-block > p:last-of-type { margin-bottom: 0; }
.ac-copy-block h3 { margin: 26px 0 12px; font-size: 21px; }
.ac-image-card { position: relative; overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius-lg); background: #eef7fb; box-shadow: var(--ac-shadow-md); }
.ac-image-card img { width: 100%; height: 430px; object-fit: cover; object-position: center; }
.ac-image-card.maternity img { object-fit: contain; padding: 16px; background: linear-gradient(135deg,#edf9ff,#fdfefe); }
.ac-image-card > span { position: absolute; right: 18px; bottom: 18px; padding: 10px 14px; border-radius: 999px; color: #fff; background: rgba(4,83,132,.9); font-size: 11px; font-weight: 800; box-shadow: var(--ac-shadow-sm); }
.ac-inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 26px; }
.ac-text-link { color: var(--ac-primary-strong); font-size: 13px; font-weight: 800; }

/* Home extended sections */
.ac-intro-section { padding: 76px 0; background: #fff; }
.ac-intro-grid { display: grid; grid-template-columns: minmax(360px,.92fr) minmax(0,1.08fr); gap: 56px; align-items: center; }
.ac-intro-media { overflow: hidden; border-radius: var(--ac-radius-lg); box-shadow: var(--ac-shadow-md); }
.ac-intro-media img { width: 100%; height: 430px; object-fit: cover; }
.ac-intro-copy h2 { margin: 0 0 16px; color: #07578e; font-size: clamp(31px,3vw,43px); }
.ac-intro-copy p { color: #5b788d; }
.ac-service-directory { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 20px; }
.ac-service-directory > div { padding: 20px; border: 1px solid var(--ac-border); border-radius: 14px; background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-service-directory h3 { margin: 0 0 12px; font-size: 15px; }
.ac-chip-list { display: flex; flex-wrap: wrap; gap: 8px; }
.ac-chip-list a,
.ac-info-pills span { display: inline-flex; align-items: center; min-height: 32px; padding: 7px 11px; border: 1px solid #d8eaf4; border-radius: 999px; color: #27617f; background: #f8fcfe; font-size: 10px; font-weight: 700; }
.ac-doctor-grid-six { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 14px; }
.ac-doctor-grid-six .v4-doc-photo { height: 176px; }
.ac-doctor-grid-six .v4-doc-body { min-height: 126px; }
.ac-care-pillars { padding: 72px 0; background: linear-gradient(135deg,#f6fbfe,#edf8fd); }
.ac-pillar-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ac-pillar-grid article { padding: 28px; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-pillar-grid article > span { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 14px; color: var(--ac-primary); background: #e7f6fd; font-size: 20px; }
.ac-pillar-grid h3 { margin-bottom: 10px; font-size: 20px; }
.ac-pillar-grid p { margin: 0; color: #637f92; font-size: 13px; }
.ac-gallery-section { padding: 72px 0; background: #fff; }
.ac-gallery-grid { display: grid; grid-template-columns: 1.35fr .85fr .85fr 1.15fr; gap: 12px; }
.ac-gallery-grid img { width: 100%; height: 260px; object-fit: cover; border-radius: 14px; box-shadow: var(--ac-shadow-xs); }
.ac-faq-wide { max-width: 900px; margin: 0 auto; display: grid; gap: 10px; }
.ac-faq-cta { max-width: 900px; margin: 22px auto 0; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--ac-border); border-radius: 14px; background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-faq-cta b { display: block; color: var(--ac-navy); margin-bottom: 3px; }
.ac-faq-cta p { margin: 0; color: var(--ac-muted); font-size: 12px; }
.ac-blog-section { padding: 78px 0; background: #fff; }
.ac-blog-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ac-blog-card { overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); transition: transform var(--ac-transition), box-shadow var(--ac-transition); }
.ac-blog-card:hover { transform: translateY(-4px); box-shadow: var(--ac-shadow-md); }
.ac-blog-image { height: 210px; overflow: hidden; background: #eef7fb; }
.ac-blog-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.ac-blog-body { padding: 20px; }
.ac-blog-body > span { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-bottom: 12px; border-radius: 50%; color: var(--ac-primary); background: #e9f7fd; font-size: 10px; font-weight: 800; }
.ac-blog-body h3 { margin-bottom: 9px; font-size: 17px; }
.ac-blog-body p { min-height: 85px; margin-bottom: 12px; color: #657f92; font-size: 12px; }
.ac-blog-body a { color: var(--ac-primary-strong); font-size: 11px; font-weight: 800; }

/* About / Obstetrics / Gynaecology */
.ac-about-intro,
.ac-condition-intro,
.ac-treatment-section { background: #fff; }
.ac-stat-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 28px; }
.ac-stat-row > div { padding: 16px; border: 1px solid var(--ac-border); border-radius: 12px; background: #f9fcfe; }
.ac-stat-row strong { display: block; color: var(--ac-primary); font-size: 24px; line-height: 1; }
.ac-stat-row span { display: block; margin-top: 7px; color: #58778b; font-size: 10px; font-weight: 700; }
.ac-values-section { padding: 72px 0; background: #f5fbfe; }
.ac-value-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.ac-value-grid article { padding: 24px; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-value-grid article > span { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 15px; border-radius: 12px; color: var(--ac-primary); background: #e6f6fd; }
.ac-value-grid h3 { margin-bottom: 8px; font-size: 17px; }
.ac-value-grid p { margin: 0; color: #687f90; font-size: 12px; }
.ac-team-feature { background: #fff; }
.ac-team-profile-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ac-team-profile-grid article { display: grid; grid-template-columns: 118px 1fr; overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-team-profile-grid img { width: 118px; height: 154px; object-fit: cover; object-position: top center; background: #eff7fb; }
.ac-team-profile-grid article > div { padding: 18px; }
.ac-team-profile-grid h3 { margin: 0 0 4px; font-size: 16px; }
.ac-team-profile-grid span { color: var(--ac-primary); font-size: 10px; font-weight: 800; }
.ac-team-profile-grid p { margin: 9px 0 0; color: #657f91; font-size: 11px; }
.ac-facility-band { padding: 72px 0; background: linear-gradient(135deg,#eef9fe,#f9fdff); }
.ac-check-list { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; }
.ac-check-list li { position: relative; padding-left: 28px; color: #57768b; }
.ac-check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ac-primary); font-size: 10px; font-weight: 800; }
.ac-info-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.ac-service-detail-section { padding: 72px 0; background: #f7fbfe; }
.ac-detail-card-grid { display: grid; gap: 18px; }
.ac-detail-card-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ac-detail-card-grid article { overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-detail-card-grid article > img { width: 100%; height: 220px; object-fit: cover; background: #eef7fb; }
.ac-detail-card-grid article > div { padding: 22px; }
.ac-detail-card-grid article > div > span { color: #9acfe9; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.ac-detail-card-grid h3 { margin: 4px 0 9px; font-size: 20px; }
.ac-detail-card-grid p { color: #657f91; font-size: 12px; }
.ac-detail-card-grid ul,
.ac-condition-grid ul { margin: 14px 0 0; padding-left: 18px; color: #59778b; font-size: 11px; }
.ac-detail-card-grid li,
.ac-condition-grid li { margin: 5px 0; }
.ac-light-section { background: linear-gradient(135deg,#f8fcfe,#eef9fe); }
.ac-bullet-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 20px; }
.ac-bullet-grid span { position: relative; padding: 12px 14px 12px 38px; border: 1px solid var(--ac-border); border-radius: 10px; color: #456b83; background: #fff; font-size: 11px; font-weight: 700; }
.ac-bullet-grid span::before { content: "✓"; position: absolute; left: 13px; color: var(--ac-primary); font-weight: 900; }
.ac-note-card { padding: 30px; border: 1px solid #cfe6f2; border-radius: var(--ac-radius-lg); background: #fff; box-shadow: var(--ac-shadow-sm); }
.ac-note-card > strong { display: inline-block; margin-bottom: 9px; padding: 5px 9px; border-radius: 999px; color: var(--ac-primary-strong); background: #e7f6fd; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.ac-note-card h3 { margin-bottom: 10px; font-size: 22px; }
.ac-note-card p { color: #5b788c; }
.ac-note-card.warning { border-color: #f0dcb8; background: #fffdf8; }
.ac-note-card.warning > strong { color: #ad7312; background: #fff1d4; }
.ac-pregnancy-journey,
.ac-service-process { padding: 72px 0; background: #fff; }
.ac-step-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; }
.ac-step-grid article { padding: 22px; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-step-grid b { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-bottom: 14px; border-radius: 50%; color: #fff; background: linear-gradient(135deg,var(--ac-primary),#11a8e5); font-size: 10px; }
.ac-step-grid h3 { margin-bottom: 8px; font-size: 16px; }
.ac-step-grid p { margin: 0; color: #667f91; font-size: 11px; }
.ac-procedure-feature { padding: 72px 0; background: #fff; }
.ac-inline-note { margin-top: 20px; padding: 14px 16px; border-left: 4px solid var(--ac-primary); border-radius: 0 10px 10px 0; color: #58778b; background: #f2faff; font-size: 11px; }
.ac-condition-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ac-condition-grid article { overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-condition-grid img { width: 100%; height: 220px; object-fit: cover; background: #eef7fb; }
.ac-condition-grid article > div { padding: 22px; }
.ac-condition-grid h3 { margin-bottom: 9px; font-size: 19px; }
.ac-condition-grid p { color: #627d90; font-size: 12px; }
.ac-existing-content { padding: 58px 0; background: #fff; border-top: 1px solid #edf4f8; }
.ac-existing-content-inner { padding: 28px; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fbfdfe; }
.ac-existing-content-inner h2:first-of-type { margin-top: 0; }
.simple-cta p { max-width: 720px; margin: 8px 0 0; color: #d7f0fb; font-size: 12px; }
.simple-cta-actions { display: flex; flex-wrap: wrap; gap: 10px; flex: 0 0 auto; }

/* Services */
.ac-service-support { background: #fff; }
.ac-support-service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ac-support-service-grid article { overflow: hidden; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-support-service-grid img { width: 100%; height: 235px; object-fit: cover; background: #edf7fb; }
.ac-support-service-grid article > div { padding: 22px; }
.ac-support-service-grid span { color: #9acfe9; font-size: 10px; font-weight: 800; }
.ac-support-service-grid h3 { margin: 4px 0 9px; font-size: 20px; }
.ac-support-service-grid p { color: #637f91; font-size: 12px; }
.ac-support-service-grid ul { margin: 12px 0 0; padding-left: 17px; color: #607d90; font-size: 11px; }
.ac-medical-services { background: #f7fbfe; }
.ac-medical-services .services-lead { max-width: 760px; margin-inline: auto; }
.services-bottom-cta p { margin: 8px 0 0; color: #d9effa; font-size: 12px; }

/* Contact */
.ac-contact-cards { padding: 38px 0 0; background: #fff; }
.ac-contact-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.ac-contact-card-grid > * { display: flex; gap: 16px; padding: 22px; border: 1px solid var(--ac-border); border-radius: var(--ac-radius); background: #fff; box-shadow: var(--ac-shadow-xs); }
.ac-contact-card-grid > * > span { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 44px; border-radius: 13px; color: var(--ac-primary); background: #e8f7fd; font-size: 17px; }
.ac-contact-card-grid small { color: var(--ac-primary); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.ac-contact-card-grid h3 { margin: 4px 0 7px; font-size: 15px; overflow-wrap: anywhere; }
.ac-contact-card-grid p { margin: 0; color: #657f91; font-size: 11px; }
.ac-contact-info-list { display: grid; gap: 12px; margin: 24px 0; }
.ac-contact-info-list > div { padding: 16px; border: 1px solid var(--ac-border); border-radius: 12px; background: #f8fcfe; }
.ac-contact-info-list b { display: block; margin-bottom: 4px; color: var(--ac-navy); }
.ac-contact-info-list p { margin: 0; font-size: 11px; }
.contact-form label { display: block; margin: 12px 0 6px; color: #365f79; font-size: 10px; font-weight: 800; }
.contact-form .form-lead { margin: -4px 0 12px; color: #6c8596; font-size: 11px; }
.privacy-note { display: block; margin-top: 10px; color: #7a92a2; font-size: 9px; line-height: 1.5; }
.ac-map-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.ac-map-heading > div { max-width: 720px; }
.footer-address { margin-top: 16px; color: #d9edf8; font-size: 11px; line-height: 1.6; }
.footer-address b { display: block; margin-bottom: 4px; color: #fff; }
.footer-open { color: #c7e4f2; font-size: 10px; line-height: 1.55; }
.footer-open b { color: #fff; }

@media (max-width: 1180px) {
  .ac-doctor-grid-six { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .ac-doctor-grid-six .v4-doc-photo { height: 220px; }
  .ac-gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-gallery-grid img { height: 250px; }
  .ac-step-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .ac-two-col,
  .ac-two-col.reverse,
  .ac-intro-grid { grid-template-columns: 1fr; gap: 34px; }
  .ac-two-col.reverse .ac-image-card { order: 2; }
  .ac-service-directory,
  .ac-pillar-grid,
  .ac-detail-card-grid.three,
  .ac-condition-grid,
  .ac-support-service-grid,
  .ac-contact-card-grid { grid-template-columns: 1fr; }
  .ac-value-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-team-profile-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-blog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-stat-row { max-width: 560px; }
  .ac-step-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-map-heading { align-items: flex-start; flex-direction: column; }
  .split-heading { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 640px) {
  .inner-hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .ac-intro-section,
  .ac-care-pillars,
  .ac-gallery-section,
  .ac-blog-section,
  .ac-values-section,
  .ac-facility-band,
  .ac-service-detail-section,
  .ac-pregnancy-journey,
  .ac-procedure-feature,
  .ac-service-process { padding: 54px 0; }
  .ac-intro-media img,
  .ac-image-card img { height: 300px; }
  .ac-image-card.maternity img { height: 330px; }
  .ac-doctor-grid-six { grid-template-columns: 1fr; }
  .ac-doctor-grid-six .v4-doctor-card { display: grid; grid-template-columns: 132px 1fr; }
  .ac-doctor-grid-six .v4-doc-photo { height: 150px; }
  .ac-doctor-grid-six .v4-doc-body { min-height: 150px; }
  .ac-gallery-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .ac-gallery-grid img { height: 150px; border-radius: 10px; }
  .ac-blog-grid { grid-template-columns: 1fr; }
  .ac-blog-body p { min-height: 0; }
  .ac-faq-cta { align-items: flex-start; flex-direction: column; }
  .ac-value-grid,
  .ac-team-profile-grid,
  .ac-step-grid { grid-template-columns: 1fr; }
  .ac-team-profile-grid article { grid-template-columns: 105px 1fr; }
  .ac-team-profile-grid img { width: 105px; height: 145px; }
  .ac-stat-row { grid-template-columns: 1fr; }
  .ac-bullet-grid { grid-template-columns: 1fr; }
  .ac-detail-card-grid article > img,
  .ac-condition-grid img,
  .ac-support-service-grid img { height: 210px; }
  .ac-existing-content { padding: 42px 0; }
  .ac-existing-content-inner { padding: 18px; }
  .simple-cta-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  .simple-cta-actions .primary-btn,
  .simple-cta-actions .secondary-btn { width: 100%; }
  .ac-contact-card-grid > * { padding: 18px; }
}

/* 2026 Anand Clinic: individual page imagery and polished responsive visual system */
.v4-hero-image { background-image: linear-gradient(90deg,#e9f7fe 0%,rgba(233,247,254,.12) 24%,transparent 52%),url('../uploads/anand-home-banner.webp'); background-position:center center; }
.inner-hero-image { border-radius: 22px; box-shadow: 0 16px 42px rgba(14,80,123,.13); align-items:stretch; background:#eaf7fd; }
.inner-hero-image img,.inner-hero-image.wide img,.services-hero .inner-hero-image img { object-fit:cover; object-position:60% center; border-radius:22px; }
.ac-intro-media img,.ac-image-card img,.ac-gallery-grid img,.ac-blog-image img,.ac-detail-card-grid article>img,.ac-condition-grid article>img,.overview-image img { object-fit:cover; }
.ac-image-card,.ac-intro-media,.overview-service-card,.ac-blog-card { overflow:hidden; border-radius:20px; }
.ac-image-card img,.ac-gallery-grid img,.ac-intro-media img { transition:transform .45s ease; }
.ac-image-card:hover img,.ac-gallery-grid img:hover,.ac-intro-media:hover img { transform:scale(1.035); }
@media(max-width:767px){.inner-hero-image { border-radius:16px; height:260px; }.inner-hero-image img,.inner-hero-image.wide img { border-radius:16px; }.v4-hero-image{background-position:60% center;} }

/* Helpful navigation when a retired page address is visited */
.ac-friendly-links{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 16px}.ac-friendly-links a{background:#e6f5fd;color:#075c91;border:1px solid #b9e4fa;padding:12px 19px;border-radius:11px;font-weight:700;text-decoration:none}.ac-friendly-links a:hover{background:#0878bc;color:#fff}

/* Specialist pages: properly aligned accessible desktop dropdown */
.menu > .nav-department {position:relative;display:flex;align-items:stretch;flex:0 0 auto}
.menu > .nav-department > a {height:var(--ac-header-height);display:inline-flex;align-items:center;gap:7px;padding:0 13px;color:#174f73;font-size:13px;font-weight:700;white-space:nowrap}
.menu > .nav-department > a:hover,.menu > .nav-department > a:focus-visible {color:var(--ac-primary-strong)}
.nav-department-menu {display:none!important;position:absolute;top:100%;left:0;min-width:245px;background:#fff;border:1px solid var(--ac-border);box-shadow:0 16px 36px rgba(8,81,129,.15);padding:8px;border-radius:12px;z-index:1100}
.nav-department:hover .nav-department-menu,.nav-department:focus-within .nav-department-menu {display:grid!important;grid-template-columns:1fr;gap:2px}
.nav-department-menu a {display:block!important;width:100%;height:auto!important;margin:0!important;padding:11px 13px!important;font-size:13px!important;font-weight:600!important;color:#174f73!important;white-space:nowrap!important;border-radius:8px;line-height:1.4;text-align:left}
.nav-department-menu a:hover,.nav-department-menu a:focus {background:#edf8fe!important;color:#006fb8!important}
@media(max-width:1100px) and (min-width:901px){.menu > .nav-department > a{padding-inline:9px;font-size:12px}}
@media(max-width:900px){
 .menu > .nav-department{display:block;width:100%}
 .menu > .nav-department > a{height:auto;min-height:44px;width:100%;padding:10px 13px}
 .nav-department-menu,.nav-department:hover .nav-department-menu,.nav-department:focus-within .nav-department-menu{position:static;display:grid!important;grid-template-columns:1fr;min-width:0;width:100%;box-shadow:none;border:0;background:#f4faff;padding:4px 8px 4px 16px;border-radius:8px}
 .nav-department-menu a{white-space:normal!important;padding:10px 12px!important}
}
.surgery-speciality-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.surgery-speciality-card {background:#fff;border:1px solid #dbeaf3;border-radius:20px;overflow:hidden;box-shadow:0 14px 40px rgba(8,81,129,.08)}
.surgery-speciality-card>img {width:100%;height:260px;object-fit:cover}
.surgery-speciality-card>div {padding:25px}
.surgery-speciality-card h3 {font-size:27px;margin:8px 0}

@media(max-width:700px){.surgery-speciality-grid {grid-template-columns:1fr}.surgery-speciality-card>img {height:210px}}


/* Doctor poster image updates for Anand Hospital */
.doctor-poster-photo,
.ac-doctor-grid-six .doctor-poster-photo {
  height: auto !important;
  aspect-ratio: 4 / 5;
  padding: 8px;
  background: #fff;
}
.doctor-poster-img,
.ac-doctor-grid-six .doctor-poster-img,
.card.doctor > img.doctor-poster-img {
  width: 100%;
  height: 100% !important;
  aspect-ratio: 4 / 5;
  object-fit: contain !important;
  object-position: center top !important;
  background: #fff;
  border-radius: 12px;
}
.doctor-poster-card .v4-doc-body,
.card.doctor.doctor-poster-card .pad {
  text-align: left;
}
.doctors-poster-grid { align-items: start; }
@media (max-width: 991px) {
  .ac-doctor-grid-six { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ac-doctor-grid-six .doctor-poster-card { display: block; }
  .ac-doctor-grid-six .doctor-poster-photo { aspect-ratio: 4 / 5; }
}
@media (max-width: 640px) {
  .ac-doctor-grid-six { grid-template-columns: 1fr; }
  .ac-doctor-grid-six .doctor-poster-photo,
  .card.doctor.doctor-poster-card > img.doctor-poster-img { aspect-ratio: 4 / 5; }
  .ac-doctor-grid-six .doctor-poster-card { display: block; }
  .ac-doctor-grid-six .v4-doc-body { min-height: auto; }
  .card.doctor > img.doctor-poster-img { height: auto !important; }
}