
:root{
  --ink:#171918;
  --ivory:#f5f0e7;
  --paper:#fffdf9;
  --stone:#b4aa9f;
  --sage:#708073;
  --slate:#5a6972;
  --line:rgba(23,25,24,.14);
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Inter", Arial, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px clamp(20px,4vw,66px);
  background:rgba(245,240,231,.91);
  border-bottom:1px solid var(--line);
  box-shadow:0 8px 30px rgba(23,25,24,.05);
  backdrop-filter:blur(16px);
}
.brand img{width:250px;max-height:66px;object-fit:contain}
nav{display:flex;gap:28px;align-items:center;font-size:.87rem;font-weight:600}
nav a{position:relative}
nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:1px;background:currentColor;transition:.25s}
nav a:hover::after{width:100%}
.menu-button{display:none;background:none;border:1px solid var(--ink);padding:8px 12px}

.hero{
  min-height:96vh;position:relative;display:flex;align-items:flex-end;
  background:url("assets/hero.jpg") center 54%/cover no-repeat;
  padding:160px clamp(22px,8vw,120px) 90px;
}
.hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(14,16,15,.75) 0%,rgba(14,16,15,.48) 45%,rgba(14,16,15,.08) 80%);
}
.hero-copy{position:relative;z-index:2;color:white;max-width:790px}
.kicker{text-transform:uppercase;letter-spacing:.23em;font-size:.74rem;font-weight:700;margin:0 0 12px}
.kicker.light{color:rgba(255,255,255,.76)}
.hero h1,.section-heading h2,.story h2,.ahead h2,.connect h2{
  font-family:var(--serif);font-weight:600;letter-spacing:-.025em;line-height:1;
}
.hero h1{font-size:clamp(3.3rem,6vw,6.2rem);margin:.15em 0 .28em}
.hero-intro{font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:670px;margin-bottom:30px}
.button{display:inline-block;padding:14px 22px;font-weight:700;border:1px solid transparent}
.button-ivory{background:var(--ivory);color:var(--ink)}

