:root{
  --black:#0a0a0a;
  --black-soft:#101010;
  --ivory:#f2eee6;
  --paper:#f3efe7;
  --muted:#a69e92;
  --champagne:#c8ad7d;
  --line:rgba(255,255,255,.14);
  --darkline:rgba(12,12,12,.15);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"DM Sans",system-ui,sans-serif;
  background:var(--black);
  color:var(--ivory);
  overflow-x:hidden;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
::selection{background:var(--champagne);color:#111}

.cursor-glow{
  position:fixed;
  width:300px;height:300px;border-radius:50%;
  pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(200,173,125,.07),transparent 65%);
  transform:translate(-50%,-50%);
  opacity:0;transition:opacity .3s ease;
}

.topbar{
  position:fixed;top:0;left:0;right:0;
  display:flex;align-items:center;justify-content:space-between;
  padding:26px 4.5vw;
  z-index:50;
  transition:.35s ease;
}
.topbar.scrolled{
  background:rgba(10,10,10,.72);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
  padding-top:18px;padding-bottom:18px;
}
.brand{display:flex;gap:14px;align-items:center;letter-spacing:.35em}
.brand-mark{font-size:28px;color:var(--champagne);font-weight:300}
.brand-name{font-size:14px}
.desktop-nav{display:flex;gap:34px;text-transform:uppercase;font-size:11px;letter-spacing:.22em}
.desktop-nav a{opacity:.82;transition:.2s}
.desktop-nav a:hover{opacity:1;color:var(--champagne)}
.menu-btn{display:none;background:none;border:0;width:34px;height:26px;position:relative;cursor:pointer}
.menu-btn span{position:absolute;left:0;width:100%;height:1px;background:var(--ivory);transition:.3s}
.menu-btn span:first-child{top:8px}.menu-btn span:last-child{top:17px}
.menu-btn.active span:first-child{transform:rotate(45deg);top:12px}
.menu-btn.active span:last-child{transform:rotate(-45deg);top:12px}

.mobile-menu{
  position:fixed;inset:0;background:rgba(10,10,10,.98);z-index:40;
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:26px;
  font-family:"Playfair Display",serif;font-size:34px;
  opacity:0;pointer-events:none;transition:.35s;
}
.mobile-menu.open{opacity:1;pointer-events:auto}

.hero{
  min-height:100vh;position:relative;display:flex;align-items:flex-end;
  padding:0 6vw 9vh;overflow:hidden;
}
.hero-image,.hero-shade{position:absolute;inset:0}
.hero-image{
  background:
    linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.12)),
    url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=2200&q=85")
    center/cover no-repeat;
  transform:scale(1.02);
}
.hero-shade{
  background:
    linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.04) 45%,rgba(0,0,0,.65) 100%),
    linear-gradient(90deg,rgba(0,0,0,.45) 0%,transparent 60%);
}
.hero-copy{position:relative;z-index:2;max-width:720px}
.eyebrow{
  font-size:10px;text-transform:uppercase;letter-spacing:.28em;color:var(--champagne);margin:0 0 18px;
}
.hero h1,.manifesto h2,.manifesto-title p,.section-head h2,.search-intro h2,
.private-copy h2,.advisory h2,.about h2,.closing h2{
  font-family:"Playfair Display",serif;font-weight:500;
}
.hero h1{font-size:clamp(48px,6.2vw,94px);line-height:.98;letter-spacing:-.035em;margin:0 0 38px}
.hero h1 em,.closing h2 em{display:block;font-weight:500;color:#d4c3a5}
.text-link{
  display:inline-flex;gap:26px;align-items:center;text-transform:uppercase;
  font-size:10px;letter-spacing:.22em;border-bottom:1px solid rgba(255,255,255,.25);
  padding-bottom:9px;
}
.text-link span{transition:transform .2s}.text-link:hover span{transform:translateX(6px)}
.hero-side{
  position:absolute;right:2.4vw;top:50%;z-index:3;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.64)
}
.scroll-cue{position:absolute;left:6vw;bottom:3.5vh;z-index:3;font-size:21px;color:var(--champagne)}

