/* Gemeinsamer Textabschnitt (Case: Aufgabe, Ziel, Strategie, Ergebnisse, Zitat; Webinare: Einleitung, Service). Maße aus Figma (1440 px).
   Überschrift und Absätze: Baustein .rx-copy (components.css). Spalte links an der Inhaltsspalte (+1 px wie im Entwurf), mittig oder
   rechts bündig. Die Prozentwerte gelten unverändert auch für breite Fenster. */
.rx-band--textabschnitt{height:auto;overflow:clip}
.rx-ta{position:relative;box-sizing:border-box;min-height:var(--ta-h);padding:var(--ta-top) 0 60px;font-family:Rubik,sans-serif;color:#fff}
/* Nur Abschnitte mit Foto brauchen mitwachsende Höhe und Textposition. */
.rx-ta:has(.rx-ta__media){--rx-ta-unit:var(--rx-media-unit,1px)}
.rx-ta__col{position:relative;width:var(--ta-w);margin-left:calc(13.8889% + 1px)}
.rx-ta--mitte .rx-ta__col{margin-left:calc(50% - var(--ta-c))}
.rx-ta--rechts .rx-ta__col{margin-left:calc(86.1111% - var(--ta-w))}
/* Button 400 px unter der Textoberkante wie in Figma, 1 px links vom Text */
.rx-ta__btn{margin:47.8125px 0 0 -1px}

/* Rotes X hinter dem Text: mittig (Case „Aufgabe“) oder links angeschnitten (Webinare) */
.rx-ta__x{position:absolute;width:1372px;height:1643px;pointer-events:none}
.rx-ta__x img{display:block;width:100%;height:100%;max-width:none}
.rx-ta__x--mitte{left:calc(50% - 686px);top:-535px}
.rx-ta__x--links{left:calc(50% - 1372px);top:-121px}

/* Foto links an der Inhaltsspalte: 186 px unter der Oberkante, 508 × 903 px (breite Fenster: 35,28 % breit), Play-Knopf in der Mitte */
.rx-ta__media{position:absolute;left:13.8889%;top:calc(186 * var(--rx-media-unit,1px));width:35.2778%;height:calc(903 * var(--rx-media-unit,1px))}
.rx-ta__photo{position:absolute;inset:0;overflow:hidden}
.rx-ta__photo img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.rx-ta__play{position:absolute;left:50%;top:50%;width:63.122px;height:63.122px;margin:-31.561px 0 0 -31.561px;padding:0;border:0;background:none;cursor:pointer;transition:scale 600ms ease-out}
.rx-ta__play[disabled]{cursor:default}
.rx-ta__play:not([disabled]):hover{scale:1.1}
.rx-ta__play svg{display:block;width:100%;height:100%;overflow:visible}

/* Handy: X (falls aktiv), Text, Button und zuletzt das Foto */
@media(max-width:767px){
 .rx-ta{min-height:0;padding:0;display:flex;flex-direction:column;gap:28px}
 .rx-ta__x{position:relative;left:auto;top:auto;width:100%;height:auto;aspect-ratio:1372/1643}
 .rx-ta .rx-ta__col{width:auto;margin:0}
 .rx-ta__btn{margin:28px 0 0}
 .rx-ta__media{position:relative;order:1;left:auto;top:auto;width:100%;height:300px}
 .rx-ta__play{width:60px;height:60px;margin:-30px 0 0 -30px}
}