@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap');

.faq-section {
    --faq-bg: #f6f7f8;
    --faq-text: #2b2d31;
    --faq-muted: #69717c;
    --faq-line: #dfe3e8;

    width: 100%;
    min-height: 0;
    padding-top: clamp(6.5rem, 11vh, 8.5rem);
    padding-right: clamp(1.2rem, 4vw, 2rem);
    padding-bottom: calc(
        clamp(6.5rem, 11vh, 8.5rem)
        + 50svh
        - clamp(2.275rem, 4vh, 2.75rem)
        + clamp(.5rem, 1.2vh, .8rem)
        - min(21.75rem, calc(50svh - 3.6rem))
    );
    padding-left: clamp(1.2rem, 4vw, 2rem);
    display: flex;
    justify-content: center;
    background: var(--faq-bg);
    color: var(--faq-text);
}

.faq-inner {
    width: min(100%, 49rem);
}

.faq-title {
    margin: 0 0 clamp(4rem, 9vh, 6.8rem);
    color: var(--faq-text);
    font-family: 'Onest', Arial, sans-serif;
    font-size: clamp(1.9rem, 3vw, 2.4rem);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -.035em;
    text-align: center;
}

.faq-list {
    width: 100%;
}

.faq-item {
    border-bottom: 1px solid var(--faq-line);
}

.faq-item summary {
    position: relative;
    min-height: 4rem;
    padding: 1.16rem 3.25rem 1.16rem 0;
    display: flex;
    align-items: center;
    color: var(--faq-text);
    font-family: 'Onest', Arial, sans-serif;
    font-size: clamp(1rem, 1.4vw, 1.18rem);
    font-weight: 620;
    line-height: 1.35;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary::after {
    content: '';
    position: absolute;
    top: 50%;
    right: .28rem;
    width: .62rem;
    height: .62rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-68%) rotate(45deg);
    transition: transform .28s cubic-bezier(.22, .61, .36, 1);
}

.faq-item.is-expanded summary::after {
    transform: translateY(-30%) rotate(225deg);
}

.faq-answer {
    overflow: hidden;
    opacity: 1;
    transform: translateY(0);
    will-change: max-height, opacity, transform;
}

.faq-answer p {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 1.32rem;
    color: var(--faq-muted);
    font-family: 'Onest', Arial, sans-serif;
    font-size: .98rem;
    font-weight: 430;
    line-height: 1.65;
    overflow-wrap: anywhere;
    word-break: normal;
}


body.dark-theme .faq-section {
    --faq-bg: #101820;
    --faq-text: #f0f2f4;
    --faq-muted: #9ca6b2;
    --faq-line: #2d3844;
}

/* Isolate the new FAQ from legacy dark-theme .faq-item rules in theme.css. */
body.dark-theme .faq-section .faq-item {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--faq-line);
}

body.dark-theme .faq-section .faq-item summary {
    color: var(--faq-text);
}

body.dark-theme .faq-section .faq-answer p {
    color: var(--faq-muted);
}

@media (prefers-reduced-motion: reduce) {
    .faq-item summary::after {
        transition: none;
    }
}

@media (max-width: 680px) {
    .faq-section {
        min-height: 0;
        padding: 6.5rem 1.25rem;
    }

    .faq-title {
        margin-bottom: 3.6rem;
        font-size: clamp(1.8rem, 8vw, 2.15rem);
    }

    .faq-item summary {
        min-height: 3.7rem;
        padding-right: 2.4rem;
        font-size: 1rem;
    }

}