:root {
  --ink: #1f1f1f;
  --brown: #2b2118;
  --terracotta: #a95c3a;
  --sage: #6b7560;
  --parchment: #f3e9d7;
  --cream: #fbf8f2;
  --stone: #8a7a60;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--parchment);
  color: var(--ink);
  font-family: "Crimson Pro", Georgia, serif;
  font-size: 1.2rem;
  line-height: 1.6;
}

.wrap { max-width: 40rem; margin: 0 auto; padding: 0 1.25rem; }

header { padding: 2.5rem 0 1rem; text-align: center; }
header img { width: min(22rem, 90%); height: auto; }

main { padding: 1.5rem 0 3rem; }

h1, h2 {
  font-family: "Cinzel", Georgia, serif;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: var(--brown);
}
h1 { font-size: 1.9rem; line-height: 1.25; margin: 1rem 0 0.75rem; text-align: center; }
h2 { font-size: 1.15rem; margin: 2.25rem 0 0.5rem; }

.lede { text-align: center; font-style: italic; color: var(--sage); margin-top: 0; }

hr { border: 0; border-top: 2px solid var(--terracotta); width: 3rem; margin: 2rem auto; }

a { color: var(--terracotta); }

.places { list-style: none; padding: 0; margin: 0.5rem 0 0; columns: 2; column-gap: 2rem; }
.places li { padding: 0.15rem 0; break-inside: avoid; }
@media (max-width: 30rem) { .places { columns: 1; } }

.cta { text-align: center; margin: 2rem 0; }
.cta a {
  display: inline-block;
  font-family: "DM Sans", Arial, sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  background: var(--terracotta);
  color: var(--cream);
  padding: 0.85rem 1.75rem;
  border-radius: 2px;
}
.cta a:hover, .cta a:focus-visible { background: var(--brown); }

footer {
  border-top: 1px solid var(--stone);
  padding: 1.5rem 0 2.5rem;
  text-align: center;
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 0.85rem;
  color: var(--stone);
}
footer a { color: var(--stone); }

.meta { font-family: "DM Sans", Arial, sans-serif; font-size: 0.85rem; color: var(--stone); }
