:root{
  --ink:#0b0c0f; --paper:#f5f1e9; --paper2:#ece6da; --muted:#9e9b94;
  --gold:#c8a86b; --gold2:#e4cf9f; --wine:#5a151d; --line:rgba(255,255,255,.13);
  --serif: Georgia, "Times New Roman", serif; --sans: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--ink);color:#fff;font-family:var(--sans);line-height:1.55;overflow-x:hidden}
a{color:inherit;text-decoration:none} img,video{max-width:100%;display:block} button{font:inherit}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.eyebrow{font-size:.73rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold2);font-weight:700}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.03;margin:0}
h1{font-size:clamp(5.4rem,13vw,12rem);letter-spacing:-.072em}
h2{font-size:clamp(2.5rem,5vw,5rem);letter-spacing:-.04em}
h3{font-size:1.55rem} p{color:#c8c8c8;margin:0}
.scroll-progress{position:fixed;z-index:90;left:0;top:0;width:0;height:2px;background:var(--gold2);pointer-events:none}

.nav{position:fixed;top:0;left:0;right:0;z-index:40;height:76px;display:flex;align-items:center;background:linear-gradient(to bottom,rgba(5,6,8,.72),rgba(5,6,8,.02));transition:.35s}
.nav.scrolled{background:rgba(6,7,9,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-inner{width:min(1320px,calc(100% - 36px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-family:var(--serif);font-size:1.25rem;letter-spacing:.12em}.brand small{display:block;font-family:var(--sans);font-size:.52rem;letter-spacing:.22em;color:#aaa;margin-top:1px}
.nav-links{display:flex;gap:22px;align-items:center;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase}.nav-links a{opacity:.72;transition:.2s}.nav-links a:hover{opacity:1;color:var(--gold2)}
.menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:999px;padding:8px 11px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 18px;border:1px solid rgba(255,255,255,.32);border-radius:999px;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;transition:.25s;background:transparent;color:#fff;cursor:pointer}
.btn:hover{background:#fff;color:#0c0d10;transform:translateY(-2px)}.btn.gold{border-color:var(--gold);background:var(--gold);color:#111}.btn.gold:hover{background:var(--gold2)}
.actions{display:flex;gap:11px;flex-wrap:wrap}

/* Minimal video-first hero */
.hero{height:100svh;min-height:720px;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:#050608}
.hero-media{position:absolute;inset:0}.hero-media video{width:100%;height:100%;object-fit:cover}
.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,6,8,.74) 0%,rgba(5,6,8,.16) 40%,rgba(5,6,8,.04) 70%),linear-gradient(90deg,rgba(5,6,8,.28),transparent 62%)}
.hero-content{position:relative;z-index:2;width:100%;padding:0 0 56px}.hero-minimal{max-width:1320px}
.hero-eyebrow{margin-bottom:10px;animation:heroIn .9s ease .15s both}.hero h1{text-shadow:0 8px 38px rgba(0,0,0,.38);animation:heroIn 1s ease .24s both}
.hero-line{font-family:var(--serif);font-size:clamp(1.25rem,2.2vw,2.1rem);color:#f3ead6;margin:8px 0 22px;animation:heroIn .9s ease .34s both}
.hero-actions{animation:heroIn .9s ease .44s both}.hero-scroll{position:absolute;z-index:3;right:32px;bottom:35px;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.65);writing-mode:vertical-rl;display:flex;gap:8px;align-items:center}.hero-scroll span{font-size:1rem;animation:bob 1.7s ease-in-out infinite}
@keyframes heroIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}} @keyframes bob{50%{transform:translateY(7px)}}

.hero-intro{padding:95px 0 100px;background:var(--paper);color:#121315}.intro-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}.hero-intro h2{margin-top:12px}.hero-intro p{color:#535353}.lead{font-family:var(--serif);font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.28;color:#242527!important}.intro-copy>p+p{margin-top:20px}
.intro-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:38px;background:#d5cec2;border:1px solid #d5cec2}.intro-stats div{background:#fff;padding:18px}.intro-stats b{display:block;font-family:var(--serif);font-size:1.35rem;font-weight:500}.intro-stats span{font-size:.62rem;letter-spacing:.11em;text-transform:uppercase;color:#777}

.section{padding:110px 0}.section.light{background:var(--paper);color:#121315}.section.light p{color:#575757}.section.soft{background:#111318}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:72px;align-items:center}.section-head{max-width:830px}.section-head p{font-size:1.08rem;margin-top:20px;max-width:720px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}.card{padding:28px;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.025);min-height:215px;transition:.35s}.card:hover{transform:translateY(-5px);border-color:rgba(228,207,159,.45)}.light .card{border-color:#d8d1c5;background:#fff}.card .num{font-family:var(--serif);color:var(--gold);font-size:1.4rem;margin-bottom:24px}.card h3{margin-bottom:12px}.card p{font-size:.91rem}

/* Dynamic section transition system */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);transition-delay:var(--delay,0ms);will-change:opacity,transform}
.reveal-left{transform:translateX(-46px)}.reveal-right{transform:translateX(46px)}.reveal-up{transform:translateY(34px)}.reveal.is-visible{opacity:1;transform:none}
.reveal-section{position:relative}
.reveal-section:before{content:"";position:absolute;top:0;left:50%;width:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transition:width 1.2s ease,left 1.2s ease}
.reveal-section.section-visible:before{left:10%;width:80%}

/* Click-through story galleries */
.gallery-heading{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end;margin-bottom:34px}.gallery-index{font-family:var(--serif);font-size:clamp(2.2rem,4vw,4rem);color:var(--gold2);white-space:nowrap}
.story-gallery{position:relative}.story-main{position:relative;width:100%;height:min(68vw,720px);min-height:470px;padding:0;border:0;background:#050608;overflow:hidden;cursor:zoom-in;color:#fff}
.story-main img{width:100%;height:100%;object-fit:cover;transition:opacity .3s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.story-main:hover img{transform:scale(1.015)}
.story-main:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.68),transparent 38%);pointer-events:none}
.story-label{position:absolute;z-index:2;left:22px;bottom:22px;font-family:var(--serif);font-size:clamp(1.25rem,2.5vw,2rem)}.story-open{position:absolute;z-index:2;right:22px;bottom:25px;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:#ddd}
.thumbnail-rail{display:grid;grid-template-columns:repeat(8,minmax(110px,1fr));gap:8px;margin-top:10px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:thin}
.thumb{position:relative;border:0;background:#15171a;padding:0;aspect-ratio:16/9;overflow:hidden;cursor:pointer;min-width:110px;outline:1px solid transparent;outline-offset:-1px;transition:transform .32s cubic-bezier(.2,.7,.2,1),box-shadow .32s,outline-color .32s}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.2,.7,.2,1),filter .35s}.thumb:after{content:"";position:absolute;inset:0;background:rgba(5,6,8,.18);transition:.35s}
.thumb:hover{transform:translateY(-7px) scale(1.025);box-shadow:0 16px 30px rgba(0,0,0,.28);z-index:2}.thumb:hover img{transform:scale(1.08)}.thumb:hover:after{opacity:0}.thumb.active{outline-color:var(--gold2)}.thumb.active:after{opacity:0}
.gallery-controls{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.gallery-arrow{width:46px;height:46px;border-radius:50%;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.22);cursor:pointer;transition:.25s}.gallery-arrow:hover{background:#fff;color:#111;transform:scale(1.06)}

.plan-wrap{margin-top:38px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.tab{border:1px solid #c8c1b6;background:transparent;color:#333;border-radius:999px;padding:10px 16px;cursor:pointer;transition:.25s}.tab:hover{transform:translateY(-2px)}.tab.active{background:#17181b;color:#fff;border-color:#17181b}
.plan-card{background:#fff;border:1px solid #d7d0c5;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(270px,.45fr);min-height:600px;overflow:hidden}.plan-visual{background:#050505;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:10px}.plan-visual img{width:100%;height:100%;object-fit:contain;max-height:760px;transition:opacity .3s,transform .45s}.plan-visual img.switching{opacity:.25;transform:scale(.985)}
.plan-info{padding:34px;border-left:1px solid #e3ddd3}.plan-info h3{font-size:2rem;margin:6px 0 18px}.amenities{list-style:none;margin:24px 0 0;padding:0}.amenities li{padding:10px 0;border-top:1px solid #ddd6ca;color:#555;font-size:.9rem}.amenities li:last-child{border-bottom:1px solid #ddd6ca}

.tour{position:relative;min-height:600px;display:flex;align-items:center;overflow:hidden}.tour-bg{position:absolute;inset:0}.tour-bg img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s}.tour:hover .tour-bg img{transform:scale(1.025)}.tour-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,8,.9),rgba(5,6,8,.5) 55%,rgba(5,6,8,.15))}.tour .container{position:relative;z-index:2}.tour-copy{max-width:650px}.tour-icon{width:74px;height:74px;border-radius:50%;border:1px solid rgba(255,255,255,.5);display:grid;place-items:center;font-family:var(--serif);font-size:1.4rem;margin-bottom:24px;background:rgba(0,0,0,.2);backdrop-filter:blur(10px)}
.partner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:36px}.partner{border-top:1px solid #c9c1b4;padding:25px 0}.partner h3{margin:8px 0 12px}.partner .label{font-size:.69rem;letter-spacing:.12em;text-transform:uppercase;color:#8e7348}
.suites{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:36px}.suite{background:#15171b;border:1px solid rgba(255,255,255,.1);padding:20px;min-height:230px;transition:.35s}.suite:hover{transform:translateY(-5px);border-color:rgba(228,207,159,.42)}.suite b{display:block;color:var(--gold2);font-family:var(--serif);font-size:1.35rem;font-weight:500}.suite span{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:#7e7e7e}.suite p{font-size:.82rem;margin-top:18px}
.pipeline{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin-top:44px;background:#d7d0c4;border:1px solid #d7d0c4}.step{background:#fff;padding:22px 16px;min-height:175px;transition:.3s}.step:hover{background:#f4efe6}.step small{color:#987b4c;font-weight:700}.step b{display:block;margin:28px 0 9px;font-family:var(--serif);font-size:1.2rem}.step p{font-size:.78rem;color:#666}
.approach{background:linear-gradient(135deg,#15171c 0%,#08090b 60%,#271015 100%)}.approach-lead{font-family:var(--serif);font-size:clamp(1.25rem,2.3vw,1.85rem);line-height:1.35;color:#e5e2da}.approach-cards{margin-top:50px}

.team{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:stretch;margin-top:40px}.team-photo{min-height:600px;background:#08090b;overflow:hidden}.team-photo img{width:100%;height:100%;object-fit:cover;transition:transform .8s}.team-photo:hover img{transform:scale(1.018)}.team-side{display:flex;flex-direction:column;gap:14px}.person{flex:1;border:1px solid rgba(255,255,255,.12);padding:30px;display:flex;flex-direction:column;justify-content:space-between;transition:.35s}.person:hover{border-color:rgba(228,207,159,.4);transform:translateX(5px)}.person h3{font-size:2rem;margin:8px 0}.person p{max-width:510px}.person .role{font-size:.67rem;letter-spacing:.13em;text-transform:uppercase;color:var(--gold2)}.person .btn{align-self:flex-start;margin-top:20px}
.contact{padding:90px 0;background:linear-gradient(120deg,#2a0c11,#0b0c0f 58%)}.contact-inner{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end}.contact h2{max-width:760px}.contact p{max-width:760px;margin-top:20px}.disclaimer{font-size:.72rem;color:#777;max-width:900px;margin-top:34px}.footer{padding:28px 0;border-top:1px solid rgba(255,255,255,.1);color:#777;font-size:.75rem}.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* Full-screen gallery */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.97);display:none;align-items:center;justify-content:center;padding:50px 80px;opacity:0;transition:opacity .28s}.lightbox.open{display:flex;opacity:1}
.lightbox-stage{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.lightbox-stage img{max-height:86vh;max-width:88vw;object-fit:contain;cursor:e-resize;user-select:none;transition:opacity .22s,transform .32s}.lightbox-stage img.changing{opacity:.28;transform:scale(.99)}
.lightbox-close{position:absolute;z-index:5;top:20px;right:24px;background:none;border:0;color:#fff;font-size:2.2rem;cursor:pointer}
.lightbox-arrow{position:absolute;z-index:5;top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.25);color:#fff;cursor:pointer;transition:.25s}.lightbox-arrow:hover{background:#fff;color:#111}.lightbox-prev{left:22px}.lightbox-next{right:22px}
.lightbox-meta{position:absolute;left:16px;bottom:8px;right:16px;display:flex;justify-content:space-between;gap:16px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#ddd}.lightbox-hint{position:absolute;top:12px;left:50%;transform:translateX(-50%);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:#777}

@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}.reveal,.reveal-section:before,.hero h1,.hero-eyebrow,.hero-line,.hero-actions{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}
}
@media(max-width:980px){
  .nav-links{display:none;position:absolute;top:68px;left:18px;right:18px;background:#0d0f12;padding:20px;flex-direction:column;align-items:flex-start}.nav-links.open{display:flex}.menu-btn{display:block}
  .intro-layout,.grid-2,.team,.contact-inner{grid-template-columns:1fr}.intro-layout{gap:38px}.cards,.partner-grid{grid-template-columns:1fr 1fr}.suites{grid-template-columns:repeat(2,1fr)}
  .plan-card{grid-template-columns:1fr}.plan-info{border-left:0;border-top:1px solid #e3ddd3}.pipeline{grid-template-columns:repeat(3,1fr)}
  .intro-stats{grid-template-columns:repeat(2,1fr)}.thumbnail-rail{grid-template-columns:repeat(8,150px)}.team-photo{min-height:auto}
}
@media(max-width:640px){
  .container{width:min(100% - 26px,1180px)}.section{padding:80px 0}.hero{min-height:650px}.hero-content{padding-bottom:34px}.hero-scroll{display:none}
  h1{font-size:clamp(4.4rem,22vw,7rem)}.hero-line{margin-bottom:18px}.hero-actions .btn{padding:11px 14px;font-size:.67rem}
  .hero-intro{padding:70px 0}.intro-stats{grid-template-columns:1fr 1fr}.intro-stats div{padding:13px}.cards,.partner-grid,.suites{grid-template-columns:1fr}.pipeline{grid-template-columns:1fr 1fr}
  .gallery-heading{grid-template-columns:1fr}.gallery-index{font-size:2rem}.story-main{height:64vw;min-height:300px}.story-label{left:14px;bottom:14px}.story-open{right:14px;bottom:15px}.thumbnail-rail{grid-template-columns:repeat(8,125px)}
  .lightbox{padding:50px 14px}.lightbox-arrow{width:42px;height:42px}.lightbox-prev{left:8px}.lightbox-next{right:8px}.lightbox-meta{left:6px;right:6px}.lightbox-hint{display:none}
  .team-photo img{min-height:360px}.tour{min-height:520px}
}


/* =========================================================
   V3 SCROLL-EXPANSION HERO
   Background = existing hero video
   Foreground reveal = supplied Villa Oceana coastal image
   ========================================================= */
.scroll-expand-hero{
  position:relative;
  width:100%;
  height:100svh;
  min-height:680px;
  overflow:hidden;
  background:#050608;
  isolation:isolate;
}
.expand-bg{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
}
.expand-bg video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
}
.expand-bg-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom,rgba(5,6,8,.16),rgba(5,6,8,.10) 48%,rgba(5,6,8,.40)),
    rgba(0,0,0,.08);
  transition:background .1s linear;
}
.expand-stage{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:76px 24px 36px;
}
.expand-media-frame{
  position:absolute;
  left:50%;
  top:50%;
  width:340px;
  height:212px;
  max-width:94vw;
  max-height:82vh;
  transform:translate(-50%,-50%);
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 32px 90px rgba(0,0,0,.42);
  background:#050608;
  will-change:width,height,border-radius;
  opacity:0;
  backface-visibility:hidden;
  transform:translate3d(-50%,-50%,0);
}
.expand-media-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.expand-media-shade{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.22);
  pointer-events:none;
  will-change:opacity;
}
.expand-title{
  position:relative;
  z-index:4;
  width:min(1500px,96vw);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(18px,3vw,48px);
  pointer-events:none;
  color:#fff;
  text-shadow:0 8px 35px rgba(0,0,0,.38);
  font-family:var(--serif);
  font-size:clamp(5rem,12vw,11.5rem);
  line-height:.82;
  letter-spacing:-.075em;
  white-space:nowrap;
  will-change:opacity;
}
.expand-title-left,
.expand-title-right{
  display:block;
  will-change:transform;
}
.expand-topline{
  position:absolute;
  z-index:6;
  top:98px;
  left:50%;
  transform:translateX(-50%);
  font-size:.67rem;
  font-weight:700;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:rgba(255,255,255,.82);
  white-space:nowrap;
  pointer-events:none;
  will-change:opacity;
}
.expand-scroll-hint{
  position:absolute;
  z-index:6;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:10px;
  font-size:.63rem;
  font-weight:700;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78);
  white-space:nowrap;
  pointer-events:none;
  will-change:opacity;
}
.expand-arrow{
  display:inline-block;
  font-size:1.1rem;
  animation:expandArrowBob 1.55s ease-in-out infinite;
}
@keyframes expandArrowBob{
  0%,100%{transform:translateY(-2px)}
  50%{transform:translateY(6px)}
}
.hero-after-reveal{
  position:relative;
  z-index:3;
}

/* While the hero is controlling wheel/touch input, avoid accidental browser anchoring. */
html.hero-expanding,
body.hero-expanding{
  overflow-anchor:none;
}

@media(max-width:767px){
  .scroll-expand-hero{min-height:620px}
  .expand-stage{padding-left:12px;padding-right:12px}
  .expand-media-frame{
    width:min(64vw,280px);
    height:min(40vw,175px);
    border-radius:14px;
  }
  .expand-title{
    gap:12px;
    font-size:clamp(3.9rem,19vw,7rem);
  }
  .expand-topline{
    top:88px;
    font-size:.56rem;
    letter-spacing:.18em;
  }
  .expand-scroll-hint{
    bottom:24px;
    font-size:.54rem;
    letter-spacing:.14em;
  }
}

/* The old V2 hero is no longer used. */
.hero{display:none!important}


/* =========================================================
   V4 SMOOTH HERO PATCH
   RequestAnimationFrame drives the hero at display refresh rate.
   CSS transitions are disabled here so they never fight the
   scroll interpolator.
   ========================================================= */
.expand-media-frame,
.expand-media-frame img,
.expand-media-shade,
.expand-title,
.expand-title-left,
.expand-title-right,
.expand-topline,
.expand-scroll-hint,
.expand-bg-overlay{
  transition:none !important;
}

.expand-media-frame,
.expand-title,
.expand-title-left,
.expand-title-right{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform-style:preserve-3d;
}

.expand-media-frame{
  will-change:width,height,opacity,border-radius,transform;
}

.expand-title,
.expand-title-left,
.expand-title-right{
  will-change:transform,opacity;
}

.expand-media-frame img{
  transform:translateZ(0);
}


/* =========================================================
   V5 — FLOOR PLAN MAGNIFIER + MOBILE PINCH VIEWER
   ========================================================= */
.plan-visual{
  position:relative;
  cursor:crosshair;
}
.plan-magnifier{
  position:absolute;
  z-index:8;
  width:190px;
  height:190px;
  left:0;
  top:0;
  border-radius:50%;
  border:2px solid rgba(228,207,159,.95);
  background-repeat:no-repeat;
  background-color:#08090b;
  box-shadow:
    0 18px 50px rgba(0,0,0,.42),
    inset 0 0 0 1px rgba(255,255,255,.18);
  pointer-events:none;
  opacity:0;
  transform:translate3d(-50%,-50%,0) scale(.92);
  transition:opacity .16s ease, transform .16s ease;
  will-change:left,top,background-position,transform;
  overflow:hidden;
}
.plan-magnifier.visible{
  opacity:1;
  transform:translate3d(-50%,-50%,0) scale(1);
}
.plan-magnifier:after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:12px;
  border-left:1px solid rgba(255,255,255,.5);
  border-top:1px solid rgba(255,255,255,.5);
  transform:translate(-50%,-50%) rotate(45deg);
  opacity:.42;
}
.plan-zoom-hint{
  position:absolute;
  z-index:6;
  left:18px;
  bottom:16px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(5,6,8,.72);
  backdrop-filter:blur(8px);
  color:rgba(255,255,255,.78);
  font-size:.61rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  pointer-events:none;
}
.plan-mobile-open{display:none}

.plan-mobile-viewer{
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  background:#050608;
  color:#fff;
  overflow:hidden;
  overscroll-behavior:none;
}
.plan-mobile-viewer.open{display:block}
.plan-mobile-stage{
  position:absolute;
  inset:70px 0 58px;
  overflow:hidden;
  touch-action:none;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#050608;
}
.plan-mobile-stage img{
  width:94vw;
  height:calc(100dvh - 150px);
  object-fit:contain;
  transform-origin:center center;
  will-change:transform;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}
.plan-mobile-close{
  position:absolute;
  z-index:4;
  right:14px;
  top:14px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(0,0,0,.28);
  color:#fff;
  font-size:1.8rem;
  line-height:1;
}
.plan-mobile-viewer-title{
  position:absolute;
  z-index:3;
  top:24px;
  left:18px;
  right:72px;
  font-family:var(--serif);
  font-size:1.15rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.plan-mobile-instruction{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:20px;
  transform:translateX(-50%);
  white-space:nowrap;
  color:rgba(255,255,255,.6);
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}

/* Mobile hero uses the portrait video as the full viewport background. */
@media(max-width:767px){
  .expand-bg video{
    object-fit:cover;
    object-position:center center;
  }

  .plan-visual{
    cursor:zoom-in;
    min-height:430px;
    touch-action:pan-y;
  }
  .plan-magnifier,
  .plan-zoom-hint-desktop{
    display:none !important;
  }
  .plan-mobile-open{
    display:block;
    position:absolute;
    z-index:7;
    left:50%;
    bottom:14px;
    transform:translateX(-50%);
    border:1px solid rgba(255,255,255,.2);
    border-radius:999px;
    background:rgba(5,6,8,.78);
    backdrop-filter:blur(9px);
    color:#fff;
    padding:9px 13px;
    white-space:nowrap;
    font-size:.57rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
  }
}

/* Fine pointers only: lens never appears on tablets/phones. */
@media(hover:none), (pointer:coarse){
  .plan-magnifier,
  .plan-zoom-hint-desktop{
    display:none !important;
  }
}


/* =========================================================
   V6 — UNIFIED BLACK DESIGN SYSTEM
   ========================================================= */
html,
body,
.section,
.section.light,
.section.soft,
.hero-intro,
.residence-overview,
.approach,
.contact{
  background:#070809 !important;
  color:#fff !important;
}

.section.light p,
.residence-overview p,
.hero-intro p,
.approach p,
.contact p{
  color:#b6b6b6 !important;
}

.section.light .eyebrow,
.residence-overview .eyebrow{
  color:var(--gold2) !important;
}

.section.light .card,
.light .card,
.card,
.suite,
.person{
  background:#0b0c0f !important;
  border-color:rgba(255,255,255,.12) !important;
  color:#fff !important;
}

.partner{
  border-color:rgba(255,255,255,.16) !important;
}
.partner .label{
  color:var(--gold2) !important;
}

.plan-card{
  background:#070809 !important;
  border-color:rgba(255,255,255,.14) !important;
}
.plan-info{
  border-color:rgba(255,255,255,.12) !important;
  background:#0b0c0f;
}
.plan-info h3{color:#fff}
.plan-info p{color:#aaa !important}
.amenities li{
  color:#b6b6b6 !important;
  border-color:rgba(255,255,255,.12) !important;
}
.tab{
  color:#d4d4d4 !important;
  border-color:rgba(255,255,255,.22) !important;
}
.tab.active{
  background:#fff !important;
  color:#070809 !important;
  border-color:#fff !important;
}

.pipeline{
  background:rgba(255,255,255,.12) !important;
  border-color:rgba(255,255,255,.12) !important;
}
.step{
  background:#0b0c0f !important;
  color:#fff !important;
}
.step:hover{background:#111318 !important}
.step p{color:#9f9f9f !important}

.disclaimer{color:#737373 !important}

/* =========================================================
   V6 — SIMPLE POST-HERO RESIDENCE OVERVIEW
   ========================================================= */
.residence-overview{
  padding:105px 0 110px;
  border-top:1px solid rgba(255,255,255,.08);
}

.overview-intro{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:70px;
  align-items:start;
}

.overview-intro h2{
  margin-top:12px;
  font-size:clamp(3rem,5.6vw,5.6rem);
}

.overview-copy{
  max-width:720px;
}
.overview-copy p{
  font-size:1.08rem;
  line-height:1.72;
}
.overview-copy p+p{margin-top:16px}

.overview-stats{
  margin-top:54px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.14);
  border-left:1px solid rgba(255,255,255,.14);
}

.overview-stat{
  min-height:145px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:24px;
  border-right:1px solid rgba(255,255,255,.14);
  border-bottom:1px solid rgba(255,255,255,.14);
  background:#090a0c;
  transition:transform .28s ease, background .28s ease;
}
.overview-stat:hover{
  transform:translateY(-3px);
  background:#0e1013;
}
.overview-stat b{
  display:block;
  font-family:var(--serif);
  font-size:1.55rem;
  font-weight:500;
}
.overview-stat span{
  display:block;
  margin-top:4px;
  font-size:.78rem;
  color:#969696;
}

.feature-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border:1px solid rgba(228,207,159,.34);
  color:var(--gold2);
}
.feature-icon.small{
  width:40px;
  height:40px;
  flex-basis:40px;
}
.feature-icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.signature-header{
  display:grid;
  grid-template-columns:1fr auto;
  gap:40px;
  align-items:end;
  margin-top:80px;
  padding-bottom:24px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.signature-header h3{
  margin-top:8px;
  font-size:clamp(2rem,3.4vw,3.4rem);
}
.signature-header p{
  max-width:380px;
  font-size:.98rem;
  text-align:right;
}

.amenity-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  margin-top:32px;
}
.amenity-column h4{
  margin:0 0 10px;
  font-family:var(--serif);
  color:var(--gold2);
  font-size:1.25rem;
  font-weight:500;
}
.amenity-feature{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:19px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.amenity-feature b{
  display:block;
  font-size:1rem;
  font-weight:650;
  color:#f1f1f1;
}
.amenity-feature span{
  display:block;
  margin-top:4px;
  font-size:.92rem;
  line-height:1.5;
  color:#888;
}

/* =========================================================
   V6 — LARGE RECTANGULAR FLOOR-PLAN MAGNIFIER
   ========================================================= */
.plan-magnifier{
  width:460px !important;
  height:300px !important;
  border-radius:14px !important;
  border:1px solid rgba(228,207,159,.88) !important;
  box-shadow:
    0 26px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
  transform:translate3d(-50%,-50%,0) scale(.96) !important;
}
.plan-magnifier.visible{
  transform:translate3d(-50%,-50%,0) scale(1) !important;
}
.plan-magnifier:after{
  display:none !important;
}

/* =========================================================
   V6 — FLOOR-SEPARATED INTERIOR GALLERY
   ========================================================= */
.interior-floor-tabs{
  display:flex;
  gap:8px;
  margin:30px 0 28px;
  flex-wrap:wrap;
}
.interior-floor-tab{
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:transparent;
  color:#c9c9c9;
  padding:11px 17px;
  cursor:pointer;
  font-size:.78rem;
  transition:.25s ease;
}
.interior-floor-tab:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.5);
}
.interior-floor-tab.active{
  background:#fff;
  color:#070809;
  border-color:#fff;
}

.interior-floor-panel{
  display:none;
}
.interior-floor-panel.active{
  display:block;
  animation:floorPanelIn .4s ease both;
}
@keyframes floorPanelIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:none}
}

.floor-gallery-heading{
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:end;
  margin-bottom:16px;
}
.floor-gallery-heading>div:first-child>span{
  color:var(--gold2);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.floor-gallery-heading h3{
  margin-top:4px;
  font-size:1.6rem;
}

.thumbnail-rail{
  display:flex !important;
  grid-template-columns:none !important;
  overflow-x:auto;
  gap:8px;
}
.thumbnail-rail .thumb{
  width:150px;
  min-width:150px;
  flex:0 0 150px;
}

/* Slightly larger base text across descriptive sections. */
.section-head p,
.card p,
.partner p,
.person p{
  font-size:.98rem !important;
  line-height:1.62;
}

/* =========================================================
   Responsive
   ========================================================= */
@media(max-width:980px){
  .overview-intro{
    grid-template-columns:1fr;
    gap:32px;
  }
  .overview-stats{
    grid-template-columns:repeat(2,1fr);
  }
  .amenity-columns{
    grid-template-columns:1fr;
    gap:30px;
  }
  .signature-header{
    grid-template-columns:1fr;
    gap:12px;
  }
  .signature-header p{
    text-align:left;
  }
}

@media(max-width:640px){
  .residence-overview{
    padding:78px 0 84px;
  }
  .overview-stats{
    grid-template-columns:1fr;
  }
  .overview-stat{
    min-height:105px;
    padding:18px;
  }
  .overview-copy p{
    font-size:1rem;
  }
  .signature-header{
    margin-top:58px;
  }
  .amenity-feature b{
    font-size:1rem;
  }
  .amenity-feature span{
    font-size:.9rem;
  }
  .floor-gallery-heading{
    align-items:flex-start;
  }
  .floor-gallery-heading .gallery-index{
    font-size:1.7rem;
  }
}


/* =========================================================
   V7 — RESIDENCE OVERVIEW IMAGE BACKDROP
   ========================================================= */
.residence-overview{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#070809 !important;
}
.residence-overview:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:url("assets/exterior-patio2.jpg") center 46% / cover no-repeat;
  filter:saturate(.65) contrast(1.08);
  transform:scale(1.03);
}
.residence-overview:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(4,5,6,.88),rgba(4,5,6,.93) 46%,rgba(4,5,6,.98));
}
.residence-overview .overview-stat{
  background:rgba(10,11,13,.72) !important;
  backdrop-filter:blur(8px);
}

/* V7 merged / reduced signature amenities */
.signature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin-top:32px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.12);
}
.signature-card{
  min-height:220px;
  padding:30px 28px;
  background:rgba(7,8,9,.88);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
  transition:background .3s ease, transform .3s ease;
}
.signature-card:hover{
  background:rgba(15,17,20,.96);
  transform:translateY(-3px);
}
.feature-icon.large{
  width:56px;
  height:56px;
  flex:0 0 56px;
}
.feature-icon.large svg{width:29px;height:29px}
.signature-card b{
  display:block;
  font-family:var(--serif);
  font-size:1.5rem;
  font-weight:500;
  line-height:1.1;
  color:#fff;
}
.signature-card span{
  display:block;
  margin-top:10px;
  color:#9d9d9d;
  font-size:.98rem;
  line-height:1.55;
}

/* =========================================================
   V7 — BIGGER FLOOR SWITCHERS + TEMPORARY ATTENTION ANIMATION
   ========================================================= */
.floor-switcher-label{
  margin:34px 0 12px;
  color:#858585;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.floor-switcher{
  display:flex;
  gap:12px !important;
  flex-wrap:wrap;
  margin-bottom:28px !important;
}
.floor-switcher button,
.interior-floor-tab,
.tab{
  position:relative;
  min-height:52px;
  padding:14px 24px !important;
  border-radius:999px !important;
  font-size:.94rem !important;
  font-weight:650;
  letter-spacing:.015em;
  border:1px solid rgba(255,255,255,.30) !important;
  background:rgba(255,255,255,.025) !important;
  color:#e8e8e8 !important;
  overflow:hidden;
}
.floor-switcher button.active,
.interior-floor-tab.active,
.tab.active{
  background:#f4f1ea !important;
  color:#08090b !important;
  border-color:#f4f1ea !important;
}
@keyframes floorChoicePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(218,188,117,0);transform:translateY(0)}
  50%{box-shadow:0 0 0 5px rgba(218,188,117,.11),0 0 26px rgba(218,188,117,.10);transform:translateY(-2px)}
}
.attention-switcher:not(.interacted) button:not(.active){
  animation:floorChoicePulse 2.4s ease-in-out infinite;
}
.attention-switcher:not(.interacted) button:nth-child(2){animation-delay:.22s}
.attention-switcher:not(.interacted) button:nth-child(3){animation-delay:.44s}
.attention-switcher:not(.interacted) button:nth-child(4){animation-delay:.66s}
.attention-switcher.interacted button{animation:none !important}

/* =========================================================
   V7 — CONTINUOUS DRAGGABLE AUTO GALLERIES
   Inspired by the requested image-auto-slider component while
   remaining compatible with the static index.html build.
   ========================================================= */
.gallery-container-wide{overflow:visible}
.auto-gallery{
  margin-top:36px;
  user-select:none;
}
.auto-gallery-mask{
  width:100%;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 96%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 96%,transparent 100%);
}
.auto-gallery-track{
  display:flex;
  gap:18px;
  width:100%;
  overflow-x:scroll;
  overflow-y:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
  padding:18px 5vw 24px;
  cursor:grab;
  overscroll-behavior-x:contain;
  touch-action:pan-y;
}
.auto-gallery-track::-webkit-scrollbar{display:none}
.auto-gallery-track.dragging{cursor:grabbing}
.auto-gallery-card{
  position:relative;
  flex:0 0 clamp(290px,30vw,430px);
  aspect-ratio:16/10;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  background:#0c0d10;
  box-shadow:0 18px 44px rgba(0,0,0,.25);
  cursor:pointer;
  padding:0;
  color:#fff;
  text-align:left;
  transform:translateZ(0);
  transition:transform .34s cubic-bezier(.2,.75,.2,1),border-color .34s ease,filter .34s ease;
}
.auto-gallery-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
  transition:transform .45s cubic-bezier(.2,.75,.2,1),filter .35s ease;
}
.auto-gallery-card:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0) 48%);
  pointer-events:none;
}
.auto-gallery-card:hover{
  transform:scale(1.025);
  border-color:rgba(228,207,159,.35);
}
.auto-gallery-card:hover img{
  transform:scale(1.045);
  filter:brightness(1.07);
}
.auto-gallery-card-label{
  position:absolute;
  z-index:2;
  left:18px;
  right:72px;
  bottom:16px;
  font-size:.93rem;
  font-weight:650;
  line-height:1.25;
  pointer-events:none;
}
.auto-gallery-card-open{
  position:absolute;
  z-index:2;
  right:16px;
  bottom:16px;
  color:var(--gold2);
  font-size:.72rem;
  pointer-events:none;
}
.auto-gallery-note{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  color:#777;
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.auto-gallery-note span+span:before{
  content:"·";
  margin-right:18px;
  color:#3d3d3d;
}
.auto-gallery-footer{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.09);
}
.auto-gallery-floor{
  display:block;
  font-family:var(--serif);
  font-size:1.45rem;
  color:#fff;
}
.auto-gallery-subtitle{
  display:block;
  margin-top:5px;
  color:#777;
  font-size:.86rem;
}

