:root {
  --cream: #f8f1ea;
  --ink: #3b2f2f;
  --muted: #7d6a64;
  --blush: #e9c9c3;
  --gold: #b89a6a;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 32px 16px;
  background: radial-gradient(120% 80% at 50% 0%, #fbe9e4 0%, var(--cream) 60%);
  color: var(--ink);
  font: 300 17px/1.6 "Jost", system-ui, sans-serif;
}

main { width: 100%; max-width: 460px; text-align: center; }

.eyebrow {
  margin: 0 0 12px;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
}

h1 {
  margin: 0 0 18px;
  font: 400 clamp(30px, 8vw, 40px)/1.15 "Bodoni Moda", Georgia, serif;
}

h1 em { font-style: italic; color: var(--gold); }

ul { list-style: none; padding: 0; margin: 22px 0 30px; }

li { padding: 8px 0; border-top: 1px solid rgba(184, 154, 106, 0.3); }

li:last-child { border-bottom: 1px solid rgba(184, 154, 106, 0.3); }

.button {
  display: inline-block;
  padding: 15px 34px;
  border-radius: 999px;
  background: var(--ink);
  color: var(--cream);
  text-decoration: none;
  letter-spacing: 0.06em;
  transition: transform 0.2s ease, background 0.2s ease;
}

.button:hover { background: #2a2121; transform: translateY(-1px); }

.small { font-size: 13px; color: var(--muted); margin-top: 18px; }

@media (prefers-reduced-motion: reduce) {
  .button { transition: none; }
  .button:hover { transform: none; }
}