:root {
  --farine: #F6F0E6;
  --carte: #FFFDF9;
  --texte: #2A211B;
  --texte-doux: #6B5D52;
  --croute: #8C5E38;
  --croute-fonce: #6E4A2C;
  --fond-doux: #F1E4D3;
  --vert: #5E7356;
  --alerte: #8E2F2A;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: var(--farine);
  color: var(--texte);
  font-family: "Jost", "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
}

.carte {
  width: 100%;
  max-width: 390px;
  padding: 32px 24px;
  background: var(--carte);
  border-radius: 20px;
  text-align: center;
}

h1 {
  margin: 0 0 12px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  font-size: 2.2rem;
  color: var(--croute);
}

p { margin: 0 0 16px; line-height: 1.5; color: var(--texte-doux); }

label {
  display: block;
  margin-bottom: 8px;
  text-align: left;
  font-weight: 500;
  color: var(--texte);
}

input[type="email"] {
  width: 100%;
  min-height: 44px;
  padding: 10px 14px;
  margin-bottom: 16px;
  border: 1px solid #D9CBB8;
  border-radius: 12px;
  background: #fff;
  font: inherit;
  color: var(--texte);
}

.bouton {
  display: inline-block;
  width: 100%;
  min-height: 44px;
  padding: 12px 20px;
  border: 0;
  border-radius: 999px;
  background: var(--croute);
  color: #fff;
  font: inherit;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.bouton:hover { background: var(--croute-fonce); }

.bouton-discret {
  background: transparent;
  color: var(--croute);
  border: 1px solid var(--croute);
}
.bouton-discret:hover { background: var(--fond-doux); }

.message-ok { padding: 12px 14px; border-radius: 12px; background: var(--fond-doux); color: var(--vert); font-weight: 600; }
.message-erreur { padding: 12px 14px; border-radius: 12px; background: #F6E3E1; color: var(--alerte); font-weight: 600; }

.detail { font-size: 0.85rem; word-break: break-word; }