:root{--fond:#17161b;--carte:#201f26;--trait:#2e2c36;--texte:#f1eee9;--sourd:#a19cab;--ambre:#ffb454;--rose:#ff8fb1}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--texte);font:400 17px/1.65 "DM Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;min-height:100vh;display:flex;flex-direction:column}
h1,h2{font-family:"DM Sans","Segoe UI",Arial,sans-serif;line-height:1.1;margin:0}
a:focus-visible{outline:3px solid var(--ambre);outline-offset:3px}
.wrap{max-width:1000px;margin:0 auto;padding:0 24px;width:100%}
main.wrap{flex:1}

header.haut{border-bottom:1px solid var(--trait)}
header.haut .wrap{padding-top:18px;padding-bottom:18px}
.marque{font-family:"Press Start 2P","Courier New",monospace;font-size:.8rem;color:var(--ambre);letter-spacing:.02em}

.hero{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:center;padding:80px 0 64px}
.hero h1{font-size:clamp(2.2rem,5.5vw,3.8rem);font-weight:700;letter-spacing:-.03em;margin-bottom:20px}
.hero p{color:var(--sourd);font-size:1.15rem;margin:0 0 30px;max-width:44ch}
.hero p.note{font-size:.92rem;margin:18px 0 0}
.btn{display:inline-block;padding:14px 26px;border-radius:10px;background:var(--ambre);color:#1b1307;font-weight:700;text-decoration:none}
.btn:hover{filter:brightness(1.08)}

.visuel{background:var(--carte);border:1px solid var(--trait);border-radius:18px;padding:36px;display:flex;justify-content:center}
.chat{width:100%;max-width:260px;height:auto}
.chat .p{fill:var(--ambre)}
.chat .oeil{fill:var(--fond)}
.chat .nez{fill:var(--rose)}

.infos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:36px;padding:48px 0 64px;border-top:1px solid var(--trait)}
.infos h2{font-size:1.15rem;margin-bottom:8px;padding-top:14px;border-top:3px solid var(--rose);display:inline-block}
.infos p{margin:0;color:var(--sourd);font-size:.98rem}

footer.bas{border-top:1px solid var(--trait);padding:26px 0 36px;color:var(--sourd);font-size:.9rem}

@media(max-width:760px){
 .hero{grid-template-columns:1fr;gap:32px;padding:48px 0 40px}
 .visuel{order:-1;padding:24px}
 .chat{max-width:150px}
}