html, body, #root { margin: 0; min-height: 100%; }
body { background: #f6f1e7; }
.haven { --green:#16281f; --amber:#e8a33d; --cream:#f6f1e7; --ink:#1d2a23; font-family: 'Helvetica Neue', Arial, sans-serif; color: var(--ink); background: var(--cream); line-height: 1.55; }
.haven * { box-sizing: border-box; }
.haven h1, .haven h2, .haven h3 { font-family: Georgia, 'Times New Roman', serif; font-weight: 500; margin: 0; letter-spacing: -.01em; }
.hero { min-height: 640px; background-size: cover; background-position: center; color: #fff; display: flex; flex-direction: column; justify-content: space-between; padding: 28px 24px 40px; }
.wordmark { display: flex; flex-direction: column; line-height: 1; }
.wordmark b { font-family: Georgia, serif; font-size: 26px; letter-spacing: .32em; font-weight: 500; }
.wordmark span { font-size: 11px; letter-spacing: .4em; margin-top: 8px; color: var(--amber); }
.hero-copy { max-width: 640px; }
.eyebrow { text-transform: uppercase; letter-spacing: .2em; font-size: 12px; color: var(--amber); margin: 0 0 12px; }
.hero h1 { font-size: clamp(42px, 9vw, 76px); line-height: 1.02; }
.lead { font-size: 18px; margin: 16px 0 24px; max-width: 520px; color: #f1ece0; }
.cta { display: flex; flex-wrap: wrap; gap: 10px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; font-size: 15px; font-weight: 600; text-decoration: none; }
.btn.primary { background: var(--amber); color: #1b1305; }
.btn.ghost { border: 1px solid rgba(255,255,255,.55); color: #fff; }
.band { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--green); color: #fff; }
.band div { padding: 22px 20px; border-right: 1px solid rgba(255,255,255,.12); display: flex; flex-direction: column; gap: 4px; }
.band div:last-child { border: 0; }
.band b { font-family: Georgia, serif; font-weight: 500; font-size: 19px; color: var(--amber); }
.band span { font-size: 14px; color: #d9d4c6; }
.sec { padding: 56px 24px; max-width: 1040px; margin: 0 auto; }
.sec h2 { font-size: clamp(30px, 5vw, 42px); }
.sub { color: #55605a; max-width: 560px; margin: 10px 0 24px; }
.gallery { display: grid; grid-template-columns: 1.1fr 1fr; grid-template-rows: 260px 260px; gap: 12px; }
.gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: 14px; display: block; }
.gallery .g1 { grid-row: 1 / 3; }
.tint { background: #ece4d2; max-width: none; }
.tint > * { max-width: 992px; margin-left: auto; margin-right: auto; }
.cards { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; margin-top: 24px; }
.card { background: #fff; border-radius: 16px; padding: 28px; }
.card.feature { background: var(--green); color: #fff; }
.card h3 { font-size: 26px; margin: 6px 0 12px; }
.tag { text-transform: uppercase; letter-spacing: .16em; font-size: 12px; color: #8a6a1f; margin: 0; }
.feature .tag { color: var(--amber); }
.card ul { margin: 0; padding: 0; list-style: none; }
.card li { padding: 8px 0; border-top: 1px solid rgba(255,255,255,.14); }
.card p { margin: 0; }
.note { color: #55605a; margin-top: 18px; font-size: 14px; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.split img { width: 100%; border-radius: 14px; display: block; }
.split p { font-size: 17px; margin: 12px 0 0; }
.final { background: var(--green); color: #fff; text-align: center; padding: 64px 24px; }
.final h2 { font-size: clamp(30px, 6vw, 46px); }
.final p { color: #d9d4c6; max-width: 520px; margin: 12px auto 24px; }
.final .cta { justify-content: center; }
.final .meta { font-size: 14px; margin-top: 28px; }
.final a { color: var(--amber); }
.final .btn.ghost { color: #fff; }
.final .btn.primary { color: #1b1305; }
.foot { text-align: center; font-size: 12px; letter-spacing: .12em; padding: 18px; color: #6b7570; text-transform: uppercase; }
@media (max-width: 700px) {
  .hero { min-height: 600px; }
  .band { grid-template-columns: 1fr; }
  .band div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 300px 200px; }
  .gallery .g1 { grid-column: 1 / 3; grid-row: 1; }
  .cards, .split { grid-template-columns: 1fr; }
  .btn { flex: 1 1 100%; }
  .sec { padding: 44px 20px; }
}

.inq { max-width: 560px; margin: 0 auto; text-align: left; display: grid; gap: 14px; }
.inq label { display: grid; gap: 6px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--amber); }
.inq input, .inq select { font: inherit; font-size: 16px; text-transform: none; letter-spacing: 0; min-height: 48px; padding: 0 14px; border-radius: 12px; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; }
.inq input::placeholder { color: #9aa59d; }
.inq select option { color: #111; }
.inq .how { font-size: 14px; margin: 4px 0 0; text-align: center; max-width: none; }
.inq .cta { margin-top: 4px; justify-content: center; }
.hero { background-image: linear-gradient(180deg, rgba(14,26,20,.55) 0%, rgba(14,26,20,.35) 40%, rgba(14,26,20,.88) 100%), url('photos/dusk.jpg'); }
.btn.ghost.dk { border-color: rgba(255,255,255,.55); }