:root { --night:#1c2430; --sand:#d7c4a3; --mist:#8ea0b5; --paper:#f3f0ea; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--night); font:17px/1.5 "Segoe UI", sans-serif; }
.top { position:absolute; inset:0 0 auto 0; display:flex; padding:22px 5vw; z-index:2; }
.brand, nav a { color:#fff; text-decoration:none; }
nav { margin-left:auto; display:flex; gap:18px; }
.nav-toggle { display:none; }
.bleed { min-height:78vh; background:#1c2430; color:#fff; display:grid; align-items:end; padding:8vh 5vw; }
.bleed img { width:min(640px, 100%); height:auto; }
.bleed h1 { font-family:Georgia, serif; font-size:clamp(42px, 6vw, 80px); font-weight:500; margin:12px 0; }
.listings { display:grid; gap:0; }
.listing { display:grid; grid-template-columns:160px 1fr 120px; gap:18px; padding:22px 5vw; border-bottom:1px solid #ddd; }
.foot { padding:20px 5vw; }
@media (max-width:800px) {
  .listing { grid-template-columns:1fr; }
  .nav-toggle { display:inline-block; margin-left:auto; color:#fff; background:transparent; border:1px solid #fff; }
  nav { display:none; }
  body.nav-open nav { display:flex; flex-direction:column; background:var(--night); padding:12px; }
}
