/* Preserve the resets previously loaded by home pages; other sections keep their geometry. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
svg { display: block; overflow: visible; }

/* One static cover image in the original banner footprint. */
.hero-static {
  position: relative;
  --hero-photo: url("/images/medicus-hero-family-cf73e6d62383.jpg");
  --hero-panel-background: #7A5329;
}
.hero-static .hero-image {
  position: absolute;
  inset: 0;
  background-image: var(--hero-photo);
  background-size: cover;
  background-position: 51% 20%;
  background-repeat: no-repeat;
}
/* Keep the bottom-aligned, centered 10px blur overlay. Allow wrapped mobile copy to fit. */
.hero-static .banner-textbox {
  --a11y-surface-text: #fff;
  min-width: 0;
  min-height: 0;
  height: auto;
  padding: 14px 36px;
  color: #fff;
  overflow-wrap: break-word;
  background: var(--hero-panel-background);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.hero-static .banner-textbox :is(h2, p) { color: #fff; }
.hero-static .banner-textbox p { margin: 6px 0 10px; }
.hero-static .hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.hero-static .hero-actions > a { flex: 0 0 auto; white-space: nowrap; }
/* These buttons already contrast with the brown panel. Preserve their palette
   for saved high-contrast preferences, while retaining the stronger border. */
.hero-static .hero-actions > .--btn-1 {
  --a11y-button-background: transparent;
  --a11y-button-text: #fff;
  --a11y-button-border: #fff;
}
.hero-static .hero-actions > .--btn-2 {
  --a11y-button-background: #fff;
  --a11y-button-text: #616161;
  --a11y-button-border: #fff;
}
.hero-static .hero-actions > .--btn-1:hover {
  --a11y-button-background: #fff;
  --a11y-button-text: var(--medicus-red);
}
.hero-static .hero-actions > .--btn-2:hover {
  --a11y-button-background: #F9F9F9;
  --a11y-button-text: var(--medicus-red);
}
/* Keep the approved solid surface and white text in high-contrast mode too. */
html.a11y-high-contrast .hero-static .banner-textbox { background: var(--hero-panel-background); }
@media (prefers-contrast: more) {
  .hero-static .banner-textbox { background: var(--hero-panel-background); }
}
@media (forced-colors: active) {
  .hero-static .banner-textbox {
    --a11y-surface-text: CanvasText;
    color: CanvasText;
    background: Canvas;
  }
  .hero-static .banner-textbox :is(h2, p) { color: CanvasText; }
  .hero-static .hero-actions > :is(.--btn-1,.--btn-2),
  .hero-static .hero-actions > :is(.--btn-1,.--btn-2):hover {
    --a11y-button-background: ButtonFace;
    --a11y-button-text: ButtonText;
    --a11y-button-border: ButtonText;
  }
}
/* Give the family its own crop on small screens; the same photo continues beneath
   the existing blurred panel. Content can grow on short screens without clipping. */
@media (max-width: 991px), (max-height: 680px) {
  .hero-static {
    height: auto;
    display: grid;
    grid-template-rows: clamp(260px, 68vw, 420px) auto;
  }
  .hero-static::before {
    content: "";
    grid-area: 1 / 1;
    position: relative;
    z-index: 1;
    background: var(--hero-photo) 51% center / cover no-repeat;
  }
  .hero-static .banner-textbox {
    grid-area: 2 / 1;
    position: relative;
  }
}
@media (min-width: 992px) and (min-height: 681px) {
  /* Reserve space outside the hero for fixed controls, not inside the text panel. */
  .hero-static { height: min(640px, calc(100svh - var(--medicus-header-height) - 112px)); }
}
@media (max-width: 767px) {
  .hero-static .banner-textbox { padding-inline: 20px; }
  /* Retain the contact button's padding from its former mobile red-band scope. */
  .hero-static .hero-actions > .--btn-2 { padding: 8px 16px; }
}

/* Informational team languages: the shared .bg-green utility supplies the
   exact service-section background. Keep language names whole and bidi-isolated. */
.team-languages-band { padding: 18px 0; color: #424242; text-align: center; }
.team-languages-band .team-languages-title {
  margin: 0 0 7px;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 600;
  color: inherit;
  overflow-wrap: break-word;
}
.team-languages-band .team-languages-names {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 6px 8px;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: inherit;
}
.team-languages-band .team-language {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
}
.team-languages-band .team-language bdi { unicode-bidi: isolate; }
@media (max-width: 767px) {
  .team-languages-band .container { padding-inline: 20px; }
  .team-languages-band .team-languages-names { column-gap: 16px; }
  .team-languages-band .team-language > [aria-hidden="true"] { display: none; }
}
@media (forced-colors: active) {
  .team-languages-band { color: CanvasText; background: Canvas; }
}
/* Leave the existing floating accessibility control clear on short landscapes. */
@media (max-width: 991px) and (orientation: landscape) and (max-height: 500px) {
  .team-languages-band .container { padding-inline: 76px; }
}