/* ============================================================
   r12-ueberuns-team.css, Gestaltungsrunde 12.10.2026, Paket „Über uns und Team“
   Aufgaben aus der Anpassungsliste des Teams: U01 bis U05 (Über uns), T01 bis T03 (Team).

   Eingebunden von quelle/bauen.py (R12_PAKETE) auf allen Seiten von physiopark.berlin und physiopark-zeitlos.de, nach allen
   bestehenden Dateien, mit ?v=-Stempel (STEMPEL_DATEIEN).
   Nur dieses Paket schreibt in diese Datei. Gemeinsame Bauteile
   (bauteile.css/js, bewegung.css/js, seiten.css) zuerst wiederverwenden;
   Mockup Brandkit 15.png ist verbindlich. Skripte nie inline (CSP),
   prefers-reduced-motion respektieren.

   Geltungsbereich: JEDE Regel hängt an body[data-seite] der beiden Seiten
   (/ueber-physiopark-berlin/ und /team/). Klassen dieses Pakets beginnen
   mit ut-. Auf anderen Seiten kippt damit nichts.

     U1  Fotokarten (.ut-karten): Über uns „Wo Sie uns heute finden“,
         Team „Wo unser Team für Sie arbeitet“. Gleiches Layout (G13),
         Pille auf dem Foto, Verweis unten bündig, am Handy Wischreihe
         mit Foto (G14)
     U2  Über uns: Geschäftsführung, Stimme mit Porträt (Zitatkarte wie
         Mockup „Echte Einblicke“)
     U3  Über uns: Leitbild als EIN Block, exklusive Aufklapper (U03, U04)
     U4  Über uns: Auszeichnungen als Pillenzeile
     T1  Team: Bühnenausschnitt ohne angeschnittene Person (T03)
     T2  Team: Schrittkarten hell (Mockup K3, .formate), drei in einer Reihe
     T3  Team: Karriere-Tafel (T01), dunkelgrün wie Mockup K1
   ============================================================ */

/* ============================================================
   U1  FOTOKARTEN
   ============================================================ */
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karten {
  gap: var(--m6);
  margin-bottom: var(--m8);
}
@media (min-width: 761px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-karten-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body[data-seite="/team/"] .ut-karten-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
  body[data-seite="/team/"] .ut-karten-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte {
  border: 0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 1px 0 var(--linie), var(--schatten-2);
}
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-bild {
  aspect-ratio: 4 / 5;
  isolation: isolate;
}
@media (min-width: 761px) and (max-width: 1099px) {
  body[data-seite="/team/"] .ut-karte .saeule-bild { aspect-ratio: 4 / 3; }
}
@media (min-width: 761px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-karten-3 .ut-karte .saeule-bild { aspect-ratio: 1 / 1; }
}
/* Ein leichter Verlauf am Fuß des Fotos trägt die Pille, ohne das Bild
   zu verdunkeln. */
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-bild::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 38%;
  background: linear-gradient(180deg, transparent, rgba(36, 57, 10, .28));
  pointer-events: none;
}
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte-pille {
  position: absolute;
  left: var(--m4);
  bottom: var(--m4);
  z-index: 1;
  margin: 0;
  box-shadow: 0 6px 16px rgba(36, 57, 10, .18);
}
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-text {
  display: flex;
  flex-direction: column;
  padding: var(--m6) var(--m6) var(--m6);
}
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-text h3 { font-size: 1.08rem; }
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-text p { color: var(--tinte-weich); }
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-text p a { color: var(--gruen-link); }
/* Verweis immer an der Unterkante: Karten nebeneinander enden gleich (G13) */
:is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .link-zeile {
  margin-top: auto;
  padding-top: var(--m4);
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte:hover .saeule-bild img { transform: scale(1.04); }
}

