/* team-details.html ONLY — hero banner (no inline styles) */

html[data-team-details-page] #main-banner.team-details-page-banner {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: stretch;
  min-height: var(--team-details-banner-height-desktop, var(--home-banner-height, clamp(517.5px, 81vh, 922.5px)));
  padding: 0;
  background-image: url("../img/banner/team-details/team-details-banner.webp");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__container {
  position: relative;
  width: 100%;
  min-height: inherit;
  height: 100%;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__content {
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width: min(80%, 920px);
  padding: 20px;
  text-align: center;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.5);
}

html[data-team-details-page] #main-banner.team-details-page-banner #main-h1 {
  margin: 0 0 10px;
  color: #facc15 !important;
  -webkit-text-fill-color: #facc15;
  -webkit-text-stroke: clamp(3px, 0.11em, 7px) #2c0e53;
  paint-order: stroke fill;
  font-size: clamp(2rem, 5vw, 3.45rem);
  font-weight: 900;
  line-height: 1.1;
  text-shadow: none;
}

html[data-team-details-page] #main-banner.team-details-page-banner h2.region-intro-text,
html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__content h2.region-intro-text,
html[data-team-details-page] #main-banner.team-details-page-banner .region-intro-text {
  margin: 0 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(1.1rem, 2.5vw, 1.725rem) !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7) !important;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb {
  position: absolute;
  right: 5%;
  bottom: 50%;
  z-index: 2;
  transform: translateY(50%);
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb ul {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb a,
html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb span {
  display: inline-flex;
  align-items: center;
  color: #ffffff;
  text-decoration: none;
  font-size: 1.5rem;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb .team-details-page-banner__crumb-current {
  color: #facc15;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb .fa-house {
  font-size: 1.8em;
  margin-right: 8px;
}

html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__breadcrumb .fa-chevron-right {
  margin: 0 10px;
  font-size: 1em;
  color: #ffffff;
}
/* === v3 responsive: image always fully visible, content drops below === */
/* === v3 desktop-to-980 containment: image stays fully visible while viewport shrinks === */
/* === v3 desktop scaling: cover fills banner above 1920px (smooth, no jump) === */
@media (min-width: 1921px) {
  html[data-team-details-page] #main-banner.team-details-page-banner {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
}


/* === v3 responsive (≤980px): image always fully visible, content drops below === */
@media (max-width: 1760px) {
  html[data-team-details-page] #main-banner.team-details-page-banner {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    background-size: contain !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    padding-top: calc(100% / 2.55) !important;
  }

  html[data-team-details-page] #main-banner.team-details-page-banner .team-page-banner__container,
  html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__container {
    position: relative !important;
    min-height: auto !important;
    height: auto !important;
  }

  html[data-team-details-page] #main-banner.team-details-page-banner .team-page-banner__content,
  html[data-team-details-page] #main-banner.team-details-page-banner .team-details-page-banner__content {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    padding: 18px 16px 0 !important;
    margin: 0 auto !important;
  }
}