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


.faq{

    padding:120px 8%;

    background:#050914;

    color:white;

}



.faq-subtitle{

    color:#00c6ff;

    font-size:14px;

    letter-spacing:3px;

    font-weight:700;

}



.faq .section-title h2{

    color:white;

}



.faq .section-title p{

    color:#b8c5d8;

}



/* CONTAINER */

.faq-container{

    max-width:900px;

    margin:60px auto 0;

}




/* ITEM */


.faq-item{

    margin-bottom:20px;

    border-radius:20px;

    overflow:hidden;

    background:

    rgba(255,255,255,.07);


    border:

    1px solid rgba(0,198,255,.2);


    backdrop-filter:blur(15px);


    transition:.4s;

}



.faq-item:hover{

    border-color:#00c6ff;

    box-shadow:

    0 15px 40px rgba(0,140,255,.25);

}



/* QUESTION */


.faq-question{

    width:100%;

    padding:25px 30px;


    background:none;

    border:none;


    color:white;

    display:flex;

    justify-content:space-between;

    align-items:center;


    font-size:18px;

    font-weight:700;


    cursor:pointer;

}



.faq-question span{

    width:35px;

    height:35px;

    border-radius:50%;


    display:flex;

    align-items:center;

    justify-content:center;


    background:#0066ff;

    font-size:25px;


    transition:.4s;

}





/* REPONSE */


.faq-answer{

    max-height:0;

    overflow:hidden;

    transition:

    max-height .5s ease;

}



.faq-answer p{

    padding:

    0 30px 25px;


    color:#c4d0e2;

    line-height:1.8;

}




/* ACTIVE */


.faq-item.active .faq-answer{

    max-height:300px;

}



.faq-item.active .faq-question span{

    transform:rotate(45deg);

    background:#00c6ff;

}





@media(max-width:768px){


.faq-question{

    font-size:16px;

    padding:20px;

}



.faq-answer p{

    padding:0 20px 20px;

}


}