:root {
  --fond: #faf7f5;
  --carte: #ffffff;
  --texte: #2b2b2b;
  --doux: #6b6b6b;
  --accent: #c48a9a;      /* rose poudré sobre */
  --accent-fonce: #a76d7d;
  --erreur: #b23b4b;
  --bord: #e7e0dc;
  --radius: 14px;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--fond); color: var(--texte);
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.5; padding: 24px 16px;
}
.carte {
  max-width: 620px; margin: 0 auto; background: var(--carte);
  border: 1px solid var(--bord); border-radius: var(--radius);
  padding: 32px; box-shadow: 0 6px 24px rgba(0,0,0,.05);
}
.entete { text-align: center; margin-bottom: 24px; }
.logo { max-height: 108px; margin-bottom: 14px; border-radius: 18px; }
h1 { font-size: 1.5rem; margin: 0 0 8px; }
.sous-titre { color: var(--doux); margin: 0; font-size: .95rem; }
form { display: flex; flex-direction: column; gap: 16px; margin-top: 8px; }
.ligne { display: flex; gap: 16px; }
.ligne label { flex: 1; }
label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: .92rem; }
input, select, textarea {
  font: inherit; padding: 11px 12px; border: 1px solid var(--bord);
  border-radius: 10px; background: #fff; color: var(--texte); font-weight: 400;
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(196,138,154,.18);
}
small { color: var(--doux); font-weight: 400; font-size: .82rem; }
textarea { resize: vertical; }
.consentement { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; font-size: .9rem; }
.consentement input { width: auto; margin-top: 3px; }
button {
  margin-top: 8px; padding: 14px; border: none; border-radius: 10px;
  background: var(--accent); color: #fff; font-size: 1rem; font-weight: 700; cursor: pointer;
}
button:hover { background: var(--accent-fonce); }
.erreurs {
  background: #fdeef0; border: 1px solid var(--erreur); color: var(--erreur);
  border-radius: 10px; padding: 12px 16px; margin-bottom: 16px; font-size: .9rem;
}
.erreurs ul { margin: 0; padding-left: 18px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 520px) {
  .carte { padding: 22px; }
  .ligne { flex-direction: column; gap: 16px; }
}
