
:root{
  --bg: #F5F2EE;
  --text: #2B2B2B;
  --muted: #6B6761;
  --gold: #C8A96A;
  --black: #1F1F1F;
  --white: #ffffff;
  --card: rgba(255,255,255,0.86);
  --shadow: 0 10px 30px rgba(31,31,31,0.12);
}
*{box-sizing:border-box}
html,body{margin:0; padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
}
a{color: inherit}
.container{width: min(1120px, calc(100% - 40px)); margin: 0 auto;}
.site-header{
  position: sticky; top: 0; z-index: 30;
  background: rgba(245,242,238,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(43,43,43,0.08);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding: 14px 0; gap: 18px;}
.brand-name{font-weight: 650; letter-spacing: 1.2px; text-decoration: none;}
.brand-sub{font-size: 12px; color: var(--muted); letter-spacing: 1.2px; text-transform: uppercase; margin-top: 2px;}
.nav{display:flex; align-items:center; gap: 18px; flex-wrap: wrap;}
.nav a{text-decoration:none; font-size: 14px; color: var(--text); opacity: 0.88;}
.nav a:hover{opacity:1}
.nav-cta{padding: 10px 14px; border: 1px solid rgba(31,31,31,0.25); border-radius: 999px;}
.nav-cta:hover{border-color: var(--gold);}
.hero{
  position: relative; min-height: 76vh; display: grid; align-items: center;
  background: linear-gradient(180deg, rgba(31,31,31,0.40), rgba(31,31,31,0.18)), var(--hero);
  background-size: cover; background-position: center;
}
.hero-overlay{position:absolute; inset:0; background: radial-gradient(60% 60% at 20% 20%, rgba(200,169,106,0.25), rgba(0,0,0,0)); pointer-events:none;}
.hero-inner{position: relative; padding: 70px 0;}
.hero-card{
  width: min(620px, 100%);
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.65);
  box-shadow: var(--shadow);
  border-radius: 18px;
  padding: 28px 26px;
}
.eyebrow{
  display:inline-block; font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
  color: rgba(43,43,43,0.85); border-left: 3px solid var(--gold); padding-left: 10px; margin-bottom: 10px;
}
.hero h1{margin: 6px 0 10px; font-size: clamp(34px, 4vw, 52px); line-height: 1.12;}
.hero p{margin: 0 0 16px; color: rgba(43,43,43,0.92); font-size: 16px;}
.buttons{display:flex; gap:10px; flex-wrap: wrap; margin-top: 10px;}
.btn{
  display:inline-block; padding: 12px 18px; border-radius: 12px;
  background: var(--black); color: var(--white); text-decoration:none;
  font-weight: 600; letter-spacing: 0.2px;
}
.btn:hover{background: var(--gold); color: var(--black);}
.btn-outline{background: transparent; border: 1px solid rgba(31,31,31,0.35); color: var(--black);}
.btn-outline:hover{border-color: var(--gold); background: rgba(200,169,106,0.12); color: var(--black);}
.micro{margin-top: 10px; font-size: 13px; color: rgba(43,43,43,0.8);}
.micro a{color: var(--black); text-decoration: underline; text-decoration-color: rgba(200,169,106,0.9);}
.trust{padding: 28px 0 10px;}
.trust-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px;}
.trust-item{background: rgba(255,255,255,0.65); border: 1px solid rgba(43,43,43,0.06); border-radius: 16px; padding: 16px 16px;}
.trust-title{font-weight: 650; margin-bottom: 4px;}
.trust-text{color: rgba(43,43,43,0.75); font-size: 14px;}
section{padding: 70px 0;}
.section-head{text-align:center; margin-bottom: 26px;}
.section-head h2{margin: 0 0 10px; font-size: 30px;}
.section-head p{margin: 0 auto; color: rgba(43,43,43,0.75); max-width: 760px;}
.section-head.light h2, .section-head.light p{color: rgba(255,255,255,0.95);}
.section-head.light p{color: rgba(255,255,255,0.80);}
.about-grid{display:grid; grid-template-columns: 420px 1fr; gap: 34px; align-items: center;}
.about-image img{width: 100%; height: auto; border-radius: 18px; box-shadow: var(--shadow);}
.about-content h2{margin:0 0 12px; font-size: 34px;}
.about-copy p{margin: 0 0 14px; color: rgba(43,43,43,0.85);}
.about-actions{display:flex; gap: 10px; flex-wrap: wrap; margin-top: 14px;}
.services .cards{display:grid; grid-template-columns: repeat(4, 1fr); gap: 14px;}
.card{background: rgba(255,255,255,0.70); border: 1px solid rgba(43,43,43,0.06); border-radius: 16px; padding: 16px 16px;}
.card-title{font-weight: 650; margin-bottom: 8px;}
.card p{margin:0; color: rgba(43,43,43,0.75); font-size: 14px;}
.listings{
  position: relative;
  background: linear-gradient(180deg, rgba(31,31,31,0.70), rgba(31,31,31,0.55)), var(--banner);
  background-size: cover; background-position: center;
}
.listings-overlay{position:absolute; inset:0; background: radial-gradient(70% 70% at 80% 20%, rgba(200,169,106,0.25), rgba(0,0,0,0)); pointer-events:none;}
.listings .container{position: relative;}
.listing-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 26px;}
.listing{
  text-decoration:none; background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18); border-radius: 18px; overflow: hidden;
  backdrop-filter: blur(6px); transition: transform 0.15s ease, border-color 0.15s ease;
}
.listing:hover{transform: translateY(-2px); border-color: rgba(200,169,106,0.7);}
.listing-photo{height: 170px; background: rgba(255,255,255,0.12); display:flex; align-items:center; justify-content:center; color: rgba(255,255,255,0.7); letter-spacing: 1px; text-transform: uppercase; font-size: 12px;}
.listing-body{padding: 14px 14px 16px;}
.listing-title{color: rgba(255,255,255,0.95); font-weight: 700; margin-bottom: 6px;}
.listing-meta{color: rgba(255,255,255,0.75); font-size: 13px; margin-bottom: 8px;}
.listing-price{color: rgba(255,255,255,0.95); font-weight: 700; margin-bottom: 10px;}
.listing-link{color: var(--gold); font-weight: 650; font-size: 13px;}
.center{text-align:center; margin-top: 22px;}
.newsletter{padding: 55px 0;}
.newsletter-inner{display:flex; align-items:center; justify-content:space-between; gap: 16px; background: rgba(255,255,255,0.65); border: 1px solid rgba(43,43,43,0.06); border-radius: 18px; padding: 18px 18px;}
.newsletter h2{margin:0 0 6px; font-size: 24px;}
.newsletter p{margin:0; color: rgba(43,43,43,0.75);}
.quicklinks .quick-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 12px;}
.quick{text-decoration:none; background: rgba(255,255,255,0.70); border: 1px solid rgba(43,43,43,0.06); border-radius: 16px; padding: 16px 16px; font-weight: 650;}
.quick:hover{border-color: rgba(200,169,106,0.7);}
.contact{padding-bottom: 90px;}
.contact-inner{text-align:center;}
.contact-sub{color: rgba(43,43,43,0.75); margin-top: -6px;}
.contact-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 24px;}
.contact-card{background: rgba(255,255,255,0.70); border: 1px solid rgba(43,43,43,0.06); border-radius: 16px; padding: 16px 16px;}
.contact-label{font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: rgba(43,43,43,0.65); margin-bottom: 8px;}
.contact-link{text-decoration:none; font-weight: 650;}
.social-icons{display:flex; justify-content:center; gap: 12px;}
.icon{width: 42px; height: 42px; border-radius: 999px; display:grid; place-items:center; border: 1px solid rgba(43,43,43,0.12); background: rgba(245,242,238,0.6);}
.icon:hover{border-color: rgba(200,169,106,0.9);}
.icon svg{width: 20px; height: 20px; fill: rgba(43,43,43,0.9);}
.fineprint{margin-top: 18px; font-size: 12px; color: rgba(43,43,43,0.65);}
.footer{background: rgba(31,31,31,0.95); color: rgba(255,255,255,0.9); padding: 26px 0;}
.footer-inner{display:flex; align-items:center; justify-content:space-between;}
.footer a{color: rgba(255,255,255,0.85); text-decoration:none;}
.footer a:hover{color: var(--gold);}
@media (max-width: 980px){
  .trust-grid{grid-template-columns: 1fr; }
  .about-grid{grid-template-columns: 1fr; }
  .services .cards{grid-template-columns: 1fr 1fr; }
  .listing-grid{grid-template-columns: 1fr; }
  .quicklinks .quick-grid{grid-template-columns: 1fr; }
  .contact-grid{grid-template-columns: 1fr; }
  .nav{justify-content:flex-end;}
}

