/*=========================================================
ESBC 2.0
FOOTER.CSS
=========================================================*/

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

.footer{
    background:linear-gradient(135deg, #2f2529 0%, #1f171a 45%, #3a2d32 100%);
    position:relative;
    overflow:hidden;
    padding:90px 0 0;
    border-top:1px solid rgba(214,184,112,.16);
}

/*=========================================
TOP
=========================================*/

.footer-top,
.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1.2fr;

    gap:50px;

    padding-bottom:60px;

}

.footer-column{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.footer-column ul{

    display:flex;

    flex-direction:column;

    gap:12px;

    padding:0;

    margin:0;

}

.footer-column ul li{
    color:var(--heading);
}

.footer-column li a{
    color:var(--heading);
}

/*=========================================
LOGO
=========================================*/

.footer-logo{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:20px;

}

.footer-logo img{

    width:60px;

    height:60px;

    object-fit:contain;

}

.footer-logo h3{

    margin:0;

    color:var(--heading);

}

.footer-about p{

    margin-bottom:25px;

    line-height:1.8;

}

/*=========================================
HEADINGS
=========================================*/

.footer h4{

    margin-bottom:25px;

    color:var(--heading);

}

/*=========================================
LINKS
=========================================*/

.footer-links{

    display:flex;

    flex-direction:column;

    gap:14px;

}

.footer-links a{
    color:var(--heading);
    transition:var(--transition);
}

.footer-links a:hover{

    color:var(--accent);

    padding-left:8px;

}

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

.footer-contact{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.footer-contact div{

    display:flex;

    align-items:flex-start;

    gap:15px;

}

.footer-contact i{

    width:42px;

    height:42px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:12px;

    background:rgba(214,184,112,.12);

    color:var(--accent);

    flex-shrink:0;

}

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

.footer-social{
    display:flex;
    gap:14px;
    margin-top:25px;
}

.footer-social a{
    width:48px;
    height:48px;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    color:var(--heading);
    border:1px solid rgba(214,184,112,.2);
    transition:var(--transition);
}

.footer-social a:hover{
    background:var(--accent);
    color:var(--bg-color);
    transform:translateY(-6px);
    box-shadow:0 10px 20px rgba(214,184,112,.2);
}

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

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
    padding:28px 0;
    background:rgba(255,255,255,.03);

}

.footer-bottom-content{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:20px;

    flex-wrap:wrap;

    text-align:center;

}

.footer-bottom p{

    width:100%;

}

.footer-bottom-links{

    display:flex;

    flex-wrap:wrap;

    gap:16px;

}

.footer-bottom p{
    font-size:.95rem;
    margin:0;
    color:var(--heading);
}

.footer-bottom-links{

    display:flex;

    gap:25px;

}

.footer-bottom-links a{
    color:var(--heading);
    transition:var(--transition);
}

.footer-bottom-links a:hover{

    color:var(--accent);

}

/*=========================================
WHATSAPP
=========================================*/

.whatsapp-float{

    position:fixed;

    right:25px;

    bottom:25px;

    width:62px;

    height:62px;

    border-radius:50%;

    background:#25D366;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:1.8rem;

    box-shadow:var(--shadow-lg);

    z-index:999;

    transition:var(--transition);

}

.whatsapp-float:hover{

    transform:scale(1.08);

}

/*=========================================
SCROLL TO TOP
=========================================*/

.scroll-top{

    position:fixed;

    left:25px;

    bottom:25px;

    width:58px;

    height:58px;

    border:none;

    border-radius:50%;

    background:var(--accent);

    color:var(--bg-color);

    cursor:pointer;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:1.3rem;

    box-shadow:var(--shadow-md);

    opacity:0;

    visibility:hidden;

    transform:translateY(12px);

    transition:var(--transition), opacity .3s ease, transform .3s ease;

    z-index:999;

}

.scroll-top.show{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.scroll-top:hover{

    transform:translateY(-6px);

}

/*=========================================
RESPONSIVE
=========================================*/

@media(max-width:1200px){

.footer-top{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.footer{

padding-top:70px;

}

.footer-top{

grid-template-columns:1fr;

gap:45px;

}

.footer-bottom-content{

flex-direction:column;

text-align:center;

}

.footer-bottom-links{

flex-wrap:wrap;

justify-content:center;

}

.footer-social{

justify-content:flex-start;

}

}

@media(max-width:480px){

.footer-social{

justify-content:center;

}

.whatsapp-float{

width:54px;

height:54px;

right:15px;

bottom:15px;

}

.scroll-top{

width:50px;

height:50px;

left:15px;

bottom:15px;

}

}