:root { color: #1c2430; background: #f6f1e8; font-family: Georgia, "Times New Roman", serif; }
body { margin: 0; }
.top, .band, .hero { padding: 28px 8vw; }
.top { display: flex; justify-content: space-between; align-items: center; }
.mark { letter-spacing: 0.08em; text-transform: uppercase; font-size: 12px; }
nav { display: flex; gap: 16px; align-items: center; }
nav a, button { color: inherit; background: none; border: 0; font: inherit; cursor: pointer; }
.hero { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: end; min-height: 70vh; }
.hero h1 { font-size: clamp(40px, 6vw, 76px); line-height: 0.95; margin: 8px 0 16px; }
.eyebrow { letter-spacing: 0.14em; text-transform: uppercase; font-size: 12px; }
.ledger { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
img { width: 100%; height: 320px; object-fit: cover; background: #ddd4c6; }
.hero img { height: 70vh; }
.alt { background: #efe6d8; }
form { display: grid; gap: 10px; max-width: 420px; }
input, button[type="submit"] { font: inherit; padding: 8px 10px; }
button[type="submit"] { background: #1c2430; color: #f6f1e8; }
.offer { border-top: 1px solid #d9d0c2; padding: 10px 0; }
@media (max-width: 800px) {
  .hero, .grid { grid-template-columns: 1fr; }
  .hero img { height: 40vh; }
}
