/* Accordéon (FAQ, Les aides une par une, Caractéristiques)
   V3 : filet 1 px brandt/line, en-tête padding 20/0 desktop (16/0 mobile), titre H2, chevron 24,
   tous fermés par défaut, un bouton par en-tête avec aria-expanded + aria-controls.
   Ouverture : grid-template-rows 0fr → 1fr, 300 ms ; chevron rotation 180°. Le panneau suit le titre (h3), pas le bouton :
   l'état ouvert se lit sur l'élément (.is-open, posé par accordion.js). Sans JavaScript, tout reste déplié. */

.accordion { width: 100%; max-width: var(--size-container-1100); }
.accordion__item { border-bottom: var(--border-1) solid var(--brandt-line); }
.accordion__item:first-child { border-top: var(--border-1) solid var(--brandt-line); }

.accordion__trigger {
  display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--space-12);
  padding: var(--space-16) 0; text-align: left;
  font-size: var(--text-h2-size); line-height: var(--text-h2-lh); font-weight: var(--text-h2-weight);
  color: var(--brandt-carbon); border-radius: var(--radius-12);
  transition: color var(--transition);
}
@media (min-width: 1024px) { .accordion__trigger { padding: var(--space-20) 0; } }
.accordion__trigger:hover { color: var(--brandt-red); }
.accordion__trigger:focus-visible { box-shadow: var(--focus-ring); }

.accordion__icon { flex: 0 0 auto; width: var(--size-icon-24); height: var(--size-icon-24); transition: transform var(--duration-expand) var(--ease); }
.accordion__trigger[aria-expanded="true"] .accordion__icon { transform: rotate(180deg); }

.accordion__panel { display: grid; grid-template-rows: 1fr; }
.accordion__panel > div { overflow: hidden; }
.js .accordion__panel { grid-template-rows: 0fr; transition: grid-template-rows var(--duration-expand) var(--ease); }
/* fermé : contenu retiré du parcours clavier et des lecteurs d'écran une fois l'animation finie */
.js .accordion__panel > div { visibility: hidden; transition: visibility 0s linear var(--duration-expand); }
.js .accordion__item.is-open > .accordion__panel { grid-template-rows: 1fr; }
.js .accordion__item.is-open > .accordion__panel > div { visibility: visible; transition-delay: 0s; }
.accordion__content { padding: var(--space-8) 0 var(--space-16); display: flex; flex-direction: column; gap: var(--space-12); }
@media (min-width: 1024px) { .accordion__content { padding: 0 0 var(--space-24); } }

@media (prefers-reduced-motion: reduce) {
  .accordion__icon, .js .accordion__panel, .js .accordion__panel > div { transition: none; }
}