.customBanner {
  position: relative;
  overflow: hidden;
  background: var(--color-black);
}

.customBanner .Button {
  display: none;
  position: relative;
  z-index: 5;
}
.customBanner__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.customBanner__image {
  z-index: 1;
  -webkit-transform: translate(-30%);
  -ms-transform: translate(-30%);
  transform: translate(-30%);
  position: absolute;
  bottom: 50px;
  left: 50%;
}

.customBanner__image img {
  display: block;
}

@media screen and (max-width: 1919px) {
  .customBanner_mark .customBanner__background {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
  }
}

@media screen and (max-width: 1259px) {
  .customBanner .Button {
    display: inline-flex;
  }
  .customBanner.customBanner_bottom .Button {
    margin-top: 24px;
  }
  .customBanner.customBanner_mark .Button {
    max-width: min-content;
    grid-column: 2;
  }
}

@media screen and (max-width: 767px) {
  .customBanner_2 .customBanner__background,
  .customBanner_3 .customBanner__background {
    -o-object-position: 0 50%;
    object-position: 0 50%;
  }
}

@media screen and (max-width: 481px) {
  .customBanner.customBanner_bottom .Button {
    margin-top: 30px;
  }
}
@media screen and (max-width: 415px) {
  .customBanner .Button { width: 100%; }
}

.customBanner__background {
  position: absolute;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  opacity: 0.45;
  z-index: 1;
}

.customBanner_bottom .customBanner__background {
  height: 100%;
}

@media screen and (max-width: 1259px) {
  .customBanner {
    padding-top: 60px;
    padding-bottom: 110px;
  }
  .customBanner.customBanner_mark {
    padding-bottom: 60px;
  }
  .customBanner.customBanner_mark .customBanner__background {
    opacity: 0.45;
  }

  .customBanner__image {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-transform: translateX(80px);
    -ms-transform: translateX(80px);
    transform: translateX(80px);
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    left: auto;
    bottom: 36px;
  }
}

@media screen and (max-width: 1025px) {
  .customBanner__image { transform: translateX(30px); }
  .customBanner__image img { max-width: 520px; }
  .customBanner__background { 
    opacity: 1;
    object-fit: cover;
    object-position: right;
  }
}

@media screen and (max-width: 991px) {
  .customBanner {
    padding-bottom: 42px;
  }
  .customBanner__image {
    position: static;
    transform: translateX(80px);
    margin-top: -44px;
  }
}

@media screen and (max-width: 821px) {
  
}

@media screen and (max-width: 599px) {
  .customBanner_2 .customBanner__background,
  .customBanner_3 .customBanner__background {
    -o-object-position: 25% 50%;
    object-position: 25% 50%;
  }

  .customBanner {
    padding-top: 48px;
    padding-bottom: 32px;
  }
  .customBanner.customBanner_mark {
    padding-bottom: 32px;
  }
}

@media screen and (max-width: 481px) {
  .customBanner__image {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0;
    margin-top: 24px;
  }
  .customBanner__image img {
    max-width: 370px;
  }
}

@media screen and (max-width: 415px) {
  .customBanner__image { transform: translateX(120px); }
}

.customBanner__container {
  width: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 2;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-bottom: 48px;
  padding-top: 48px;
}

@media screen and (max-width: 1259px) {
  .customBanner__container {
    padding-top: 0;
    padding-bottom: 0;
  }
}

@media screen and (max-width: 1025px) {
  .containerPage.customBanner__container {
    padding-left: 39px;
    padding-right: 39px;
  }
}

@media screen and (max-width: 670px) {
  .containerPage.customBanner__container {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.customBanner__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-top: 42px;
  padding-bottom: 42px;
  margin-right: 100px;
  color: #fff;
}

.customBanner__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 16px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: 52px;
  line-height: 64px;
  font-weight: 700;
}

.customBanner__title span:not(:last-child) {
  margin-right: 16px;
}

.customBanner__title img:not(.customBanner__markLogo) {
  max-width: 64px;
  margin-bottom: 10px;
}
.customBanner__title img.chevrolet:not(.customBanner__markLogo) { max-width: 74px; }
.customBanner__title img.hummer:not(.customBanner__markLogo) { max-width: 120px; }
.customBanner__title img.gmc:not(.customBanner__markLogo) { max-width: 100px; }

@media screen and (max-width: 1259px) {
  .customBanner__content {
    width: 100%;
    max-width: 800px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    padding: 0;
  }

  .customBanner__title {
    font-size: 42px;
    line-height: 1.2;
  }
}

