/*=========================================
FOOTER
=========================================*/
.site-footer{
    background:

        var(--color-background-foot);

    backdrop-filter:

        blur(var(--footer-blur));

    -webkit-backdrop-filter:

        blur(var(--footer-blur));

    border-top:1px solid var(--glass-highlight);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft),
        inset 0 1px 0 var(--glass-bg-strong);

    margin-top:calc(var(--space-upperxl) - 35px);

}

.footer-top{

    display:grid;

    grid-template-columns:

        repeat(

            auto-fit,

            minmax(220px,1fr)

        );
    gap: var(--space-2xl);

    padding:

        var(--space-3xl)

        8%;


}
/*=========================================
FOOTER BRAND
=========================================*/

.footer-brand{

    display:flex;

    flex-direction:column;
    
    gap:var(--space-md);
}

.footer-brand img{

    width:150px;

    height:150px;
    margin: auto;
    object-fit:contain;

}

.footer-brand h3{

    color:var(--color-text);

    font-size:var(--text-large);

}

.footer-brand p{

    color:var(--color-text-dark);
    font-size: var(--text-body);
    line-height:var(--leading-body);

}

.footer-nav,

.footer-social,

.footer-contact{

    display:flex;

    flex-direction:column;

    gap:var(--space-md);

}

.footer-nav h4,

.footer-social h4,

.footer-contact h4{

    color:var(--color-text);

    font-size:var(--text-body);

    margin-bottom:var(--space-sm);

}

/*=========================================
FOOTER LISTS
=========================================*/

.footer-nav ul,
.footer-social ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:var(--space-md);
}

.footer-nav a,
.footer-social a,
.footer-contact a{

    position:relative;

    width:fit-content;

    text-decoration:none;

    color:var(--color-text-dark);

    transition:

        color var(--motion-normal),

        transform var(--motion-normal);

}

.footer-nav a::after,
.footer-social a::after,
.footer-contact a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-3px;

    width:0;

    height:1px;

    background:var(--color-primary-hover);

    transition:

        width var(--motion-upperslow);

}

.footer-nav a:hover,
.footer-social a:hover,
.footer-contact a:hover{

    color:var(--color-text);

    transform:

        translateX(4px);

}

.footer-nav a:hover::after,
.footer-social a:hover::after,
.footer-contact a:hover::after{

    width:100%;

}
.footer-contact address{
    font-size: var(--text-large);
}


/*=========================================
FOOTER BOTTOM
=========================================*/

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:var(--space-xl) 8%;

    border-top:

        2px solid

        var(--glass-bg-strong);

}

.footer-bottom p{

    color:var(--color-text-dark);

    font-size:var(--text-body);

}

.footer-bottom p:last-child{

    opacity:.8;

}