:root { --fond: #10151C; --texte: #EDE7DA; --accent: #C9A961; --sourd: #8C8578; --carte: #161C25; }
* { box-sizing: border-box; }
html { background: var(--fond); color: var(--texte); font: 17px/1.55 Georgia, "Times New Roman", serif; -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 1.5rem; }
.carte { width: 100%; max-width: 26rem; background: var(--carte); border: 1px solid #232b37; border-radius: 12px; padding: 2rem 1.5rem; }
.auteur { margin: 0 0 .5rem; color: var(--sourd); font-size: .9rem; letter-spacing: .08em; text-transform: uppercase; }
h1 { margin: 0 0 1rem; font-size: 1.9rem; line-height: 1.15; font-weight: normal; color: var(--accent); }
.promesse { margin: 0 0 1.5rem; }
.erreur { margin: 0 0 1rem; padding: .6rem .8rem; border-left: 3px solid #c95f4a; background: #241a19; }
.champ { display: block; margin-bottom: 1rem; }
.champ span { display: block; margin-bottom: .35rem; color: var(--sourd); font-size: .9rem; }
input[type=email] { width: 100%; font: inherit; padding: .75rem .9rem; border-radius: 8px; border: 1px solid #3a4352; background: var(--fond); color: var(--texte); }
input[type=email]:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
button { width: 100%; font: inherit; font-size: 1.05rem; padding: .85rem; border: 0; border-radius: 8px; background: var(--accent); color: var(--fond); cursor: pointer; }
button:hover { filter: brightness(1.08); }
.consentement { margin: 1rem 0 0; color: var(--sourd); font-size: .85rem; }
.piege { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
footer { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid #232b37; color: var(--sourd); font-size: .85rem; display: flex; gap: .6rem; }
a { color: var(--accent); }