/* ============================================================
   Gabarit Contact — /contact/
   Repris de maquettes/maquette-contact-byu-france.html (parties propres à la page).
   ============================================================ */
body{line-height:1.65}
.lien-simple{padding-bottom:1px}

/* Tête */
.tete-page{background:var(--nuit);color:var(--papier);padding:clamp(34px,5vw,58px) 0}
.fil{font-size:.85rem;color:#9FB4E8;margin-bottom:18px}
.fil a{text-decoration:none}
.fil a:hover{color:#fff}
.fil span{margin:0 8px;opacity:.5}
.tete-page h1{font-weight:900;font-stretch:118%;line-height:.98;letter-spacing:-.03em;
  font-size:clamp(2rem,4.6vw,3.1rem)}
.tete-page p{margin-top:14px;color:#9FB4E8;font-size:.95rem}
.tete-page .chapeau{max-width:64ch}

/* ---------- Page contact ---------- */
.contenu{padding:clamp(44px,6vw,76px) 0}
.contenu h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;font-stretch:112%;margin-bottom:14px}
.contenu .intro{color:var(--gris);font-size:1.04rem;max-width:82ch;margin-bottom:30px}
.contact-grille{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(30px,5vw,56px);align-items:start}
form{background:#fff;border:1px solid var(--trait);padding:clamp(22px,3vw,32px)}
.champ{margin-bottom:18px}
.champ label{display:block;font-weight:700;font-size:.92rem;margin-bottom:6px}
.champ input,.champ select,.champ textarea{
  width:100%;font:inherit;font-size:.98rem;padding:11px 13px;background:var(--papier);
  border:1px solid var(--trait);border-radius:2px;color:var(--encre)}
.champ input:focus,.champ select:focus,.champ textarea:focus{
  outline:none;border-color:var(--bleu);box-shadow:0 0 0 3px rgba(19,56,160,.15)}
.champ textarea{min-height:170px;resize:vertical}
.champ .aide{font-size:.82rem;color:var(--gris);margin-top:5px}
.obligatoire{color:var(--rouge)}
.consentement{display:flex;gap:11px;align-items:flex-start;font-size:.88rem;color:var(--gris);margin:20px 0}
.consentement input{width:auto;flex:none;margin-top:3px}
form .btn{width:100%;text-align:center;border:none;cursor:pointer;font:inherit;font-weight:700;
  font-stretch:108%;padding:.85em 1.5em}
.bloc-contact{background:#fff;border:1px solid var(--trait);padding:24px}
.bloc-contact + .bloc-contact{margin-top:20px}
.bloc-contact h3{font-size:1.08rem;margin-bottom:10px;padding-bottom:9px;border-bottom:2px solid var(--encre)}
.bloc-contact p{font-size:.94rem;color:var(--gris)}
.bloc-contact .qui{font-weight:800;font-stretch:108%;color:var(--encre);font-size:1.02rem;margin-bottom:2px}
.bloc-contact .fonction{font-size:.85rem;color:var(--gris);margin-bottom:12px}
/* Ajout thème : style porté en ligne dans la maquette (coordonnées et lien des encarts). */
.bloc-contact .suite{margin-top:12px}
.reseaux-liste{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.reseaux-liste a{font-size:.88rem;font-weight:700;text-decoration:none;padding:8px 14px;
  border:1px solid var(--trait);border-radius:2px}
.reseaux-liste a:hover{border-color:var(--bleu);color:var(--bleu)}
.delai{background:var(--nuit);color:var(--papier);padding:22px 24px;margin-top:20px}
.delai b{display:block;font-style:italic;font-weight:900;font-stretch:118%;font-size:1.9rem;line-height:1}
.delai p{color:#C6CEE0;font-size:.92rem;margin-top:6px}

/* Ajout thème : états du formulaire (erreurs, envoi réussi) et champ leurre. */
.leurre{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.message-formulaire{padding:14px 18px;margin-bottom:20px;font-size:.95rem;border-left:4px solid;max-width:none}
.message-formulaire.succes{background:#EAF0FB;border-color:var(--bleu);color:var(--encre)}
.message-formulaire.echec{background:#FBECEB;border-color:var(--rouge-sombre);color:var(--encre)}
.champ .erreur,.consentement-erreur{font-size:.85rem;color:var(--rouge-sombre);font-weight:600;margin-top:5px}
.champ [aria-invalid="true"]{border-color:var(--rouge-sombre)}

@media (max-width:900px){
  .contact-grille{grid-template-columns:1fr}
}