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

.footer{

    background:
    linear-gradient(
        135deg,
        #020617 0%,
        #0f172a 35%,
        #111827 70%,
        #065f46 100%
    );

    color:white;

    position:relative;

    overflow:hidden;

    padding:
    80px
    20px
    30px;

}

.footer::before{

    content:"";

    position:absolute;

    top:-150px;

    right:-150px;

    width:350px;

    height:350px;

    border-radius:50%;

    background:
    rgba(
        16,
        185,
        129,
        .08
    );

    filter:
    blur(80px);

    pointer-events:none;

}

.footer-container{

    max-width:1200px;

    margin:0 auto;

    display:grid;

    grid-template-columns:
    repeat(
        auto-fit,
        minmax(
            250px,
            1fr
        )
    );

    gap:40px;

    position:relative;

    z-index:2;

}

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

.footer-brand img{

    width:80px;

    margin-bottom:18px;

    filter:
    drop-shadow(
        0 0 15px rgba(
            255,
            255,
            255,
            .20
        )
    );

    transition:
    all .3s ease;

}

.footer-brand img:hover{

    transform:
    scale(1.05);

}

.footer-brand h3{

    font-size:1.3rem;

    font-weight:700;

    margin-bottom:12px;

}

.footer-brand p{

    line-height:1.9;

    opacity:.85;

}

/* ======================================
   TITLE
====================================== */

.footer h4{

    color:white;

    font-size:1.1rem;

    margin-bottom:18px;

    position:relative;

}

.footer h4::after{

    content:"";

    display:block;

    width:45px;

    height:3px;

    border-radius:999px;

    margin-top:8px;

    background:#10b981;

}

/* ======================================
   INFO
====================================== */

.footer-info p{

    margin-bottom:12px;

    opacity:.85;

    line-height:1.8;

}

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

.social-icons{

    display:flex;

    gap:15px;

    margin-top:15px;

}

.social-icons a{

    width:48px;

    height:48px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

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

    transition:
    all .3s ease;

    font-size:20px;

}

.social-icons a:hover{

    transform:
    translateY(-6px)
    scale(1.1);

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

    box-shadow:
    0 15px 35px rgba(
        16,
        185,
        129,
        .35
    );

}

.social-icons i{

    color:white;

}

/* ======================================
   MAP FULL WIDTH
====================================== */

.footer-map-full{

    max-width:1200px;

    margin:
    60px auto 0;

    position:relative;

    z-index:2;

}

.footer-map-full h4{

    color:white;

    margin-bottom:18px;

}

.footer-map-full iframe{

    width:100%;

    height:400px;

    border:none;

    border-radius:28px;

    overflow:hidden;

    box-shadow:
    0 20px 50px rgba(
        0,
        0,
        0,
        .35
    );

}

/* ======================================
   COPYRIGHT
====================================== */

.footer-copy{

    max-width:1200px;

    margin:
    50px auto 0;

    padding-top:25px;

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

    text-align:center;

    opacity:.65;

    font-size:.9rem;

    letter-spacing:.5px;

    position:relative;

    z-index:2;

}

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

@media(
max-width:768px
){

    .footer{

        text-align:center;

    }

    .footer-brand img{

        margin:
        0 auto 18px;

    }

    .footer h4::after{

        margin:
        8px auto 0;

    }

    .social-icons{

        justify-content:center;

    }

    .footer-map-full{

        margin-top:40px;

    }

    .footer-map-full iframe{

        height:280px;

        border-radius:20px;

    }

}

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

.footer-brand,
.footer-info,
.footer-social,
.footer-map-full{

    transition:
    all .3s ease;

}