
.pws-hero { position: relative; display: flex; align-items: center; min-height: 620px; padding: 100px 0; box-sizing: border-box; background: #141414 url('/images/stages/stages-hero-bg.webp') center / cover no-repeat; font-family: 'Roboto', Arial, sans-serif; }
.pws-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,20,20,.85) 0%, rgba(20,20,20,.55) 55%, rgba(20,20,20,.25) 100%); }
.pws-hero .pwb-wrap { position: relative; }
.pws-hero__title { margin: 30px 0 0; font-size: 70px; line-height: 1; font-weight: 700; text-transform: uppercase; color: #ffffff; }
.pws-hero__title span { display: block; color: #e62e45; }
.pws-hero__bar { width: 80px; height: 5px; margin-top: 25px; background: #e62e45; }
.pws-hero__sub { margin: 25px 0 0; font-size: 28px; line-height: 34px; font-weight: 700; text-transform: uppercase; color: #ffffff; }
.pws-hero__sub span { color: #e62e45; }
.pws-hero__text { max-width: 600px; margin: 25px 0 0; font-size: 18px; line-height: 28px; color: #ffffff; }

.pws-flow .pwb-card { position: relative; }
.pws-flow .pwb-card + .pwb-card::before { content: ''; position: absolute; top: 40px; left: -32px; width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e62e45' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h17M14 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.pws-flow__icon { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; }
.pws-flow__icon--accent { background: #e62e45; }
.pws-flow .pwb-card__line { background: #757575; }
.pws-flow .pwb-card__line--accent { background: #e62e45; }

@media screen and (max-width: 1199px) {
  .pws-hero__title { font-size: 60px; }
  .pws-flow .pwb-card + .pwb-card::before { left: -22px; width: 20px; }
}

@media screen and (max-width: 959px) {
  .pws-hero { min-height: 560px; }
  .pws-hero__title { font-size: 50px; }
  .pws-hero__sub { font-size: 24px; line-height: 29px; }
  .pws-flow .pwb-card + .pwb-card { margin-top: 20px; }
  .pws-flow .pwb-card + .pwb-card::before { top: -32px; left: 20px; transform: rotate(90deg); width: 24px; }
  .pws-flow.pwb-cards { gap: 20px; }
}

@media screen and (max-width: 639px) {
  .pws-hero { min-height: 0; padding: 75px 0; }
  .pws-hero__title { font-size: 40px; }
  .pws-hero__sub { font-size: 20px; line-height: 24px; }
  .pws-hero__text { font-size: 16px; line-height: 25px; }
}

@media screen and (max-width: 479px) {
  .pws-hero__title { font-size: 34px; }
}
