/* ===== Brand ===== */
:root{
  --sand:#eae4df;
  --clay:#ba8c73;
  --navy:#041f38;
  --white:#fff;
  --ink:#041f38;
  --maxw:1280px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ===== Gotham =====
   Gotham is a commercial font. Put your licensed files in /fonts and they are used automatically.
   Until then, Montserrat (similar geometric look) is loaded as a fallback. */
@font-face{font-family:"Gotham";src:url("../fonts/Gotham-Light.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Gotham";src:url("../fonts/Gotham-Book.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Gotham";src:url("../fonts/Gotham-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Gotham";src:url("../fonts/Gotham-Bold.woff2") format("woff2");font-weight:700;font-display:swap}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{font-family:"Gotham","Montserrat",Helvetica,Arial,sans-serif;font-weight:400;color:var(--ink);background:var(--sand);line-height:1.8;font-size:15px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-weight:500;letter-spacing:.08em;line-height:1.2}
.eyebrow{font-size:11px;letter-spacing:.35em;text-transform:uppercase;color:var(--sand);margin-bottom:18px;font-weight:500}
.eyebrow.dark{color:var(--clay)}

/* ===== Buttons ===== */
.btn{display:inline-block;padding:15px 38px;border:1px solid var(--sand);color:var(--sand);text-decoration:none;font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;background:transparent;cursor:pointer;transition:.35s var(--ease);font-family:inherit}
.btn:hover{background:var(--clay);border-color:var(--clay);color:var(--white)}
.btn.dark{background:var(--navy);border-color:var(--navy);color:var(--sand)}
.btn.dark:hover{background:var(--clay);border-color:var(--clay)}
.btn.ghost{border-color:var(--navy);color:var(--navy)}
.btn.ghost:hover{background:var(--navy);color:var(--sand)}

/* ===== Header ===== */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:26px 48px;transition:.4s var(--ease);color:var(--white)}
.site-header.solid{background:var(--navy);padding:16px 48px;box-shadow:0 2px 20px rgba(0,0,0,.15)}
.logo{text-decoration:none;font-size:18px;letter-spacing:.4em;font-weight:500;display:flex;gap:.6em}
.logo-mark.light{font-weight:300;color:var(--clay)}
.nav{display:flex;gap:34px;align-items:center}
.nav a{text-decoration:none;font-size:11px;letter-spacing:.25em;text-transform:uppercase;font-weight:500;position:relative;padding:4px 0}
.nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:var(--clay);transition:width .35s var(--ease)}
.nav a:hover::after{width:100%}
.burger{display:none;background:none;border:0;width:36px;height:28px;position:relative;cursor:pointer}
.burger span{position:absolute;left:4px;right:4px;height:1.5px;background:currentColor;transition:.3s}
.burger span:first-child{top:9px}.burger span:last-child{top:17px}
.burger[aria-expanded="true"] span:first-child{top:13px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:13px;transform:rotate(-45deg)}

/* ===== Hero ===== */
.hero{position:relative;height:100vh;min-height:620px;color:var(--white);display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:zoom 18s ease-out forwards}
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,31,56,.55) 0%,rgba(4,31,56,.38) 30%,rgba(4,31,56,.42) 60%,rgba(4,31,56,.65) 100%)}
.hero-content{text-shadow:0 2px 28px rgba(4,31,56,.6);position:relative;padding:0 24px;animation:rise 1.4s var(--ease) both .2s}
@keyframes rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero h1{font-size:clamp(40px,8vw,104px);font-weight:300;letter-spacing:.22em;margin-bottom:14px;padding-left:.22em}
.hero-sub{font-size:clamp(13px,1.6vw,17px);letter-spacing:.2em;text-transform:uppercase;margin-bottom:40px;font-weight:300}
.hero-price{text-align:left;position:absolute;left:48px;bottom:36px;font-size:22px;letter-spacing:.12em;font-weight:300}
.hero-price span{display:block;font-size:10px;letter-spacing:.35em;text-transform:uppercase;color:var(--clay);font-weight:500}

/* ===== Stats ===== */
.stats{background:var(--navy);color:var(--sand);display:grid;grid-template-columns:repeat(4,1fr);max-width:none}
.stat{padding:48px 16px;text-align:center;border-right:1px solid rgba(234,228,223,.12)}
.stat:last-child{border:0}
.stat svg{width:42px;height:42px;fill:none;stroke:var(--clay);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 14px}
.stat b{display:block;font-size:26px;font-weight:300;letter-spacing:.1em}
.stat span{font-size:10px;letter-spacing:.35em;text-transform:uppercase;color:var(--clay);font-weight:500}

