/* =============================================================================
   faq.css — les questions frequentes, en accordeon
   =============================================================================
   Repris de la maquette figee : `style.css` l. 1400-1410, les HUIT regles.

   ⚠️ L'ACCORDEON EST NATIF : `<details>` / `<summary>`, aucun JavaScript. Le CSS
   ne fait que cacher le marqueur par defaut du navigateur et dessiner un « + »
   qui pivote en « x » a l'ouverture (`[open]`). Ne pas « porter » un JS d'ouverture
   qui n'existe pas dans la maquette — et surtout ne pas en ajouter un : l'element
   natif est accessible au clavier et aux lecteurs d'ecran sans un octet de script.

   ⚠️ LE SEUL JS QUI TOUCHE CE BLOC EST LE MOTEUR D'APPARITION. `.faq` est dans sa
   liste de sections et `.faq__item` dans sa liste d'elements : les questions
   montent une a une en fondu. C'est `scroll-reveal.js`, deja porte (D121), rien a
   faire ici.

   ⚠️ AUCUN @media, ET C'EST VERIFIE DANS LA MAQUETTE, pas constate chez nous : ni
   `style.css` ni `mobile.css` ne portent de regle responsive pour `.faq*`. Le bloc
   est fluide par construction — `max-width:780px` plus des `clamp()` sur la
   typographie. Consigne dans `tests/decoupe/config.php` (cle `blocs_sans_media`)
   pour que le controle ne le signale pas a chaque passage.
   ============================================================================= */

/* ---- FAQ ---- */
/* beige uni, ACCORDÉ au haut (nuages) du footer — couleur fournie par le client */
.faq{ background:var(--beige-footer); }   /* dernière section de l'index avant le footer */
.faq__list{ max-width:780px; margin:0 auto; }
.faq__item{ border-bottom:1px solid var(--creme-2); padding:4px 0; }
.faq__item summary{ list-style:none; cursor:pointer; padding:22px 4px; font-size:var(--fs-h3); font-weight:600;
  color:var(--noir); display:flex; align-items:center; justify-content:space-between; }
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{ content:"+"; font-size:26px; font-weight:400; color:var(--jaune-d); transition:transform .25s; }
.faq__item[open] summary::after{ transform:rotate(45deg); }
.faq__item p{ padding:0 4px 22px; font-size:var(--fs-body); line-height:1.6; color:var(--noir-50); max-width:680px; }