footer {
    background-color: var(--c10);
    color: var(--c9);
    --ffb: 100%;
    --sfb: 100%;
    --afb: 100%;
}

.footer {
    row-gap: 2rem;
    column-gap: 0.5rem;
}

.footer > div {
    flex: 1 1 var(--afb);
}

.footer > div:nth-child(1) {
    flex-basis: var(--ffb);
}

.footer > div:nth-child(2) {
    flex-basis: var(--sfb);
}

footer .tag-desc {
    text-align: justify;
}

footer .tag-desc * {
    color: var(--light-text);
}

footer .tag-desc p {
    margin-bottom: 0.5rem;
}

footer .tag-desc p:last-child {
    margin-bottom: 0;
}

footer .nav-link {
    position: relative;
    display: inline-flex;
}

footer .nav-link,
footer .nav-link * {
    color: var(--light-text);
}

footer .nav-link p {
    margin-bottom: 0;
}

footer .nav-link::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--light-text);
    transition: all ease 300ms;
}

footer .nav-link:hover::after {
    width: 100%;
}

footer .nav-link.active {
    color: var(--light-text)!important;
}

footer .copyright {
    column-gap: 2rem;
}



@media screen and (min-width: 576px) {
    footer {
        --ffb: 100%;
        --sfb: 48%;
        --afb: 48%;
    }
}

@media screen and (min-width: 768px) {
    footer {
        --ffb: 48%;
        --sfb: 48%;
        --afb: 25%;
    }
}

@media screen and (min-width: 992px) {
    footer {
        --ffb: 60%;
        --sfb: 30%;
        --afb: 30%;
    }
}

@media screen and (min-width: 1200px) {
    footer {
        --ffb: 25%;
        --sfb: 15%;
        --afb: 15%;
    }
}