footer {
    min-height: 419px;
    padding: 112px 0 78px 0;
}

.footer {
    display: flex;
    flex-direction: column;
}

.footer__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    max-width: var(--container-max-width);
    width: var(--container-width);

    gap: 16px;
    margin: auto;
}

.footer__navigation,
.footer__section--first {
    display: flex;
    flex-direction: column;

    font-family: var(--text-font);
    font-size: var(--text-font-size);
    line-height: var(--line-height);
}

.footer__section--first {
    gap: calc(var(--elements-gap) / 2);
}

.footer__navigation--title {
    font-family: var(--title-font);
    font-size: var(--text-font-size);
    line-height: var(--line-height);
}

.footer__navigation--social,
.footer__navigation--list {
    display: flex;
    gap: 14px;
}

.footer__navigation--list {
    flex-direction: column;
}

.footer__navigation.footer__navigation--social.social {
    gap: 0px;
}

.footer__navigation--link,
.sub-footer {
    font-family: var(--text-font);
    font-size: var(--text-font-size);
    line-height: var(--line-height);
}

.sub-footer {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 24px;
    padding: var(--block-default-padding);
    margin: auto;
    width: 100%;
}

.whatsapp,
.back-top {
    position: fixed;
    bottom: 20px;
    z-index: 1000;
}

.whatsapp {
    right: 20px;
    padding: 25px;
}


.footer__logo,
.footer__navigation--title {
    margin-bottom: 20px;
}

.foot__description--last {
    margin-top: 8px;
}

.footer__navigation--centered {
    align-items: center;
    justify-content: center;
}

.footer__navigation--icon {
    vertical-align: middle;
    margin: 0 calc(var(--elements-gap) / 2) 0 0;
}

@media screen and (min-width: 1024px) {
    footer .footer {
        height: auto;
    }

    .footer__container {
        flex-wrap: nowrap;
    }

    .footer__navigation,
    .footer__section--first {
        flex: 0 0 content;
    }

    .footer__section--first,
    .footer__navigation {
        max-inline-size: 284px;
    }
}

@media screen and (min-width: 768px) {
    .footer__container {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .footer__navigation,
    .footer__section--first {
        flex: 0 0 calc(50% - 16px);
        margin: unset;
    }

    .sub-footer {
        flex-direction: row;
        height: 68px;
    }

    .footer__navigation--payment {
        margin: calc(var(--elements-gap) * 2) auto auto;
    }

    .footer__navigation--no-limit {
        max-inline-size: unset;
        flex: 0 1 content;
    }
}

@media screen and (max-width: 768px) {
    .footer__container {
        gap: 24px;
    }

    footer {
        padding: 48px 0;
    }
}
