:root { color-scheme: light; }
* { box-sizing: border-box; }
body {
  margin: 0; padding: 0 1.25rem 3rem;
  font: 16px/1.65 Georgia, "Times New Roman", serif;
  color: #1c1c1e; background: #faf9f6;
  max-width: 46rem; margin-inline: auto;
}
header { padding: 2.5rem 0 1rem; border-bottom: 2px solid #1c1c1e; }
h1 { font: 700 2.1rem/1.15 "Helvetica Neue", Arial, sans-serif; letter-spacing: -0.02em; margin: 0; }
.tag { margin: 0.4rem 0 0; color: #555; font-family: "Helvetica Neue", Arial, sans-serif; }
h2 { font: 600 1.15rem "Helvetica Neue", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.08em; color: #444; margin: 2.2rem 0 0.6rem; }
p { margin: 0.5rem 0; }
a { color: #7a2e12; }
ul { margin: 0.5rem 0; padding-left: 1.2rem; }
li { margin: 0.35rem 0; }

ul.cards { list-style: none; padding: 0; }
ul.cards li {
  padding: 0.7rem 1rem; margin: 0.5rem 0;
  background: #f1eee8; border: 1px solid #d8d4cb;
  border-left: 4px solid #7a2e12;
}
ul.cards strong { font-family: "Helvetica Neue", Arial, sans-serif; }

p.state {
  padding: 0.9rem 1rem; margin: 0.8rem 0 0.3rem;
  background: #f6efe8; border: 1px solid #e2d4c6;
  border-left: 4px solid #7a2e12;
}

p.cta { margin: 1.2rem 0 0.4rem; }
p.cta a {
  display: inline-block; padding: 0.7rem 1.2rem;
  background: #7a2e12; color: #fff; text-decoration: none;
  font: 600 1rem "Helvetica Neue", Arial, sans-serif; border-radius: 3px;
}
p.cta a:hover { background: #5f230b; }

footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid #e6e3dc; color: #777; font-size: 0.85rem; }