/* Magnifier remains large, but V7 intentionally reduces the zoom ratio in JS. */
.plan-magnifier{width:460px !important;height:300px !important}

@media(max-width:980px){
  .signature-grid{grid-template-columns:repeat(2,1fr)}
  .auto-gallery-footer{align-items:flex-start;flex-direction:column}
}
@media(max-width:680px){
  .signature-grid{grid-template-columns:1fr}
  .signature-card{min-height:0;padding:24px}
  .floor-switcher button,.interior-floor-tab,.tab{min-height:50px;padding:13px 19px !important;font-size:.9rem !important}
  .auto-gallery-mask{-webkit-mask-image:none;mask-image:none}
  .auto-gallery-track{padding-left:0;padding-right:0;gap:12px;touch-action:pan-x pan-y}
  .auto-gallery-card{flex-basis:82vw;border-radius:12px}
  .auto-gallery-note{gap:8px;font-size:.6rem}
  .auto-gallery-note span+span:before{margin-right:8px}
}


/* =========================================================
   V8 — Signature amenities over white garage backdrop
   ========================================================= */
.signature-showcase{
  margin-top:28px;
  padding:46px 34px 34px;
  border-radius:28px;
  background:#ffffff url("assets/exterior-front-night.jpg") center 18px / min(100%, 1180px) auto no-repeat;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 28px 70px rgba(0,0,0,.16);
  overflow:hidden;
}
.signature-showcase .signature-header{
  margin-top:0;
  border-bottom:1px solid rgba(0,0,0,.12);
}
.signature-showcase .eyebrow{color:#8e7348 !important;}
.signature-showcase .signature-header h3{color:#17181b;}
.signature-showcase .signature-header p{color:#555; max-width:420px;}
.signature-showcase .signature-grid{
  margin-top:320px;
  background:rgba(0,0,0,.08);
  border:1px solid rgba(0,0,0,.08);
}
.signature-showcase .signature-card{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(5px);
}
.signature-showcase .signature-card:hover{background:#fff;}
.signature-showcase .signature-card b{color:#141518;}
.signature-showcase .signature-card span{color:#53575c;}
.signature-showcase .feature-icon{border-color:rgba(142,115,72,.35);}

/* V8 — simpler gallery heads */
#exteriors .section-head p,
#interiors .section-head p,
#exteriors .auto-gallery-note,
#interiors .auto-gallery-note{display:none !important;}
#exteriors .section-head,
#interiors .section-head{max-width:none;}
#exteriors .section-head h2,
#interiors .section-head h2{font-size:clamp(2.6rem,4.6vw,4.6rem);}
.auto-gallery{margin-top:28px;}
.auto-gallery-footer{padding-top:18px;}
.lightbox-hint{display:none !important;}

@media(max-width:1100px){
  .signature-showcase .signature-grid{margin-top:260px;}
}
@media(max-width:820px){
  .signature-showcase{padding:28px 20px 24px; background-position:center 12px; background-size:calc(100% - 28px) auto;}
  .signature-showcase .signature-grid{margin-top:180px;}
}
@media(max-width:640px){
  .signature-showcase{border-radius:20px;}
  .signature-showcase .signature-grid{margin-top:120px;}
}


/* =========================================================
   V9 — signature amenities title-only layout and clearer bg
   ========================================================= */
.signature-showcase{
  position:relative;
  margin-top:28px;
  padding:40px 32px 30px;
  border-radius:28px;
  background:#080808 url("assets/exterior-front-night.jpg") center center / contain no-repeat;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 28px 70px rgba(0,0,0,.22);
  overflow:hidden;
}
.signature-showcase::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.32),rgba(0,0,0,.48));
  pointer-events:none;
}
.signature-showcase > *{position:relative; z-index:1;}
.signature-title{
  font-family:Canela, Georgia, serif;
  font-size:clamp(2.6rem, 5vw, 5rem);
  line-height:.95;
  color:#fff;
  margin:0 0 28px;
  letter-spacing:.01em;
}
.signature-showcase .signature-header{display:none !important;}
.signature-showcase .signature-grid{
  margin-top:0;
  background:rgba(0,0,0,.34);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
}
.signature-showcase .signature-card{
  background:transparent;
  backdrop-filter:none;
}
.signature-showcase .signature-card:hover{background:rgba(255,255,255,.05);}
.signature-showcase .signature-card b{color:#fff;}
.signature-showcase .signature-card span{color:rgba(255,255,255,.84);}
.signature-showcase .feature-icon{border-color:rgba(255,255,255,.28); color:#f2deb0;}

/* clearer full-screen gallery controls */
.lightbox-close{
  top:18px; right:22px;
  padding:10px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.22);
  font-size:.95rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.lightbox-arrow{
  width:auto; min-width:140px; height:52px;
  padding:0 18px; border-radius:999px;
  font-size:.92rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center; gap:10px;
}
.lightbox-prev{left:22px;}
.lightbox-next{right:22px;}
.lightbox-stage img{max-height:88vh;max-width:90vw;}

@media(max-width:900px){
  .signature-showcase{padding:28px 18px 22px; background-size:cover; background-position:center center;}
  .signature-title{margin-bottom:18px;}
  .lightbox-arrow{min-width:0; width:auto; padding:0 12px; font-size:.8rem; height:44px;}
}
@media(max-width:640px){
  .signature-title{font-size:clamp(2.1rem, 10vw, 3rem);}
  .lightbox-close{top:10px; right:10px; padding:8px 12px; font-size:.78rem;}
  .lightbox-arrow{bottom:18px; top:auto; transform:none;}
  .lightbox-prev{left:10px;}
  .lightbox-next{right:10px;}
  .lightbox-stage img{max-height:82vh; max-width:95vw;}
}

/* =========================================================
   V10 — keep Signature Amenities layout unchanged; add the
   supplied Bugatti image as a full-width section background.
   ========================================================= */
.signature-showcase{
  background:none !important;
  overflow:visible;
  isolation:isolate;
}
.signature-showcase::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:url("assets/exterior-backside.jpg") center center / cover no-repeat;
  z-index:-2;
  pointer-events:none;
}
.signature-showcase::before{
  inset:auto !important;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:linear-gradient(180deg,rgba(0,0,0,.36),rgba(0,0,0,.52));
  z-index:-1;
}
@media(max-width:900px){
  .signature-showcase::after{background-position:center center;}
}


/* =========================================================
   V11 — TRUE NEVER-ENDING AUTO-SLIDER
   Duplicated image sets + requestAnimationFrame make the
   gallery move immediately and loop without reaching an end.
   ========================================================= */
.auto-gallery-mask{
  overflow:hidden !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 7%,#000 93%,transparent 100%) !important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 7%,#000 93%,transparent 100%) !important;
}
.auto-gallery-track{
  width:100% !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:scroll !important;
  scroll-behavior:auto !important;
  scrollbar-width:none !important;
  will-change:scroll-position;
}
.auto-gallery-track::-webkit-scrollbar{display:none !important;}
.auto-gallery-card{
  flex:0 0 clamp(290px,30vw,430px) !important;
}

@media(max-width:680px){
  .auto-gallery-mask{
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 3%,#000 97%,transparent 100%) !important;
    mask-image:linear-gradient(90deg,transparent 0%,#000 3%,#000 97%,transparent 100%) !important;
  }
  .auto-gallery-card{flex-basis:82vw !important;}
}


/* =========================================================
   V12 — INTERACTIVE BENTO GALLERY
   ========================================================= */
#exteriors .auto-gallery,
#interiors .auto-gallery{margin-top:32px;}
.auto-gallery-mask{
  position:relative;
  overflow:hidden !important;
  padding:4px 0 10px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 96%,transparent 100%) !important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 96%,transparent 100%) !important;
}
.auto-gallery-track{
  display:grid !important;
  grid-auto-flow:column !important;
  grid-template-rows:repeat(2, clamp(150px, 15vw, 220px)) !important;
  grid-auto-columns:clamp(220px, 22vw, 330px) !important;
  align-items:stretch !important;
  gap:16px !important;
  width:100% !important;
  height:auto !important;
  min-height:clamp(316px, calc(30vw + 16px), 456px);
  padding:14px 5vw 24px !important;
  overflow-x:scroll !important;
  overflow-y:hidden !important;
  scroll-behavior:auto !important;
  scrollbar-width:none !important;
  cursor:grab;
  touch-action:pan-y;
  overscroll-behavior-x:contain;
  will-change:scroll-position;
}
.auto-gallery-track::-webkit-scrollbar{display:none !important;}
.auto-gallery-track.dragging{cursor:grabbing !important;}
.auto-gallery-card,.bento-gallery-card{
  position:relative !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  aspect-ratio:auto !important;
  flex:none !important;
  overflow:hidden;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:#0b0c0f !important;
  box-shadow:0 18px 46px rgba(0,0,0,.32) !important;
  padding:0 !important;
  color:#fff;
  cursor:pointer;
  text-align:left;
  isolation:isolate;
  transform:translateZ(0);
  transition:transform .42s cubic-bezier(.2,.75,.2,1),border-color .35s ease,box-shadow .35s ease !important;
}
.bento-gallery-card.bento-large{grid-column:span 2;grid-row:span 2;}
.bento-gallery-card.bento-tall{grid-column:span 1;grid-row:span 2;}
.bento-gallery-card.bento-wide{grid-column:span 2;grid-row:span 1;}
.bento-gallery-card.bento-standard{grid-column:span 1;grid-row:span 1;}
.bento-gallery-card img{
  position:absolute !important;inset:0;width:100% !important;height:100% !important;object-fit:cover !important;display:block;
  pointer-events:none;transform:scale(1.002);
  transition:transform .62s cubic-bezier(.2,.75,.2,1),filter .45s ease !important;
}
.auto-gallery-card-label,.auto-gallery-card-open{display:none !important;}
.bento-gallery-shade{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.18) 58%,rgba(0,0,0,.88) 100%);
  opacity:0;transition:opacity .48s ease;
}
.bento-gallery-content{
  position:absolute;z-index:2;left:22px;right:22px;bottom:20px;display:flex;flex-direction:column;gap:6px;
  opacity:0;transform:translateY(18px);pointer-events:none;
  transition:opacity .46s ease,transform .5s cubic-bezier(.2,.75,.2,1);
}
.bento-gallery-content b{font-family:var(--serif);font-size:clamp(1.05rem,1.35vw,1.45rem);line-height:1.1;font-weight:500;color:#fff;}
.bento-gallery-content small{color:rgba(255,255,255,.74);font-size:.7rem;font-weight:650;letter-spacing:.09em;text-transform:uppercase;}
.bento-gallery-card:hover,.bento-gallery-card:focus-visible{
  transform:scale(1.018) !important;border-color:rgba(228,207,159,.42) !important;box-shadow:0 22px 58px rgba(0,0,0,.42) !important;outline:none;
}
.bento-gallery-card:hover img,.bento-gallery-card:focus-visible img{transform:scale(1.06) !important;filter:brightness(1.06);}
.bento-gallery-card:hover .bento-gallery-shade,.bento-gallery-card:focus-visible .bento-gallery-shade{opacity:1;}
.bento-gallery-card:hover .bento-gallery-content,.bento-gallery-card:focus-visible .bento-gallery-content{opacity:1;transform:translateY(0);}
.lightbox{background:rgba(0,0,0,.94) !important;backdrop-filter:blur(14px);}
.lightbox-stage img{max-width:min(94vw,1600px) !important;max-height:88vh !important;border-radius:12px;box-shadow:0 30px 100px rgba(0,0,0,.48);}
.lightbox-close,.lightbox-arrow{backdrop-filter:blur(10px);background:rgba(15,15,15,.72) !important;border:1px solid rgba(255,255,255,.22) !important;color:#fff !important;}
.lightbox-close:hover,.lightbox-arrow:hover{background:#fff !important;color:#111 !important;}
@media(max-width:900px){
  .auto-gallery-track{grid-template-rows:repeat(2,150px) !important;grid-auto-columns:min(68vw,280px) !important;min-height:316px;gap:12px !important;padding:12px 18px 20px !important;}
  .bento-gallery-content{left:16px;right:16px;bottom:15px;}
}
@media(max-width:620px){
  .auto-gallery-mask{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 2%,#000 98%,transparent 100%) !important;mask-image:linear-gradient(90deg,transparent 0%,#000 2%,#000 98%,transparent 100%) !important;}
  .auto-gallery-track{grid-template-rows:repeat(2,132px) !important;grid-auto-columns:64vw !important;min-height:276px;gap:10px !important;padding:10px 12px 18px !important;}
  .bento-gallery-card{border-radius:13px !important;}
  .bento-gallery-card.bento-large{grid-column:span 1;grid-row:span 2;}
  .bento-gallery-card.bento-wide{grid-column:span 1;grid-row:span 1;}
  .bento-gallery-content b{font-size:1rem;}.bento-gallery-content small{font-size:.6rem;}
}


/* =========================================================
   V13 — gallery clickability + lightbox interaction hardening
   ========================================================= */
.auto-gallery-card,.bento-gallery-card{
  pointer-events:auto !important;
  position:relative;
  z-index:1;
  -webkit-tap-highlight-color:transparent;
}
.auto-gallery-card:active,.bento-gallery-card:active{transform:scale(.995) !important;}
.lightbox.open{display:flex !important;opacity:1 !important;visibility:visible !important;pointer-events:auto !important;}
.lightbox{visibility:hidden;pointer-events:none;}
.lightbox.open .lightbox-stage,
.lightbox.open .lightbox-close,
.lightbox.open .lightbox-arrow{pointer-events:auto !important;}
.lightbox-close,.lightbox-arrow{z-index:110 !important;}


/* =========================================================
   V14 — Signature Amenities background VIDEO
   Keeps the V13/V10 visual treatment and copy unchanged.
   The video itself is shown at original brightness/sharpness:
   no dark overlay, opacity reduction, blur, or filter.
   ========================================================= */
.signature-showcase{
  position:relative !important;
  isolation:isolate !important;
  background:none !important;
  overflow:visible !important;
}
.signature-showcase::before,
.signature-showcase::after{
  display:none !important;
  content:none !important;
  background:none !important;
}
.signature-bg-video{
  position:absolute !important;
  z-index:0 !important;
  top:0 !important;
  bottom:0 !important;
  left:50% !important;
  width:100vw !important;
  height:100% !important;
  transform:translateX(-50%) !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
  opacity:1 !important;
  filter:none !important;
  -webkit-filter:none !important;
  pointer-events:none !important;
}
.signature-showcase > :not(.signature-bg-video){
  position:relative;
  z-index:1;
}

@media(max-width:900px){
  .signature-bg-video{
    object-fit:cover !important;
    object-position:center center !important;
  }
}

/* =========================================================
   V15 — TRUE FULL-BLEED SIGNATURE AMENITIES VIDEO
   Fixes the V14 clipping caused by the global video max-width.
   The supplied video is shown at its original brightness and
   sharpness: no dark overlay, no blur, no opacity reduction.
   ========================================================= */
.signature-showcase{
  position:relative !important;
  isolation:isolate !important;
  background:transparent !important;
  overflow:visible !important;
}

/* Remove every legacy image/gradient layer from earlier versions. */
.signature-showcase::before,
.signature-showcase::after{
  display:none !important;
  content:none !important;
  background:none !important;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.signature-bg-video{
  position:absolute !important;
  z-index:0 !important;
  top:0 !important;
  bottom:0 !important;
  left:50% !important;
  width:100vw !important;
  max-width:none !important; /* critical: overrides global video{max-width:100%} */
  height:100% !important;
  transform:translateX(-50%) !important;
  object-fit:cover !important;
  object-position:center center !important;
  opacity:1 !important;
  filter:none !important;
  -webkit-filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  mix-blend-mode:normal !important;
  pointer-events:none !important;
}

/* Keep all existing text/icons/layout, but remove the translucent
   dark/blur layer that was making the video behind them look muddy. */
.signature-showcase .signature-grid{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.signature-showcase .signature-card,
.signature-showcase .signature-card:hover{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.signature-showcase > :not(.signature-bg-video){
  position:relative !important;
  z-index:1 !important;
}

@media(max-width:900px){
  .signature-bg-video{
    width:100vw !important;
    max-width:none !important;
    object-fit:cover !important;
    object-position:center center !important;
  }
}


/* =========================================================
   V16 — EXTRA-WIDE, LARGE BENTO GALLERIES
   ========================================================= */

/* Pull both gallery titles slightly upward and keep only one title. */
#exteriors,
#interiors{
  padding-top:68px !important;
  padding-bottom:105px !important;
}

#exteriors .gallery-container-wide,
#interiors .gallery-container-wide{
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:0 !important;
  overflow:visible !important;
}

#exteriors .gallery-main-heading,
#interiors .gallery-main-heading{
  width:min(1540px,calc(100vw - 80px));
  max-width:none !important;
  margin:0 auto 22px !important;
  padding:0 !important;
}

#exteriors .gallery-main-heading h2,
#interiors .gallery-main-heading h2{
  margin:0 !important;
  font-size:clamp(3.6rem,5.7vw,6.2rem) !important;
  line-height:.94;
}

/* Interior floor selector still aligns with the large page title rather than the first image. */
#interiors .floor-switcher-label,
#interiors #interiorFloorTabs{
  width:min(1540px,calc(100vw - 80px));
  margin-left:auto !important;
  margin-right:auto !important;
}

/* The gallery itself now reaches almost edge-to-edge across wide displays. */
#exteriors .auto-gallery,
#interiors .auto-gallery{
  width:100vw !important;
  margin:18px 0 0 !important;
}

#exteriors .auto-gallery-mask,
#interiors .auto-gallery-mask{
  width:100vw !important;
  overflow:hidden !important;
  padding:4px 0 14px !important;
  -webkit-mask-image:linear-gradient(
    90deg,
    transparent 0%,
    #000 1.8%,
    #000 98.2%,
    transparent 100%
  ) !important;
  mask-image:linear-gradient(
    90deg,
    transparent 0%,
    #000 1.8%,
    #000 98.2%,
    transparent 100%
  ) !important;
}

/* Much larger bento cells while preserving the existing mixed layout. */
#exteriors .auto-gallery-track,
#interiors .auto-gallery-track{
  grid-template-rows:repeat(2,clamp(235px,17.5vw,325px)) !important;
  grid-auto-columns:clamp(330px,26vw,505px) !important;
  min-height:clamp(486px,calc(35vw + 20px),670px) !important;
  gap:20px !important;
  width:100vw !important;
  max-width:none !important;
  padding:12px clamp(28px,3vw,60px) 30px !important;
}

