/* =========================================================================
   SEZIONE — FAQ
   Basata su <details>: funziona senza JS e il testo delle risposte
   resta nel DOM anche a pannello chiuso.
   ========================================================================= */

.ex-faq__title {
    margin-bottom: var(--ex-space-2xl);
    text-align: center;
}

.ex-faq__list {
    display: flex;
    flex-direction: column;
    gap: var(--ex-space-sm);
}

.ex-faq__item {
    background: var(--ex-surface);
    border: 1px solid var(--ex-border-hairline);
    border-radius: var(--ex-radius-md);
    transition: border-color var(--ex-t-fast) var(--ex-ease);
}

.ex-faq__item[open] {
    border-color: var(--ex-border);
}

.ex-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ex-space-md);
    padding: var(--ex-space-lg) var(--ex-space-xl);
    cursor: pointer;
    font-family: var(--ex-font-headline);
    font-size: var(--ex-fs-h4);
    font-weight: 700;
    line-height: 1.35;
    list-style: none;
}

/* Rimuove il marcatore nativo su tutti i browser */
.ex-faq__question::-webkit-details-marker {
    display: none;
}

.ex-faq__question::marker {
    content: '';
}

.ex-faq__question:hover {
    color: var(--ex-gold);
}

.ex-faq__icon {
    transition: transform var(--ex-t-fast) var(--ex-ease);
}

.ex-faq__item[open] .ex-faq__icon {
    transform: rotate(45deg);
}

.ex-faq__answer {
    padding: 0 var(--ex-space-xl) var(--ex-space-xl);
    color: var(--ex-text-muted);
    line-height: 1.75;
    max-width: 68ch;
}
