#faq {
    padding: 0 185px;
    padding-bottom: 60vh;
}

#faq #buttons-wrapper {
    width: 600px;
    white-space: nowrap;
}

#faq .content-wrapper {
    width: 100%;
    height: fit-content;

    border-radius: 0.2rem;
    background: rgba(255, 255, 255, 0.05);
}

#faq button {
    padding: 0.45rem 0.9375rem;
    border: none;
    box-shadow: none;

    width: 100%;
    height: 40px;
    font-weight: 500;

    display: flex;
    align-items: center;
    justify-content: flex-start;

    border-radius: 0.2rem;
    background: rgba(255, 255, 255, 0.05);
}

#faq button.active {
    border: 0.0625rem solid rgba(0, 200, 255, 0.20);
    background: rgba(0, 200, 255, 0.05);
    box-shadow: 0rem 0rem 0rem 0.0625rem rgba(255, 255, 255, 0.10), 0rem 0.25rem 2.1437rem 0rem rgba(0, 0, 0, 0.35);
}

#faq button:active {
    transform: none;
}

#faq .character img {
    width: 18rem;
}

#faq .character .light {
    position: absolute;
    bottom: 0;
    right: 0;

    width: 45rem;
    height: 45rem;

    border-radius: 75rem;
    background: rgba(255, 255, 255, 0.07);

    filter: blur(14.0625rem);
    -webkit-filter: blur(14.0625rem);
}

@media (max-width: 1200px) {
    #faq {
        padding: 0 85px;
    }
}

@media (max-width: 768px) {
    #faq {
        padding: 0 25px;
        padding-bottom: 10vh;
    }

    #faq #buttons-wrapper {
        width: 100%;
    }

    #faq .content-wrapper {
        width: 100%;
        height: fit-content;

        border-radius: 0.2rem;
        background: rgba(255, 255, 255, 0.05);
    }
}

a {
    color: #066A86; 
    text-decoration: underline;
    font-weight: bold;
}

a:hover {
    color: #066A86;
    text-decoration: bold;
}