/* ==========================================================================
   Gabarit formulaire. Sert la candidature partenaire et la demande de devis.
   ========================================================================== */

.formulaire-page {
  max-width: 760px;          /* mesure du prototype : un formulaire ne s'étale pas */
  margin: 0 auto;
  padding: var(--esp-8) var(--esp-12) var(--esp-16);
  display: flex; flex-direction: column; gap: var(--esp-8);
}
.formulaire-page__entete { display: flex; flex-direction: column; gap: var(--esp-4); }

.formulaire { display: flex; flex-direction: column; gap: var(--esp-8); }
.formulaire__consigne { color: var(--vert-coteau); }

/* Les champs sont groupés par intention — l'établissement, vous joindre, le
   consentement. Un fieldset par groupe : le lecteur d'écran annonce la légende
   en entrant dans le groupe, ce qui remplace les sous-titres décoratifs. */
.formulaire__groupe {
  margin: 0; padding: 0; border: 0;
  display: flex; flex-direction: column; gap: var(--esp-4);
}
.formulaire__groupe legend {
  padding: 0 0 var(--esp-3);
  font-size: var(--taille-legende);
  font-weight: var(--poids-semibold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--vert-coteau);
}
.formulaire__champs { display: flex; flex-direction: column; gap: var(--esp-6); }

.formulaire__envoi {
  display: flex; align-items: center; gap: var(--esp-4); flex-wrap: wrap;
  padding-top: var(--esp-6);
  border-top: var(--filet);
}
.formulaire__note { font-size: var(--taille-legende); color: var(--vert-coteau); }

@media (max-width: 900px) {
  .formulaire-page { padding: var(--esp-4) var(--esp-4) var(--esp-16); gap: var(--esp-6); }
  .formulaire__envoi { flex-direction: column; align-items: stretch; }
  .formulaire__envoi .bouton { justify-content: center; }
}