/* ==========================================================
   CTA
========================================================== */

.cta{

    background:#fff;

}

.cta-box{

    background:linear-gradient(
        135deg,
        #037FFC,
        #005FD1
    );

    border-radius:30px;

    padding:80px;

    color:#fff;

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

    box-shadow:var(--shadow-lg);

}

.cta-content{

    flex:1;

}

.cta-content h2{

    font-size:48px;

    margin:20px 0;

    color:#fff;

}

.cta-content p{

    font-size:18px;

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

    max-width:650px;

    line-height:1.8;

}

.cta-buttons{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.cta .btn-primary{

    background:#fff;

    color:var(--primary);

}

.cta .btn-primary:hover{

    background:#F5F5F5;

}

.cta .btn-outline{

    border:2px solid #fff;

    color:#fff;

}

.cta .btn-outline:hover{

    background:#fff;

    color:var(--primary);

}
/* ==========================================================
   CONTACT INFORMATION
========================================================== */

.contact-information{

    background:#fff;

}

.contact-info{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

.contact-details p{

    margin-bottom:40px;

    line-height:1.9;

    color:var(--text-light);

}

.contact-item{

    display:flex;

    align-items:flex-start;

    gap:20px;

    margin-bottom:28px;

}

.contact-item:last-child{

    margin-bottom:0;

}

.contact-item i{

    width:56px;

    height:56px;

    border-radius:14px;

    background:var(--primary);

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:20px;

    flex-shrink:0;

}

.contact-item h4{

    font-size:18px;

    margin-bottom:6px;

    color:var(--dark);

}

.contact-item p{

    margin:0;

    color:var(--text-light);

    line-height:1.8;

}

.contact-image img{

    width:100%;

    border-radius:24px;

    display:block;

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

}
/* ==========================================================
   CONTACT FORM
========================================================== */

.contact-form{

    max-width:900px;

    margin:60px auto 0;

    display:flex;

    flex-direction:column;

    gap:25px;

}

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

.contact-form .grid-2{

    display:grid;

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

    gap:25px;

}

/* ===========================
   INPUTS
=========================== */

.contact-form input,
.contact-form textarea{

    width:100%;

    padding:18px 20px;

    border:1px solid #dbe4ee;

    border-radius:14px;

    background:#fff;

    font-size:16px;

    font-family:inherit;

    color:var(--dark);

    transition:.3s;

}

.contact-form textarea{

    resize:vertical;

    min-height:180px;

}

/* ===========================
   FOCUS
=========================== */

.contact-form input:focus,
.contact-form textarea:focus{

    outline:none;

    border-color:var(--primary);

    box-shadow:0 0 0 4px rgba(3,127,252,.12);

}

/* ===========================
   PLACEHOLDER
=========================== */

.contact-form input::placeholder,
.contact-form textarea::placeholder{

    color:#98a6b8;

}

/* ===========================
   BUTTON
=========================== */

.contact-form button{

    align-self:flex-start;

    min-width:220px;

}