
:root {
  --forest: #173f2b;
  --forest-deep: #0d2a1c;
  --cream: #f5f2e9;
  --paper: #fbfaf6;
  --ink: #17211b;
  --muted: #5d685f;
  --line: rgba(23,63,43,.18);
  --content: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
h1,h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; margin: 0; }
h1 { font-size: clamp(3.4rem, 8vw, 7.8rem); line-height: .92; letter-spacing: -.035em; }
h2 { font-size: clamp(2.3rem, 5vw, 4.6rem); line-height: 1.02; letter-spacing: -.025em; }
p { margin: 0 0 1.2rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:100; background:#fff; padding:.8rem 1rem; }
.skip-link:focus { top:1rem; }

.site-header {
  position:absolute;
  z-index:20;
  top:0; left:0; width:100%;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.2rem clamp(1.2rem,4vw,4rem);
  color:#fff;
}
.brand img { width:190px; filter: brightness(0) invert(1); }
.site-nav { display:flex; gap:2rem; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; }
.site-nav a { text-decoration:none; padding:.5rem 0; border-bottom:1px solid transparent; }
.site-nav a:hover,.site-nav a:focus { border-color:currentColor; }
.menu-toggle { display:none; border:0; background:transparent; padding:.5rem; }
.menu-toggle span:not(.sr-only) { display:block; width:24px; height:1px; background:#fff; margin:5px 0; }

.hero { min-height:100svh; position:relative; color:#fff; display:grid; place-items:center; overflow:hidden; }
.hero-image { position:absolute; inset:0; background:url("/assets/estate-hero.jpg") center 53%/cover no-repeat; transform:scale(1.01); }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,24,13,.28),rgba(4,24,13,.18) 44%,rgba(4,24,13,.55)); }
.hero-content { position:relative; z-index:2; text-align:center; max-width:940px; padding:8rem 1.5rem 6rem; text-shadow:0 2px 24px rgba(0,0,0,.25); }
.hero-tagline { font-size:clamp(1.15rem,2.2vw,1.8rem); line-height:1.35; margin:1.8rem auto 2.3rem; }
.eyebrow { text-transform:uppercase; letter-spacing:.18em; font-size:.72rem; margin-bottom:1.2rem; }
.eyebrow.dark { color:var(--forest); }
.button { display:inline-block; text-decoration:none; text-transform:uppercase; letter-spacing:.13em; font-size:.72rem; padding:1rem 1.4rem; border:1px solid; }
.button-light { color:#fff; border-color:rgba(255,255,255,.7); background:rgba(10,40,25,.16); backdrop-filter:blur(8px); }
.button:hover,.button:focus { background:#fff; color:var(--forest); }
.scroll-cue { position:absolute; z-index:2; bottom:1.6rem; left:50%; transform:translateX(-50%); text-decoration:none; text-transform:uppercase; letter-spacing:.18em; font-size:.62rem; display:grid; gap:.6rem; justify-items:center; }
.scroll-cue i { height:35px; width:1px; background:rgba(255,255,255,.75); }

.section { max-width:var(--content); margin:auto; padding:clamp(5rem,10vw,9rem) clamp(1.4rem,4vw,3rem); }
.about { display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,8vw,8rem); align-items:center; }
.section-copy p:not(.eyebrow) { max-width:640px; color:var(--muted); font-size:1.06rem; }
.section-copy h2 { color:var(--forest); margin-bottom:2rem; }
.about-image img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:2px; }
.about-image figcaption { color:var(--muted); font-size:.75rem; margin-top:.7rem; letter-spacing:.05em; }

.coming-soon { background:var(--cream); padding:clamp(5rem,10vw,8rem) max(calc((100vw - var(--content))/2 + 3rem),1.4rem); }
.coming-soon > div:first-child { max-width:780px; }
.coming-soon h2 { color:var(--forest); margin-bottom:1.4rem; }
.coming-soon p { color:var(--muted); }
.coming-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); margin-top:3rem; border:1px solid var(--line); }
.coming-grid span { background:var(--cream); padding:1.2rem; text-align:center; font-family:Georgia,serif; color:var(--forest); }

.contact { display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,8vw,8rem); }
.contact h2 { color:var(--forest); margin-bottom:1.5rem; }
.contact > div:first-child > p:last-child { color:var(--muted); max-width:520px; }
.contact-card { border-top:1px solid var(--line); }
.contact-card > div { padding:1.4rem 0; border-bottom:1px solid var(--line); }
.contact-card span { display:block; text-transform:uppercase; font-size:.68rem; letter-spacing:.16em; color:var(--muted); margin-bottom:.3rem; }
.contact-card a { color:var(--forest); font-family:Georgia,serif; font-size:1.2rem; }
.contact-card p { margin:0; }
.placeholder-note { margin-top:1.4rem!important; color:var(--muted); font-size:.8rem; }

.site-footer { background:var(--forest-deep); color:#fff; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:2rem; padding:2rem clamp(1.4rem,4vw,4rem); font-size:.72rem; }
.site-footer img { width:150px; filter:brightness(0) invert(1); }
.site-footer p { margin:0; text-align:center; opacity:.8; }
.site-footer div { display:flex; gap:1.3rem; }
.site-footer a { text-decoration:none; opacity:.85; }

@media (max-width: 760px) {
  .site-header { position:absolute; padding:1rem 1.1rem; }
  .brand img { width:145px; }
  .menu-toggle { display:block; position:relative; z-index:22; }
  .site-nav {
    display:none; position:absolute; top:0; right:0; width:min(78vw,320px);
    min-height:100vh; background:var(--forest-deep); padding:6rem 2rem 2rem;
    flex-direction:column; gap:1.2rem; box-shadow:-20px 0 50px rgba(0,0,0,.25);
  }
  .site-nav.open { display:flex; }
  .hero-content { padding-top:7rem; }
  .hero-image { background-position:58% center; }
  .about,.contact { grid-template-columns:1fr; }
  .about-image { order:-1; }
  .about-image img { aspect-ratio:4/3; }
  .coming-grid { grid-template-columns:1fr 1fr; }
  .site-footer { grid-template-columns:1fr; justify-items:center; text-align:center; }
}
@media (max-width: 440px) {
  .coming-grid { grid-template-columns:1fr; }
  h1 { font-size:3.4rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
}
