﻿.faq-section {
    /* ton image en fond si tu en as une (sinon couleur) */
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: auto; /* centrer horizontalement */
    margin-top: 4em;
    margin-bottom: 4em;
}

/* Conteneur commun */
.faq-section__content {
    position: relative; /* pour l’empilement si overlay */
    z-index: 1;
    color: var(--black); /* ou blanc si fond foncé */
}

/* === Mobile par défaut (<768px) === */
.faq-section {
    justify-content: center; /* centre horizontalement */
    padding: 1rem; /* un peu de marge intérieure */
}

.faq-section__content {
    max-width: 100%; /* quasi full-width */
    text-align: center; /* titre et paragraphe centrés */
}


.faq-section h2 {
    text-transform: uppercase;
}

.faq-section .faq-underline {
    width: 120px;
    height: auto;
    margin-top: 0;
}

/*FAQ*/
/* supprime les puces natives */
.faq-item summary {
    list-style: none;
    -webkit-appearance: none;
    margin: 0;
    padding: 0.75rem 0;
}

    /* support webkit/firefox */
    .faq-item summary::-webkit-details-marker {
        display: none;
    }

    .faq-item summary::-moz-list-bullet {
        font-size: 0;
    }

    .faq-item summary::marker {
        font-size: 0;
    }

.faq-list .faq-item {
    border-bottom: 1px solid #ccc;
    /* si tu avais un margin-bottom qui créait un espace trop grand : */
    margin-bottom: 0;
    text-align : start;
}
/* mettons le summary en flex pour aligner SVG+texte */
.faq-item summary {
    display: flex !important;
    align-items: flex-start !important;
    padding: 0.75rem 0;
}

/* taille + couleur des icônes */
.faq-icon {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.5rem;
    color: var(--secondary); /* via stroke="currentColor" */
    flex-shrink: 0;
    margin-top : 0.2rem;
}

/* on cache l’icône “–” quand c’est fermé */
.faq-icon--minus {
    display: none;
}

/* une fois ouvert, on cache le + et on affiche le – */
.faq-item[open] .faq-icon--plus {
    display: none;
}

.faq-item[open] .faq-icon--minus {
    display: inline-block;
}

/* style de la réponse */
.faq-answer {
    padding: 0.5rem 0 1rem;
    text-align: left;
    line-height: 1.5;
    color: var(--text);
}




/* === Responsive mobile (<768px) === */
@media (max-width: 767.98px) {
    .faq-section {
        justify-content: center; /* on centre le contenu */
        text-align: left; /* paragraphes centrés */
        width: 100%;
        padding: 2em 2em;
    }

    .faq-content {
        /*max-width: 100%; /* prend toute la largeur dispo */
    }
}

@media (min-width: 1400px) {
    .faq-section {
        max-width: 1120px; /* optionnel : pour ne pas dépasser une taille raisonnable */
    }
}

@media (max-width: 992px) {
    .faq-section {
    }
}