#exteriors .bento-gallery-card,
#interiors .bento-gallery-card{
  border-radius:20px !important;
}

#exteriors .bento-gallery-content,
#interiors .bento-gallery-content{
  left:26px;
  right:26px;
  bottom:24px;
}

#exteriors .bento-gallery-content b,
#interiors .bento-gallery-content b{
  font-size:clamp(1.3rem,1.55vw,1.8rem);
}

/* Keep the active interior-floor label aligned with the wide gallery. */
#interiors .auto-gallery-footer{
  width:min(1540px,calc(100vw - 80px));
  margin:0 auto !important;
}

/* Tablet */
@media(max-width:1100px){
  #exteriors,
  #interiors{
    padding-top:58px !important;
    padding-bottom:88px !important;
  }

  #exteriors .gallery-main-heading,
  #interiors .gallery-main-heading,
  #interiors .floor-switcher-label,
  #interiors #interiorFloorTabs,
  #interiors .auto-gallery-footer{
    width:calc(100vw - 44px);
  }

  #exteriors .auto-gallery-track,
  #interiors .auto-gallery-track{
    grid-template-rows:repeat(2,205px) !important;
    grid-auto-columns:clamp(300px,46vw,430px) !important;
    min-height:430px !important;
    gap:16px !important;
    padding:12px 22px 26px !important;
  }
}

