.site-footer{
    position:relative;

    background-image:url('../assets/images/Logo_rodapé.png');
 background-size:cover;
background-position:center;
background-repeat:no-repeat;

    color:var(--light);

    padding:50px 0;

    overflow:hidden;
}

.site-footer::before{
    content:'';
    position:absolute;
    inset:0;

    background:rgba(5,5,5,.88);

    z-index:1;
}

.footer-surface,
.footer-grid,
.footer-bottom{
    position:relative;
    z-index:2;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;
    gap:32px;
}

.footer-column h4{
    color:var(--white);
    margin-bottom:18px;
    font-size:.92rem;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.footer-column p,
.footer-column li{
    color:var(--light);
    font-size:.95rem;
    line-height:1.9;
}

.footer-column ul{
    display:grid;
    gap:12px;
}

.footer-column a{
    color:var(--light);
    transition:.3s;
}

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

.footer-brand .site-logo{
    margin-bottom:18px;
}

.footer-socials{
    display:grid;
    gap:10px;
    margin-top:18px;
}

.footer-socials a{
    color:var(--light);
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.08);
    padding:22px 0;
    margin-top:40px;

    color:rgba(255,255,255,.55);

    text-align:center;
}

@media(max-width:992px){

    .footer-grid{
        grid-template-columns:1fr;
        gap:24px;
    }

}

.footer-brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.footer-tagline{
    font-size:.72rem;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:rgba(255,255,255,.45);
    margin-bottom:28px;
}

.footer-logo{
    width:220px;
    height:auto;
    margin-bottom:20px;
}

.footer-description{
    max-width:260px;
    color:rgba(255,255,255,.75);
    font-size:1rem;
    line-height:1.8;
}