/* ===== About ===== */
.about{max-width:var(--maxw);margin:0 auto;padding:130px 48px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.about h2{font-size:clamp(22px,2.6vw,34px);margin-bottom:22px}
.price{font-size:24px;letter-spacing:.14em;color:var(--clay);font-weight:500;margin-bottom:26px}
.about p+p{margin-top:16px}
.actions{margin-top:38px;display:flex;gap:14px;flex-wrap:wrap}
.about-img{position:relative;height:620px}
.about-img img{position:absolute;object-fit:cover}
.about-img img:first-child{width:78%;height:76%;top:0;right:0}
.about-img img:last-child{width:58%;height:48%;left:0;bottom:0;border:10px solid var(--sand)}

/* ===== Banner ===== */
.banner{height:75vh;min-height:380px;background-size:cover;background-position:center;background-attachment:fixed}

/* ===== Video ===== */
.video{background:var(--navy);color:var(--sand);padding:110px 24px 120px}
.video-head{text-align:center;margin-bottom:46px}
.video h3{font-size:clamp(24px,3vw,38px);font-weight:300;letter-spacing:.25em}
.video-wrap{position:relative;max-width:1200px;margin:0 auto;aspect-ratio:16/9;background:#000}
.video-wrap video{width:100%;height:100%;display:block;object-fit:cover}
.play{position:absolute;inset:0;margin:auto;width:92px;height:92px;border-radius:50%;border:1px solid var(--sand);background:rgba(4,31,56,.35);cursor:pointer;transition:.35s var(--ease);display:flex;align-items:center;justify-content:center}
.play svg{width:34px;height:34px;fill:var(--sand);margin-left:4px}
.play:hover{background:var(--clay);border-color:var(--clay)}
.video-wrap.playing .play{display:none}

/* ===== Features ===== */
.features{max-width:1000px;margin:0 auto;padding:120px 48px}
.features-head{text-align:center;margin-bottom:50px}
.features h3,.gallery h3,.location h3,.contact h3{font-size:clamp(24px,3vw,38px);font-weight:300;letter-spacing:.25em}
.feature-list{list-style:none}
.feature-list li{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid rgba(4,31,56,.15)}
.feature-list b{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--clay);font-weight:500;padding-top:3px}

/* ===== Gallery ===== */
.gallery{background:var(--navy);color:var(--sand);padding:110px 24px 120px}
.gallery-head{text-align:center;margin-bottom:46px}
.filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:34px}
.filters button{background:none;border:1px solid rgba(234,228,223,.3);color:var(--sand);padding:10px 20px;font:500 10px "Gotham","Montserrat",sans-serif;letter-spacing:.25em;text-transform:uppercase;cursor:pointer;transition:.3s}
.filters button:hover,.filters button.on{background:var(--clay);border-color:var(--clay);color:#fff}
.grid{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid a{display:block;overflow:hidden;cursor:zoom-in;position:relative;background:#0a2c4d;aspect-ratio:4/3}
.grid img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),opacity .6s;opacity:0}
.grid img.in{opacity:1}
.grid a:hover img{transform:scale(1.05)}
.grid a.hide,.grid a.cap{display:none}
.more-wrap{text-align:center;margin-top:44px}
.more-wrap[hidden]{display:none}

/* ===== Location ===== */
.location{max-width:var(--maxw);margin:0 auto;padding:120px 48px;display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:center}
.location h3{margin-bottom:22px}
.distances{list-style:none;margin:30px 0 36px}
.distances li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(4,31,56,.15)}
.distances b{color:var(--clay);font-weight:500;letter-spacing:.1em}
.location-map iframe{width:100%;height:480px;border:0;filter:grayscale(.5) sepia(.15)}

/* ===== Footer ===== */
.footer{background:var(--navy);color:var(--sand);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:30px 48px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.footer a{text-decoration:none;color:var(--clay)}

/* ===== Lightbox ===== */
.lb{position:fixed;inset:0;background:rgba(4,31,56,.96);z-index:100;display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}
.lb img{max-width:92vw;max-height:88vh;object-fit:contain}
.lb button{position:absolute;background:none;border:0;color:var(--sand);cursor:pointer;font-size:46px;line-height:1;padding:16px;transition:color .2s}
.lb button:hover{color:var(--clay)}
.lb-close{top:10px;right:20px;font-size:52px!important}
.lb-prev{left:10px;top:50%;transform:translateY(-50%)}
.lb-next{right:10px;top:50%;transform:translateY(-50%)}
.lb-count{position:absolute;bottom:18px;font-size:11px;letter-spacing:.3em;color:var(--clay)}

/* ===== Reveal ===== */
.reveal{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ===== Responsive ===== */
@media (max-width:980px){
  .site-header,.site-header.solid{padding:16px 24px}
  .burger{display:block}
  .nav{position:fixed;inset:0 0 0 auto;width:min(320px,82vw);background:var(--navy);flex-direction:column;justify-content:center;gap:28px;transform:translateX(100%);transition:transform .45s var(--ease)}
  .nav.open{transform:none}
  .burger{z-index:2}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2n){border-right:0}
  .stat{border-bottom:1px solid rgba(234,228,223,.12)}
  .about,.location{grid-template-columns:1fr;gap:50px;padding:80px 24px}
  .about-img{height:480px}
  .banner{background-attachment:scroll;height:50vh}
  .features{padding:80px 24px}
  .feature-list li{grid-template-columns:1fr;gap:4px}
  .hero-price{left:24px;bottom:24px}
  .footer{padding:26px 24px;justify-content:center;text-align:center}
}
@media (max-width:560px){
  .play{width:68px;height:68px}
  .grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .location-map iframe{height:340px}
  .about-img{height:380px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}

/* ===== Floorplans ===== */
.plans{max-width:var(--maxw);margin:0 auto;padding:120px 48px}
.plans-head{text-align:center;margin-bottom:56px}
.plans h3{font-size:clamp(24px,3vw,38px);font-weight:300;letter-spacing:.25em}
.plans-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.plan a{display:block;background:#fff;padding:22px;cursor:zoom-in;overflow:hidden}
.plan img{width:100%;height:auto;transition:transform .6s var(--ease)}
.plan a:hover img{transform:scale(1.03)}
.plan figcaption{margin-top:18px;text-align:center;font-size:11px;letter-spacing:.35em;text-transform:uppercase;color:var(--clay);font-weight:500}
@media (max-width:980px){
  .plans{padding:80px 24px}
  .plans-grid{grid-template-columns:1fr;gap:34px}
}

.hero .eyebrow{color:#fff}