@media (max-width: 760px) {
  /* Wischreihe mit Foto: 4:3 statt 16:10, die Personen bleiben im Bild */
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karten.wisch .saeule-bild { aspect-ratio: 4 / 3; }
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karten.wisch .saeule-text { padding: var(--m5); }
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karten.wisch { margin-bottom: 0; }
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte { box-shadow: 0 1px 0 var(--linie), var(--schatten-1); }
}

/* Bildausschnitte je Motiv */
body[data-seite="/team/"] .ut-karte img[src*="tempelhof-3"] { object-position: 50% 70%; }
/* Das Knetefoto ist nur unten scharf (Hand und Knete): Ausschnitt dorthin */
body[data-seite="/team/"] .ut-karte img[src*="ergo-praxis-knete"] { object-position: 50% 100%; scale: 1.45; transform-origin: 60% 100%; }
body[data-seite="/team/"] .ut-karte img[src*="heim-bewegung"] { object-position: 60% 30%; }
body[data-seite="/team/"] .ut-karte img[src*="verwaltung-arbeitsplatz"] { object-position: 60% 40%; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-karte img[src*="tempelhof-2"] { object-position: 50% 60%; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-karte img[src*="heim-lachen"] { object-position: 50% 30%; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-karte img[src*="team-verwaltung"] { object-position: 50% 25%; }

/* ============================================================
   U2  ÜBER UNS: GESCHÄFTSFÜHRUNG UND STIMME
   ============================================================ */
/* U02 als Lead wie der Bühnentext (kursive Serife, grösser). Vorher
   Serife in Textgrösse direkt über einem Absatz in Inter: Das sah nach zwei
   Schriften im selben Textblock aus (Handyprüfung 12.10.2026). */
body[data-seite="/ueber-physiopark-berlin/"] .ut-gf .zitat-text {
  margin-bottom: var(--m6);
  font-style: italic;
  font-family: var(--font-sub);
  font-size: clamp(1.18rem, .5vw + 1.05rem, 1.36rem);
  line-height: 1.55;
  color: var(--tinte);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-gf .zitat-text a { color: var(--gruen-link); }

body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-karte {
  position: relative;
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: var(--m10);
  align-items: center;
  max-width: 980px;
  margin: 0 auto;
  padding: var(--m12) var(--m12) var(--m10);
  background: #fff;
  border: 2px solid var(--gruen-dunkel);
  border-radius: 22px;
  box-shadow: var(--schatten-2);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-bild {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  object-fit: cover;
  object-position: 50% 30%;
  box-shadow: 0 0 0 6px #fff, 0 0 0 8px var(--gruen), var(--schatten-2);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text .leitsatz {
  margin: 0 0 var(--m5);
  max-width: none;
  font-size: clamp(1.08rem, .45vw + .98rem, 1.3rem);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text figcaption strong {
  display: block;
  font-family: var(--font-head);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: .98rem;
  color: var(--tinte);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text figcaption span {
  font-family: var(--font-sub);
  font-style: italic;
  font-size: .95rem;
  color: var(--gruen-dunkel);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme .fehlt { max-width: 980px; margin-inline: auto; }
/* Am Handy: Porträt und Name nebeneinander oben, das Zitat darunter.
   display: contents macht Zitat und Bildunterschrift zu Rasterfeldern der
   Karte, die Reihenfolge im Markup bleibt (Zitat vor Name). */
@media (max-width: 760px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-karte {
    grid-template-columns: 76px minmax(0, 1fr);
    grid-template-areas: "bild name" "zitat zitat";
    gap: var(--m5) var(--m4);
    padding: var(--m6) var(--m5) var(--m6);
  }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text { display: contents; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-bild {
    grid-area: bild;
    width: 76px; height: 76px;
    box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--gruen);
  }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text figcaption { grid-area: name; align-self: center; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text figcaption span { font-size: .88rem; line-height: 1.4; display: block; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-stimme-text .leitsatz { grid-area: zitat; margin: 0; }
}

/* ============================================================
   U3  ÜBER UNS: LEITBILD ALS EIN BLOCK
   Kopf links (am Rechner mitlaufend, mit Foto), die sieben Grundsätze
   rechts. Der offene Grundsatz liegt auf einer hellgrünen Fläche, darin
   der Wortlaut (Lora, grüner Strich) und „Im Alltag“ auf weissem Grund.
   ============================================================ */
body[data-seite="/ueber-physiopark-berlin/"] .ut-leitbild-bild {
  margin: var(--m8) 0 0;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--schatten-2);
  aspect-ratio: 4 / 5;
  max-width: 400px;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-leitbild-bild img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 30%;
  display: block;
}
@media (min-width: 961px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-leitbild-kopf {
    position: sticky;
    top: calc(var(--kopf-hoehe) + var(--m6));
    align-self: start;
  }
}
@media (max-width: 960px) {
  /* 4:3 am Handy: beide Gesichter passen nicht zugleich hinein (60 bis 865
     von 900 px). Ausschnitt unten: die Bewohnerin ganz, darüber die Hände
     der Therapeutin auf ihren Schultern. Kein halbes Gesicht am Rand. */
  body[data-seite="/ueber-physiopark-berlin/"] .ut-leitbild-bild { aspect-ratio: 4 / 3; max-width: none; margin-top: var(--m6); }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-leitbild-bild img { object-position: 50% 100%; }
}

body[data-seite="/ueber-physiopark-berlin/"] .ut-werte { border-top: 0; margin: 0; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .wert-zeile {
  border: 0;
  border-bottom: 1px solid var(--linie);
  border-radius: 0;
  padding-inline: var(--m5);
  transition: background-color var(--zeit-wechsel) linear, border-color var(--zeit-wechsel) linear;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .wert-zeile:has(> .aufklapp-knopf[aria-expanded="true"]) {
  background: var(--karte-hell);
  border-bottom-color: transparent;
  border-radius: 16px;
  margin-block: var(--m2);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .aufklapp-knopf { padding: var(--m5) 0; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .wert-nr {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 1.05rem;
  min-width: 2ch;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .aufklapp-knopf[aria-expanded="true"] .aufklapp-zeichen { background: var(--gruen-dunkel); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .wert-zeile:has(> .aufklapp-knopf[aria-expanded="false"]) .aufklapp-zeichen { background: #fff; box-shadow: inset 0 0 0 1px var(--linie-stark); }

body[data-seite="/ueber-physiopark-berlin/"] .ut-wortlaut {
  margin: 0 0 var(--m5);
  padding-left: var(--m5);
  border-left: 3px solid var(--gruen);
  font-family: var(--font-sub);
  font-style: italic;
  font-size: clamp(1.02rem, .25vw + .98rem, 1.12rem);
  line-height: 1.6;
  color: var(--tinte);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag {
  background: #fff;
  border-radius: 12px;
  padding: var(--m4) var(--m5) var(--m5);
  box-shadow: var(--schatten-1);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag-titel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--m2);
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gruen-dunkel);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag-titel::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--orange);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag p { font-size: .96rem; line-height: 1.6; color: var(--tinte); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag a {
  display: inline-block;
  margin-top: var(--m1);
  color: var(--gruen-link);
  font-weight: 600;
}
@media (max-width: 760px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .wert-zeile { padding-inline: var(--m4); margin-inline: calc(-1 * var(--m2)); }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-werte .aufklapp-knopf { gap: var(--m4); font-size: 1rem; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-alltag { padding: var(--m3) var(--m4) var(--m4); }
}

/* ============================================================
   U4  ÜBER UNS: AUSZEICHNUNGEN ALS PILLEN
   ============================================================ */
body[data-seite="/ueber-physiopark-berlin/"] .ut-belege {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--m3);
  margin: var(--m8) 0 0;
  padding: 0;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-belege li {
  display: block;
  padding: 10px 18px;
  border: 2px solid var(--gruen);
  border-radius: 22px;
  line-height: 1.45;
  background: #fff;
  font-size: .9rem;
  color: var(--tinte);
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-belege li::before {
  content: "";
  display: inline-block;
  width: 9px; height: 9px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--orange);
  vertical-align: .05em;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-belege strong { font-family: var(--font-head); font-weight: 700; color: var(--gruen-dunkel); }
@media (max-width: 760px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-belege { margin-top: var(--m6); }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-belege li { font-size: .85rem; padding: 8px 14px; }
}

/* ============================================================
   T1  TEAM: BÜHNENAUSSCHNITT (T03)
   Seit dem Zusammenführen (12.10.2026) team-drei.webp statt team-fenster
   (das ist jetzt die Karriere-Bühne, K05). Das Foto ist quer (5:4). Im
   Hochformat der Bühne (4:5, ab 961 px) zeigt der Rahmen die rechten
   beiden Personen mit ganzem Gesicht, um 4 % vergrössert; links endet der
   Arm der mittleren Person am Rand. Am Handy (4:3) stehen alle drei ganz
   im Bild.
   ============================================================ */
/* Nachbesserung Handyprüfung 12.10.2026: Im 4:5-Rahmen fehlte am Rechner
   die linke Person ganz, nur ihre Hand lag auf der Schulter des Mannes.
   Ab 961 px ist der Rahmen auf der Teamseite quadratisch und so breit wie
   auf allen Bühnen; der Ausschnitt reicht von der linken bis zur rechten
   Person (Köpfe ganz im Bild). Die Bühne wird dadurch nicht niedriger:
   .buehne-bild behält die Höhe des 4:5-Rahmens, das Bild steht oben wie
   überall, Pille und H1 bleiben, wo sie sind. */
@media (min-width: 961px) {
  body[data-seite="/team/"] .seite-hero.buehne .buehne-bild { aspect-ratio: 4 / 5; }
  body[data-seite="/team/"] .seite-hero.buehne .buehne-rahmen { aspect-ratio: 1 / 1; }
  body[data-seite="/team/"] .seite-hero.buehne .buehne-rahmen img { object-position: 54% 0; }
}
@media (max-width: 960px) {
  body[data-seite="/team/"] .seite-hero.buehne .buehne-rahmen img { object-position: 50% 30%; }
}

/* ============================================================
   T2  TEAM: SCHRITTKARTEN HELL
   ============================================================ */
body[data-seite="/team/"] .ut-abstimmung .schritte-kopf { max-width: 720px; text-align: center; }
body[data-seite="/team/"] .ut-abstimmung .schritte-kopf p { margin-inline: auto; }
body[data-seite="/team/"] .ut-formate {
  list-style: none;
  margin: var(--m10) 0 0;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 761px) {
  body[data-seite="/team/"] .ut-formate {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--m6);
  }
  /* Verbindungslinie hinter den Pillen: drei Schritte, ein Team */
  body[data-seite="/team/"] .ut-formate::before {
    content: "";
    position: absolute;
    top: 26px;
    left: 16%;
    right: 16%;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--gruen) 0 10px, transparent 10px 18px);
    z-index: 0;
  }
  body[data-seite="/team/"] .ut-formate .format { position: relative; z-index: 1; }
}
body[data-seite="/team/"] .ut-formate .format { padding: var(--m12) var(--m6) var(--m8); }
body[data-seite="/team/"] .ut-formate .format h3 {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 1.08rem;
  color: var(--tinte);
}
body[data-seite="/team/"] .ut-formate .format p { font-size: .95rem; color: var(--tinte-weich); }

/* ============================================================
   T3  TEAM: KARRIERE-TAFEL (T01)
   Dunkelgrün wie der Mockup-Slider „Deine Vorteile“ (bg-gruen.webp mit
   12 % Tönung), Teamfoto links, Stellen als ganze, antippbare Zeilen.
   ============================================================ */
body[data-seite="/team/"] .ut-karriere-tafel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  grid-template-areas:
    "bild   bild"
    "text   stellen"
    "aktion stellen";
  column-gap: var(--m12);
  border-radius: 24px;
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(rgba(36, 57, 10, .12), rgba(36, 57, 10, .12)),
    url("../img/bg-gruen.webp") center / cover no-repeat,
    var(--gruen-dunkel);
  box-shadow: var(--schatten-3);
}
/* Das Teamfoto als Band über die ganze Tafel: quer wie das Foto, alle
   drei Personen ganz im Bild (im Hochformat links war die linke Person
   halb abgeschnitten, Foto 12.10.2026). */
body[data-seite="/team/"] .ut-karriere-bild {
  grid-area: bild;
  position: relative;
  margin: 0;
  aspect-ratio: 16 / 7;
  overflow: hidden;
}
body[data-seite="/team/"] .ut-karriere-bild img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 28%;
  display: block;
}
body[data-seite="/team/"] .ut-karriere-bild::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 30%;
  background: linear-gradient(180deg, transparent, rgba(36, 57, 10, .45));
  pointer-events: none;
}
body[data-seite="/team/"] .ut-karriere-text { grid-area: text; padding: var(--m12) 0 0 var(--m12); }
body[data-seite="/team/"] .ut-karriere-stellen { grid-area: stellen; padding: var(--m12) var(--m12) var(--m12) 0; }
body[data-seite="/team/"] .ut-karriere-aktion { grid-area: aktion; padding: var(--m6) 0 var(--m12) var(--m12); }
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-karriere-pille {
  position: absolute;
  top: var(--m6);
  left: var(--m6);
  z-index: 1;
  background: #fff;
  box-shadow: 0 8px 20px rgba(36, 57, 10, .25);
}
body[data-seite="/team/"] .ut-karriere-text .sub-strich { background: var(--gruen-leuchte); }
body[data-seite="/team/"] .ut-karriere-text h2 { color: #fff; font-size: var(--grad-h2); margin: var(--m5) 0 var(--m4); }
body[data-seite="/team/"] .ut-karriere-text h2 .zeile-gruen { color: var(--gruen-leuchte); }
body[data-seite="/team/"] .ut-karriere-text > p { color: #F2F8E6; max-width: 34em; }

:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stellen {
  list-style: none;
  display: grid;
  gap: var(--m3);
  margin: 0;
  padding: 0;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--m4);
  padding: var(--m4) var(--m4) var(--m4) var(--m5);
  border-radius: 14px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .26);
  color: #fff;
  text-decoration: none;
  transition: background-color var(--zeit-wechsel) linear, color var(--zeit-wechsel) linear,
              transform var(--zeit-wechsel) var(--kurve-aus), border-color var(--zeit-wechsel) linear;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-nr {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .82rem;
  color: #fff;
  transition: color var(--zeit-wechsel) linear;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-text strong {
  display: block;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.3;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-text span {
  display: block;
  margin-top: 2px;
  font-size: .86rem;
  color: #fff;
  transition: color var(--zeit-wechsel) linear;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-pfeil {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .8);
  transition: background-color var(--zeit-wechsel) linear, border-color var(--zeit-wechsel) linear,
              transform var(--zeit-wechsel) var(--kurve-aus);
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-pfeil svg { width: 18px; height: 18px; }
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover,
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:focus-visible {
  background: #fff;
  border-color: #fff;
  color: var(--tinte);
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover .ut-stelle-nr,
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:focus-visible .ut-stelle-nr { color: var(--orange-tief); }
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover .ut-stelle-text span,
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:focus-visible .ut-stelle-text span { color: var(--tinte-weich); }
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover .ut-stelle-pfeil,
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:focus-visible .ut-stelle-pfeil {
  background: var(--orange-aktion);
  border-color: var(--orange-aktion);
  color: #fff;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover { transform: translateX(4px); }
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle:hover .ut-stelle-pfeil { transform: translateX(2px); }
  /* Der Punkt der Pille pulsiert einmal pro Sekunde: „jetzt offen“ */
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-karriere-pille::before { animation: ut-puls 1.6s var(--kurve-weich) infinite; }
}
@keyframes ut-puls {
  0%, 100% { box-shadow: 0 0 0 0 rgba(248, 130, 70, .55); }
  60% { box-shadow: 0 0 0 7px rgba(248, 130, 70, 0); }
}
body[data-seite="/team/"] .ut-karriere-aktion .btn-reihe {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--m4) var(--m8);
  margin-top: 0;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-karriere-telefon {
  margin-top: var(--m6);
  font-size: .88rem;
  color: #fff;
}
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-karriere-telefon a { color: #fff; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
:is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-nowrap { white-space: nowrap; }

@media (max-width: 960px) {
  body[data-seite="/team/"] .ut-karriere-tafel {
    grid-template-columns: 1fr;
    grid-template-areas: "bild" "text" "stellen" "aktion";
    border-radius: 20px;
  }
  body[data-seite="/team/"] .ut-karriere-bild { aspect-ratio: 16 / 11; }
  body[data-seite="/team/"] .ut-karriere-text { padding: var(--m8) var(--m6) 0; }
  body[data-seite="/team/"] .ut-karriere-stellen { padding: var(--m6) var(--m6) 0; }
  body[data-seite="/team/"] .ut-karriere-aktion { padding: var(--m8) var(--m6) var(--m8); }
}
@media (max-width: 760px) {
  body[data-seite="/team/"] .ut-karriere .container-breit { padding-inline: var(--m4); }
  body[data-seite="/team/"] .ut-karriere-text { padding: var(--m8) var(--m5) 0; }
  body[data-seite="/team/"] .ut-karriere-stellen { padding: var(--m6) var(--m4) 0; }
  body[data-seite="/team/"] .ut-karriere-aktion { padding: var(--m8) var(--m5) var(--m8); }
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-karriere-pille { top: var(--m4); left: var(--m4); }
  body[data-seite="/team/"] .ut-karriere-aktion .btn-reihe .btn { width: 100%; justify-content: center; }
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle { padding: var(--m3) var(--m3) var(--m3) var(--m4); gap: var(--m3); }
  :is(body[data-seite="/team/"], body[data-seite="/ueber-physiopark-berlin/"]) .ut-stelle-pfeil { width: 36px; height: 36px; }
}

/* Vier Karten in einer Reihe (ab 1100 px): „Für Pflegeeinrichtungen“
   passte mit dem Strich nicht in eine Zeile (Foto 12.10.2026). */
@media (min-width: 1100px) {
  body[data-seite="/team/"] .ut-karten-4 .ut-karte .saeule-text { padding: var(--m5); }
  body[data-seite="/team/"] .ut-karten-4 .weiter { letter-spacing: .035em; gap: 7px; }
}
@media (min-width: 761px) and (max-width: 1099px) {
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .weiter { letter-spacing: .035em; gap: 7px; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-karten-3 .ut-karte .saeule-text { padding: var(--m5); }
}

/* ============================================================
   T4  NACHBESSERUNG HANDYPRÜFUNG 12.10.2026
   ============================================================ */
/* Bereichskarten: Personenfotos statt Raum und Knete (T02, G14) */
body[data-seite="/team/"] .ut-karte img[src*="leistung-krankengymnastik"] { object-position: 50% 30%; }
body[data-seite="/team/"] .ut-karte img[src*="strecke-ergo-steckbrett"] { object-position: 50% 35%; }
/* Titel einer Kartenreihe auf zwei Zeilen Höhe: Die Texte beginnen in
   allen Karten auf derselben Höhe (G13). */
@media (min-width: 761px) {
  :is(body[data-seite="/ueber-physiopark-berlin/"], body[data-seite="/team/"]) .ut-karte .saeule-text h3 { min-height: calc(2 * 1.3em); }
}

/* „Wie sich unser Team abstimmt“: Schrittkarten mit Foto (r12-berlin.css
   RB2). Ausschnitte, damit Gesichter im 4:3 stehen. */
body[data-seite="/team/"] .ut-schritte { margin-top: var(--m10); }
body[data-seite="/team/"] .ut-schritte .schritt-foto[src$="/team-verwaltung.webp"] { object-position: 50% 22%; }
body[data-seite="/team/"] .ut-schritte .schritt-foto[src$="/praxis-tempelhof-empfang-1-quer.webp"] { object-position: 60% 30%; }

/* Schlussband auf der Teamseite hell: Auf die grüne Karriere-Tafel folgte
   nach 60 px Weiß das grüne Band, die Blöcke verschmolzen. Creme, nicht
   die Fußfarbe (#E0EECA), Knopf und Verweise wie auf hellem Grund. */
body[data-seite="/team/"] .cta-band {
  background: var(--flaeche-creme);
  color: var(--tinte);
  border-top: 1px solid var(--linie);
}
body[data-seite="/team/"] .cta-band h2 { color: var(--tinte); }
body[data-seite="/team/"] .cta-band .headline .zeile-gruen { color: var(--gruen-dunkel); }
body[data-seite="/team/"] .cta-band .sub-strich { background: var(--gruen); }
body[data-seite="/team/"] .cta-band p { color: var(--tinte-weich); }
body[data-seite="/team/"] .cta-band p a { color: var(--gruen-link); }
body[data-seite="/team/"] .cta-band .btn-primary { color: #fff; }
body[data-seite="/team/"] .cta-band :focus-visible { outline-color: var(--gruen-dunkel); }

/* Über uns: Karriere-Tafel kompakt (Handyprüfung 12.10.2026). Vorher nur
   die Pille „Karriere“ und ein Textlink, dieselbe Schwäche wie T01 auf der
   Teamseite. Jetzt Bild, Überschrift, zwei Stellen, ein Knopf. Grund und
   Stellenzeilen wie die Tafel der Teamseite (T3). */
body[data-seite="/ueber-physiopark-berlin/"] .ut-karriere-kompakt {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "bild bild" "text stellen";
  column-gap: var(--m12);
  border-radius: 24px;
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(rgba(36, 57, 10, .12), rgba(36, 57, 10, .12)),
    url("../img/bg-gruen.webp") center / cover no-repeat,
    var(--gruen-dunkel);
  box-shadow: var(--schatten-3);
}
/* Das Teamfoto ist quer: als Band über die Tafel, alle drei ganz im Bild */
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-bild { grid-area: bild; position: relative; margin: 0; aspect-ratio: 21 / 8; overflow: hidden; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-bild img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 50% 32%;
  display: block;
}
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text { grid-area: text; padding: var(--m10) 0 var(--m10) var(--m12); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-stellen { grid-area: stellen; padding: var(--m10) var(--m12) var(--m10) 0; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text .ut-karriere-pille { position: static; margin-bottom: var(--m5); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text h2 { color: #fff; font-size: var(--grad-h2); margin: 0 0 var(--m4); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text h2 .zeile-gruen { color: var(--gruen-leuchte); }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text > p { color: #F2F8E6; max-width: 34em; }
/* Zwei Stellen genügen hier; alle stehen auf der Karriereseite */
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-stellen .ut-stellen > li:nth-child(n+3) { display: none; }
body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-stellen .btn-reihe { margin-top: var(--m6); }
@media (max-width: 760px) {
  body[data-seite="/ueber-physiopark-berlin/"] .ut-karriere-kompakt { grid-template-columns: minmax(0, 1fr); grid-template-areas: "bild" "text" "stellen"; border-radius: 20px; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-bild { aspect-ratio: 16 / 10; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-text { padding: var(--m8) var(--m5) 0; }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-stellen { padding: var(--m6) var(--m4) var(--m8); }
  body[data-seite="/ueber-physiopark-berlin/"] .ut-kk-stellen .btn { width: 100%; justify-content: center; }
}