* {
    margin: 0;
    padding: 0;
}

/* 
####
FOOTER
####
*/
footer {
    background-color: var(--bg-color);
    height: 28rem;
}

footer>div {
    width: var(--width-index);
    display: flex;
    flex-direction: column;
    max-width: 1000px;
}

.footer-content {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #0E5673;
    height: 90%;
}


.footer-content>div {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.footer-logo {
    display: flex;
    align-items: center;
    width: 50%;
}

footer .div-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
}

footer .div-content>div {
    width: 45%;
}

.footer-content h4,
.footer-content a,
.footer-content p {
    font-size: 11px;
    color: var(--txt-color-1);
}

.footer-content h4 {
    font-weight: 700;
}

.footer-content p {
    margin: 0;
}

.footer-content a {
    text-decoration: none;
}

.footer-servicio div,
.footer-contacto div {
    margin: 1.2rem 0 2rem 0;
    display: flex;
    flex-direction: column;
    gap: .4rem;
    line-height: var(--txt-lh);
}

.footer-content img {
    object-fit: contain;
}

.footer-content .reclamo-img a {
    font-weight: 700;
}



.footer-content .reclamo-img>div {
    width: max-content;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: .4rem;
}

.footer-content .footer-proveedor {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.footer-content .footer-proveedor a {
    margin-top: .5rem;
}

.footer-copy {
    font-size: 11px;
    color: var(--txt-color-1);
    height: 10%;
    align-content: center;
}

.footer-copy p{
    margin: 0;
}


/* 
####
DARK MODE
####
*/
.dark-mode footer{
    background-color: var(--bg-dm-2);
    border-top: 1px solid var(--bg-dm-1);
}

.dark-mode footer .footer-content{
    border-bottom: 1px solid var(--bg-dm-1);
}


/* 
####
RESPONSIVE
####
*/
@media screen and (max-width: 768px) {
    footer {
        height: auto;
    }

    footer>div {
        width: 80%;
        margin: 4rem 0 0 0;
    }

    .footer-logo {
        width: 100%;
    }

    .footer-content,
    .footer-copy {
        height: auto;
    }

    .footer-content>div {
        flex-direction: column;
        gap: 2rem;
    }

    footer .div-content {
        flex-direction: column;
        gap: 1.5rem;
        align-items: start;
    }

    footer .div-content>div {
        width: auto;
    }

    footer .div-content .footer-servicio,
    footer .div-content .footer-contacto,
    footer .div-content .footer-proveedor {
        width: 100%;
        border-bottom: 1px solid var(--bg-color-border);
        text-align: start;
    }

    .footer-content p,
    .footer-content h4 {
        margin: 0;
    }

    .footer-servicio div,
    .footer-contacto div {
        margin-bottom: .8rem;
    }

    .footer-copy p {
        margin: 1.2rem 0;
    }

    .footer-servicio {
        order: 1;
    }

    .footer-contacto {
        order: 2;
    }

    footer .div-content .reclamo-img {
        width: 100%;
        order: 4;
        display: flex;
        flex-direction: column;
        gap: 1.2rem;
        border: 0;
        border-bottom: 1px solid var(--bg-color-border);
    }

    .reclamo-img>div {
        margin: 1.2rem 0 2rem 0;
    }

    .footer-content .reclamo-img img {
        width: 100%;
    }

    .footer-proveedor {
        order: 3;
    }

    .footer-proveedor a {
        margin: 1.2rem 0 .8rem 0;
    }

}