/* ======================================================
   SEAN B SOLUTIONS
   PROFESSIONAL FOOTER SYSTEM
====================================================== */


.saas-footer{

    background:
    linear-gradient(
        135deg,
        #071426,
        var(--primary)
    );

    color:#fff;

    padding:70px 0 25px;

    position:relative;

    overflow:hidden;

}



/* CONTAINER */

.saas-footer .container{

    width:90%;

    max-width:1300px;

    margin:auto;

}




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


.footer-top{

    display:grid;

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

    gap:45px;

    align-items:start;

}



/* ======================================================
   COLUMNS
====================================================== */


.footer-column{

    color:#fff;

}



.footer-logo{

    font-size:30px;

    font-weight:800;

    margin-bottom:18px;

    color:#fff;

}



.footer-logo span{

    color:var(--secondary);

}



.footer-column p{

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

    font-size:15px;

    line-height:1.8;

}



.footer-column h3{

    color:#fff;

    font-size:18px;

    font-weight:700;

    margin-bottom:20px;

}



.footer-column h3::after{

    content:"";

    display:block;

    width:30px;

    height:3px;

    background:var(--secondary);

    margin-top:8px;

}




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


.footer-column ul{

    list-style:none;

    padding:0;

    margin:0;

}



.footer-column li{

    margin-bottom:12px;

}



.footer-column a{

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

    text-decoration:none;

    font-size:15px;

    transition:.3s ease;

}



.footer-column a:hover{

    color:#fff;

    padding-left:5px;

}





/* ======================================================
   CERTIFICATE
====================================================== */


.footer-cert{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:25px;

    color:#fff;

    font-size:14px;

}



.footer-cert i{

    color:var(--secondary);

    font-size:22px;

}





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


.footer-contact-item{

    display:flex;

    align-items:flex-start;

    gap:12px;

    margin-bottom:15px;

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

    font-size:15px;

}



.footer-contact-item i{

    color:var(--secondary);

    margin-top:4px;

}






/* ======================================================
   DIVIDER
====================================================== */


.footer-divider{

    border:none;

    height:1px;

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

    margin:45px 0 25px;

}






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


.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    flex-wrap:wrap;

}



.footer-bottom p{

    margin:0;

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

    font-size:14px;

}



.footer-bottom-links{

    display:flex;

    gap:20px;

}



.footer-bottom-links a{

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

    font-size:14px;

}





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


.footer-socials{

    display:flex;

    gap:12px;

}



.footer-socials a{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

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

    color:#fff;

    transition:.3s;

}



.footer-socials a:hover{

    background:var(--secondary);

    transform:translateY(-4px);

}






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


.whatsapp-float{

    position:fixed;

    right:25px;

    bottom:25px;

    width:58px;

    height:58px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#25d366;

    color:white;

    font-size:30px;

    z-index:999;

    box-shadow:
    0 10px 25px rgba(0,0,0,.25);

}





/* ======================================================
   TABLET
====================================================== */


@media(max-width:992px){


.footer-top{

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

}



.footer-bottom{

    flex-direction:column;

    text-align:center;

}


}







/* ======================================================
   MOBILE
====================================================== */


@media(max-width:600px){


.saas-footer{

    padding:50px 0 25px;

}



.footer-top{

    grid-template-columns:1fr;

    gap:35px;

}



.footer-column{

    text-align:center;

}



.footer-column h3::after{

    margin:8px auto 0;

}



.footer-logo{

    font-size:25px;

}



.footer-column p{

    max-width:350px;

    margin:auto;

}



.footer-cert{

    justify-content:center;

}



.footer-contact-item{

    justify-content:center;

}



.footer-bottom-links{

    flex-direction:column;

    gap:10px;

}



.footer-socials{

    justify-content:center;

}



.whatsapp-float{

    width:52px;

    height:52px;

    right:15px;

    bottom:15px;

    font-size:26px;

}


}