/* ================================================================
   SHARON WISNIEWSKI — Luxury Real Estate
   Inspired by The Karas Group aesthetic
   Fonts: Playfair Display (headings) + Montserrat (body)
   Palette: Black #0a0a0a, White #fff, Gold #C9A84C, Cream #F8F5F0
   ================================================================ */

/* ---------- RESET & BASE ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Montserrat',sans-serif;color:#222;background:#fff;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit;transition:color .3s}
ul{list-style:none}

/* ---------- UTILITY ---------- */
.container{max-width:1280px;margin:0 auto;padding:0 2rem}
.overline{font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.35em;text-transform:uppercase;color:#C9A84C}
.overline--white{color:rgba(255,255,255,.6)}
.gold{color:#C9A84C}

/* ---------- TYPOGRAPHY ---------- */
h1,h2,h3,h4{font-family:'Playfair Display',serif;font-weight:400;line-height:1.15}
h1{font-size:clamp(2.6rem,5.5vw,4.5rem);letter-spacing:-.02em}
h2{font-size:clamp(2rem,4vw,3.2rem);letter-spacing:-.01em}
h3{font-size:clamp(1.4rem,2.5vw,1.8rem)}
p{font-size:.95rem;line-height:1.8;color:#555}

/* ---------- BUTTONS ---------- */
.btn{display:inline-block;padding:14px 38px;font-family:'Montserrat',sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;border:1px solid;transition:all .4s cubic-bezier(.25,.8,.25,1);cursor:pointer}
.btn--gold{border-color:#C9A84C;color:#C9A84C;background:transparent}
.btn--gold:hover{background:#C9A84C;color:#fff}
.btn--white{border-color:#fff;color:#fff;background:transparent}
.btn--white:hover{background:#fff;color:#0a0a0a}
.btn--dark{border-color:#0a0a0a;color:#0a0a0a;background:transparent}
.btn--dark:hover{background:#0a0a0a;color:#fff}
.btn--filled{background:#C9A84C;color:#fff;border-color:#C9A84C}
.btn--filled:hover{background:#b8943f;border-color:#b8943f}

/* ---------- HEADER ---------- */
.header{position:fixed;top:0;left:0;width:100%;z-index:1000;padding:1.5rem 0;transition:all .5s}
.header--scrolled{background:rgba(10,10,10,.95);padding:.8rem 0;backdrop-filter:blur(12px)}
.header__inner{display:flex;align-items:center;justify-content:space-between}
.header__logo{display:flex;align-items:center;gap:1rem}
.header__logo img{height:42px;transition:height .3s}
.header--scrolled .header__logo img{height:34px}
.header__nav{display:flex;align-items:center;gap:2.5rem}
.header__nav a{font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#fff;position:relative;padding:4px 0}
.header__nav a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:#C9A84C;transition:width .3s}
.header__nav a:hover::after{width:100%}
.header__nav a:hover{color:#C9A84C}

/* Mobile menu toggle */
.menu-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;z-index:1001}
.menu-toggle span{width:24px;height:1.5px;background:#fff;transition:all .3s}

/* ---------- HERO ---------- */
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#0a0a0a}
.hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.5s ease;z-index:1}
.hero__bg.loaded{opacity:.35}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35;z-index:1}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.1) 40%,rgba(0,0,0,.5) 100%);z-index:2}
.hero__content{position:relative;z-index:3;text-align:center;color:#fff;max-width:900px;padding:0 2rem}
.hero__content h1{color:#fff;margin-bottom:1.5rem}
.hero__content h1 em{font-style:italic;color:#C9A84C}
.hero__tagline{font-family:'Montserrat',sans-serif;font-size:.85rem;letter-spacing:.15em;color:rgba(255,255,255,.7);margin-bottom:2.5rem;font-weight:300}
.hero__line{width:60px;height:1px;background:#C9A84C;margin:0 auto 2rem}
.hero__ctas{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}

/* ---------- SECTION SHARED ---------- */
.section{padding:7rem 0}
.section--dark{background:#0a0a0a;color:#fff}
.section--dark p{color:rgba(255,255,255,.65)}
.section--dark h2,.section--dark h3{color:#fff}
.section--cream{background:#F8F5F0}
.section--texture{background:#fff}
.section__header{text-align:center;max-width:700px;margin:0 auto 4rem}
.section__header .overline{margin-bottom:1rem;display:block}
.section__header h2{margin-bottom:1.5rem}
.section__header p{color:#777}

/* ---------- INTRO / ABOUT SPLIT ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.split__image{position:relative;overflow:hidden}
.split__image img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.25,.8,.25,1)}
.split__image:hover img{transform:scale(1.03)}
.split__image::after{content:'';position:absolute;inset:0;border:1px solid rgba(201,168,76,.3);margin:1rem;pointer-events:none;transition:margin .5s}
.split__image:hover::after{margin:.5rem}
.split__text .overline{margin-bottom:1.5rem;display:block}
.split__text h2{margin-bottom:1.5rem;color:#0a0a0a}
.split__text p{margin-bottom:1.5rem}
.split__text .btn{margin-top:1rem}

/* ---------- STATS BAR ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center;padding:4rem 0}
.stat__number{font-family:'Playfair Display',serif;font-size:clamp(2.2rem,4vw,3.5rem);color:#C9A84C;font-weight:400}
.stat__label{font-family:'Montserrat',sans-serif;font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:.5rem}

/* ---------- NEIGHBORHOODS / COMMUNITIES ---------- */
.communities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:1.5rem}
.community-card{position:relative;overflow:hidden;aspect-ratio:4/3;cursor:pointer;display:block}
.community-card__image{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.25,.8,.25,1);filter:brightness(.7)}
.community-card:hover .community-card__image{transform:scale(1.08);filter:brightness(.5)}
.community-card__content{position:absolute;bottom:0;left:0;right:0;padding:2rem;z-index:2;color:#fff}
.community-card__content h3{font-family:'Playfair Display',serif;font-size:1.6rem;margin-bottom:.5rem;transform:translateY(10px);transition:transform .5s}
.community-card:hover .community-card__content h3{transform:translateY(0)}
.community-card__content p{font-size:.8rem;color:rgba(255,255,255,.7);opacity:0;transform:translateY(15px);transition:all .5s .1s;letter-spacing:.05em}
.community-card:hover .community-card__content p{opacity:1;transform:translateY(0)}
.community-card__gradient{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,transparent 60%);z-index:1}

/* ---------- LARGE FEATURE NEIGHBORHOOD ---------- */
.feature-community{display:grid;grid-template-columns:1fr 1fr;min-height:70vh}
.feature-community__image{background-size:cover;background-position:center;position:relative}
.feature-community__image::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.15)}
.feature-community__text{display:flex;flex-direction:column;justify-content:center;padding:5rem 4rem;background:#0a0a0a;color:#fff}
.feature-community__text .overline{margin-bottom:1.5rem;display:block}
.feature-community__text h2{color:#fff;margin-bottom:1.5rem}
.feature-community__text p{color:rgba(255,255,255,.65);margin-bottom:2rem}
.feature-community:nth-child(even) .feature-community__image{order:2}
.feature-community:nth-child(even) .feature-community__text{order:1}

/* ---------- TESTIMONIALS ---------- */
.testimonials{position:relative;overflow:hidden}
.testimonial-track{display:flex;transition:transform .6s cubic-bezier(.25,.8,.25,1)}
.testimonial-slide{min-width:100%;padding:0 2rem;text-align:center}
.testimonial__quote{font-family:'Playfair Display',serif;font-size:clamp(1.2rem,2.5vw,1.6rem);font-style:italic;line-height:1.8;max-width:800px;margin:0 auto 2rem;color:#333}
.testimonial__author{font-family:'Montserrat',sans-serif;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:#C9A84C}
.testimonial-dots{display:flex;justify-content:center;gap:.75rem;margin-top:2.5rem}
.testimonial-dot{width:8px;height:8px;border-radius:50%;border:1px solid #C9A84C;background:transparent;cursor:pointer;transition:background .3s}
.testimonial-dot.active{background:#C9A84C}

/* ---------- CTA BANNER ---------- */
.cta-banner{position:relative;padding:6rem 0;overflow:hidden;background:#0a0a0a}
.cta-banner__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.2}
.cta-banner__content{position:relative;z-index:2;text-align:center;color:#fff}
.cta-banner__content h2{color:#fff;margin-bottom:1rem}
.cta-banner__content p{color:rgba(255,255,255,.6);max-width:600px;margin:0 auto 2.5rem;font-size:.95rem}

/* ---------- FOOTER ---------- */
.footer{background:#0a0a0a;color:#fff;padding:5rem 0 2rem}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;margin-bottom:4rem}
.footer__brand img{height:40px;margin-bottom:1.5rem}
.footer__brand p{color:rgba(255,255,255,.5);font-size:.85rem;line-height:1.7;max-width:300px}
.footer__heading{font-family:'Montserrat',sans-serif;font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:#C9A84C;margin-bottom:1.5rem}
.footer__links a{display:block;font-size:.85rem;color:rgba(255,255,255,.5);padding:.35rem 0;transition:color .3s}
.footer__links a:hover{color:#C9A84C}
.footer__contact a{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:rgba(255,255,255,.5);padding:.35rem 0;transition:color .3s}
.footer__contact a:hover{color:#C9A84C}
.footer__contact svg{width:14px;height:14px;flex-shrink:0;fill:currentColor}
.footer__social{display:flex;gap:1rem;margin-top:1.5rem}
.footer__social a{width:36px;height:36px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s}
.footer__social a:hover{border-color:#C9A84C;background:rgba(201,168,76,.1)}
.footer__social svg{width:14px;height:14px;fill:rgba(255,255,255,.6)}
.footer__social a:hover svg{fill:#C9A84C}
.footer__bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer__bottom p{font-size:.75rem;color:rgba(255,255,255,.35);letter-spacing:.05em}
.footer__powered{font-size:.7rem;color:rgba(255,255,255,.25);letter-spacing:.15em;text-transform:uppercase}

/* ---------- NOTABLE SALES ---------- */
.notable-sales{overflow:hidden}
.notable-sales__stats{display:flex;justify-content:center;gap:3rem;margin-bottom:3.5rem;flex-wrap:wrap}
.notable-sales__stat{text-align:center}
.notable-sales__stat-number{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:400;color:#0a0a0a;letter-spacing:-.02em}
.notable-sales__stat-label{font-family:'Montserrat',sans-serif;font-size:.65rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#999;margin-top:.25rem}
.notable-sales__track-wrapper{position:relative;padding:0 0 2rem}
.notable-sales__track{display:flex;gap:1.5rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 2rem 1rem}
.notable-sales__track::-webkit-scrollbar{display:none}
.notable-sales__card{flex:0 0 340px;scroll-snap-align:start;position:relative;overflow:hidden;cursor:pointer;background:#fff;box-shadow:0 2px 20px rgba(0,0,0,.06);transition:transform .5s cubic-bezier(.25,.8,.25,1),box-shadow .5s ease}
.notable-sales__card:hover{transform:translateY(-8px);box-shadow:0 20px 60px rgba(0,0,0,.12)}
.notable-sales__card-image{aspect-ratio:4/3;overflow:hidden;position:relative}
.notable-sales__card-image img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.25,.8,.25,1),filter .6s ease;filter:brightness(.95)}
.notable-sales__card:hover .notable-sales__card-image img{transform:scale(1.08);filter:brightness(1)}
.notable-sales__card-badge{position:absolute;top:1rem;left:1rem;background:rgba(10,10,10,.75);backdrop-filter:blur(10px);padding:.4rem 1rem;font-family:'Montserrat',sans-serif;font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#C9A84C;z-index:2}
.notable-sales__card-content{padding:1.25rem 1.5rem 1.5rem}
.notable-sales__card-price{font-family:'Playfair Display',serif;font-size:1.5rem;font-weight:400;color:#0a0a0a;margin-bottom:.35rem}
.notable-sales__card-address{font-family:'Montserrat',sans-serif;font-size:.8rem;color:#666;font-weight:400;margin-bottom:.15rem}
.notable-sales__card-city{font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#C9A84C}
.notable-sales__nav{display:flex;justify-content:center;gap:1rem;margin-top:2rem}
.notable-sales__nav-btn{width:48px;height:48px;border:1px solid rgba(10,10,10,.15);background:transparent;color:#0a0a0a;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;font-size:1.2rem;font-family:'Montserrat',sans-serif}
.notable-sales__nav-btn:hover{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
.notable-sales__nav-btn:disabled{opacity:.3;cursor:default}
.notable-sales__nav-btn:disabled:hover{background:transparent;color:#0a0a0a;border-color:rgba(10,10,10,.15)}
.notable-sales__progress{display:flex;justify-content:center;gap:6px;margin-top:1.5rem}
.notable-sales__dot{width:6px;height:6px;border-radius:50%;background:rgba(10,10,10,.15);transition:all .4s ease;cursor:pointer}
.notable-sales__dot.active{background:#C9A84C;width:24px;border-radius:3px}

/* Notable sales card entrance animations */
.notable-sales__card{opacity:0;transform:translateY(40px) scale(.95)}
.notable-sales__card.visible{opacity:1;transform:translateY(0) scale(1);transition:opacity .6s cubic-bezier(.25,.8,.25,1),transform .6s cubic-bezier(.25,.8,.25,1)}
.notable-sales__card:nth-child(1).visible{transition-delay:.05s}
.notable-sales__card:nth-child(2).visible{transition-delay:.1s}
.notable-sales__card:nth-child(3).visible{transition-delay:.15s}
.notable-sales__card:nth-child(4).visible{transition-delay:.2s}
.notable-sales__card:nth-child(5).visible{transition-delay:.25s}
.notable-sales__card:nth-child(6).visible{transition-delay:.3s}
.notable-sales__card:nth-child(7).visible{transition-delay:.35s}
.notable-sales__card:nth-child(8).visible{transition-delay:.4s}

@media(max-width:768px){
  .notable-sales__card{flex:0 0 280px}
  .notable-sales__stats{gap:2rem}
  .notable-sales__nav{display:none}
}

/* ---------- REVEAL ANIMATIONS ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:all .9s cubic-bezier(.25,.8,.25,1)}
.reveal--left{transform:translateX(-40px)}
.reveal--right{transform:translateX(40px)}
.reveal.visible{opacity:1;transform:translate(0)}
.reveal-delay-1{transition-delay:.15s}
.reveal-delay-2{transition-delay:.3s}
.reveal-delay-3{transition-delay:.45s}

/* ---------- PAGE HERO (sub-pages) ---------- */
.page-hero{min-height:55vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#0a0a0a}
.page-hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.3}
.page-hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.4) 0%,rgba(0,0,0,.2) 100%);z-index:1}
.page-hero__content{position:relative;z-index:2;text-align:center;color:#fff;padding:8rem 2rem 4rem}
.page-hero__content h1{color:#fff;margin-bottom:.75rem}
.page-hero__content .overline{color:rgba(255,255,255,.5)}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1024px){
  .split{grid-template-columns:1fr;gap:2.5rem}
  .footer__grid{grid-template-columns:1fr 1fr;gap:2rem}
  .stats{grid-template-columns:repeat(2,1fr)}
  .feature-community{grid-template-columns:1fr}
  .feature-community__image{min-height:45vh}
  .feature-community__text{padding:3rem 2rem}
  .feature-community:nth-child(even) .feature-community__image{order:0}
  .feature-community:nth-child(even) .feature-community__text{order:0}
}
@media(max-width:768px){
  .header__nav{position:fixed;top:0;right:-100%;width:75%;height:100vh;background:#0a0a0a;flex-direction:column;justify-content:center;gap:2rem;transition:right .4s;padding:2rem}
  .header__nav.active{right:0}
  .menu-toggle{display:flex}
  .communities-grid{grid-template-columns:1fr}
  .community-card[style*="21/9"]{aspect-ratio:4/3 !important}
  .hero__content h1{font-size:2.2rem}
  .footer__grid{grid-template-columns:1fr}
  .footer__bottom{flex-direction:column;text-align:center}
  .hero__ctas{flex-direction:column;align-items:center}
  .stats{grid-template-columns:1fr 1fr}
}