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

#footer{

    background:#0f172a;
    color:#ffffff;

    padding:100px 0 40px;

    overflow:hidden;

}

#footer .container{

    max-width:1400px;
    margin:0 auto;

}

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

.footer-top{

    display:grid;
    grid-template-columns:1.2fr 1.3fr .9fr;

    gap:56px;
    align-items:start;

}

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

.footer-brand img{

    height:54px;
    width:auto;

    margin-bottom:40px;

}

.footer-brand h2{

    font-size:80px;
    line-height:1.02;
    font-weight:800;

    color:#3b82f6;

    margin-bottom:36px;

}

.footer-brand p{

    max-width:500px;

    font-size:28px;
    line-height:1.8;

    color:#cbd5e1;

}

/* ========================================= */
/* CARDS */
/* ========================================= */

.footer-newsletter-card,
.footer-social-card{

    background:#111827;

    border-radius:28px;

    padding:42px;

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

}

/* ========================================= */
/* LABEL */
/* ========================================= */

.footer-label{

    display:block;

    color:#ffffff;

    font-size:18px;
    font-weight:700;

    letter-spacing:.12em;

    text-transform:uppercase;

}

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

.footer-divider{

    width:64px;
    height:5px;

    border-radius:999px;

    margin:18px 0 30px;

    background:linear-gradient(
        90deg,
        #2563eb,
        #7c3aed
    );

}

/* ========================================= */
/* NEWSLETTER */
/* ========================================= */

.footer-newsletter-card h3{

    font-size:46px;
    line-height:1.2;

    margin-bottom:22px;

}

.footer-newsletter-card p{

    font-size:22px;
    line-height:1.8;

    color:#cbd5e1;

    margin-bottom:42px;

}

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

.footer-social-card h3{

    font-size:36px;

    margin-bottom:20px;

}

.footer-social-card p{

    color:#cbd5e1;

    font-size:20px;
    line-height:1.8;

    margin-bottom:34px;

}

/* ========================================= */
/* NEWSLETTER FORM */
/* ========================================= */

.newsletter-form{

    display:flex;

    border-radius:22px;

    overflow:hidden;

    background:#1e293b;

}

.newsletter-form input{

    flex:1;

    border:none;
    outline:none;

    background:transparent;

    color:#ffffff;

    padding:26px 30px;

    font-size:20px;

}

.newsletter-form input::placeholder{

    color:#94a3b8;

}

.newsletter-form button{

    width:110px;

    border:none;

    cursor:pointer;

    color:#ffffff;

    font-size:28px;

    background:linear-gradient(
        90deg,
        #2563eb,
        #7c3aed
    );

    transition:.3s;

}

.newsletter-form button:hover{

    filter:brightness(1.08);

}

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

.social-icons{

    display:flex;

    gap:18px;

    flex-wrap:wrap;

}

.social-icons a{

    width:72px;
    height:72px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:22px;

    background:#1e293b;

    color:#ffffff;

    text-decoration:none;

    font-size:28px;

    transition:.3s;

}

.social-icons a:hover{

    background:linear-gradient(
        90deg,
        #2563eb,
        #7c3aed
    );

    transform:translateY(-4px);

}

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

.footer-line{

    height:1px;

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

    margin:70px 0 40px;

}

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

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:30px;

    flex-wrap:wrap;

}

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

.footer-copyright{

    color:#94a3b8;

    font-size:18px;

}

/* ========================================= */
/* BENEFITS */
/* ========================================= */

.footer-benefits{

    display:flex;

    gap:42px;

    flex-wrap:wrap;

}

.benefit-item{

    display:flex;

    align-items:center;

    gap:12px;

    color:#cbd5e1;

    font-size:18px;

}

.benefit-item i{

    color:#3b82f6;

    font-size:20px;

}

/* ========================================= */
/* LANGUAGE */
/* ========================================= */

.footer-language{

    display:flex;

    align-items:center;

    gap:12px;

    color:#cbd5e1;

    font-size:18px;

    cursor:pointer;

}

.footer-language i:first-child{

    color:#3b82f6;

}

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

@media (max-width:1200px){

    .footer-top{

        grid-template-columns:1fr;

    }

    .footer-brand{

        text-align:center;

    }

    .footer-brand p{

        margin:auto;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

    .footer-benefits{

        justify-content:center;

    }

}

@media (max-width:768px){

    #footer{

        padding:80px 0 40px;

    }

    .footer-brand h2{

        font-size:46px;

    }

    .footer-brand p{

        font-size:20px;

    }

    .footer-newsletter-card h3{

        font-size:34px;

    }

    .newsletter-form{

        flex-direction:column;

    }

    .newsletter-form button{

        width:100%;
        height:72px;

    }

    .social-icons{

        justify-content:center;

    }

}