:root { color-scheme: dark; --night:#171816; --surface:#242b20; --low:#10130f; --ivory:#f1e8d6; --mist:#c0b9aa; --copper:#c97832; --gold:#d99938; --green:#5caf68; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; background:linear-gradient(160deg,#171816 0%,#10130f 100%); color:var(--ivory); font-family:Arial,Helvetica,sans-serif; line-height:1.6; }
a { color:#f4b560; }
.wrap { width:min(100% - 40px,760px); margin:auto; }
header { padding:28px 0 20px; border-bottom:1px solid rgba(241,232,214,.12); }
.brand { color:var(--ivory); font-size:24px; font-weight:800; text-decoration:none; }
.brand span { color:var(--copper); }
nav { margin-top:12px; display:flex; gap:18px; flex-wrap:wrap; font-size:14px; }
main { padding:56px 0; }
.eyebrow { color:var(--gold); font-size:12px; font-weight:800; letter-spacing:.08em; }
h1 { font-size:clamp(32px,7vw,52px); line-height:1.08; margin:10px 0 16px; }
h2 { font-size:22px; line-height:1.2; margin:0 0 10px; }
p,li { color:var(--mist); }
.lead { font-size:19px; max-width:620px; }
.card { margin:20px 0; padding:24px; border:1px solid rgba(217,153,56,.28); border-radius:18px; background:rgba(36,43,32,.76); }
.notice { border-left:3px solid var(--copper); padding:14px 16px; background:rgba(201,120,50,.1); border-radius:0 12px 12px 0; }
.button { display:inline-block; margin-top:12px; padding:13px 18px; border-radius:12px; background:var(--copper); color:var(--ivory); font-weight:800; text-decoration:none; }
footer { border-top:1px solid rgba(241,232,214,.12); padding:26px 0 36px; font-size:13px; }
@media (max-width:480px) { .wrap { width:min(100% - 32px,760px); } main { padding:40px 0; } .card { padding:20px; } }