.banner {
  --swiper-pagination-bullet-width: 10px;
  --swiper-pagination-bullet-height: 10px;
  --swiper-pagination-bullet-horizontal-gap: 10px;
  --swiper-pagination-color: #fff;
  --swiper-pagination-bullet-inactive-color: #fff;
  --banner-height: 45.9vw;
  overflow: hidden;
  height: var(--banner-height);
  position: relative;
  margin-bottom: 75px; }
  .banner__container {
    padding-left: 25px;
    padding-right: 25px;
    box-sizing: border-box; }
  .banner-swiper {
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    border-radius: var(--border-radius); }
    .banner-swiper__item {
      position: relative;
      height: 100%;
      height: var(--banner-height); }
      .banner-swiper__item-bg {
        width: 100%;
        height: 100%;
        object-fit: cover; }
      .banner-swiper__item .direct-video {
		  display: block;
        transform: scale(1.2);
        width: 100%;
        height: 100%;
        object-fit: cover; }
      .banner-swiper__item-video {
        transform: scale(1.2);
        width: 300%;
        margin-left: -100%; }
      .banner-swiper__item-content {
        color: #fff;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        display: flex;
        align-items: center;
        z-index: 1; }
        .banner-swiper__item-content:before {
          content: '';
          display: block;
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          background: var(--color-accent);
          opacity: 0.3;
          z-index: -1; }
      .banner-swiper__item-title {
        font-weight: bold;
        font-size: 96px;
        max-width: calc(100% - 50px); }
  .banner .swiper-control {
    position: absolute;
    width: 100%;
    height: 100px;
    bottom: 0;
    left: 0;
    z-index: 10; }
    .banner .swiper-control__container {
      height: 100%;
      box-sizing: border-box;
      padding-bottom: 49px;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      position: relative; }
  .banner .swiper-pagination {
    position: static;
    display: flex;
    align-items: center; }
  .banner .swiper-pagination-bullet {
    transition: 0.3s; }
  .banner .swiper-pagination-bullet-active {
    width: 20px;
    height: 20px; }
  .banner .swiper-nav__button {
    filter: invert(1); }
  .banner .socials {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: calc(var(--banner-height) - 100px); }
    .banner .socials__item {
      margin-right: 0; }
  .banner .swiper-number {
    position: absolute;
    right: 15px;
    bottom: 57px;
    z-index: 1;
    color: #fff;
    display: flex;
    align-items: flex-end;
    font-size: 36px; }
    .banner .swiper-number__current {
      font-weight: bold; }
    .banner .swiper-number__of {
      font-size: 20px; }
  .banner .button-feedback {
    margin-top: 1em;
    display: none; }

@media (max-width: 1919px) {
  .banner__container {
    padding-left: 20px;
    padding-right: 20px; } }

@media (max-width: 1600px) {
  .banner-swiper__item-title {
    font-size: 64px; } }

@media (max-width: 1399px) {
  .banner .button-feedback {
    display: inline-flex; } }

@media (max-width: 1199px) {
  .banner {
    --banner-height: 58.7vw; } }

@media (max-width: 991px) {
  .banner {
    margin-bottom: 50px; }
    .banner-swiper__item-title {
      font-size: 50px; } }

@media (max-width: 767px) {
  .banner {
    --banner-height: 100vw; }
    .banner-swiper__item-title {
      font-size: 38px; } }


@media (max-width: 575px) {
  .banner {
    --banner-height: 845px;
    --swiper-pagination-bullet-width: 5px;
    --swiper-pagination-bullet-height: 5px; }
    .banner-swiper__item-content {
      align-items: end;
      padding-bottom: 130px;
      box-sizing: border-box; }
    .banner-swiper__item-title {
      max-width: 100%; }
    .banner .swiper-pagination-bullet-active {
      width: 10px;
      height: 10px; }
    .banner .socials {
      justify-content: flex-start; }
    .banner .swiper-number {
      font-size: 32px;
      bottom: 50px;
      right: 20px; }
      .banner .swiper-number__of {
        font-size: 16px; }
    .banner .button-feedback {
      width: 100%; } }