.section{padding:105px clamp(22px,6vw,96px)}
.muted{background:var(--ivory)}
.section-heading{max-width:780px;margin-bottom:46px}
.section-heading.centered{text-align:center;margin-left:auto;margin-right:auto}
.section-heading h2,.story h2,.ahead h2,.connect h2{font-size:clamp(2.65rem,5vw,4.9rem);margin:.12em 0 .26em}
.section-heading p:last-child{max-width:650px;color:#535a56}

.chronicle-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:18px}
.update-card{background:white;border:1px solid var(--line);padding:30px;min-height:250px}
.update-card.feature{display:flex;gap:24px;align-items:flex-start}
.update-date{width:82px;min-width:82px;aspect-ratio:1;display:grid;place-content:center;text-align:center;background:var(--ink);color:#fff}
.update-date span{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em}
.update-date strong{font-family:var(--serif);font-size:2.35rem;line-height:.85}
.card-label,.meta{text-transform:uppercase;letter-spacing:.14em;font-size:.69rem;font-weight:700;color:var(--sage)}
.update-card h3,.amenity h3{font-family:var(--serif);font-size:1.85rem;line-height:1.08;margin:.5em 0}

.amenities{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}
.amenity{background:rgba(255,255,255,.7);border:1px solid var(--line);padding:27px;min-height:235px}
.amenity.wide{grid-column:1/-1;min-height:auto;display:flex;gap:22px;align-items:center}
.amenity-mark{font-size:1.7rem;color:var(--sage)}
.ahead{margin-top:72px;background:var(--ink);color:#fff;padding:clamp(34px,6vw,72px);display:grid;grid-template-columns:1fr 1.15fr;gap:60px}
.ahead p{color:rgba(255,255,255,.78)}
.ahead-list>div{display:grid;gap:4px;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.17)}
.ahead-list strong{font-family:var(--serif);font-size:1.5rem}
.ahead-list span{color:rgba(255,255,255,.72)}

.story{display:grid;grid-template-columns:1fr .9fr;gap:72px;align-items:center}
.story-copy{max-width:720px}
.flourish{width:205px;margin:20px 0 30px;opacity:.8}
.lead{font-family:var(--serif);font-size:clamp(1.55rem,2.5vw,2.25rem);line-height:1.25}
.motto{text-transform:uppercase;letter-spacing:.13em;font-size:.78rem;font-weight:700;margin-top:28px}
.story-image{margin:0;padding:14px;background:var(--ivory);border:1px solid var(--line)}
.story-image img{width:100%;aspect-ratio:4/5;object-fit:cover}

.neighborhood{background:#ebe6dd}
.panorama{margin:0}
.panorama img{width:100%;height:min(60vw,660px);object-fit:cover;object-position:center;border:1px solid rgba(23,25,24,.12)}
.panorama figcaption{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:#646b67;margin-top:11px}

.photo-strip{display:grid;grid-template-columns:1fr 1fr 1fr;height:420px}
.photo-strip figure{margin:0;overflow:hidden}
.photo-strip img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.photo-strip figure:hover img{transform:scale(1.025)}

.connect-inner{max-width:760px;margin:auto;text-align:center}
.crest{width:105px;margin:0 auto 20px}
footer{text-align:center;background:var(--ink);color:#fff;padding:58px 20px}
footer img{width:290px;margin:0 auto 17px;filter:invert(1) grayscale(1) brightness(3)}
footer p{font-family:var(--serif);font-size:1.8rem;margin:0}
footer small{display:block;margin-top:8px;text-transform:uppercase;letter-spacing:.15em;opacity:.68}

.reveal{opacity:0;transform:translateY(22px);transition:.75s ease}
.reveal.visible{opacity:1;transform:none}

@media(max-width:940px){
  .menu-button{display:block}
  nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:22px;flex-direction:column;align-items:flex-start;border-top:1px solid var(--line)}
  nav.open{display:flex}
  .chronicle-grid{grid-template-columns:1fr 1fr}
  .update-card.feature{grid-column:1/-1}
  .amenities{grid-template-columns:1fr 1fr}
  .story,.ahead{grid-template-columns:1fr}
  .photo-strip{height:320px}
}
@media(max-width:620px){
  .brand img{width:205px}
  .hero{min-height:88vh;padding:140px 22px 62px;background-position:57% center}
  .hero h1{font-size:3.55rem}
  .section{padding:78px 20px}
  .chronicle-grid,.amenities{grid-template-columns:1fr}
  .update-card.feature{grid-column:auto;flex-direction:column}
  .amenity.wide{display:block}
  .photo-strip{grid-template-columns:1fr;height:auto}
  .photo-strip figure{height:260px}
}




/* Refined closing connection panel */
.connect{
  padding-top:90px;
  padding-bottom:90px;
}

.connect-panel{
  max-width:900px;
  margin:0 auto;
  padding:64px 48px;
  text-align:center;
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 18px 50px rgba(23,25,24,.06);
}

.connect-crest{
  width:95px;
  margin:0 auto 20px;
}

.connect-panel h2{
  max-width:700px;
  margin:0 auto 20px;
}

.connect-copy{
  max-width:680px;
  margin:0 auto;
  color:#555d58;
}

.connect-buttons{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
  margin-top:34px;
}

.connect-motto{
  margin-top:32px;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sage);
}

.button-dark{
  background:var(--ink);
  color:white;
  border:1px solid var(--ink);
}

.button-outline{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--ink);
}

.button-outline:hover{
  background:var(--ink);
  color:white;
}

/* Plot map overview */
.plot-overview{
  background:var(--paper);
}

.plot-map{
  max-width:1200px;
  margin:0 auto;
}

.plot-map img{
  width:100%;
  height:auto;
  border:1px solid var(--line);
  background:white;
  box-shadow:0 20px 55px rgba(23,25,24,.08);
}

.plot-map-placeholder{
  min-height:420px;
  display:grid;
  place-content:center;
  gap:8px;
  text-align:center;
  border:1px dashed rgba(23,25,24,.28);
  background:var(--ivory);
  color:#59605c;
}

.plot-map-placeholder p{
  margin:0;
  font-family:var(--serif);
  font-size:2rem;
  color:var(--ink);
}

.plot-map-placeholder span{
  font-size:.9rem;
}

.plot-map:has(img[src]){
  position:relative;
}

.plot-map img:not([style*="display: none"]) + *{
  display:none;
}

@media(max-width:620px){
  .connect-panel{
    padding:46px 22px;
  }

  .connect-buttons{
    flex-direction:column;
  }

  .connect-buttons .button{
    width:100%;
  }

  .plot-map-placeholder{
    min-height:280px;
    padding:28px;
  }
}


/* RC2 — quieter, community-first refinements */
.about{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:72px;
  align-items:center;
}

.about-copy{
  max-width:720px;
}

.about h2{
  font-family:var(--serif);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1;
  font-size:clamp(2.65rem,5vw,4.9rem);
  margin:.12em 0 .26em;
}

.about-image{
  margin:0;
  padding:14px;
  background:var(--ivory);
  border:1px solid var(--line);
}

.about-image img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
}

.ahead-section{
  padding-top:0;
  padding-bottom:105px;
  background:var(--ivory);
}

.plot-map figcaption{
  margin-top:11px;
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#646b67;
}

.plot-map a{
  display:block;
}

.plot-map img{
  cursor:zoom-in;
}

@media(max-width:940px){
  .about{
    grid-template-columns:1fr;
  }
}
