:root{
  --sand:#e8d5b0; --sand-dim:#b9a583; --ink:#141110; --ink-2:#1e1a17;
  --ember:#e8a33d; --rule:#3a322b; --body:#d8cdbd;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--ink); color:var(--body);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}
header{padding:64px 0 40px;border-bottom:1px solid var(--rule)}
h1{margin:0;font-size:40px;letter-spacing:.02em;color:var(--sand)}
.sub{margin:6px 0 0;color:var(--sand-dim);text-transform:uppercase;letter-spacing:.14em;font-size:13px}
h2{margin:44px 0 12px;font-size:20px;color:var(--ember);letter-spacing:.01em}
p{margin:0 0 14px}
a{color:var(--ember)}
img{max-width:100%;height:auto;display:block;border-radius:6px;border:1px solid var(--rule)}
figure{margin:22px 0}
nav{margin-top:22px;display:flex;gap:18px;flex-wrap:wrap}
nav a{color:var(--sand-dim);text-decoration:none;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
nav a:hover{color:var(--ember)}
.card{background:var(--ink-2);border:1px solid var(--rule);border-radius:8px;padding:18px 20px;margin:18px 0}
footer{margin:60px 0 40px;padding-top:20px;border-top:1px solid var(--rule);color:var(--sand-dim);font-size:14px}
ul{margin:0 0 14px;padding-left:20px}
li{margin:0 0 6px}