/* FOOTER */
.footer__copyright span {
    font-weight: bold;
}
.footer {
    padding-top: 77px;
    background-color: #023953;
}
.footer__logo-wrap {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 36px;
    margin-bottom: 6px;
}
.footer__logo {
    display: block;
    flex-shrink: 0;
}
.footer__logo-image {
    display: block;
    width: 209px;
}
.footer__logo-wrap::after {

}
.footer__wrap {
    display: grid;
    grid-template-columns: 320px 1fr 1fr 1fr 310px;
    margin-bottom: 18px;
    color: #fff;
    font-family: "TTNormsPro";
}
.footer__contacts {
    display: flex;
    flex-direction: column;
    padding-top: 0px;
    padding-bottom: 37px;
    padding-right: 0px;
    border-right: 1px solid #004E78;
}
.footer__phone {
    font-size: 20px;
    font-weight: 500;
    transition: color 0.15s ease-in-out;
}
.footer__logo {
    margin-bottom: 41px;
}
.footer__text {
    letter-spacing: 1px;
}
@media (any-hover: hover) {
    .footer__phone:hover {
        color: var(--accent-red);
    }
}
.footer__phone:active {
    color: var(--accent-red);
}
.footer__text {
    margin-bottom: 13px;
    font-size: 14px;
    line-height: 21px;
    text-transform: uppercase;
}
.footer__phone {
    font-size: 20px;

    letter-spacing: 0.5px;
    margin-bottom: 43px;
}
.footer__phone {
    letter-spacing: 0.5px;
}
.footer__mail {
    margin-bottom: 48px;
    font-size: 20px;
    color: #fff;
    font-weight: 500;
}
.footer__address {
    margin-bottom: 31px;
    font-size: 14px;
    font-style: normal;
    line-height: 21px;
}
.footer__social {
    align-items: end;
}
.footer__map-link-top {
    display: inline-block;
    margin-bottom: 51px;
    font-size: 13px;
    text-decoration: underline;
    transition: color 0.15s
    ease-in-out;
    display: flex
;
    margin-bottom: 29px;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.15s
    ease-in-out;
    border-bottom: 1px solid;
    width: 163px;
    /* margin: auto 0; */
    /* float: right; */
    line-height: 20px;
}
.footer__map-link {
    display: flex
;    margin-bottom: 44px;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.15s
    ease-in-out;
    border-bottom: 1px solid;
    width: 109px;
    /* margin: auto 0; */
    /* float: right; */
    line-height: 20px;
}
@media (any-hover: hover) {
    .footer__map-link-top:hover {
        color: var(--accent-red);
    }
    .footer__map-link:hover {
        color: var(--accent-red);
    }
}
.footer__map-link-top:active {
    color: var(--accent-red);
}
.footer__map-link:active {
    color: var(--accent-red);
}
.footer__catalog,
.footer__menu,
.footer__info {
    display: flex
;
    flex-direction: column;
    row-gap: 33px;
    padding-top: 89px;
    padding-left: 113px;
    border-right: 1px solid #004E78;
}
.footer__title {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}
.footer__link {
    align-self: flex-start;
    font-size: 14px;
    transition: color 0.15s ease-in-out;
}
@media (any-hover: hover) {
    .footer__link:hover {
        color: var(--accent-red);
    }
}
.footer__link:active {
    color: var(--accent-red);
}
.footer__social {
    display: flex;
    flex-direction: column;
  text-align: right;
    padding-top: 86px;
}
.footer__link-call {
    margin-left: 128px;
    margin-bottom: 40px;
}
.footer__mode {
    margin-left: 132px;
    margin-bottom: 5px;
    font-size: 14px;
}
.footer__time {
    margin-left: 135px;
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 700;
}
.footer__vacancies {
    margin-bottom: 35px;
    margin-left: 135px;
    font-size: 14px;
    transition: color 0.15s ease-in-out;
}
@media (any-hover: hover) {
    .footer__vacancies:hover {
        color: var(--accent-red);
    }
}
.footer__vacancies:active {
    color: var(--accent-red);
}
.social__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    margin-left: 125px;
}
.social__link {
    position: relative;
    display: block;
    width: 47px;
    height: 30px;
}
.social__link::before {
    content: "";
    display: block;
    width: 47px;
    height: 30px;
    background-color: #004E78;
    mask: var(--url) no-repeat center / var(--size);
    transition: background-color 0.15s ease-in-out;
}
.rutube {
    --url: url("../images/social/rutube.svg");
    --size: 23px 21px;
}
.unknown {
    --url: url("../images/social/unknown.svg");
    --size: 20px 20px;
}
.vk {
    --url: url("../images/social/vk.svg");
    --size: 47px 30px;
}
.telegram {
    --url: url("../images/social/telegram.svg");
    --size: 30px 30px;
}
.youtube {
    --url: url("../images/social/youtube.svg");
    --size: 23px 17px;
}
@media (any-hover: hover) {
    .social__link:hover::before {
        background-color: var(--accent-red);
    }
}
.social__link:active::before {
    background-color: var(--accent-red);
}

