/* Prozess-Schritte (Social Media „Vorgehen“). Maße aus Figma (1440 px): ab 120 px an der Inhaltsspalte (1040 px), Kopf, 56 px Abstand,
   Schritte in gleich breiten Zellen mit 20 px Abstand, Kreise 240 px (rot, Nummer 40 px, Bezeichnung 22/28 px), graue Linie durch die Kreismitten. */
.rx-band--prozess-schritte{height:auto}
.rx-pz{box-sizing:border-box;min-height:629px;padding:120px 0 60px}
.rx-pz__inner{display:flex;flex-direction:column;gap:56px;width:1040px;margin-left:13.8889%}
.rx-pz__steps{position:relative;display:flex;gap:20px;margin:0;padding:0;list-style:none}
/* Linie von der ersten bis zur letzten Kreismitte: eine halbe Zellbreite Abstand an beiden Enden */
.rx-pz .rx-pz__line{position:absolute;top:119px;left:calc((100% - (var(--pz-n) - 1) * 20px) / var(--pz-n) / 2);right:calc((100% - (var(--pz-n) - 1) * 20px) / var(--pz-n) / 2);height:1px;background:#484848;transform-origin:left center}
.rx-pz__step{display:flex;flex:1 1 0;justify-content:center;min-width:0}
.rx-pz__circle{position:relative;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:10px;width:240px;height:240px;padding:68px 28px 0;border:1px solid #ce1620;border-radius:50%;background:#ce1620;color:#fff;font-weight:700;text-align:center;transition:background-color 200ms}
.rx-pz__step:hover .rx-pz__circle{background:var(--rx-black)}
.rx-pz__number{margin:0;font-size:40px;line-height:normal}
.rx-pz__label{margin:0;font-size:22px;line-height:28px}

/* Handy: zwei Spalten, Kreise füllen die Zelle */
@media(max-width:767px){
 .rx-pz{min-height:0;padding:0}
 .rx-pz__inner{width:auto;margin:0;gap:32px}
 .rx-pz__steps{display:grid;grid-template-columns:1fr 1fr;gap:16px}
 .rx-pz .rx-pz__line{display:none}
 .rx-pz__circle{width:100%;height:auto;aspect-ratio:1;justify-content:center;gap:6px;padding:0 12px}
 .rx-pz__number{font-size:32px}
 .rx-pz__label{font-size:15px;line-height:19px}
}