/* HERO */

.faq-hero{
    height:750px;
    background:url('../images/faqhero.webp') center center/cover no-repeat;
}

/* FAQ SECTION */

.faq-section{
    padding:20px 0;
    background:#f8fbff;
}

.faq-wrapper{
    max-width:950px;
    margin:auto;
}

.section-badge{
    display:inline-block;
    padding:10px 22px;
    background:#eaf6ff;
    color:#0077C8;
    border-radius:50px;
    font-size:13px;
    font-weight:600;
    letter-spacing:2px;
    margin-bottom:20px;
}

.section-heading h1{
    font-size:58px;
    color:#003B73;
    margin-bottom:20px;
    font-weight:700;
}

.section-heading p{
    color:#6d7d8b;
    max-width:700px;
    margin:auto;
    line-height:1.9;
}

/* ACCORDION */

.accordion-item{
    border:none;
    margin-bottom:20px;
    border-radius:25px !important;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,119,200,.06);
}

.accordion-button{
    background:#fff;
    color:#003B73;
    font-size:18px;
    font-weight:600;
    padding:28px;
    box-shadow:none !important;
}

.accordion-button:not(.collapsed){
    background:#fff;
    color:#0077C8;
}

.accordion-body{
    padding:0 28px 28px;
    color:#6d7d8b;
    line-height:1.9;
}

.accordion-button::after{
    width:42px;
    height:42px;
    border-radius:50%;
    background:#eaf6ff;
    display:flex;
    align-items:center;
    justify-content:center;
}

/* CTA */

.faq-cta{
    padding:10px 0;
    background:#fff;
}

.cta-box{
    text-align:center;
    padding:70px;
    border-radius:35px;
    background:linear-gradient(135deg,#003B73,#0077C8);
    color:#fff;
}

.cta-box h2{
    font-size:52px;
    margin-bottom:15px;
}

.cta-box p{
    max-width:650px;
    margin:auto;
    opacity:.9;
}

.cta-btn{
    display:inline-block;
    margin-top:25px;
    padding:15px 35px;
    border-radius:50px;
    background:#F5A623;
    color:#fff;
    font-weight:600;
}

.cta-btn:hover{
    color:#fff;
}

@media(max-width:991px){

    .section-heading h2{
        font-size:42px;
    }

    .cta-box{
        padding:40px 25px;
    }

    .cta-box h2{
        font-size:36px;
    }

}


/* ==========================================
   MOBILE FAQ PAGE
========================================== */

@media (max-width: 991px){

    /* Fix navbar overlap */
    .faq-hero{
        margin-top:100px;
        height:250px;
        background-position:center center;
    }

    .faq-section{
        padding:15px 0;
    }

    .section-heading{
        margin-bottom:25px;
    }

    .section-heading h2{
        font-size:34px;
        line-height:1.2;
        margin-bottom:12px;
    }

    .section-heading p{
        font-size:15px;
        line-height:1.7;
    }

    .section-badge{
        font-size:11px;
        padding:8px 16px;
        letter-spacing:1px;
        margin-bottom:15px;
    }

    /* Accordion */
    .accordion-item{
        margin-bottom:12px;
        border-radius:16px !important;
    }

    .accordion-button{
        padding:18px;
        font-size:15px;
        line-height:1.5;
    }

    .accordion-body{
        padding:0 18px 18px;
        font-size:14px;
        line-height:1.7;
    }

    .accordion-button::after{
        width:32px;
        height:32px;
        background-size:14px;
    }

    /* CTA */
    .faq-cta{
        padding:15px 0;
    }

    .cta-box{
        padding:30px 20px;
        border-radius:20px;
    }

    .cta-box h2{
        font-size:30px;
        line-height:1.2;
        margin-bottom:10px;
    }

    .cta-box p{
        font-size:15px;
        line-height:1.7;
    }

    .cta-btn{
        margin-top:18px;
        padding:12px 24px;
        font-size:14px;
    }
}

/* Small Mobile Devices */

@media (max-width:576px){

    .faq-hero{
        height:180px;
        margin-top:100px;
    }

    .section-heading h2{
        font-size:28px;
    }

    .section-heading p{
        font-size:14px;
    }

    .accordion-button{
        padding:16px;
        font-size:14px;
    }

    .accordion-body{
        padding:0 16px 16px;
        font-size:13px;
    }

    .cta-box{
        padding:25px 15px;
    }

    .cta-box h2{
        font-size:24px;
    }
}