footer {
    background-color: #0E0E0E;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 32px var(--side-padding);

    --slant-bg: #0E0E0E;
    margin-bottom: 0 !important;

    .logo {
        font-size: 28px;
    }

    ul {
        list-style: none;
        display: flex;
        gap: 32px;

        svg {
            height: 24px;
            fill: #ffffff80;
            color: #ffffff80;
            vertical-align: middle;
            transition: fill 0.3s, color 0.3s;
        }

        a:hover svg {
            fill: #ffffff;
            color: #ffffff;
        }
    }

    @media screen and (max-width: 850px) {
        padding: 24px;
    }
}

footer::after { height: 0 !important; }
