/* Les pages de texte : mentions légales, accessibilité, données personnelles, contact.
   Une seule colonne, une mesure de lecture confortable, rien d'autre. */
/* ⚠️ Le padding remplace celui de .dedans (0 28px) : sans les 28 px latéraux, le texte collait au
   bord de l'écran sur mobile (Guillaume, 20/09). */
.page-texte { padding: 34px 28px 60px; max-width: calc(74ch + 56px); }
@media (max-width: 680px) { .page-texte { padding: 22px 16px 48px; } }
.page-texte .fil { font-size: 14px; color: var(--gris); margin-bottom: 18px; }
.page-texte .fil a { color: var(--gris); }
.page-texte h1 { font-size: clamp(26px, 3.4vw, 38px); font-weight: 600; letter-spacing: -.025em; }
.page-texte h2 { font-size: 19px; font-weight: 600; margin-top: 30px; }
.page-texte p { margin-top: 12px; }
/* Un canevas non validé ne doit jamais passer pour un texte officiel : on le dit à l'écran. */
.page-texte .avertissement { background: #fdf6e8; border: 1px solid var(--filet); border-left: 4px solid var(--brun);
  padding: 14px 18px; margin-top: 20px; font-size: 15.5px; }

/* ── LE FORMULAIRE DE CONTACT. */
.formulaire-contact { margin-top: 22px; background: var(--blanc); border: 1px solid var(--filet); padding: 22px 24px; }
.formulaire-contact .piege { position: absolute; left: -9999px; }
.formulaire-contact label { display: block; font-size: 13.5px; color: var(--gris); margin-bottom: 5px; }
.formulaire-contact input, .formulaire-contact textarea { width: 100%; font: inherit; font-size: 16px;
  padding: 10px 12px; border: 1px solid #b9b3a8; border-radius: 4px; background: var(--blanc); }
.formulaire-contact input:focus, .formulaire-contact textarea:focus { border-color: var(--encre); outline: 2px solid var(--brun); outline-offset: 1px; }
.formulaire-contact textarea { resize: vertical; }
.formulaire-contact p { margin-top: 14px; }
.formulaire-contact .deux { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.formulaire-contact .envoi { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 20px; }
.formulaire-contact button { font: inherit; font-size: 15.5px; font-weight: 600; background: var(--encre); color: #fff;
  border: 0; border-radius: 4px; padding: 11px 22px; cursor: pointer; }
.formulaire-contact button:hover { background: #42352d; }
.formulaire-contact button[disabled] { opacity: .6; cursor: default; }
.formulaire-contact .finesse { font-size: 13px; color: var(--gris); }
.etat-contact { margin-top: 18px; padding: 14px 18px; border-radius: 4px; font-size: 15.5px; }
.etat-contact.reussi { background: #eaf3ec; border-left: 4px solid #1b7a4b; color: #17452c; }
.etat-contact.souci { background: #fdecec; border-left: 4px solid #a33; color: #5e1b12; }
@media (max-width: 560px) { .formulaire-contact .deux { grid-template-columns: 1fr; } }

/* Le choix de l'établissement (obligatoire, 20/09) — même dessin que les champs du formulaire. */
.formulaire-contact select { width: 100%; font: inherit; padding: 10px 12px; border: 1px solid var(--gris);
  border-radius: 12px; background: var(--blanc); color: var(--encre-noire); }