
:root {
  --ink: #1f2420;
  --cream: #f4efe6;
  --paper: #fffdf9;
  --sage: #7e8b7a;
  --sage-dark: #526052;
  --line: #ded8ce;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "DM Sans", sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.6;
}
.wrap { width: min(1120px, 90%); margin: 0 auto; }

.hero {
  min-height: 82vh;
  position: relative;
  color: white;
  display: flex;
  flex-direction: column;
  background:
    linear-gradient(rgba(18,24,20,.30), rgba(18,24,20,.58)),
    url("images/hero.jpg") center/cover no-repeat,
    #536054;
}
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.35), rgba(0,0,0,.05)); }
.nav {
  position: relative;
  z-index: 2;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:28px 0;
}
.brand { font-weight:700; letter-spacing:.12em; font-size:.9rem; }
.brand span { font-weight:400; opacity:.85; }
.nav-phone { color:white; text-decoration:none; font-weight:600; }

.hero-content {
  position:relative;
  z-index:2;
  margin:auto;
  padding:60px 0 90px;
}
.eyebrow {
  font-size:.8rem;
  letter-spacing:.18em;
  font-weight:700;
  text-transform:uppercase;
  margin-bottom:14px;
}
.eyebrow.dark { color:var(--sage-dark); }
.hero h1, h2 {
  font-family:"Playfair Display", serif;
  line-height:1.08;
  margin:0 0 20px;
}
.hero h1 { font-size:clamp(3rem,7vw,6.5rem); max-width:850px; }
h2 { font-size:clamp(2.1rem,4vw,3.8rem); }
.hero-sub { font-size:1.15rem; }
.hero-sub span { margin:0 8px; opacity:.7; }
.price { font-size:clamp(2rem,4vw,3.2rem); font-weight:700; margin:18px 0 26px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }

.btn {
  display:inline-block;
  padding:14px 24px;
  border-radius:4px;
  text-decoration:none;
  font-weight:700;
  border:1px solid transparent;
  cursor:pointer;
  font-family:inherit;
  font-size:1rem;
}
.btn-primary { background:var(--cream); color:var(--ink); }
.btn-secondary { border-color:white; color:white; background:rgba(255,255,255,.08); }
.full { width:100%; background:var(--sage-dark); color:white; }

.intro {
  padding:95px 0;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:70px;
  align-items:start;
}
.intro-copy p { font-size:1.08rem; color:#50564f; }
.feature-card {
  background:var(--cream);
  padding:34px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
.feature { border-bottom:1px solid #d6cec1; padding-bottom:20px; }
.feature strong { display:block; font-family:"Playfair Display",serif; font-size:2rem; }
.feature span { color:#676b66; }

.photo-grid {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  grid-template-rows:260px 260px;
  gap:14px;
  margin-bottom:95px;
}
.photo {
  background:#dfe2dc center/cover no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#70756f;
  font-weight:600;
  min-height:220px;
}
.photo.large { grid-row:1 / span 2; }
.photo-1 { background-image:url("images/exterior.jpg"); }
.photo-2 { background-image:url("images/interior.jpg"); }
.photo-3 { background-image:url("images/kitchen.jpg"); }
.photo-4 { background-image:url("images/backyard.jpg"); }
.photo-5 { background-image:url("images/bedroom.jpg"); }
.photo span {
  background:rgba(255,255,255,.82);
  padding:9px 13px;
  border-radius:3px;
}

.why { background:var(--cream); padding:90px 0; }
.center { text-align:center; max-width:820px; margin-left:auto; margin-right:auto; }
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.why-card { background:var(--paper); padding:32px; }
.icon { font-size:2rem; }
.why-card h3 { margin:12px 0 8px; }
.why-card p { margin:0; color:#5c625d; }

.cta {
  background:var(--sage-dark);
  color:white;
  padding:95px 0;
}
.cta-grid { display:grid; grid-template-columns:1fr .9fr; gap:70px; align-items:start; }
.cta-copy p { color:#e7ebe6; font-size:1.08rem; }
.agent-card {
  display:flex; gap:16px; align-items:center; margin-top:34px;
}
.agent-avatar {
  width:58px; height:58px; border-radius:50%; background:var(--cream); color:var(--ink);
  display:flex; align-items:center; justify-content:center; font-weight:800;
}
.agent-card strong, .agent-card span, .agent-card a { display:block; }
.agent-card span { opacity:.8; font-size:.9rem; }
.agent-card a { color:white; font-weight:700; margin-top:3px; }

.tour-form {
  background:white;
  color:var(--ink);
  padding:34px;
  border-radius:6px;
  box-shadow:0 18px 45px rgba(0,0,0,.16);
}
.tour-form h3 { font-family:"Playfair Display",serif; font-size:2rem; margin-top:0; }
.tour-form label { display:block; font-weight:600; margin:14px 0; font-size:.92rem; }
.tour-form input, .tour-form textarea {
  width:100%; margin-top:6px; padding:12px 13px;
  border:1px solid #d9d9d9; border-radius:3px; font:inherit;
}
.form-note { text-align:center; color:#777; font-size:.82rem; margin-bottom:0; }
.hidden { display:none; }

footer { padding:28px 0; border-top:1px solid var(--line); }
.footer-grid { display:flex; justify-content:space-between; gap:20px; align-items:center; }
footer p { margin:2px 0 0; color:#70746f; font-size:.88rem; }
footer a { color:var(--ink); font-weight:700; text-decoration:none; }

@media (max-width: 800px) {
  .hero { min-height:72vh; }
  .nav { padding-top:20px; }
  .brand span { display:none; }
  .intro, .cta-grid { grid-template-columns:1fr; gap:38px; }
  .intro { padding:65px 0; }
  .photo-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .photo.large { grid-row:auto; grid-column:1 / -1; height:340px; }
  .why-grid { grid-template-columns:1fr; }
  .footer-grid { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 520px) {
  .photo-grid { grid-template-columns:1fr; }
  .photo.large { grid-column:auto; height:280px; }
  .feature-card { grid-template-columns:1fr 1fr; padding:24px; }
}

.full-gallery { padding: 10px 0 95px; }
.gallery-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:38px;
}
.gallery-grid img {
  width:100%;
  height:245px;
  object-fit:cover;
  display:block;
}
.gallery-grid img:nth-child(1),
.gallery-grid img:nth-child(7) {
  grid-column:span 2;
}
@media (max-width:800px) {
  .gallery-grid { grid-template-columns:1fr 1fr; }
  .gallery-grid img, .gallery-grid img:nth-child(1), .gallery-grid img:nth-child(7) {
    grid-column:auto;
    height:210px;
  }
}
@media (max-width:520px) {
  .gallery-grid { grid-template-columns:1fr; }
  .gallery-grid img { height:auto; }
}

.staging-section { padding: 0 0 95px; }
.staging-note { max-width:760px; margin:14px auto 28px; text-align:center; color:#5f625d; line-height:1.7; }
.staging-image { width:100%; display:block; border-radius:6px; box-shadow:0 12px 30px rgba(0,0,0,.10); }
