.rec {
  padding-block: 70px 130px;
  color: var(--clr-white);
  background-color: var(--clr-black);
  overflow: hidden;
}

.rec-slider {
  margin-top: 40px;
}

.rec-slider-wrap {
  overflow: visible;
  margin-inline: auto;
  max-width: 1057px;
}

.rec .card-item-media {
  background-color: rgba(235, 241, 244, 0.3);
}

.rec .card-item-info-icon {
  filter: invert(100%);
}

.rec .card-item-big {
  width: 100%;
  max-width: 694px;
}

.rec .card-item-v1,
.rec .card-item-v2 {
  width: 100%;
  max-width: 337px;
}

@media screen and (max-width: 1440px) {
  .rec {
    padding-block: 60px 130px;
  }

  .rec-slider-wrap {
    max-width: 900px;
  }

  .rec .card-item-big {
    max-width: 592px;
  }

  .rec .card-item-v1,
  .rec .card-item-v2 {
    max-width: 288px;
  }
}

@media screen and (max-width: 1164px) {
  .rec {
    padding-block: 45px 100px;
  }

  .rec-slider {
    margin-top: 25px;
  }

  .rec-slider-wrap {
    max-width: 716px;
  }

  .rec .card-item-big {
    max-width: 472px;
  }

  .rec .card-item-v1,
  .rec .card-item-v2 {
    max-width: 228px;
  }
}

@media screen and (max-width: 964px) {
  .rec .card-item-big {
    max-width: 344px;
  }

  .rec .card-item-v1,
  .rec .card-item-v2 {
    max-width: 164px;
  }
}

@media screen and (max-width: 624px) {
  .rec {
    padding-block: 24px 48px;
  }

  .rec .card-item-big {
    max-width: 100%;
  }

  .rec .card-item-v1,
  .rec .card-item-v2 {
    max-width: 100%;
  }
}