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

.site-footer{

    position:relative;

    padding:80px 0 0;

    background:#0b1120;

    color:#94a3b8;

    overflow:hidden;

}

.site-footer .container{

    position:relative;

}

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

.footer-grid{

    display:grid;

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

    gap:50px;

    padding-bottom:60px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

/*======================================
            FOOTER LOGO / ABOUT
======================================*/

.footer-logo{

    font-size:26px;

    font-weight:800;

    color:#ffffff;

    margin-bottom:18px;

}

.footer-logo span{

    color:#3b82f6;

}

.footer-col p{

    font-size:15px;

    line-height:26px;

    color:#94a3b8;

    margin-bottom:22px;

    max-width:320px;

}

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

.footer-socials{

    display:flex;

    gap:14px;

}

.footer-socials a{

    width:40px;

    height:40px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:rgba(255,255,255,.06);

    color:#e2e8f0;

    font-size:16px;

    transition:.3s;

}

.footer-socials a:hover{

    background:linear-gradient(135deg,#2563eb,#3b82f6);

    color:#ffffff;

    transform:translateY(-4px);

}

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

.footer-col h4{

    color:#ffffff;

    font-size:17px;

    font-weight:700;

    margin-bottom:22px;

}

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

.footer-links{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-links li{

    margin-bottom:14px;

}

.footer-links a{

    color:#94a3b8;

    font-size:15px;

    text-decoration:none;

    transition:.3s;

    position:relative;

}

.footer-links a:hover{

    color:#3b82f6;

    padding-left:6px;

}

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

.footer-contact{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-contact li{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:16px;

    font-size:15px;

    color:#94a3b8;

}

.footer-contact i{

    width:36px;

    height:36px;

    flex-shrink:0;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:rgba(37,99,235,.15);

    color:#3b82f6;

    font-size:14px;

}

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

.footer-bottom{

    padding:28px 0;

    text-align:center;

}

.footer-bottom p{

    font-size:14px;

    color:#64748b;

    margin:0;

}

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

@media(max-width:992px){

.footer-grid{

    grid-template-columns:1fr 1fr;

    gap:40px;

}

}

@media(max-width:576px){

.site-footer{

    padding:60px 0 0;

}

.footer-grid{

    grid-template-columns:1fr;

    gap:35px;

    text-align:center;

}

.footer-col p{

    max-width:100%;

    margin-left:auto;

    margin-right:auto;

}

.footer-socials{

    justify-content:center;

}

.footer-contact li{

    justify-content:center;

}

.footer-contact a{
    color:inherit;
    text-decoration:none;
    transition:.3s;
}

.footer-contact a:hover{
    color:#4f7cff;
}

.footer-socials a{
    transition:.3s;
}

.footer-socials a:hover{
    transform:translateY(-3px);
}

}