/* ===== Team-Raster (Abschnitt "Team") =====
 * Zeilen mit 1-4 Spalten, Zellen = Person, Freibild oder leer. Alle Farben/Radien aus den Variablen des Themes.
 * Breite einer Zelle = 1/Spalten der Zeile, auch wenn die Zeile weniger Zellen hat (Rest bleibt leer).
 */
.tgrid{--g:clamp(18px,2.4vw,34px);display:flex;flex-direction:column;gap:var(--g)}
.tgrid__row{--n:var(--cols,3);display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;gap:var(--g)}
.tgrid__row[data-align="center"]{justify-content:center}
/* -.5px: Rundungsfehler duerfen eine volle Zeile nie umbrechen */
.tcell{flex:0 0 calc((100% - (var(--n) - 1)*var(--g))/var(--n) - .5px);min-width:0;max-width:100%;margin:0;position:relative}
.tgrid__row[data-cols="1"] .tcell{flex-basis:min(100%,560px)}
.tfig{margin:0;position:relative}
.tph{border-radius:var(--r-md);overflow:hidden;aspect-ratio:1;background:var(--sand);position:relative}
.tph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.tcell:hover .tph img{transform:scale(1.04)}
.tfig figcaption{padding:18px 6px 0}
.tfig h3{font-size:calc(1.2rem*var(--hs,1));margin:0 0 .2em}
.tfig p{margin:0;color:var(--muted);font-size:.98rem;line-height:1.5}
.tfig h3,.tfig p{overflow-wrap:anywhere;hyphens:auto}
/* grosse Karten: Zeilen mit 1-2 Spalten */
.tgrid__row[data-cols="1"] .tfig h3,.tgrid__row[data-cols="2"] .tfig h3{font-size:calc(1.45rem*var(--hs,1))}
.tgrid__row[data-cols="1"] .tfig p,.tgrid__row[data-cols="2"] .tfig p{font-size:1.05rem}
/* leere Zelle: nimmt Platz (Abstand), bleibt unsichtbar */
.tcell--l .tph{background:none;visibility:hidden}

@media (max-width:900px){
  .tgrid__row{--n:min(var(--cols,3),3)}
}
@media (max-width:600px){
  .tgrid__row{--n:min(var(--cols,3),2)}
  .tcell--l{display:none}
  .tfig figcaption{padding:14px 2px 0}
  .tfig h3{font-size:calc(1.05rem*var(--hs,1))}
  .tfig p{font-size:.85rem}
  .tgrid__row[data-cols="1"] .tfig h3{font-size:calc(1.3rem*var(--hs,1))}
  .tgrid__row[data-cols="1"] .tfig p{font-size:.95rem}
  .tgrid__row[data-cols="2"] .tfig h3{font-size:calc(1.05rem*var(--hs,1))}
  .tgrid__row[data-cols="2"] .tfig p{font-size:.85rem}
}
@media (prefers-reduced-motion:reduce){
  .tph img{transition:none}
  .tcell:hover .tph img{transform:none}
}

/* Personen mit Link: Foto und Name sind gemeinsam anklickbar (Streckbereich ueber der ganzen Karte) */
.tlink{color:inherit;text-decoration:none}
.tlink::after{content:"";position:absolute;inset:0;z-index:2;border-radius:var(--r-md)}
.tcell--link{cursor:pointer}
.tcell--link .tfig h3::after{content:" →";color:var(--pink-d);display:inline-block;transition:transform .35s var(--ease)}
.tcell--link:hover .tfig h3{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:5px}
.tcell--link:hover .tfig h3::after{transform:translateX(5px)}
.tlink:focus-visible{outline:none}
.tlink:focus-visible::after{outline:3px solid var(--pink);outline-offset:3px}
body.av-live-on .tlink::after{display:none}
body.av-live-on .tcell--link{cursor:auto}
body.av-live-on .tcell--link:hover .tfig h3{text-decoration:none}
.tcell--b.tcell--link .tfig h3::after{content:none}
.tlink--img{position:absolute;inset:0;z-index:2;border-radius:var(--r-md)}
.tlink--img::after{display:none}
.tlink--img:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
body.av-live-on .tlink--img{display:none}

/* Person ohne Foto: blanker Umriss (Kopf und Schultern) auf hellem Grund */
.tph--empty{display:grid;place-items:center;background:color-mix(in srgb,var(--mint) 22%,#fff);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--mint) 70%,transparent)}
.tcell:hover .tph__mark{animation:tph-wiggle .7s ease-in-out 1}
@keyframes tph-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-5deg)}60%{transform:rotate(4deg)}}
@media (prefers-reduced-motion:reduce){.tcell:hover .tph__mark{animation:none}}
.tph--empty{padding:6%}
.tph__mark{width:auto;height:100%;max-width:100%;display:block;transition:transform .5s var(--ease)}