.footer {
    padding-top: var(--space-l);
    padding-bottom: var(--space-l);
    margin-top: var(--space-l);
    color: var(--color-text);
    background-color: var(--color-secondary);
}

.footer:before {
    content: url('../../img/wave.svg');
    z-index: -1;
    display: block;
    position: absolute;
    bottom: 100%;
    width: 100vw;
    -webkit-animation: var(--animation-fadeIn);
    animation: var(--animation-fadeIn);
    -webkit-transform: scale(-1);
    transform: scale(-1);
}

.footer__container {
    max-width: 90rem;
    margin: auto;
}

.footer .grid__column:not(:first-child) {
    margin-top: var(--space-l);
}

.footer a:hover {
    opacity: 50%;
}

.footer__logo {
    display: block;
    width: 33vw;
    width: 12.5rem;
    margin-bottom: var(--space-l);
}

@media screen and (min-width: 60rem) {
    .footer__contact * {
        text-align: right;
    }

    .footer__contact a {
        justify-content: flex-end;
    }
}

.footer__legal {
    margin-top: var(--space-l);
}

.footer__legal li {
    display: inline;
}

.footer__legal li:not(:last-child) {
    margin-right: 1.5rem;
}