/* Image-led compositions. The opaque ends of each veil protect reading contrast. */
.hero {
  display: block;
  padding: 0;
  min-height: 740px;
  isolation: isolate;
  overflow: hidden;
  background: #f3f7fa;
  perspective: none;
}
.hero-backdrop, .hero-overlay, .contact-backdrop, .contact-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero-backdrop, .contact-backdrop { z-index: 0; overflow: hidden; }
.hero-backdrop img, .contact-backdrop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 47%;
}
.hero-overlay {
  z-index: 1;
  background: linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.92) 28%, rgba(255,255,255,.66) 48%, rgba(255,255,255,.13) 78%),
              linear-gradient(0deg, rgba(255,255,255,.88), rgba(255,255,255,0) 30%);
}
.hero-shell {
  position: relative;
  z-index: 2;
  min-height: inherit;
  display: flex;
  flex-direction: column;
  padding-top: 90px;
}
.hero-content { max-width: 780px; padding: 0 0 56px; }
.hero h1 {
  font-size: clamp(64px, 6.6vw, 96px);
  line-height: 1.06;
  letter-spacing: -.04em;
  font-weight: 500;
  margin-bottom: 30px;
}
.hero-copy { max-width: 405px; color: #425c63; font-size: 17px; line-height: 1.85; }
.hero-actions { margin-top: 32px; gap: 30px; }
.hero-actions .button { box-shadow: 0 9px 24px #005c7418; }
.hero-actions .text-link { color: var(--ink); }
.hero-location { margin-top: 44px; }
.hero-location small { color: #49656b; }
.hero-bottom {
  margin-top: auto;
  padding: 24px 0;
  border-top: 1px solid #829ea54a;
  color: #37565d;
}

/* Service imagery is the surface, never a competing image tile above the copy. */
.services .section-heading { align-items: end; gap: 50px; margin-bottom: 58px; }
.services .section-heading h2 { letter-spacing: -.035em; }
.services-grid { gap: 28px; align-items: start; }
.services-grid .service-card:nth-child(n) { margin-top: 0; }
.services-grid .service-card:nth-child(2) { margin-top: 56px; }
.services-grid .service-card:nth-child(3),
.services-grid .service-card:nth-child(6) { margin-top: 24px; }
.services-grid .service-card:nth-child(8) { margin-top: 38px; }
.services-grid .service-card {
  min-height: 430px;
  padding: 28px;
  border: 0;
  border-radius: 12px;
  isolation: isolate;
  background: #eef4f5;
  box-shadow: inset 0 0 0 1px #dce6e8;
  transition: box-shadow .35s var(--ease);
}
.services-grid .service-card--consultation,
.services-grid .service-card--baby { min-height: 486px; }
.services-grid .service-card--wellness { min-height: 458px; }
.services-grid .service-card:hover { transform: none; box-shadow: 0 14px 32px #173c4314; }
.service-media {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  pointer-events: none;
}
.service-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--image-position, center 30%);
  opacity: .8;
  transform: scale(1.035);
  transition: transform .75s var(--ease), opacity .55s var(--ease);
}
.service-card::before, .service-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.service-card::before {
  background: linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.2) 20%, rgba(255,255,255,.93) 49%, #fff 75%);
}
.service-card::after {
  background: #f2f8f9;
  opacity: .28;
  transition: opacity .55s var(--ease);
}
.service-card-body { margin-top: auto; padding-top: 150px; }
.service-card h3 {
  font-size: clamp(26px, 2.25vw, 34px);
  line-height: 1.13;
  letter-spacing: -.035em;
  margin-bottom: 14px;
  color: var(--ink);
  text-wrap: balance;
}
.service-card-body > p {
  font-size: 15px;
  line-height: 1.75;
  color: #425e65;
  margin-bottom: 23px;
  max-width: 31ch;
}
.service-card .service-link {
  border-top: 1px solid #b7ccd1;
  min-height: 48px;
  padding-top: 17px;
  color: var(--teal-dark);
  font-size: 13px;
}
.service-card--womens-health { --image-position: center 10%; }
.service-card--antenatal { --image-position: 50% 53%; }
.service-card--family-planning { --image-position: 35% 30%; }
.service-card--baby { --image-position: 48% 35%; }
.service-card--sonar { --image-position: 60% 30%; }
.service-card--wellness { --image-position: 48% 27%; }
.service-card--fitness { --image-position: 56% 30%; }
.service-card--womens-health .service-media img { object-fit: contain; height: 86%; object-position: center top; }
.service-card--antenatal .service-media img { object-fit: contain; height: 88%; object-position: center top; }
.service-card--womens-health .service-media,
.service-card--antenatal .service-media { background: white; }
.service-card:focus-within .service-media img { opacity: 1; transform: scale(1); }
.service-card:focus-within::after { opacity: 0; }
@media (hover: hover) and (pointer: fine) {
  .service-card:hover .service-media img { opacity: 1; transform: scale(1); }
  .service-card:hover::after { opacity: 0; }
}
.services-grid .more-services { margin: 40px 0 0; padding: 26px 15px; align-self: center; }
.photo-disclaimer { margin-top: 38px; }

/* A quiet photographic backdrop bridges the information and appointment form. */
.contact { overflow: hidden; background: #e9f1f3; border-radius: 0; padding: 110px 0; }
.contact-backdrop img { object-position: center center; }
.contact-overlay {
  z-index: 1;
  background: linear-gradient(90deg, rgba(245,249,250,.96), rgba(242,247,248,.84) 42%, rgba(236,244,246,.7)),
              linear-gradient(0deg, rgba(245,249,250,.5), transparent 60%);
}
.contact-grid { position: relative; z-index: 2; gap: 8%; align-items: center; }
.contact-copy h2 { letter-spacing: -.035em; }
.contact-copy > p:not(.eyebrow) { color: #425c63; max-width: 370px; }
.contact-copy .contact-label { color: #486269; }
.contact-copy address { color: #425c63; }
.contact-details { margin-top: 34px; }
.contact-item { margin-bottom: 24px; }
.booking-panel { border: 0; padding: 40px; box-shadow: 0 22px 65px #18363c12; }
.form-heading h3 { font-size: 29px; margin-bottom: 10px; letter-spacing: -.035em; }
.form-heading p { max-width: 34ch; }
input, select, textarea { caret-color: var(--teal); }
.booking-panel input::placeholder, .booking-panel textarea::placeholder { color: #65767c; }

@media (min-width: 1600px) {
  .hero { min-height: 810px; }
  .hero-shell { padding-top: 116px; }
}
@media (max-width: 1050px) {
  .services-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }
  .services-grid .service-card:nth-child(n) { margin-top: 0; min-height: 450px; }
  .services-grid .service-card:nth-child(even) { margin-top: 32px; }
  .services-grid .more-services { grid-column: 1 / -1; margin-top: 10px; padding: 25px 0 0; }
  .services-grid .more-services h3 br { display: none; }
  .service-card h3 { font-size: 30px; }
  .contact-grid { gap: 5%; }
  .booking-panel { padding: 28px; }
}
@media (max-width: 900px) {
  .hero { min-height: 730px; }
  .hero-shell { padding-top: 84px; }
  .hero-content { padding-bottom: 48px; max-width: 680px; }
  .hero h1 { font-size: clamp(60px, 8.8vw, 78px); letter-spacing: -.04em; }
  .hero-overlay {
    background: linear-gradient(90deg, rgba(255,255,255,.96), rgba(255,255,255,.8) 50%, rgba(255,255,255,.25)),
                linear-gradient(0deg, rgba(255,255,255,.94), transparent 48%);
  }
  .hero-backdrop img { object-position: 62% center; }
  .hero-actions { gap: 24px; }
  .hero-actions .button { font-size: 14px; }
  .hero-location { margin-top: 36px; }
  .hero-bottom { margin-top: auto; padding: 22px 0; }
  .services .section-heading { margin-bottom: 36px; }
  .contact { padding: 70px 0; }
  .contact-grid { gap: 38px; }
  .contact-copy h2 { font-size: 44px; }
  .contact-copy > p:not(.eyebrow) { max-width: 480px; }
  .contact-details { grid-template-columns: 1fr 1fr; gap: 26px; }
  .contact-item { margin: 0; }
  .contact-item:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .contact-backdrop img { object-position: 40% top; }
  .contact-overlay { background: linear-gradient(180deg,rgba(242,247,248,.88),rgba(242,247,248,.93) 48%,rgba(242,247,248,.82)); }
  .booking-panel { padding: 34px; }
}
@media (max-width: 600px) {
  .hero { min-height: 740px; }
  .hero-shell { padding-top: 70px; }
  .hero-content { padding-bottom: 35px; }
  .hero h1 { font-size: clamp(43px, 10.8vw, 64px); margin-bottom: 27px; }
  .hero-copy { font-size: 16px; max-width: 34ch; line-height: 1.8; }
  .hero-backdrop img { object-position: 61% center; }
  .hero-overlay {
    background: linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.72) 60%,rgba(255,255,255,.45)),
                linear-gradient(0deg,rgba(255,255,255,.98),rgba(255,255,255,.3) 55%,transparent);
  }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 10px; margin-top: 28px; }
  .hero-actions .button { min-height: 54px; padding: 15px 21px; gap: 26px; }
  .hero-actions .text-link { font-size: 14px; }
  .hero-location { margin-top: 32px; }
  .hero-bottom { font-size: 9px; letter-spacing: .65px; gap: 12px; }
  .hero-bottom a { font-size: 12px; gap: 10px; }
  .services-grid { grid-template-columns: minmax(0,1fr); gap: 22px; }
  .services-grid .service-card:nth-child(n) { margin-top: 0; min-height: 430px; padding: 26px; }
  .services-grid .service-card--consultation, .services-grid .service-card--baby { min-height: 460px; }
  .service-card-body { padding-top: 150px; }
  .service-card h3 { font-size: 32px; }
  .service-card-body > p { font-size: 16px; max-width: 32ch; }
  .service-card .service-link { font-size: 13px; }
  .service-card::after { opacity: .18; }
  .services-grid .more-services { margin-top: 10px; padding: 16px 0; }
  .contact-copy h2 { font-size: 40px; }
  .contact-details { grid-template-columns: 1fr; gap: 24px; }
  .contact-item:nth-child(2) { grid-column: auto; grid-row: auto; }
  .contact-copy .contact-item a.email { font-size: 15px; }
  .booking-panel { padding: 27px 21px; }
  .form-heading h3 { font-size: 26px; }
  .contact-grid { gap: 36px; }
}
@media (max-width: 350px) {
  .hero { min-height: 760px; }
  .hero h1 { font-size: 42px; }
  .hero-location { gap: 9px; font-size: 12px; }
  .hero-location small { font-size: 11px; }
  .hero-bottom { font-size: 8px; letter-spacing: .25px; }
  .hero-bottom a { font-size: 11px; }
  .services-grid .service-card:nth-child(n) { padding: 23px; }
  .service-card h3 { font-size: 29px; }
  .service-card .service-link { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-backdrop { opacity: 1 !important; transform: none !important; }
  .service-media img { transition: none; transform: none !important; }
  .service-card::after { transition: none; }
}

/* Symbol-only brand signature, kept clear of the primary message. */
.hero-signature{position:absolute;z-index:2;right:max(7%,calc((100vw - 1240px)/2));top:17%;width:clamp(230px,24vw,350px);pointer-events:none;text-align:center}
.hero-signature img{width:100%;height:auto;opacity:.17}
.hero-signature p{margin:20px 0 0;font-size:24px;line-height:1.3;letter-spacing:-.025em;color:#244f5d;opacity:.7}
.hero-content{max-width:760px}
/* Only the image layer is pinned. Normal scrolling, links and forms are unaffected. */
.has-pinned-scenes .hero-backdrop img,.has-pinned-scenes .contact-backdrop img{position:absolute;top:0;left:0;height:100vh;height:100svh;transform:translate3d(0,var(--scene-y,0px),0);will-change:transform}
.contact::after{content:'';position:absolute;z-index:1;bottom:0;left:0;right:0;height:100px;background:linear-gradient(transparent,#fff);pointer-events:none}
.health-footer{position:relative;isolation:isolate;overflow:hidden;background:#eaf3f5;border-top:0;padding:78px 0 26px}
.footer-watermark{position:absolute;z-index:-1;right:-80px;top:40px;width:650px;height:auto;opacity:.055;pointer-events:none}
.footer-invitation{display:flex;align-items:center;justify-content:space-between;gap:48px;padding-bottom:50px;border-bottom:1px solid #bfd3d8}
.footer-invitation h2{font-size:clamp(38px,4.5vw,64px);letter-spacing:-.035em;margin:0;line-height:1.1}
.footer-invitation>div{max-width:355px}.footer-invitation p{font-size:16px;color:#47626b;margin-bottom:18px}
.footer-columns{display:grid;grid-template-columns:1.3fr .8fr 1fr 1.1fr;gap:38px;padding:48px 0}
.footer-columns h3{font-size:15px;font-weight:600;margin-bottom:18px;letter-spacing:0}
.footer-practice>p{font-size:14px;color:#47626b;margin:24px 0 18px}
.footer-links{display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.6}
.footer-links a{width:fit-content;padding:4px 0}.footer-links a:hover,.health-footer .text-link:hover{color:var(--teal);text-decoration:underline;text-underline-offset:5px}
.footer-columns address{font-size:14px;color:#47626b;line-height:1.9}.footer-columns .text-link{color:var(--teal-dark);margin-top:10px}
.footer-email{overflow-wrap:anywhere}.footer-hours{font-size:12px;line-height:1.75;color:#47626b;margin:20px 0 0;max-width:28ch}
.social-links{display:flex;flex-wrap:wrap;gap:8px}.social-links a{display:flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;gap:7px;border:1px solid #abc8d0;border-radius:6px;padding:9px;color:var(--teal-dark);transition:background .2s,color .2s}.social-links a:hover{background:var(--teal-dark);color:#fff}.social-links svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.social-links span{font-size:12px}.social-links a:not(:first-child) span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.health-footer .footer-bottom{border-color:#bfd3d8;color:#47626b;font-size:12px}
@media(max-width:1100px){.hero-signature{width:220px;right:5%;top:25%}.hero-signature p{font-size:20px}.hero h1{font-size:72px}.footer-columns{grid-template-columns:1fr 1fr;gap:38px 60px}}
@media(max-width:900px){.hero-signature{width:140px;right:7%;top:auto;bottom:130px}.hero-signature p{font-size:15px;margin-top:8px}.hero-signature img{opacity:.12}.hero h1{font-size:clamp(60px,8.8vw,78px)}.footer-invitation{gap:28px}.footer-watermark{right:-180px;top:160px}}
@media(max-width:600px){.hero-signature{bottom:86px;right:6%;width:105px}.hero-signature p{font-size:12px;opacity:.65}.hero h1{font-size:clamp(43px,10.8vw,64px)}.hero-location{max-width:100%}.health-footer{padding:58px 0 90px}.footer-invitation{display:block;padding-bottom:34px}.footer-invitation>div{margin-top:26px}.footer-columns{grid-template-columns:1fr;gap:32px;padding:34px 0}.footer-columns .footer-practice{padding-bottom:10px}.footer-watermark{width:430px;right:-145px;top:100px}.footer-links{gap:6px}.footer-links a{min-height:40px;display:flex;align-items:center}.footer-invitation h2{font-size:44px}.footer-hours{max-width:36ch}}
@media(prefers-reduced-motion:reduce){.has-pinned-scenes .hero-backdrop img,.has-pinned-scenes .contact-backdrop img{position:static;height:100%;transform:none!important;will-change:auto}}


/* Transparent full-body mock portrait, within the existing About image space. */
.about-doctor { border: 0; background: transparent; box-shadow: none; }
.about-doctor > img { height: clamp(360px, 42vw, 560px); object-fit: contain; object-position: center; border: 0; border-radius: 0; box-shadow: none; }
.about-doctor .photo-label { position: static; width: fit-content; margin: 8px auto 0; padding: 0; background: transparent; border: 0; border-radius: 0; color: #47626b; font-size: 11px; letter-spacing: .02em; text-align: center; }

