@charset "UTF-8";
/**
needs bootstrap function str-replace()
 */
/**
* Метод дополняет svg-sprite.scss.
* Позволяет получить чистый урл элемента спрайта для использования в псевдоэлементах или background-image
* Example: content: url(get-svg-url('checkmark', $user-variables: (fill: 'tomato')));
* Example: background-image: url(get-svg-url('heart', $user-variables: (stroke: 'red', fill: 'pink')));
*/
/**
вертикальные отступы
для каждого цвета указываются в порядке как в $grid-breakpoints
 */
.contacts {
  background-color: #000;
  color: white;
}
.contacts .breadcrumb {
  margin-bottom: 56px;
}
@media (min-width: 400px) {
  .contacts .breadcrumb {
    margin-bottom: 56px;
  }
}
@media (min-width: 576px) {
  .contacts .breadcrumb {
    margin-bottom: 56px;
  }
}
@media (min-width: 768px) {
  .contacts .breadcrumb {
    margin-bottom: 56px;
  }
}
@media (min-width: 992px) {
  .contacts .breadcrumb {
    margin-bottom: 88px;
  }
}
@media (min-width: 1200px) {
  .contacts .breadcrumb {
    margin-bottom: 88px;
  }
}
@media (min-width: 1600px) {
  .contacts .breadcrumb {
    margin-bottom: 88px;
  }
}
@media (min-width: 1800px) {
  .contacts .breadcrumb {
    margin-bottom: 88px;
  }
}
.contacts-form {
  overflow: hidden;
  background-color: #fff;
  padding-top: 72px;
  padding-bottom: 72px;
}
@media (min-width: 400px) {
  .contacts-form {
    padding-top: 72px;
  }
}
@media (min-width: 576px) {
  .contacts-form {
    padding-top: 72px;
  }
}
@media (min-width: 768px) {
  .contacts-form {
    padding-top: 72px;
  }
}
@media (min-width: 992px) {
  .contacts-form {
    padding-top: 120px;
  }
}
@media (min-width: 1200px) {
  .contacts-form {
    padding-top: 120px;
  }
}
@media (min-width: 1600px) {
  .contacts-form {
    padding-top: 120px;
  }
}
@media (min-width: 1800px) {
  .contacts-form {
    padding-top: 120px;
  }
}
@media (min-width: 400px) {
  .contacts-form {
    padding-bottom: 72px;
  }
}
@media (min-width: 576px) {
  .contacts-form {
    padding-bottom: 72px;
  }
}
@media (min-width: 768px) {
  .contacts-form {
    padding-bottom: 72px;
  }
}
@media (min-width: 992px) {
  .contacts-form {
    padding-bottom: 120px;
  }
}
@media (min-width: 1200px) {
  .contacts-form {
    padding-bottom: 120px;
  }
}
@media (min-width: 1600px) {
  .contacts-form {
    padding-bottom: 120px;
  }
}
@media (min-width: 1800px) {
  .contacts-form {
    padding-bottom: 120px;
  }
}
.contacts-form__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.contacts-form__form {
  width: 100%;
}
@media (min-width: 992px) {
  .contacts-form__form {
    width: 650px;
  }
}
.contacts-form__image {
  position: relative;
  width: 420px;
  height: 406px;
  background-image: url("/upload/_base/contacts/contacts-form-person.svg");
  background-size: contain;
  display: none;
}
@media (min-width: 992px) {
  .contacts-form__image {
    display: block;
    -webkit-transform: translateX(120px);
        -ms-transform: translateX(120px);
            transform: translateX(120px);
  }
}
@media (min-width: 1200px) {
  .contacts-form__image {
    -webkit-transform: translateX(180px);
        -ms-transform: translateX(180px);
            transform: translateX(180px);
  }
}
@media (min-width: 1600px) {
  .contacts-form__image {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
  }
}
.contacts-form__image__text {
  position: absolute;
  width: 290px;
  height: 190px;
  background-image: url("/upload/_base/contacts/contacts-form-text.svg");
  background-size: contain;
  background-repeat: no-repeat;
  left: -200px;
  top: -20px;
  display: none;
}
@media (min-width: 1200px) {
  .contacts-form__image__text {
    display: block;
  }
}