.light{background:var(--paper);color:#161616}
.dark{background:var(--black);color:var(--ivory)}

.manifesto{padding:120px 6vw}
.section-grid{
  display:grid;grid-template-columns:.65fr 2.25fr 1.2fr;gap:6vw;align-items:start
}
.kicker{font-size:10px;letter-spacing:.23em;text-transform:uppercase;color:#6e6558;padding-top:8px}
.manifesto h2{font-size:clamp(36px,4.2vw,60px);line-height:1.05;margin:0}
.manifesto-title p{font-size:clamp(30px,3.3vw,50px);line-height:1.05;margin:10px 0 0;color:#9a7e58}
.manifesto-text{padding-top:8px}
.manifesto-text p{line-height:1.8;color:#5a5752;margin:0 0 32px;max-width:360px}
.dark-link{color:#161616;border-color:var(--darkline)}

.select{padding:110px 6vw 120px}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:42px;gap:40px}
.section-head h2{font-size:clamp(34px,4vw,56px);margin:0}
.property-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.property-card{background:#111;overflow:hidden;cursor:pointer}
.property-image{aspect-ratio:1.15/1;position:relative;background-size:cover;background-position:center;transition:transform .7s ease}
.property-card:hover .property-image{transform:scale(1.02)}
.property-image span{position:absolute;top:16px;left:16px;font-size:9px;letter-spacing:.18em}
.img-one{background-image:linear-gradient(0deg,rgba(0,0,0,.15),transparent),url("assets/le-port/hero.webp")}
.img-two{background-image:linear-gradient(0deg,rgba(0,0,0,.15),transparent),url("https://images.unsplash.com/photo-1600047509807-ba8f99d2cdde?auto=format&fit=crop&w=1300&q=82")}
.img-three{background-image:linear-gradient(0deg,rgba(0,0,0,.15),transparent),url("https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?auto=format&fit=crop&w=1300&q=82")}
.property-info{padding:22px 20px 24px;display:flex;flex-direction:column;gap:24px}
.property-info h3{font-family:"Playfair Display",serif;font-weight:500;font-size:24px;margin:0 0 7px}
.property-info p{margin:0 0 8px;color:#b9b2a7;font-size:13px}
.property-info small{color:#766f66}
.price{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.08em;color:#e8dfd2}

.search-section{
  padding:110px 6vw;display:grid;grid-template-columns:1fr 2fr;gap:8vw;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.search-intro h2{font-size:clamp(40px,5vw,68px);line-height:1.03;margin:0}
.search-panel label{display:block;text-transform:uppercase;font-size:9px;letter-spacing:.25em;color:#80786f;margin-bottom:16px}
.search-line{display:flex;border-bottom:1px solid rgba(255,255,255,.35)}
.search-line input{flex:1;background:transparent;border:0;outline:0;color:#fff;padding:19px 0;font-size:20px}
.search-line input::placeholder{color:#666}
.search-line button{background:transparent;border:0;color:var(--champagne);cursor:pointer;text-transform:uppercase;letter-spacing:.2em;font-size:10px}
.suggestions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.suggestions button{border:1px solid var(--line);background:transparent;color:#aca59b;padding:9px 14px;font-size:9px;text-transform:uppercase;letter-spacing:.16em;cursor:pointer}
.suggestions button:hover{color:var(--ivory);border-color:#716858}
.search-response{min-height:24px;color:var(--champagne);font-size:12px;margin-top:18px}

.private-section{min-height:650px;display:grid;grid-template-columns:1.05fr 1.25fr .55fr;position:relative}
.private-image{
  background:url("https://images.unsplash.com/photo-1600607688969-a5bfcd646154?auto=format&fit=crop&w=1300&q=82") center/cover;
  min-height:650px
}
.private-copy{padding:10vw 7vw 8vw;align-self:center}
.private-copy h2{font-size:clamp(40px,4.8vw,66px);line-height:1.03;margin:0 0 28px}
.private-copy p{color:#aaa196;line-height:1.75;max-width:510px;margin:0 0 34px}
.outline-btn{
  display:inline-flex;gap:26px;align-items:center;border:1px solid rgba(255,255,255,.32);
  padding:15px 20px;text-transform:uppercase;font-size:9px;letter-spacing:.2em;
}
.private-mark{display:flex;align-items:center;justify-content:center;font-size:70px;color:var(--champagne);border-left:1px solid var(--line)}

.advisory{padding:110px 6vw}
.advisory-intro{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px}
.dark-eye{color:#8b744f}
.advisory h2{font-size:clamp(38px,4.2vw,58px);margin:0}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--darkline)}
.service{padding:32px 4vw 10px 0;border-right:1px solid var(--darkline);margin-right:3vw;min-height:260px}
.service:last-child{border-right:0}
.service-number{font-family:"Playfair Display",serif;color:#ad956f;font-size:28px}
.service h3{text-transform:uppercase;font-size:12px;letter-spacing:.18em;margin:24px 0 14px}
.service p{color:#69645c;line-height:1.7;font-size:14px;max-width:340px}
.service a{text-transform:uppercase;font-size:9px;letter-spacing:.18em;color:#8d754d}

.about{display:grid;grid-template-columns:1.1fr 1fr;min-height:560px}
.about-image{background:url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1400&q=82") center/cover;min-height:560px}
.about-copy{padding:8vw;align-self:center}
.about h2{font-size:clamp(38px,4.6vw,64px);line-height:1.04;margin:0 0 28px}
.about-copy p{color:#a89f93;line-height:1.7;max-width:560px}

.closing{
  display:grid;grid-template-columns:.8fr 1.3fr .9fr;gap:5vw;
  padding:100px 6vw 90px;border-top:1px solid var(--line);align-items:center
}
.footer-brand{margin-bottom:20px}
.closing-brand p{color:#706b65;font-size:12px}
.closing h2{font-size:clamp(40px,5vw,70px);line-height:1.03;margin:0}
.closing-cta{text-align:right}
footer{
  padding:22px 6vw 30px;display:flex;justify-content:space-between;gap:20px;
  border-top:1px solid var(--line);color:#5d5851;font-size:9px;letter-spacing:.14em;text-transform:uppercase
}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:none}

@media (max-width:900px){
  .desktop-nav{display:none}.menu-btn{display:block}
  .hero{padding:0 7vw 12vh}.hero-side{display:none}.hero h1{font-size:54px;max-width:520px}
  .section-grid{grid-template-columns:1fr;gap:34px}
  .manifesto{padding:90px 7vw}
  .property-grid{grid-template-columns:1fr}
  .property-image{aspect-ratio:1.55/1}
  .select{padding:90px 7vw}
  .section-head{align-items:start;flex-direction:column}
  .search-section{grid-template-columns:1fr;padding:90px 7vw;gap:45px}
  .private-section{grid-template-columns:1fr}
  .private-image{min-height:430px}.private-copy{padding:80px 7vw}.private-mark{display:none}
  .advisory{padding:90px 7vw}.advisory-intro{display:block}
  .service-grid{grid-template-columns:1fr}.service{border-right:0;border-bottom:1px solid var(--darkline);margin-right:0}
  .about{grid-template-columns:1fr}.about-image{min-height:420px}.about-copy{padding:80px 7vw}
  .closing{grid-template-columns:1fr;padding:80px 7vw;gap:45px}.closing-cta{text-align:left}
}
@media (max-width:560px){
  .topbar{padding:22px 6vw}.brand-name{font-size:12px}.brand-mark{font-size:24px}
  .hero h1{font-size:42px}.hero{min-height:92vh}
  .hero-copy{padding-bottom:10px}
  .manifesto h2{font-size:36px}.manifesto-title p{font-size:32px}
  .property-image{aspect-ratio:1.1/1}
  .search-line input{font-size:15px}.search-line button{font-size:9px}
  .private-copy h2,.about h2,.closing h2{font-size:40px}
  footer{flex-direction:column}
}