footer {
    background-color: var(--black);
    color: var(--white);
    font-size: var(--fontsize-body-sm);
}

    footer a {
        color: var(--white);
    }

.footer__top {
    background: var(--gradient-orange);
    padding: 4rem 0;
}

    .footer__top h2 {
        margin-bottom: 2.5rem;
    }

    .footer__top p:first-of-type {
        margin-bottom: .5rem;
    }

    .footer__top strong {
        font-size: var(--fontsize-body-ms);
    }

.footer__usp {
    position: relative;
    padding-left: 2.5rem;
}

    .footer__usp > svg {
        position: absolute;
        top: .5rem;
        left: 0;
    }

.footer__bottom {
    padding: 4rem 0;
}

.footer__col--about svg {
    width: auto;
    height: 8rem;
    margin-bottom: 2.1rem;
}

.footer__col--links h2,
.footer__col--newsletter h2 {
    height: 8rem;
    margin-bottom: 2.5rem;
    display: inline-flex;
    align-items: flex-end;
}

.footer__col--links a:not(.button) {
    background-image: linear-gradient(var(--black), var(--black));
}

.footer__col--links ul li {
    padding-left: 0;
}

    .footer__col--links ul li:before {
        content: none;
    }

.footer__col--newsletter .form {
    display: flex;
    flex-flow: row;
    gap: 2rem;
}

.footer__col--newsletter .form__group {
    width: 100%;
}

    .footer__col--newsletter .form__group:last-of-type {
        width: 5.7rem;
    }

.footer__logos {
    margin: 2.5rem;
    padding: 2.5rem 0;
    border-top: .1rem solid var(--grey);
    border-bottom: .1rem solid var(--grey);
    display: flex;
    justify-content: space-between;
}

.footer__socials {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .footer__socials p {
        margin-right: 1rem;
    }

    .footer__socials svg path {
        fill: var(--beige);
    }

@media (pointer: fine) {
    .footer__socials a svg, .footer__socials a svg path {
        transition: var(--transition-default);
    }

    .footer__socials a:hover svg {
        transform: scale(1.2);
    }

        .footer__socials a:hover svg path {
            fill: var(--white);
        }
}

.footer__payments ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.footer__sublinks ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    font-size: var(--fontsize-body-xs);
}