.hero{
    padding: 100px 0px;
}

.hero h1{
    color: var(--dark-surface);
    font-weight: 700;
}

.main-sec{
    padding: 100px 0px;
}

.main-sec h1{
    color: var(--dark-surface);
    font-weight: 700;
}

.main-sec p{
    color: var(--black-50);
    font-weight: 500;
}

.main-sec .card {
    border: 0.5px solid #dcdcdc;
    border-radius: 10px;
    box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.063);
    overflow: hidden;
}

.main-sec .card h5{
    color: var(--dark-surface);
    font-weight: 700;
}

.main-sec .card p{
    color: var(--black-50);
    font-weight: 500;
}

.faq h1{
    color: var(--dark-surface);
    font-weight: 700;
}

.accordion button{
    font-weight: 700;
    color: var(--primary-100)!important;
    font-size: 1rem;
}

.accordion-button:not(.collapsed){
    background-color : white;
}



.accordion-button:focus{
    border-color:  white!important;
    box-shadow: none!important;
}


@media only screen and (max-width: 786px) {
    .hero{
        padding: 50px 0px;
    }

    .main-sec{
        padding: 50px 0px;
    }
}