:root{
  --sand:#f4efe7; --stone:#e7dfd3; --clay:#b48a64; --olive:#6f7559; --ink:#2b2622; --muted:#7a6f66; --sea:#2f5d6b; --white:#fff;
  --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:300;color:var(--ink);background:var(--sand);line-height:1.75;font-size:16px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.15;letter-spacing:.01em}
h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:1.2rem}
h3{font-size:1.55rem;margin-bottom:.5rem}
p+p{margin-top:1rem}
.container{width:min(1180px,90vw);margin:0 auto}
.section{padding:clamp(4.5rem,9vw,8rem) 0}
.eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:1rem;font-weight:400}
.eyebrow.dark{color:var(--clay)}
.muted{color:var(--muted)}
.center{text-align:center;margin-top:2.5rem}
.btn{display:inline-block;padding:.95rem 2rem;font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;border:1px solid transparent;transition:all .3s;font-weight:400;cursor:pointer;font-family:var(--sans)}
.btn-light{background:var(--white);color:var(--ink)}
.btn-light:hover{background:var(--sand)}
.btn-ghost{border-color:rgba(255,255,255,.7);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:var(--olive)}
.link{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--clay);padding-bottom:3px;color:var(--ink);display:inline-block;margin-top:1rem}

.proto-bar{background:var(--ink);color:#d9cfc3;text-align:center;font-size:.72rem;letter-spacing:.08em;padding:.45rem 1rem;position:relative;z-index:60}

/* nav */
.nav{position:fixed;top:28px;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:1.1rem 5vw;transition:all .35s}
.nav.scrolled{top:0;background:rgba(43,38,34,.92);backdrop-filter:blur(8px);padding:.7rem 5vw}
.nav-logo img{height:46px;width:auto}
.nav.scrolled .nav-logo img{height:38px}
.nav-links{display:flex;gap:2.2rem}
.nav-links a{color:#fff;text-decoration:none;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;opacity:.9}
.nav-links a:hover{opacity:1;border-bottom:1px solid #fff}
.nav-book{padding:.7rem 1.4rem}
.nav-toggle{display:none;background:none;border:0;width:34px;height:24px;position:relative;cursor:pointer}
.nav-toggle span{position:absolute;left:0;right:0;height:1px;background:#fff;transition:.3s}
.nav-toggle span:first-child{top:7px}.nav-toggle span:last-child{bottom:7px}

/* hero */
.hero{position:relative;height:100vh;min-height:600px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.06);animation:heroZoom 18s ease-out forwards}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,16,.55) 0%,rgba(20,18,16,.35) 45%,rgba(20,18,16,.6) 100%)}
@keyframes heroZoom{to{transform:scale(1)}}
.hero-inner{position:relative;z-index:2;padding:0 6vw}
.hero h1,.hero-sub{text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero h1{font-size:clamp(3.2rem,9vw,7.5rem);font-weight:300;letter-spacing:.04em}
.hero-sub{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.4vw,1.9rem);margin:.4rem 0 2.4rem}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.scroll-cue{position:absolute;bottom:34px;left:50%;width:1px;height:60px;background:rgba(255,255,255,.6);z-index:2}
.scroll-cue::after{content:"";position:absolute;top:0;left:-2px;width:5px;height:5px;border-radius:50%;background:#fff;animation:cue 2.2s infinite}
@keyframes cue{0%{top:0;opacity:1}100%{top:55px;opacity:0}}

/* concept */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.split-text p{color:#4d453f}
.quote{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--olive)!important;border-left:1px solid var(--clay);padding-left:1.2rem;margin-top:1.8rem!important;line-height:1.4}
.split-media{position:relative;padding-bottom:12%}
.img-tall{width:78%;aspect-ratio:3/4;object-fit:cover;margin-left:auto}
.img-float{position:absolute;left:0;bottom:0;width:46%;aspect-ratio:3/4;object-fit:cover;border:10px solid var(--sand)}

/* facts */
.facts{background:var(--stone);padding:3rem 0}
.facts-grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.facts-grid>div{border-left:1px solid rgba(43,38,34,.12)}
.facts-grid>div:first-child{border-left:0}
.num{display:block;font-family:var(--serif);font-size:2.6rem;color:var(--ink)}
.lbl{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}

/* section head */
.section-head{text-align:center;max-width:680px;margin:0 auto 3.5rem}
.section-head p{color:var(--muted)}

/* suites */
.suites{background:var(--white)}
.suite{display:grid;grid-template-columns:1.4fr 1fr;gap:3.5rem;align-items:center}
.suite-gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.suite-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
.suite-gallery .main{grid-column:1/-1;aspect-ratio:16/9}
.specs{list-style:none;margin:1.6rem 0 2rem;border-top:1px solid var(--stone)}
.specs li{display:flex;justify-content:space-between;padding:.85rem 0;border-bottom:1px solid var(--stone);font-size:.92rem}
.specs span{color:var(--muted)}
.specs strong{font-weight:400}
.note{font-size:.72rem;color:var(--clay);margin-top:1.2rem;line-height:1.5}
.growth{text-align:center;margin-top:3.5rem;font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--olive)}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.2rem}
.svc img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:1.3rem;filter:saturate(.85)}
.svc p{font-size:.92rem;color:#5a524b}
.svc-order{background:var(--ink);color:#efe7dd;padding:1.6rem}
.svc-order p{color:#cfc4b8}
.order-visual{display:flex;justify-content:center;align-items:center;aspect-ratio:3/2;margin-bottom:1.3rem;background:linear-gradient(135deg,#3a332d,#2b2622)}
.phone{width:120px;height:84%;border:1px solid #8a7d70;border-radius:16px;padding:8px;background:#1f1b18}
.phone-screen{background:var(--sand);height:100%;border-radius:10px;padding:8px;color:var(--ink);font-size:.5rem;line-height:1.3;display:flex;flex-direction:column;gap:5px}
.ps-head{font-family:var(--serif);font-size:.8rem;border-bottom:1px solid var(--stone);padding-bottom:3px}
.ps-row{display:flex;justify-content:space-between}
.ps-row b{font-weight:500}
.ps-btn{margin-top:auto;background:var(--ink);color:#fff;text-align:center;padding:4px;font-size:.5rem;letter-spacing:.1em;text-transform:uppercase}
.tag{display:inline-block;margin-top:1rem;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;border:1px dashed var(--clay);color:var(--clay);padding:.3rem .6rem}

/* milos */
.milos{position:relative;padding:clamp(5rem,12vw,10rem) 0}
.milos-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-attachment:fixed}
.milos-inner{position:relative}
.milos-card{background:rgba(244,239,231,.96);max-width:560px;padding:clamp(2rem,4vw,3.4rem)}
.milos-card p{font-size:.95rem;color:#4d453f}
.near{list-style:none;margin:1.5rem 0 .5rem}
.near li{display:flex;justify-content:space-between;border-bottom:1px solid var(--stone);padding:.55rem 0;font-size:.88rem}
.near span{color:var(--muted);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}

/* gallery */
.masonry{columns:3 280px;column-gap:12px}
.masonry img{width:100%;margin-bottom:12px;break-inside:avoid;transition:opacity .3s;cursor:zoom-in}
.masonry img:hover{opacity:.88}
.lightbox{position:fixed;inset:0;background:rgba(20,18,16,.92);display:flex;align-items:center;justify-content:center;z-index:100;cursor:zoom-out}
.lightbox img{max-width:92vw;max-height:88vh}

/* reviews placeholder */
.placeholder-zone{background:var(--stone);position:relative;outline:2px dashed var(--clay);outline-offset:-14px}
.ph-badge{display:block;width:max-content;max-width:90%;margin:0 auto 2rem;background:var(--clay);color:#fff;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;padding:.4rem .9rem;text-align:center}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.review-grid blockquote{font-family:var(--serif);font-style:italic;font-size:1.25rem;line-height:1.5;color:#5a524b;background:var(--sand);padding:2rem}
.review-grid cite{display:block;margin-top:1rem;font-family:var(--sans);font-style:normal;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* cta */
.cta{position:relative;padding:clamp(6rem,12vw,10rem) 0;text-align:center;color:#fff;overflow:hidden}
.cta-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.cta-bg::after{content:"";position:absolute;inset:0;background:rgba(25,22,20,.5)}
.cta-inner{position:relative;max-width:620px;margin:0 auto;padding:0 6vw}
.cta-inner p:not(.eyebrow){margin-bottom:2rem;font-size:1.02rem}

/* contact */
.contact{background:var(--white)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem)}
.contact-list{list-style:none;margin:1.8rem 0 2rem}
.contact-list li{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--stone);font-size:.92rem;flex-wrap:wrap}
.contact-list span{color:var(--muted);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
.contact-list a{text-decoration:none}
.contact-form{background:var(--sand);padding:clamp(1.6rem,3vw,2.6rem);display:flex;flex-direction:column;gap:1.1rem;align-self:start}
.contact-form label{display:flex;flex-direction:column;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);gap:.4rem}
.contact-form input,.contact-form textarea{font:inherit;font-size:.95rem;letter-spacing:0;text-transform:none;color:var(--ink);background:#fff;border:1px solid var(--stone);padding:.75rem .9rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-msg{font-size:.8rem;color:var(--olive)}

/* footer */
.footer{background:var(--ink);color:#bfb3a6;padding:3.5rem 0 5rem;text-align:center;font-size:.82rem}
.footer-logo{height:54px;width:auto;margin:0 auto 1.2rem;opacity:.9}
.small{font-size:.7rem;margin-top:.6rem;opacity:.7}

.mobile-book{display:none}

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

@media (max-width:960px){
  .nav-links{position:fixed;inset:0;background:rgba(43,38,34,.97);flex-direction:column;align-items:center;justify-content:center;gap:2rem;opacity:0;pointer-events:none;transition:.3s}
  .nav-links.open{opacity:1;pointer-events:auto}
  .nav-links a{font-size:.9rem}
  .nav-toggle{display:block;z-index:60}
  .nav-book{display:none}
  .split,.suite,.contact-grid{grid-template-columns:1fr}
  .svc-grid,.review-grid{grid-template-columns:1fr 1fr}
  .milos-bg{background-attachment:scroll}
}
@media (max-width:640px){
  body{font-size:15px}
  .nav{top:44px}
  .nav-logo img{height:38px}
  .facts-grid{grid-template-columns:1fr 1fr;row-gap:2rem}
  .facts-grid>div:nth-child(3){border-left:0}
  .svc-grid,.review-grid{grid-template-columns:1fr}
  .row2{grid-template-columns:1fr}
  .hero-actions .btn{width:100%}
  .mobile-book{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--ink);color:#fff;text-align:center;padding:1rem;font-size:.75rem;letter-spacing:.24em;text-transform:uppercase;text-decoration:none}
}