@media screen and (max-width: 821px) {
  .customBanner__content {
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .customBanner__title {
    font-size: 32px;
  }

  .customBanner__title span:not(:last-child) {
    margin-right: 12px;
  }

  .customBanner__title img.gmc:not(.customBanner__markLogo),
  .customBanner__title img.hummer:not(.customBanner__markLogo) {
    max-width: 104px;
  }

  .customBanner__title img.chevrolet:not(.customBanner__markLogo) {
    max-width: 70px;
  }
}

@media screen and (max-width: 640px) {
  .customBanner__title img:not(.customBanner__markLogo) { display: none; }
  .customBanner__title img.gmc:not(.customBanner__markLogo) { max-width: 34px; }
}

@media screen and (max-width: 599px) {
  .customBanner__title { font-size: 24px; }
  .customBanner__title span:not(:last-child) { margin-right: 8px; }
}

.customBanner__text {
  max-width: 536px;
  font-size: 20px;
  line-height: 150%;
}

.customBanner__text_image {
  max-width: 100%;
  display: grid;
  gap: 24px 36px;
  align-items: start;
  grid-template-columns: fit-content(184px) minmax(0, 1fr);
}

.customBanner__text_image img {
  margin-top: 10px;
}

.customBanner__markLogoWrap {
  display: inline-block;
  padding-top: var(--logo-top-desktop, 0px);
  padding-bottom: var(--logo-bottom-desktop, 0px);
}

/* Строка заголовка модели: margin-bottom wrap (mobile-first, пороги 480 / 1026).
   Мобилка ≤479: 0; таблет 480–1025: −3; десктоп ≥1026: +5. */
.customBanner__title > .customBanner__markLogoWrap {
  margin-bottom: 0;
}

@media screen and (min-width: 480px) {
  .customBanner__title > .customBanner__markLogoWrap {
    margin-bottom: -3px;
  }
}

@media screen and (min-width: 1026px) {
  .customBanner__title > .customBanner__markLogoWrap {
    margin-bottom: 5px;
  }
}

.customBanner__markLogo {
  max-width: var(--logo-max-width-desktop, 120px);
}

.customBanner__text_image img.customBanner__markLogo,
.customBanner__title img.customBanner__markLogo {
  max-width: var(--logo-max-width-desktop, 120px);
  margin-top: 0;
  margin-bottom: 0;
}

.customBanner__text_image span {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media screen and (max-width: 1439px) {
  .customBanner__content { margin-right: 50px; }
}

@media screen and (max-width: 1259px) {
  .customBanner__content { margin-right: 0; }
  .customBanner__text {
    font-size: 18px;
  }
  .customBanner__text_image img { margin-top: 8px; }
  .customBanner__text_image img.customBanner__markLogo,
  .customBanner__title img.customBanner__markLogo {
    margin-top: 0;
  }
  .customBanner__form { display: none; }
}

@media screen and (max-width: 1025px) {
  .customBanner__content { max-width: 100%; }
  .customBanner__markLogoWrap {
    padding-top: var(--logo-top-tablet, var(--logo-top-desktop, 0px));
    padding-bottom: var(--logo-bottom-tablet, var(--logo-bottom-desktop, 0px));
  }
  .customBanner__markLogo {
    max-width: var(--logo-max-width-tablet, var(--logo-max-width-desktop, 120px));
  }
  .customBanner_mark .customBanner__text_image {
    grid-template-columns: fit-content(var(--logo-max-width-tablet, var(--logo-max-width-desktop, 120px))) minmax(0, 1fr);
  }
}

@media screen and (max-width: 821px) {
  .customBanner__text_image { gap: 24px 28px; }
  .customBanner__text_image span { width: 100%; }
}

@media screen and (max-width: 640px) {
  .customBanner__text { font-size: 16px; }
}

.customBanner__form {
  width: 424px;
  padding: 36px;
  border-radius: 12px;
  background: #fff;
}

.customBanner__titleForm {
  font-size: 24px;
  font-weight: 700;
}

.customBanner__subtitleForm {
  margin-top: 8px;
}

.customBanner__blocks {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 48px;
}

.customBanner__block {
  padding: 20px 16px;
  border-radius: 6px;
  background-color: rgba(255, 255, 255, 0.86);
  color: #212121;
}

.customBanner__blockTitle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-family: HeliosCond;
}

.customBanner__blockTitle img {
  width: 36px;
  height: 36px;
  margin-right: 20px;
}

.customBanner__blockTitle span {
  font-size: 22px;
  font-weight: 700;
}

@media screen and (max-width: 1439px) {
  .customBanner__block {
    padding: 16px 12px;
  }

  .customBanner__blockTitle span {
    font-size: 20px;
  }
  .customBanner__blockText {
    margin-top: 16px;
    font-size: 16px;
  }
}

@media screen and (max-width: 1259px) {
  .customBanner__blocks {
    grid-gap: 16px;
  }

  .customBanner__blockTitle span {
    font-size: 22px;
  }
}

@media screen and (max-width: 767px) {
  .customBanner__blockTitle img {
    width: 28px;
    height: 28px;
    margin-right: 16px;
  }

  .customBanner__blockTitle span {
    font-size: 18px;
  }
}

@media screen and (max-width: 599px) {
  .customBanner__blocks {
    grid-template-columns: minmax(0, 1fr);
  }
  .customBanner_mark .customBanner__text_image {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  .customBanner.customBanner_mark .Button { 
    grid-column: auto;
    margin-top: 12px;
  }
  .customBanner__blockTitle span {
    font-size: 22px;
  }
  .customBanner__text_image img {
    width: 100%;
    max-width: 112px;
    margin-top: 0;
    margin-bottom: 8px;
  }
  .customBanner__markLogo {
    max-width: var(--logo-max-width-mobile, var(--logo-max-width-tablet, 112px));
  }
  .customBanner__markLogoWrap {
    padding-top: var(--logo-top-mobile, var(--logo-top-tablet, 0px));
    padding-bottom: var(--logo-bottom-mobile, var(--logo-bottom-tablet, 0px));
  }
}
@media screen and (max-width: 481px) {
  .customBanner__blocks {
    margin-top: 24px;
  }
  .customBanner .Button { max-width: 100%; }
}

.customBanner__blockText {
  margin-top: 20px;
}

@media screen and (max-width: 415px) {
  .customBanner_mark .customBanner__text_image img.customBanner__markLogo {
    max-width: var(--logo-max-width-mobile, var(--logo-max-width-tablet, 112px));
  }
}