/* =====================================================
   FAQ
===================================================== */

.faq-section{

    padding:120px 0;

    background:#f8f7f5;

}

.faq-container{

    width:min(96%,1400px);

    margin:auto;

}


/* =====================================================
   Header
===================================================== */

.faq-header{

    max-width:1400px;

    margin:0 auto 80px;

    text-align:center;

}


.faq-tag{

    display:inline-block;

    color:#2563eb;
    font-size:20px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;

    margin-bottom:24px;
}

.faq-header h2{

margin: 0;
    font-size: 70px;
    line-height: 1.08;
    font-weight: 800;
    color: #111827;

}

.faq-header p{

    margin-top:22px;

    font-size:28px;

    line-height:1.8;

    color:#6B7280;

}


/* =====================================================
   Editorial Layout
===================================================== */

.faq-layout{

    display:flex;

    gap:28px;

    align-items:flex-start;

}

.faq-column{

    flex:1;

    display:flex;

    flex-direction:column;

    gap:28px;

}


/* =====================================================
   Featured Column
===================================================== */

.faq-column:nth-child(2){

    flex:1.15;

}


/* =====================================================
   Card
===================================================== */

.faq-card{

    position:relative;

    overflow:hidden;

    padding:36px;

    border-radius:22px;

    background:#ffff;

    border:1px solid #ECECEC;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;

}

.faq-card:hover{

    transform:translateY(-8px);

    border-color:rgba(79,70,229,.18);

    box-shadow:
        0 20px 45px rgba(15,23,42,.08);

}


/* =====================================================
   Accent Line
===================================================== */

.faq-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:transparent;

    transition:.25s;

}

.faq-card:hover::before{

    background:#4F46E5;

}


/* =====================================================
   Featured Card
===================================================== */

.faq-featured{

    min-height:430px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.faq-featured h3{

    font-size:40px;

    margin-bottom:28px;

}

.faq-featured p{

    font-size:20px;

    line-height:2;

}


/* =====================================================
   Typography
===================================================== */

.faq-card h3{

    margin:0 0 22px;

    font-size:31px;

    text-align:center;

    line-height:1.18;

    font-weight:700;

    color:#111827;

}

.faq-card p{

    margin:0;

    font-size:24px;

    text-align:center;

    line-height:normal;

    color:#6B7280;

}

.faq-card strong{

    font-weight:600;

    color:#111827;

}


/* =====================================================
   Premium Hover
===================================================== */

.faq-card:hover h3{

    color:#4F46E5;

}

.faq-icon{

    margin:0 auto 18px;

    font-size:24px;

    color:#7c3aed;

}

.faq-icon i{

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

    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

}