/*==================================================
SECTION 9 : FINAL CTA
==================================================*/

.final-cta-section{

    position:relative;

    overflow:hidden;

    padding:72px 0;

    background:
        radial-gradient(circle at 78% 48%,
        rgba(56,189,248,.18) 0%,
        rgba(56,189,248,0) 42%),

        linear-gradient(
        90deg,
        #071B4D 0%,
        #0B356A 45%,
        #0E497C 100%);

}


/*==================================================
LAYOUT
==================================================*/

.final-cta-wrapper{

    display:grid;

    grid-template-columns:46% 54%;

    align-items:center;

    gap:40px;

}


/*==================================================
LEFT
==================================================*/

.final-cta-content{

    color:#fff;

}


.final-cta-content h2{

    font-family:Oswald,sans-serif;

    font-size:3rem;

    line-height:1.15;

    font-weight:600;

    color:#fff;

    margin-bottom:28px;

}


.cta-intro{

    font-size:1.18rem;

    line-height:1.9;

    color:#EEF6FF;

    margin-bottom:18px;

}


.final-cta-content p{

    color:#D8E7FF;

    line-height:1.9;

    margin-bottom:0;

}


/*==================================================
BUTTONS
==================================================*/

.cta-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:14px;

    margin-top:38px;

}


.cta-buttons .btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    padding:18px 30px;

    border-radius:14px;

    text-decoration:none;

    font-weight:600;

    transition:.35s ease;

}


.btn-icon{
 
    width:36px;
 
    height:36px;
 
    object-fit:contain;
 
    display:block;
 
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.18));
 
    transform:translateY(-1px);
 
}


.btn-primary{
 
    background:var(--accent);
 
    color:#fff;
 
    border:2px solid var(--accent);
 
    box-shadow:0 12px 28px rgba(214,40,40,.28);
 
}


.btn-primary:hover{
 
    transform:translateY(-4px);
 
    background:var(--accent-dark);
 
}


.btn-outline-light{

    color:#fff;

    border:2px solid rgba(255,255,255,.35);

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

    backdrop-filter:blur(8px);

}


.btn-outline-light:hover{

    transform:translateY(-4px);

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

}


/*==================================================
IMAGE
==================================================*/

.final-cta-image{

    position:relative;

    display:flex;

    justify-content:center;

    align-items:center;

}


.final-cta-image::before{

    content:"";

    position:absolute;

    width:620px;

    height:620px;

    border-radius:50%;

    background:

        radial-gradient(circle,
        rgba(59,130,246,.28),
        rgba(59,130,246,0) 70%);

    z-index:0;

}


.final-cta-image img{

    position:relative;

    width:115%;

    max-width:760px;

    height:auto;

    display:block;

    z-index:2;

    border-radius:16px;

}

/* ==========================================
   FOOTER CTA BUTTON
========================================== */

.footer-cta-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:18px;

    padding:18px 34px;

    background:var(--accent);
    color:#ffffff;

    text-decoration:none;

    border-radius:14px;

    font-weight:700;
    font-size:1rem;

    transition:.3s ease;

    box-shadow:0 12px 28px rgba(214,40,40,.24);
}

.footer-cta-btn:hover{

    transform:translateY(-3px);

    background:var(--accent-dark);

    box-shadow:0 18px 36px rgba(183,28,28,.3);

}

.footer-btn-icon{
 
    width:36px;
    height:36px;

    flex-shrink:0;

    display:block;

    filter: drop-shadow(0 5px 10px rgba(0,0,0,.18));

}

.footer-btn-arrow{

    width:20px;
    height:20px;

    flex-shrink:0;

    transition:.3s;

}

.footer-cta-btn:hover .footer-btn-arrow{

    transform:translateX(4px);

}

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

@media(max-width:1100px){

.final-cta-wrapper{

grid-template-columns:1fr;

text-align:center;

}

.final-cta-image{

order:-1;

}

.cta-buttons{

justify-content:center;

}

.final-cta-image img{

width:100%;

}

}


@media(max-width:768px){

.final-cta-section{

padding:56px 0;

}

.final-cta-content h2{

font-size:2.4rem;

}

.cta-buttons{

flex-direction:column;

align-items:center;

}

.cta-buttons .btn{

width:100%;

max-width:330px;

}

}