.footer__bottom {
    padding-block: 29px;
    background-color: var(--black);
}
.footer__bottom-container {
    display: flex;
    justify-content: space-between;
    gap: 25px;
    flex-wrap: wrap;
    align-items: end;
    font-size: 14px;
    line-height: 19px;
}
.footer__copyright {
    color: var(--white);
}
.footer__policy,
.footer__personal {
    color: var(--white);
    transition: color 0.15s ease-in-out;
}
@media (any-hover: hover) {
    .footer__policy:hover,
    .footer__personal:hover {
        color: var(--accent-red);
    }
}
.footer__policy:active,
.footer__personal:active {
    color: var(--accent-red);
}
.footer__made {
    color: var(--white);
}

@media (max-width: 1650px) {
    .footer__wrap {
        grid-template-columns: 280px 1fr 1fr 1fr 228px;
        margin-bottom: 18px;
    }
    .footer__contacts {
        padding-right: 13px;
        border-right: 1px solid #004E78;
    }
    .footer__catalog,
    .footer__menu,
    .footer__info {
        align-items: center;
        padding-inline: 14px;
    }
    .footer__link {
    }
    .footer__social {
        padding-left: 18px;
    }
    .footer__link-call {
        margin-left: 0;
        align-self: flex-end;
    }
    .footer__mode {
        margin-left: 0;
    }
    .footer__time {
        margin-left: 0;
    }
    .footer__vacancies {
        margin-left: 0;
    }
    .social__list {
        margin-left: 0;
    }
}

@media (max-width: 1024px) {
    .footer__wrap {
        grid-template-columns: 30% 1fr 1fr 1fr;
    }
    .footer__contacts {
        padding-bottom: 20px;
    }
    .footer__text {
        margin-bottom: 10px;
    }
    .footer__mail {
        margin-bottom: 15px;
    }
    .footer__map-link-top {
        margin-bottom: 20px;
    }
    .footer__catalog,
    .footer__menu,
    .footer__info {
        row-gap: 20px;
    }
    .footer__social {
        padding-top: 20px;
        padding-left: 0;
    }
    .footer__info {
        border-right: none;
    }
    .footer__link-call {
        align-self: flex-start;
        margin-bottom: 20px;
        margin-left: 24px;
    }
    .footer__time {
        margin-bottom: 18px;
    }
    .footer__vacancies {
        margin-bottom: 25px;
    }
    .social__list {
        column-gap: 10px;
    }
    .footer__bottom-container {
        display: grid;
        grid-template-columns: auto auto;
        justify-content: initial;
        gap: 25px;
        align-items: initial;
    }
    .footer__social {

        align-items: flex-start;
    }
    .footer__address {
        text-align: left;
    }
}

@media (max-width: 768px) {
    .footer {
        padding-top: 40px;
    }
    .footer__wrap {
        grid-template-columns: 1fr;
        grid-template-areas:
        "contacts"
        "social"
        "catalog"
        "menu"
        "info";
    }
    .footer__contacts {
        grid-area: contacts;
        padding: 22px 53px 15px 0;
        border-right: none;
    }
    .footer__catalog {
        grid-area: catalog;
    }
    .footer__menu {
        grid-area: menu;
    }
    .footer__info {
        grid-area: info;
    }
    .footer__social {
        grid-area: social;
        padding-top: 12px;
        padding-left: 0;
        align-items: flex-start;
    }
    .footer__catalog,
    .footer__menu,
    .footer__info {
        align-items: start;
        padding-inline: 0;
        row-gap: 15px;
        border-right: none;
        padding-top: 22px;
    }
    .footer__link {
        align-self: flex-start;
        text-align: start;
    }
    .footer__vacancies {
        margin-bottom: 20px;
    }
    .social {
        margin-bottom: 4px;
        column-gap: 16px;
    }

    .footer__bottom-container {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}
/* end footer */