/* Photo strip above Meet Cortney copy */
.about-strip{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0 18px;
}
.about-strip img{
  width:100%;
  height: 110px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(43,43,43,0.06);
  box-shadow: 0 8px 22px rgba(31,31,31,0.08);
}

/* Carousels (Open Houses / New Listings) */
.market .section-head{margin-bottom: 18px;}
.carousel{
  background: rgba(255,255,255,0.60);
  border: 1px solid rgba(43,43,43,0.06);
  border-radius: 18px;
  padding: 16px 16px 14px;
}
.carousel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.carousel-head h3{
  margin: 0;
  font-size: 18px;
  letter-spacing: 0.2px;
}
.carousel-controls{
  display:flex;
  gap: 8px;
}
.carousel-controls button{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(43,43,43,0.14);
  background: rgba(245,242,238,0.8);
  color: rgba(43,43,43,0.9);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.carousel-controls button:hover{
  border-color: rgba(200,169,106,0.9);
}

.slides-viewport{ overflow: hidden; width: 100%; }
.slides-track{
  display:grid;
  grid-auto-flow: column;
  grid-auto-columns: min(320px, 85%);
  gap: 12px;
  transition: transform 0.35s ease;
  will-change: transform;
}
.slide-card{
  display:block;
  text-decoration:none;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(43,43,43,0.08);
  background: rgba(255,255,255,0.75);
  box-shadow: 0 10px 26px rgba(31,31,31,0.10);
}
.slide-img{
  height: 150px;
  background-size: cover;
  background-position: center;
}
.slide-body{padding: 14px 14px 16px;}
.slide-kicker{
  font-size: 12px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: rgba(43,43,43,0.65);
  margin-bottom: 6px;
}
.slide-title{ font-weight: 750; margin-bottom: 6px; }
.slide-meta{
  color: rgba(43,43,43,0.72);
  font-size: 14px;
  margin-bottom: 10px;
}
.slide-price{ font-weight: 750; margin-bottom: 8px; }
.slide-link{ color: rgba(200,169,106,1); font-weight: 650; font-size: 13px; }

.slides-dots{
  display:flex;
  gap: 8px;
  justify-content:center;
  margin-top: 10px;
}
.dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 0;
  background: rgba(43,43,43,0.20);
  cursor: pointer;
}
.dot.active{ background: rgba(200,169,106,1); }

@media (max-width: 980px){
  .about-strip img{height: 92px;}
}

/* Home Value (Seller Lead Magnet) */
.homevalue{
  padding: 40px 0 10px;
}
.homevalue-card{
  background: rgba(255,255,255,0.70);
  border: 1px solid rgba(43,43,43,0.06);
  border-radius: 18px;
  padding: 22px 18px;
  box-shadow: 0 10px 26px rgba(31,31,31,0.08);
}
.homevalue-card h2{
  margin: 0 0 10px;
  font-size: 28px;
}
.homevalue-card p{
  margin: 0;
  color: rgba(43,43,43,0.78);
  max-width: 900px;
}

/* Header social icons */
.header-social{display:flex; gap:10px; align-items:center;}
.icon-link{width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(31,31,31,0.18); border-radius:999px; color:var(--ink); background:rgba(255,255,255,0.75);}
.icon-link svg{width:18px; height:18px; fill:currentColor; opacity:0.9;}
.icon-link:hover{background:rgba(255,255,255,0.95);}

/* Award row */
.award-row{display:flex; gap:14px; align-items:center; margin-top:18px;}
.award-badge{width:96px; height:auto;}
.small{font-size:0.92rem;}

@media (max-width: 900px){
  .header-social{display:none;}
}
