/*==========================================================
Section : Footer
Version : 2.0
Author  : Erwin Echon
==========================================================*/
.footer{

    position:relative;

    padding:90px 0 35px;

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

    background:
        linear-gradient(
            180deg,
            #08111f 0%,
            #071a34 45%,
            #002dac 100%);

    overflow:hidden;

}

/*==========================================================
BACKGROUND EFFECT
==========================================================*/

.footer::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(4,120,99,.22),
            transparent 72%);

}

.footer::after{

    content:"";

    position:absolute;

    left:-160px;

    bottom:-220px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(255,255,255,.05),
            transparent 72%);

}

/*==========================================================
CONTENT
==========================================================*/

.footer .container-xl{

    position:relative;

    z-index:2;

}

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

.footer-top{

    padding-bottom:4rem;

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

}

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

.footer-logo{

    display:inline-flex;

    margin-bottom:2rem;

}

.footer-logo img{

    height:50px;

}

/*==========================================================
TAGLINE
==========================================================*/

.footer-tagline{

    margin-bottom:1.25rem;

    font-size:2rem;

    font-weight:800;

    line-height:1.2;

    color:#fff;

}

.footer-tagline span{

    display:block;

    color:var(--mbi-secondary);

}

/*==========================================================
DESCRIPTION
==========================================================*/

.footer-description{

    max-width:360px;

    margin-bottom:2rem;

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

    line-height:1.9;

}

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

.footer-social{

    display:flex;

    gap:14px;

}

.footer-social a{

    text-decoration:none;

}

.footer-social .mbi-icon-box{

    width:54px;

    height:54px;

    margin:0;

    border-radius:18px;

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

    border:1px solid rgba(255,255,255,.10);

    color:#fff;

}

.footer-social .mbi-icon-box i{

    color:#fff;

    font-size:1.3rem;

}

.footer-social a:hover .mbi-icon-box{

    background:

        linear-gradient(
            135deg,
            var(--mbi-primary),
            var(--mbi-secondary));

}

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

.footer h4{

    margin-bottom:1.75rem;

    font-size:.95rem;

    font-weight:700;

    letter-spacing:.12em;

    text-transform:uppercase;

    color:#fff;

}

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

.footer ul{

    margin:0;

    padding:0;

    list-style:none;

}

.footer li{

    margin-bottom:1rem;

}

.footer a{

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

    text-decoration:none;

    transition:var(--mbi-transition);

}

.footer ul a:hover{

    color:#fff;

    padding-left:8px;

}

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

.footer-contact{

    display:flex;

    flex-direction:column;

    gap:1.5rem;

}

.footer-contact-item{

    display:flex;

    gap:1rem;

    align-items:flex-start;

}

.footer-contact-item .mbi-icon-box{

    width:54px;

    height:54px;

    margin:0;

    flex-shrink:0;

    border-radius:18px;

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

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

}

.footer-contact-item .mbi-icon-box i{

    color:#fff;

    font-size:1.2rem;

}

.footer-contact-item a{

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

}

.footer-contact-item a:hover{

    color:#fff;

}

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

.footer-bottom{

    padding-top:2.5rem;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:2rem;

}

.footer-copyright{

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

}

.footer-links{

    display:flex;

    gap:2rem;

}

.footer-links a{

    font-size:.95rem;

}