/* ============================================================
   DCP — Participer

   La page reunit les anciennes Ecosysteme et Principes : elle charge
   leurs deux feuilles, qui ne connaissent que leurs classes, et
   n'ajoute ici que ce qui tient a la reunion : les ancres du menu, les
   sous-titres qui rythment la longue premiere section, la liste des
   manieres de participer.
   ============================================================ */

/* Les cinq sections sont des cibles du menu : l'en-tete colle en haut de
   la page, un ancrage nu poserait le titre sous lui. Les deux ancres de
   la premiere section (qualifications, manieres) aussi. */
#ecosysteme, #principes, #appuis, #engagements, #feuille-de-route, #manieres {
  scroll-margin-top: 5rem;
}

/* Un sous-titre de section, entre le titre de section et un sous-titre
   de bloc : la premiere section en enchaine six. Il tient la laisse comme
   les titres de page.css. */
.participer-sous-titre {
  font-size: clamp(1.1875rem, 2.25vw, 1.5rem);
  margin: 3.5rem 0 0.75rem;
  margin-left: max(0px, calc((100% - var(--laisse-texte)) / 2));
}

/* Les manieres de participer : motif partage .depliant-item, borne a la
   laisse ; les liens d'une maniere suivent son texte, en ligne. */
.manieres {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: var(--laisse-texte);
  margin-left: max(0px, calc((100% - var(--laisse-texte)) / 2));
}

.manieres summary { font-size: 1rem; padding-block: 0.75rem; }

.maniere-liens {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem 1.25rem;
  margin-top: -0.25rem;
}

.maniere-liens a {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--accent-gold-text);
}

.maniere-liens a:hover { text-decoration: underline; }

.maniere-liens a:focus-visible {
  outline: 2px solid var(--accent-gold);
  outline-offset: 2px;
  border-radius: 3px;
}