:root {
  --night: #16182a;
  --ink: #141418;
  --gold: #f2b134;
  --teal: #2a9d8f;
  --cream: #f8f0dc;
  --coral: #e76f51;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--night);
  color: var(--cream);
  font: 17px/1.6 "Righteous", system-ui, sans-serif;
}
a { color: var(--gold); }
header { text-align: center; padding: 24px 16px 8px; }
header a { text-decoration: none; }
.logo {
  font-family: "Pacifico", cursive;
  font-size: 44px;
  color: var(--gold);
  -webkit-text-stroke: 2px var(--ink);
  paint-order: stroke fill;
  text-shadow: 3px 3px 0 var(--ink);
}
main { max-width: 760px; margin: 0 auto; padding: 8px 16px 48px; }
.card { width: 100%; height: auto; border-radius: 16px; border: 4px solid var(--ink); display: block; margin: 8px 0 24px; }
h1, h2 { color: var(--gold); font-weight: 400; letter-spacing: 0.02em; }
h1 { font-size: 30px; margin: 8px 0 4px; }
h2 { font-size: 21px; margin: 28px 0 4px; color: var(--teal); }
p, li { color: #e9e2cf; }
.small { font-size: 14px; color: #b9b3a3; }
.stores { display: flex; gap: 12px; flex-wrap: wrap; margin: 12px 0 24px; }
.stores span {
  border: 3px solid var(--ink); background: var(--coral); color: var(--ink);
  padding: 8px 16px; border-radius: 999px; font-size: 15px;
}
footer { text-align: center; padding: 24px 16px; font-size: 14px; color: #8f8a7d; }
footer a { color: #b9b3a3; }