/* Team & Expertise · V112 · ausschliesslich diese Seite.
   Einheitliches, bildunabhaengiges Hero-Format und natuerliche Kontextbild-Proportionen.
   Keine Aenderung an globalen Heros, CMS-Funktionen oder Portraitdateien. */
@media (min-width: 761px) {
  /* 2048 x 682 entspricht dem Bildformat des Startseiten-Heros (ca. 3:1).
     Ein eigener Bildausschnitt bestimmt nicht mehr die Hoehe des Containers. */
  .team-page .team-hero--immersive {
    block-size: clamp(470px, 33.3vw, 682px);
    min-block-size: 0;
    overflow: hidden;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }
  .team-page .team-hero--immersive .hero-media,
  .team-page .team-hero--immersive .hero-stage {
    grid-area: 1 / 1;
    align-self: stretch;
    min-height: 0;
    height: 100%;
  }
  .team-page .team-hero--immersive .hero-media {
    position: relative;
    inset: auto;
    overflow: hidden;
  }
  .team-page .team-hero--immersive .hero-media picture,
  .team-page .team-hero--immersive .hero-media img {
    display: block;
    height: 100%;
    width: 100%;
  }
  .team-page .team-hero--immersive .hero-media img {
    object-fit: cover;
    object-position: 50% 30%; /* Kopfbereiche sichtbar statt Mittel-Crop */
  }
  .team-page .team-hero--immersive .hero-stage {
    position: relative;
    inset: auto;
  }
  .team-page .team-hero--immersive .hero-stage-inner {
    height: 100%;
    min-height: 0;
    padding-block: clamp(26px, 3vw, 40px) clamp(20px, 3vw, 38px);
  }
  .team-page .team-hero--immersive .hero-content-overlay {
    margin-top: clamp(22px, 4.2vw, 66px);
    max-height: none;
    transform: none !important;
  }
  /* Portrait und Klinikbild bilden links/rechts jeweils eine zusammenhaengende
     Bildspalte; der Originalausschnitt des Kontextfotos bleibt nahezu erhalten. */
  .team-page .doctor-profile {
    display: grid;
    grid-template-columns: minmax(250px, 40%) minmax(0, 1fr);
    grid-template-rows: minmax(420px, 1fr) auto;
    min-height: 0;
    align-items: stretch;
  }
  .team-page .doctor-profile .doctor-portrait {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    min-height: 0;
    border-right: 1px solid var(--line);
  }
  .team-page .doctor-profile .doctor-portrait img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    object-position: center 22%;
  }
  .team-page .doctor-profile .doctor-profile-content {
    grid-column: 2;
    grid-row: 1 / 3;
    min-width: 0;
  }
  .team-page .doctor-profile .doctor-profile-context {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    min-height: 0;
    max-height: 320px;
    aspect-ratio: 3 / 2;
    margin: 0;
    overflow: hidden;
    border-top: 1px solid var(--line);
    border-right: 1px solid var(--line);
    background: #f4f7f8;
  }
  .team-page .doctor-profile .doctor-profile-context img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 36%;
  }
  .team-page .doctor-profile:nth-child(even) {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 40%);
  }
  .team-page .doctor-profile:nth-child(even) .doctor-portrait {
    grid-column: 2;
    border-right: 0;
    border-left: 1px solid var(--line);
  }
  .team-page .doctor-profile:nth-child(even) .doctor-profile-content {
    grid-column: 1;
  }
  .team-page .doctor-profile:nth-child(even) .doctor-profile-context {
    grid-column: 2;
    border-right: 0;
    border-left: 1px solid var(--line);
  }
}
@media (min-width: 761px) and (max-width: 980px) {
  .team-page .team-hero--immersive .hero-content-overlay {
    margin-top: 18px;
  }
  .team-page .team-hero--immersive .hero-stage-inner {
    padding-block: 25px;
  }
  .team-page .doctor-profile,
  .team-page .doctor-profile:nth-child(even) {
    grid-template-columns: minmax(245px, 38%) minmax(0, 1fr);
    grid-template-rows: minmax(390px, 1fr) auto;
  }
  .team-page .doctor-profile:nth-child(even) {
    grid-template-columns: minmax(0, 1fr) minmax(245px, 38%);
  }
  .team-page .doctor-profile .doctor-profile-content {
    padding: clamp(22px, 3vw, 34px);
  }
}
@media (max-width: 760px) {
  /* Auf kleinen Screens gehoeren Bild und Text nacheinander in den normalen
     Dokumentfluss; der Bildausschnitt bleibt trotzdem vom Quellformat unabhaengig. */
  .team-page .team-hero--immersive {
    display: block;
    height: auto;
    min-height: 0;
    overflow: hidden;
  }
  .team-page .team-hero--immersive .hero-media {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    overflow: hidden;
  }
  .team-page .team-hero--immersive .hero-media picture,
  .team-page .team-hero--immersive .hero-media img {
    display: block;
    width: 100%;
    height: 100%;
  }
  .team-page .team-hero--immersive .hero-media img {
    object-fit: cover;
    object-position: 50% 23%;
  }
  .team-page .team-hero--immersive .hero-stage {
    position: relative;
    inset: auto;
    height: auto;
  }
  .team-page .team-hero--immersive .hero-content-overlay {
    margin-top: -25px;
    padding-top: 0;
    transform: none !important;
  }
  .team-page .doctor-profile,
  .team-page .doctor-profile:nth-child(even) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    min-height: 0;
  }
  .team-page .doctor-profile .doctor-portrait,
  .team-page .doctor-profile:nth-child(even) .doctor-portrait {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    border: 0;
  }
  .team-page .doctor-profile .doctor-portrait img {
    width: 100%;
    height: clamp(320px, 94vw, 460px);
    min-height: 0;
    object-fit: cover;
    object-position: center 18%;
  }
  .team-page .doctor-profile .doctor-profile-context,
  .team-page .doctor-profile:nth-child(even) .doctor-profile-context {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    max-height: 280px;
    aspect-ratio: 3 / 2;
    border: 0;
    border-top: 1px solid var(--line);
  }
  .team-page .doctor-profile .doctor-profile-context img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 32%;
  }
  .team-page .doctor-profile .doctor-profile-content,
  .team-page .doctor-profile:nth-child(even) .doctor-profile-content {
    grid-column: 1;
    grid-row: 3;
    min-width: 0;
  }
}

/* v113 - context photos were intentionally removed from both doctor profiles. */
@media (min-width: 761px) {
  .team-page .doctor-profile {
    grid-template-rows: minmax(420px, 1fr);
  }

  .team-page .doctor-profile .doctor-profile-content {
    grid-row: 1;
  }

  .team-page .doctor-profile .doctor-profile-context {
    display: none;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  .team-page .doctor-profile,
  .team-page .doctor-profile:nth-child(even) {
    grid-template-rows: minmax(390px, 1fr);
  }
}

@media (max-width: 760px) {
  .team-page .doctor-profile,
  .team-page .doctor-profile:nth-child(even) {
    grid-template-rows: auto auto;
  }

  .team-page .doctor-profile .doctor-profile-context {
    display: none;
  }

  .team-page .doctor-profile .doctor-profile-content,
  .team-page .doctor-profile:nth-child(even) .doctor-profile-content {
    grid-row: 2;
  }
}
