/* ============ MEMENTO VIV'EXPRESS — blocs FAQ ============
   Feuille autonome parce que la FAQ vit désormais sur l'accueil (qui ne charge
   PAS css/pages.css) autant que sur la page Édition 2027 (qui la charge). Ces
   règles vivaient dans css/pages.css tant que la FAQ était propre à /contact/ :
   les dupliquer aurait garanti la dérive entre les deux copies.

   FAQ en <details> natifs : zéro JS, ouvrable au clavier, et ouvrable même si
   l'hydratation CMS ne répond jamais. Pas d'animation de hauteur — non fiable
   sans JS, on assume. */

.faq{display:flex;flex-direction:column;gap:12px;max-width:820px;margin-top:40px}
.faq-q{background:#fff;border:1.5px solid rgba(31,26,19,.5);border-radius:14px;padding:18px 22px}
.faq-q summary{list-style:none;cursor:pointer;font-family:var(--display);font-weight:700;
  text-transform:uppercase;font-size:.95rem;display:flex;justify-content:space-between;
  align-items:center;gap:16px}
.faq-q summary::-webkit-details-marker{display:none}
.faq-q summary::after{content:"+";font-size:1.4rem;line-height:1;transition:transform .2s}
.faq-q[open] summary::after{transform:rotate(45deg)}
.faq-q[open]{box-shadow:0 16px 34px rgba(31,26,19,.1)}
.faq-q p{color:#463E30;margin-top:12px;font-size:.98rem}

/* Contenu venu du CMS : VivCMS.markdown() peut rendre autre chose que des <p>
   (listes, sous-titres, citations). Sans ces règles, une réponse en liste sort
   sans puces ni retrait — l'admin n'a aucun moyen de le voir avant publication. */
.faq-rep ul,.faq-rep ol{margin-top:12px;padding-left:20px;color:#463E30;font-size:.98rem}
.faq-rep li{margin-top:4px}
.faq-rep h2,.faq-rep h3{font-family:var(--display);font-weight:700;font-size:1rem;margin-top:14px}
.faq-rep blockquote{margin-top:12px;padding-left:14px;border-left:3px solid var(--jaune);color:#463E30}
/* Les liens des blocs FAQ doivent se voir : sans soulignement ils sortaient en
   noir chaud sur fond blanc ou jaune, strictement indistinguables du texte
   courant (constaté en capture). Le soulignement est le seul repère disponible,
   la couleur orange étant réservée à l'action. */
.faq-q a,.faq-lead a,.faq-reste a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.faq-q a:hover,.faq-lead a:hover,.faq-reste a:hover{text-decoration-thickness:2px}

/* la ligne « ta question n'y est pas ? » sous chaque bloc */
.faq-reste{margin-top:26px;font-size:.98rem;color:#463E30}

@media (max-width:760px){
  .faq-q{padding:16px 18px}
  .faq-q summary{font-size:.88rem}
}
@media (prefers-reduced-motion:reduce){
  .faq-q summary::after{transition:none}
}