/*====================================
FOOTER
DESKTOP
====================================*/

.footer{

    padding:3.5rem 0 2rem;

    border-top:1px solid rgba(179,138,59,.20);

}

/*====================================
BRAND
====================================*/

.footer-brand{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    text-align:center;

    margin-bottom:2rem;

}

.footer-logo{

    display:block;

    width:260px;

    height:auto;

    margin:0 auto 1.5rem;

}

.footer-tagline{

    color:var(--color-accent);

    font-size:var(--fs-md);

    text-align:center;

    margin:0;

}

/*====================================
CONTACT
====================================*/

.footer-contact{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:1.5rem;

    margin:0 auto 2.5rem;

}

.footer-contact a,

.footer-contact span{

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

    text-decoration:none;

    transition:color .3s ease;

}

.footer-contact a:hover{

    color:var(--color-accent);

}

/*====================================
SOCIAL
====================================*/

.footer-social{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:1rem;

    margin-bottom:3rem;

}

.footer-social a{

    display:flex;

    justify-content:center;

    align-items:center;

    width:46px;

    height:46px;

    border:1px solid rgba(179,138,59,.25);

    border-radius:50%;

    transition:

        border-color .3s ease,

        transform .3s ease;

}

.footer-social a:hover{

    border-color:var(--color-accent);

    transform:translateY(-3px);

}

.footer-social img{

    width:20px;

    height:20px;

    opacity:.75;

    transition:opacity .3s ease;

}

.footer-social a:hover img{

    opacity:1;

}

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

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:2rem;

    padding-top:1.5rem;

    border-top:1px solid rgba(179,138,59,.20);

}

.footer-links{

    display:flex;

    align-items:center;

    gap:1rem;

}

.footer-links a{

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

    text-decoration:none;

    transition:color .3s ease;

}

.footer-links a:hover{

    color:var(--color-accent);

}

.footer-bottom p{

    margin:0;

    font-size:var(--fs-sm);

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

}
/*====================================
FOOTER
MOBILE
====================================*/

@media (max-width:768px){

    .footer{

        padding:2.5rem 0 1.5rem;

    }

    .footer-brand{

        margin-bottom:1.5rem;

    }

    .footer-logo{

        width:200px;

        margin-bottom:1rem;

    }

    .footer-tagline{

        margin:0;

        margin-bottom:2rem;

        font-size:.95rem;

    }

    .footer-contact{

        display:flex;

        flex-direction:column;

        justify-content:center;

        align-items:center;

        gap:.75rem;

        margin-bottom:2rem;

        text-align:center;

    }

    .footer-contact a,

    .footer-contact span{

        font-size:.78rem;

        line-height:1.4;

        white-space:normal;

    }

    .footer-social{

        gap:.9rem;

        margin-bottom:2rem;

    }

    .footer-social a{

        width:42px;

        height:42px;

        margin-bottom:0;

    }

    .footer-social img{

        width:18px;

        height:18px;

    }

    .footer-bottom{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:1.25rem;

        padding-top:1.5rem;

        text-align:center;

    }

    .footer-links{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:.6rem;

    }

    .footer-links span{

        display:none;

    }

    .footer-links a{

        font-size:.88rem;

    }

    .footer-bottom p{

        max-width:30ch;

        margin:0 auto;

        font-size:.8rem;

        line-height:1.5;

    }

}