.contacts-info {
  margin-bottom: 72px;
}
@media (min-width: 400px) {
  .contacts-info {
    margin-bottom: 72px;
  }
}
@media (min-width: 576px) {
  .contacts-info {
    margin-bottom: 72px;
  }
}
@media (min-width: 768px) {
  .contacts-info {
    margin-bottom: 72px;
  }
}
@media (min-width: 992px) {
  .contacts-info {
    margin-bottom: 120px;
  }
}
@media (min-width: 1200px) {
  .contacts-info {
    margin-bottom: 120px;
  }
}
@media (min-width: 1600px) {
  .contacts-info {
    margin-bottom: 120px;
  }
}
@media (min-width: 1800px) {
  .contacts-info {
    margin-bottom: 120px;
  }
}
.contacts-info__container {
  display: grid;
  grid-auto-rows: minmax(0, -webkit-min-content);
  grid-auto-rows: minmax(0, min-content);
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "title" "primary" "map" "contacts" "requisites";
  grid-row-gap: 32px;
}
@media (min-width: 768px) {
  .contacts-info__container {
    grid-row-gap: 56px;
  }
}
@media (min-width: 992px) {
  .contacts-info__container {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    grid-template-areas: "title title" "primary map" "contacts map" "contacts requisites";
    grid-column-gap: 24px;
    grid-row-gap: 32px;
  }
}
@media (min-width: 1200px) {
  .contacts-info__container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "title map" "primary map" "contacts requisites";
    grid-column-gap: 16px;
    grid-row-gap: 56px;
  }
}
@media (min-width: 1600px) {
  .contacts-info__container {
    grid-column-gap: 80px;
  }
}
.contacts-info__title {
  grid-area: title;
  color: #fff;
  margin: 0;
}
.contacts-info__map {
  grid-area: map;
}
.contacts-info__primary {
  grid-area: primary;
  display: block;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (min-width: 576px) {
  .contacts-info__primary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media (min-width: 992px) {
  .contacts-info__primary {
    display: block;
  }
}
@media (min-width: 1600px) {
  .contacts-info__primary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.contacts-info__primary > div {
  width: 100%;
}
@media (min-width: 576px) {
  .contacts-info__primary > div {
    width: calc(50% - 16px);
  }
}
@media (min-width: 992px) {
  .contacts-info__primary > div {
    width: 100%;
  }
}
@media (min-width: 1600px) {
  .contacts-info__primary > div {
    width: calc(50% - 16px);
  }
}
.contacts-info__common {
  font-size: var(--fz-h3);
  margin-bottom: 32px;
}
@media (min-width: 576px) {
  .contacts-info__common {
    margin-bottom: 0;
  }
}
@media (min-width: 992px) {
  .contacts-info__common {
    margin-bottom: 40px;
  }
}
@media (min-width: 1600px) {
  .contacts-info__common {
    margin-bottom: 0;
  }
}
.contacts-info__common__phone {
  margin-bottom: 12px;
}
@media (min-width: 400px) {
  .contacts-info__common__phone {
    margin-bottom: 12px;
  }
}
@media (min-width: 576px) {
  .contacts-info__common__phone {
    margin-bottom: 12px;
  }
}
@media (min-width: 768px) {
  .contacts-info__common__phone {
    margin-bottom: 12px;
  }
}
@media (min-width: 992px) {
  .contacts-info__common__phone {
    margin-bottom: 16px;
  }
}
@media (min-width: 1200px) {
  .contacts-info__common__phone {
    margin-bottom: 16px;
  }
}
@media (min-width: 1600px) {
  .contacts-info__common__phone {
    margin-bottom: 16px;
  }
}
@media (min-width: 1800px) {
  .contacts-info__common__phone {
    margin-bottom: 16px;
  }
}
.contacts-info__common__email {
  color: #A9FFC6;
}
.contacts-info__common__support {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 8px;
}
.contacts-info__common__support p {
  font-size: var(--fz-h6);
  margin-top: 12px;
}
@media (min-width: 400px) {
  .contacts-info__common__support p {
    margin-top: 12px;
  }
}
@media (min-width: 576px) {
  .contacts-info__common__support p {
    margin-top: 12px;
  }
}
@media (min-width: 768px) {
  .contacts-info__common__support p {
    margin-top: 12px;
  }
}
@media (min-width: 992px) {
  .contacts-info__common__support p {
    margin-top: 16px;
  }
}
@media (min-width: 1200px) {
  .contacts-info__common__support p {
    margin-top: 16px;
  }
}
@media (min-width: 1600px) {
  .contacts-info__common__support p {
    margin-top: 16px;
  }
}
@media (min-width: 1800px) {
  .contacts-info__common__support p {
    margin-top: 16px;
  }
}
.contacts-info__common__support a {
  font-size: var(--fz-h6);
  color: #A9FFC6;
}
.contacts-info__contacts {
  grid-area: contacts;
  display: grid;
  grid-gap: 24px;
  grid-auto-rows: -webkit-min-content;
  grid-auto-rows: min-content;
  grid-template-columns: 1fr;
}
@media (min-width: 576px) {
  .contacts-info__contacts {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 768px) {
  .contacts-info__contacts {
    grid-gap: 32px;
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 992px) {
  .contacts-info__contacts {
    grid-template-columns: 1fr;
  }
}
@media (min-width: 1200px) {
  .contacts-info__contacts {
    grid-template-columns: repeat(2, 1fr);
  }
}
.contacts-info__requisites {
  grid-area: requisites;
}

.contacts-info__block {
  color: #afafaf;
  line-height: 1.6;
  font-size: 16px;
}
@media (min-width: 768px) {
  .contacts-info__block {
    font-size: 18px;
  }
}
.contacts-info__block > div:not(:last-child) {
  margin-bottom: 8px;
}

.contacts-info__row--caption {
  line-height: 1.2;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 12px;
}
.contacts-info__row--email {
  color: #A9FFC6;
}