/* Mobile — still intentionally large, swipeable and obvious. */
@media(max-width:680px){
  #exteriors,
  #interiors{
    padding-top:48px !important;
    padding-bottom:74px !important;
  }

  #exteriors .gallery-main-heading,
  #interiors .gallery-main-heading,
  #interiors .floor-switcher-label,
  #interiors #interiorFloorTabs,
  #interiors .auto-gallery-footer{
    width:calc(100vw - 28px);
  }

  #exteriors .gallery-main-heading h2,
  #interiors .gallery-main-heading h2{
    font-size:clamp(2.8rem,13vw,4rem) !important;
  }

  #exteriors .auto-gallery-mask,
  #interiors .auto-gallery-mask{
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 1%,#000 99%,transparent 100%) !important;
    mask-image:linear-gradient(90deg,transparent 0%,#000 1%,#000 99%,transparent 100%) !important;
  }

  #exteriors .auto-gallery-track,
  #interiors .auto-gallery-track{
    grid-template-rows:repeat(2,155px) !important;
    grid-auto-columns:78vw !important;
    min-height:324px !important;
    gap:12px !important;
    padding:10px 14px 20px !important;
  }

  #exteriors .bento-gallery-card.bento-large,
  #interiors .bento-gallery-card.bento-large{
    grid-column:span 1;
    grid-row:span 2;
  }

  #exteriors .bento-gallery-card.bento-wide,
  #interiors .bento-gallery-card.bento-wide{
    grid-column:span 1;
    grid-row:span 1;
  }
}