*{box-sizing:border-box}
body#home{margin:0;background:#0b0b0e;color:#fff;font-family:Avenir Next,Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}
a{color:inherit;text-decoration:none}
.site-nav{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:26px 7vw;background:linear-gradient(to bottom,rgba(0,0,0,.65),transparent)}
.brand{font-family:Georgia,serif;color:#e8dcc4;letter-spacing:.18em;text-transform:uppercase}
.site-nav nav{display:flex;gap:22px;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.site-hero{position:relative;min-height:100vh;display:grid;place-items:center;background:#111;background-size:cover;background-position:center;padding:130px 7vw 90px;text-align:center}
.site-hero-overlay{position:absolute;inset:0;background:radial-gradient(circle at center,rgba(0,0,0,.18),rgba(0,0,0,.78))}
.site-hero-content{position:relative;max-width:850px}
.site-hero-content span,.section-heading span{color:#e8dcc4;font-size:12px;letter-spacing:.32em;text-transform:uppercase}
.site-hero h1{font-family:Georgia,serif;font-weight:300;font-size:clamp(54px,10vw,112px);line-height:.95;margin:18px 0;color:#e8dcc4}
.site-hero p{max-width:680px;margin:0 auto;color:rgba(255,255,255,.75);font-size:clamp(17px,2vw,22px);line-height:1.55}
.site-hero a{display:inline-flex;margin-top:34px;border:1px solid #e8dcc4;color:#e8dcc4;border-radius:999px;padding:14px 24px;letter-spacing:.18em;text-transform:uppercase;font-size:12px}
.listings-section{padding:90px 7vw 120px;background:#f6f4ee;color:#141414}
.section-heading{max-width:760px;margin:0 auto 44px;text-align:center}
.section-heading h2{font-family:Georgia,serif;font-size:clamp(42px,7vw,76px);font-weight:300;margin:14px 0 10px}
.section-heading p{color:#666;font-size:17px;line-height:1.65}
.listing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px;max-width:1180px;margin:0 auto}
.listing-card{background:#fff;border:1px solid #dedbd0;border-radius:28px;overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.07)}
.listing-image{position:relative;aspect-ratio:4/3;background:#ddd;overflow:hidden}
.listing-image img{width:100%;height:100%;object-fit:cover;display:block}
.status-pill{position:absolute;top:18px;left:18px;background:rgba(0, 0, 0, 0.72);color:#e8dcc4;border:1px solid rgba(232,220,196,.4);padding:8px 14px;border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.listing-content{padding:24px}
.listing-content span{color:#8a7c61;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.listing-content h3{font-family:Georgia,serif;font-weight:300;font-size:34px;margin:10px 0;color:#141414}
.listing-content p{color:#666;line-height:1.6}
.listing-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:22px}
.listing-footer strong{color:#141414}
.listing-footer em{color:#8a7c61;font-style:normal}
@media(max-width:720px){.site-nav{position:absolute;align-items:flex-start;gap:16px;flex-direction:column}.site-nav nav{gap:14px;flex-wrap:wrap}.site-hero{place-items:end start}.section-heading{text-align:left}}


/* v2.3.0-alpha.4 public responsive header */
.site-nav {
    gap: 18px;
}

.site-nav nav {
    align-items: center;
}

@media(max-width:720px){
    header.site-nav {
        align-items: center;
        flex-direction: initial;
        position: sticky;
        top: 0;
    }

    main {
        top: -74px;
        position: relative;
    }

    .site-nav{
        position:absolute;
        padding:18px 20px;
        align-items:flex-start;
        gap:12px;
        background:linear-gradient(to bottom,rgba(0,0,0,.72),rgba(0,0,0,.08));
    }

    .site-nav .brand{
        max-width:62vw;
        line-height:1.35;
        font-size:13px;
        letter-spacing:.12em;
    }

    .site-nav nav{
        gap:10px;
        flex-wrap:wrap;
        justify-content:flex-end;
        text-align:right;
        font-size:11px;
        line-height:1.3;
    }

    header.site-nav nav {
        gap: 5px;
    }

    .site-nav nav a{
        padding:7px 10px;
        border:1px solid rgba(232,220,196,.35);
        border-radius:999px;
        background:rgba(0,0,0,.22);
    }

    .site-hero{
        min-height:78vh;
        padding:110px 22px 70px;
    }

    .site-hero h1{
        font-size:clamp(42px,14vw,72px);
    }

    .listings-section{
        padding:64px 20px 84px;
    }

    .listing-grid{
        grid-template-columns:1fr;
    }

    .listing-footer{
        display:grid;
    }
}