.contacts-page {
    display: flex;
    width: 100%;
    padding-bottom: 111px;
}

.contacts-page__inner {
    max-width: 1302px;
    width: 100%;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

.contacts-page__info {
    max-width: 490px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 34px;
}

.contacts-page__info-block {
    display: flex;
    width: 100%;
    gap: 20px;
    justify-content: space-between;
}

.contacts-page__info-block-items {
    display: flex;
    max-width: 189px;
    width: 100%;
    flex-direction: column;
    gap: 24px;
}

.contacts-page__info-block-item {
    display: flex;
    max-width: 189px;
    width: 100%;
    flex-direction: column;
    gap: 8px;
}

.contacts-page__info-block-item .social-network {
    margin: 0;
    gap: 16px;
}

.contacts-page__info-block-item-title {
    font: 18px/150% Roboto, sans-serif;
    color: #5A616C;
}

.contacts-page__info-block-item-value {
    font: 500 18px/150% Roboto, sans-serif;
    color: #333333;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contacts-page__info-block-item-value a {
    font: 500 18px/150% Roboto, sans-serif;
    color: #333333;
}

.contacts-page__info-block-item-value .span {
    font: 500 12px/150% Roboto, sans-serif;
    color: #5A616C;
    margin-top: -4px;
}

.contacts-page__media {
    max-width: 700px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.contacts_img {
    display: flex;
    width: 100%;
    aspect-ratio: 700 / 238;
    height: max-content;
}

.contacts_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contacts-page__map {
    width: 100%;
    display: flex;
    aspect-ratio: 700 / 218;
    height: max-content;
}

.contacts-page__map .bx-yandex-view-layout {
    display: flex;
    width: 100%;
    height: 100%;
}

.contacts-page__map .bx-yandex-view-map {
    display: flex;
    width: 100%;
}

.contacts-page__map .bx-yandex-map {
    display: flex;
    width: 100%;
    height: 100%;
}

.contacts_img-mobile {
    display: none;
}

@media screen and (max-width: 1200px) {
    .contacts-page__info {
        max-width: 420px;
    }
    .contacts-page__info-block-item-title {
        font: 13px/150% Roboto, sans-serif;
    }
    .contacts-page__info-block-item-value {
        font: 500 14px/150% Roboto, sans-serif;
    }
    .contacts-page__info-block-item-value a {
        font: 500 14px/150% Roboto, sans-serif;
    }
    .contacts-page__media {
        max-width: 550px;
    }
}

@media screen and (max-width: 1000px) {
    .contacts-page__info-block {
        flex-direction: column;
    }
    .contacts-page__info-block.address {
        order: 1;
    }
    .contacts-page__info-block.phone {
        order: 2;
    }
    .contacts-page__info-block.departments {
        order: 4;
    }
    .contacts-page__info-block.social {
        order: 3;
    }
}

@media screen and (max-width: 768px) {
    .contacts-page {
        padding-top: 24px;
        padding-bottom: 80px;
    }
    .contacts-page__inner {
        gap: 32px;
        justify-content: unset;
        padding: 0;
        flex-direction: column;
    }
    .contacts-page__info {
        max-width: unset;
        gap: 24px;
        padding: 0 16px;
        box-sizing: border-box;
    }
    .contacts-page__info-block {
        gap: 24px;
    }
    .contacts-page__info-block-items {
        max-width: unset;
    }
    .contacts-page__info-block-item {
        max-width: unset;
    }
    .contacts-page__info-block-item .social-network {
        justify-content: unset;
    }
    .contacts-page__info-block-item-title {
        font: 14px/150% Roboto, sans-serif;
    }
    .contacts-page__info-block-item-value {
        font: 500 16px/150% Roboto, sans-serif;
    }
    .contacts-page__info-block-item-value a {
        font: 500 16px/150% Roboto, sans-serif;
    }
    .contacts-page__info-block.departments {
        padding-top: 40px;
        border-top: 1px solid #E1E1E1;
        box-sizing: border-box;
    }
    .contacts-page__info-block.social {
        padding-bottom: 12px;
    }
    .contacts-page__info-block.social .contacts-page__info-block-item {
        gap: 12px;
    }
    .contacts-page__media {
        max-width: unset;
    }
    .contacts_img {
        display: none;
        aspect-ratio: 343 / 178;
    }
    .contacts_img-mobile {
        display: flex;
        padding: 0 16px;
        box-sizing: border-box;
    }
    .contacts_img-mobile .contacts_img {
        display: flex;
    }
    .contacts-page__map {
        aspect-ratio: 375 / 200;
        margin-top: 32px;
    }
}