/** BLOC 15 — FAQ accordéon (Figma node 1470:5857) */
.section-faq__container {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

/* Header : title + description, gap 32px */
.section-faq__header {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin: 0;
}

.section-faq__title {
    font-size: clamp(1.75rem, 2.8vw, 2.3125rem);
    font-weight: var(--font-weight-bold);
    line-height: 1.2;
    margin: 0;
    color: inherit;
}
.section-faq__title .accent,
.section-faq__title .green-text { color: var(--color-accent); }

.section-faq__description {
    font-size: var(--font-size-body);
    line-height: var(--line-height-base);
    margin: 0;
    color: inherit;
}

/* Liste : gap 16px entre items */
.section-faq__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

/* Item : bleu primary, radius 16px */
.section-faq__item {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: background-color var(--transition-base);
}

/* Question (summary) : padding 20/24, 16px medium blanc */
.section-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: 20px 24px;
    cursor: pointer;
    list-style: none;
    font-weight: 500;
    font-size: var(--font-size-body);
    color: var(--color-white);
    line-height: 1.3;
}
.section-faq__question::-webkit-details-marker { display: none; }
.section-faq__question::marker { content: none; }

.section-faq__question-text { flex: 1; }

/* Chevron fin 10×16 (style weui-arrow-outlined) */
.section-faq__chevron {
    flex-shrink: 0;
    transition: transform var(--transition-base);
}

/* Ouvert : chevron pivote 90° */
.section-faq__item[open] > .section-faq__question .section-faq__chevron {
    transform: rotate(90deg);
}

/* Réponse : padding-top 12px pour ne pas coller la zone survolée au texte */
.section-faq__answer {
    padding: 12px 24px 20px;
    font-size: var(--font-size-body-sm);
    line-height: var(--line-height-base);
    color: var(--color-white);
    opacity: 0.95;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: 0;
}
.section--bg-blue .section-faq__answer {
    border-top-color: rgba(0, 0, 0, 0.08);
}
.section-faq__answer :first-child { margin-top: 0; }
.section-faq__answer :last-child { margin-bottom: 0; }

.section-faq__question:hover,
.section-faq__question:focus-visible {
    background-color: var(--color-primary-dark);
}

/* Sur fond bleu : items blancs, texte noir (Figma Foncé exact) */
.section--bg-blue .section-faq__item {
    background-color: var(--color-white);
    color: var(--color-text);
}
.section--bg-blue .section-faq__question,
.section--bg-blue .section-faq__answer {
    color: var(--color-text);
}
.section--bg-blue .section-faq__chevron { color: var(--color-text); }
.section--bg-blue .section-faq__question:hover,
.section--bg-blue .section-faq__question:focus-visible {
    background-color: var(--color-grey-100);
}