/* Team-Raster (Über uns). Maße aus Figma (1440 px): dunklere Fläche von oben bis 129 px unter das Raster, Raster ab 190 px über die
   volle Breite (drei Spalten, Reihen abwechselnd 642 und 598 px hoch), darunter 49 px tiefer der Text (592 px, mittig) und der Button. */
.rx-band--team-raster{height:auto}
.rx-tr{padding-bottom:209px}
.rx-tr__area{padding:190px 0 129px;background:#171717}
.rx-tr__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:calc(642 * var(--rx-media-unit,1px)) calc(598 * var(--rx-media-unit,1px))}
.rx-tr__tile{position:relative;min-width:0;overflow:hidden;cursor:default}
.rx-tr__tile img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;pointer-events:none;transition:scale 250ms ease-out}
.rx-tr__tile:is(:hover,:focus-visible)>picture>img{scale:1.03}
/* Rolle als Bildunterschrift beim Hover; ohne Hover (Touch) dauerhaft mit Name */
.rx-tr__caption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:32px;background:#1c1c1c66;opacity:0;translate:0 12px;transition:opacity 250ms ease-out,translate 250ms ease-out;font-size:18px;line-height:26px;color:#fff}
.rx-tr__caption strong{font-size:24px;font-weight:700}
.rx-tr__tile:is(:hover,:focus-visible) .rx-tr__caption{opacity:1;translate:0 0}
/* Sprechblase: gelber Kreis mit Vorname, wie im Design bei Jara */
.rx-tr__bubble{position:absolute;left:calc(62% - 60px);top:calc(207 * var(--rx-media-unit,1px));display:grid;place-items:center;width:119px;height:119px;opacity:0;scale:.6;transform-origin:bottom left;pointer-events:none;transition:opacity 250ms ease-out,scale 250ms cubic-bezier(.34,1.56,.64,1)}
.rx-tr__bubble img{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.rx-tr__bubble span{position:relative;font-weight:400;line-height:22px;color:#000;text-align:center;white-space:nowrap}
.rx-tr__tile:is(:hover,:focus-visible) .rx-tr__bubble{opacity:1;scale:1}
/* Der Anker folgt auch dem leichten Foto-Zoom beim Hover. */
.rx-tr__bubble[data-rx-direction]{transition:opacity 250ms ease-out,scale 250ms cubic-bezier(.34,1.56,.64,1),left 250ms ease-out,top 250ms ease-out}
.rx-tr__tile:is(:hover,:focus-visible) .rx-tr__bubble[data-rx-direction]{left:calc(var(--rx-anchor-x) * 1.03 - 1.5%);top:calc(var(--rx-anchor-y) * 1.03 - 1.5%)}
@media(hover:hover) and (min-width:768px){
 /* Der Name steht in der Sprechblase, die Bildunterschrift zeigt nur die Rolle (falls vorhanden) */
 .rx-tr__caption:not(.has-role){display:none}
 .rx-tr__caption strong{display:none}
}
@media(hover:none){.rx-tr__caption{opacity:1;translate:0 0;background:linear-gradient(transparent,#1c1c1caa)}}
@media(prefers-reduced-motion:reduce){.rx-tr__bubble{transition:opacity 200ms}}
.rx-tr__text{width:592px;margin:49px 0 0 calc(50% - 297px);font-size:18px;line-height:26px}
.rx-tr__button{margin:29px 0 0 calc(50% - 297px)}

/* Handy: Raster zweispaltig im Hochformat, Text und Button darunter */
@media(max-width:767px){
 .rx-tr{padding:0}
 .rx-tr__area{padding:0;background:none}
 .rx-tr__grid{grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:12px}
 .rx-tr__tile{aspect-ratio:4/5}
 .rx-tr__bubble{display:none}
 .rx-tr__caption{padding:12px;font-size:13px;line-height:18px;gap:2px}
 .rx-tr__caption strong{font-size:15px}
 .rx-tr__text{width:auto;margin:28px 0 0;font-size:16px;line-height:24px}
 .rx-tr__button{margin:20px 0 0}
}