/* ============================================================
   LEAGUE GROUP — Split-Screen Landing
   Design language: cream / bronze / charcoal · Playfair Display + Jost
   Split hero inspired by 62management.com (cursor-reactive divider,
   depth-of-field blur, one picture + one name per panel, click to
   enter each project like a storefront's Women / Men doors)
   Split hero inspired by 62management.com — cursor-reactive
   divider, depth-of-field blur on the inactive panel, staggered
   reveal, cinematic scroll. Editorial luxury: oversized display
   serif, hairline rules, generous negative space, motion that
   follows one signature curve.
   ============================================================ */

:root{
  --bg:#FAF8F5;
  --surface:#FFFFFF;
  --stone:#ECE7DF;
  --charcoal:#202020;
  --charcoal-soft:#3a3a3a;
  --bronze:#8D6A3A;
  --bronze-deep:#6f5329;
  --champagne:#D8BF8B;
  --cream:#F3EEE6;
  --warm-black:#141210;
  --line:rgba(32,32,32,.12);
  --line-strong:rgba(32,32,32,.22);
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.72,.21,.29,.98);
  --ease-snap:cubic-bezier(.16,1,.3,1);
  --shadow-lg:0 24px 60px rgba(32,32,32,.18);
  --shadow-sm:0 8px 24px rgba(32,32,32,.10);
  --header-h:88px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} /* scroll-behavior removed: Lenis handles smooth scroll */
body{font-family:var(--font-body);background:var(--bg);color:var(--charcoal);font-size:16px;line-height:1.65;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:rgba(141,106,58,.28);color:var(--charcoal)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--bronze);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--bronze-deep)}

:focus-visible{outline:2px solid var(--bronze);outline-offset:3px;border-radius:2px}

.skip-link{position:absolute;top:-100px;left:16px;z-index:10000;background:var(--bronze);color:var(--bg);padding:12px 24px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;transition:top .3s}
.skip-link:focus{top:16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ============ LOADER ============ */
.loader{position:fixed;inset:0;z-index:9998;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:opacity .8s ease,visibility .8s}
.loader.hidden{opacity:0;visibility:hidden}
.loader-inner{display:flex;flex-direction:column;align-items:center;gap:16px}
.loader-brand{font-family:var(--font-display);font-style:italic;font-size:64px;color:var(--bronze);line-height:1;animation:loaderFloat 2s var(--ease) infinite}
.loader-rule{width:120px;height:1px;background:linear-gradient(90deg,transparent,var(--bronze),transparent);animation:loaderRule 2s var(--ease) infinite}
.loader-progress{width:220px;height:1px;background:rgba(32,32,32,.12);position:relative;overflow:hidden}
.loader-progress::after{content:"";position:absolute;inset:0;background:var(--bronze);transform:translateX(-100%);animation:loaderProgress 1.5s var(--ease) forwards}
.loader-tag{font-size:10.5px;letter-spacing:.45em;text-transform:uppercase;color:rgba(32,32,32,.5)}
@keyframes loaderFloat{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes loaderRule{0%,100%{transform:scaleX(.4);opacity:.5}50%{transform:scaleX(1);opacity:1}}
@keyframes loaderProgress{to{transform:translateX(0)}}

/* ============ HEADER ============ */
.site-header{position:fixed;top:0;left:0;width:100%;z-index:900;transition:background .4s,box-shadow .4s,transform .5s var(--ease)}
.site-header .header-inner{max-width:1240px;margin:0 auto;height:var(--header-h);padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.header-logo{display:flex;align-items:center;gap:12px;z-index:2}
.logo-mark{width:40px;height:40px;border:1.5px solid var(--bronze);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-style:italic;font-size:21px;color:var(--bronze);background:rgba(250,248,245,.65);transition:background .3s,color .3s}
.logo-word{font-family:var(--font-display);font-style:italic;font-size:26px;color:var(--bronze)}
.header-nav{display:flex;gap:34px}
.header-nav a{font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(32,32,32,.78);position:relative;padding:6px 0;transition:color .3s}
.header-nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--bronze);transition:width .35s var(--ease)}
.header-nav a:hover{color:var(--bronze)}
.header-nav a:hover::after{width:100%}
.header-actions{display:flex;align-items:center;gap:18px}
.header-cta{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--bg);background:var(--bronze);padding:12px 22px;border-radius:999px;transition:background .3s,transform .3s;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}
.header-cta:hover{background:var(--bronze-deep);transform:translateY(-1px)}
.header-cta:active{transform:translateY(0);box-shadow:inset 0 2px 5px rgba(0,0,0,.22);transition:transform .1s ease,box-shadow .1s ease}

/* header over hero: transparent, white text */
.site-header.is-hero{background:linear-gradient(to bottom,rgba(20,20,20,.35),transparent)}
.site-header.is-hero .header-nav a{color:rgba(255,255,255,.85)}
.site-header.is-hero .logo-word{color:var(--champagne)}
.site-header.is-hero .logo-mark{color:var(--champagne);border-color:rgba(216,191,139,.7);background:rgba(20,20,20,.25)}

.site-header.scrolled{background:rgba(250,248,245,.92);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line),0 10px 30px rgba(32,32,32,.06)}
.site-header.scrolled .header-nav a{color:rgba(32,32,32,.8)}
.site-header.scrolled .logo-word{color:var(--bronze)}
.site-header.scrolled .logo-mark{border-color:var(--bronze);color:var(--bronze);background:var(--bg)}

/* mobile menu button */
.menu-btn{display:none;flex-direction:column;gap:5px;padding:8px;z-index:960}
.menu-btn span{width:26px;height:2px;background:var(--charcoal);transition:transform .35s var(--ease),opacity .25s}
.site-header.is-hero .menu-btn span{background:#fff}
.menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.site-header.scrolled .menu-btn span{background:var(--charcoal)}
/* when the menu is open the overlay is opaque cream — force the X dark so it
   stays visible above it (is-hero leaves the spans white by default) */
.menu-btn.open span{background:var(--charcoal)!important}

.mobile-menu{position:fixed;inset:0;z-index:950;background:var(--bg);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
.mobile-menu.open{opacity:1;visibility:visible}
/* explicit close affordance: the header (z 900) sits under the overlay (z 950),
   so the morphing burger would be hidden — give the menu its own clear ✕ */
.mobile-menu-close{position:absolute;top:24px;right:24px;z-index:2;width:46px;height:46px;border-radius:50%;border:1px solid rgba(141,106,58,.42);background:var(--surface);color:var(--bronze);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-sm);opacity:0;transform:translateY(-8px);transition:opacity .35s var(--ease) .15s,transform .35s var(--ease) .15s,background .3s,color .3s,border-color .3s}
.mobile-menu.open .mobile-menu-close{opacity:1;transform:none}
.mobile-menu-close:hover{background:var(--bronze);color:#fff;border-color:var(--bronze)}
.mobile-menu-close:active{transform:scale(.94)}
.mobile-menu nav{display:flex;flex-direction:column;gap:8px;text-align:center}
.mobile-menu a{font-family:var(--font-display);font-size:34px;color:var(--charcoal);padding:8px;transition:color .3s,transform .3s}
.mobile-menu a:hover{color:var(--bronze)}
.mobile-menu a[download]{font-family:var(--font-body);font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze);font-weight:600}

.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--bronze),var(--champagne));z-index:950}

/* ============================================================
   HERO — THE GRAND SPLIT
   Two full-bleed portraits divided by a diagonal seam. Hovering
   a panel expands it while the other recedes into depth-of-field
   blur. Oversized serif titles, champagne hairlines and a bronze
   medallion bridge the seam. Entrance: the seam parts like
   stage curtains (GSAP, with a pure-CSS failsafe).
   ============================================================ */
.split-hero{position:relative;height:100vh;height:100svh;min-height:660px;overflow:hidden;background:var(--warm-black)}
.split-canvas{position:absolute;inset:0}
.hero-vignette{position:absolute;inset:0;z-index:6;pointer-events:none;background:radial-gradient(120% 95% at 50% 42%,transparent 55%,rgba(8,7,6,.5) 100%)}
.grain{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:.35;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.seam-light{position:absolute;inset:0;z-index:5;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(97deg,transparent 45.5%,rgba(216,191,139,.10) 50%,transparent 54.5%)}

/* -- panels: one portrait per world --
   Asymmetric padding parks each panel's centred content inside its
   own half of the canvas (left panel reads left, right reads right). */
.panel{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;color:#fff;isolation:isolate;
  transition:clip-path 1.1s var(--ease-snap),filter .7s var(--ease);
}
.panel-luxes{clip-path:polygon(0 0,74% 0,26% 100%,0 100%);padding:0 46vw 0 6vw}
.panel-overlook{clip-path:polygon(74% 0,100% 0,100% 100%,26% 100%);padding:0 6vw 0 46vw}
.panel-bg{
  position:absolute;inset:-5%;
  background-size:cover;background-position:center;
  will-change:transform,filter;
  transition:filter .8s var(--ease),transform 1.6s var(--ease-snap);
}
.panel-scrim{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,10,8,.58) 0%,rgba(12,10,8,.26) 38%,rgba(12,10,8,.2) 56%,rgba(12,10,8,.52) 100%);
  transition:background .7s var(--ease);
}

/* -- panel content -- */
.panel-content{
  position:relative;z-index:3;max-width:600px;
  padding:0 clamp(24px,4vw,64px);
  text-align:center;display:flex;flex-direction:column;align-items:center;
  gap:clamp(10px,1.6vh,16px);
  transition:opacity .55s var(--ease),transform .8s var(--ease-snap);
}
.panel-kicker{
  font-size:clamp(9px,.85vw,11px);font-weight:600;letter-spacing:.42em;
  text-transform:uppercase;color:var(--champagne);
  text-shadow:0 1px 8px rgba(0,0,0,.6);
}
.panel-title{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(64px,9.5vw,168px);line-height:.98;letter-spacing:.005em;
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.55),0 10px 60px rgba(0,0,0,.45);
}
.panel-rule{width:clamp(56px,6vw,92px);height:1px;background:linear-gradient(90deg,transparent,var(--champagne),transparent)}
.panel-sub{
  font-size:clamp(10px,1vw,12.5px);font-weight:500;letter-spacing:.34em;
  text-transform:uppercase;color:rgba(255,255,255,.8);
  text-shadow:0 1px 6px rgba(0,0,0,.6);
}
.panel-explore{
  display:inline-flex;align-items:center;gap:12px;
  margin-top:clamp(8px,1.6vh,16px);
  padding:14px 30px;border:1px solid rgba(255,255,255,.4);border-radius:999px;
  background:rgba(12,11,9,.28);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  font-size:10.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:#fff;
  text-shadow:0 1px 6px rgba(0,0,0,.5);
  transition:background .45s var(--ease),border-color .45s var(--ease),color .45s var(--ease),transform .45s var(--ease),text-shadow .45s var(--ease);
}
.panel-explore i{font-style:normal;font-size:14px;line-height:1;transition:transform .4s var(--ease)}
.panel:hover .panel-explore{
  background:var(--champagne);border-color:var(--champagne);color:#211D18;
  transform:translateY(-2px);text-shadow:none;
}
.panel:hover .panel-explore i{transform:translateX(5px)}
.panel:active .panel-explore{transform:translateY(0) scale(.99)}

/* -- index numerals anchored to each panel's outer edge -- */
.panel-index{
  position:absolute;bottom:clamp(24px,4.5vh,42px);z-index:3;
  display:flex;align-items:baseline;gap:12px;
}
.panel-luxes .panel-index{left:clamp(24px,3.4vw,52px)}
.panel-overlook .panel-index{right:clamp(24px,3.4vw,52px);flex-direction:row-reverse}
.panel-index b{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(24px,2.4vw,34px);line-height:1;color:var(--champagne);text-shadow:0 2px 12px rgba(0,0,0,.6)}
.panel-index span{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.68);text-shadow:0 1px 6px rgba(0,0,0,.6)}

/* -- bronze medallion bridging the seam -- */
.hero-medallion{
  position:absolute;left:50%;top:50%;z-index:7;
  transform:translate(-50%,-50%);
  width:clamp(56px,5vw,76px);height:clamp(56px,5vw,76px);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#2A241C,#191510 70%);
  border:1px solid rgba(216,191,139,.6);
  box-shadow:0 0 0 8px rgba(16,14,11,.28),0 0 0 9px rgba(216,191,139,.3),0 18px 44px rgba(0,0,0,.5);
  pointer-events:none;
}
.hero-medallion span{
  font-family:var(--font-display);font-style:italic;
  font-size:clamp(22px,2vw,32px);line-height:1;color:var(--champagne);
  transform:translateY(-2px);
}

/* -- scroll cue -- */
.hero-scroll-hint{
  position:absolute;left:50%;bottom:clamp(16px,3.2vh,30px);transform:translateX(-50%);
  z-index:7;display:flex;flex-direction:column;align-items:center;gap:10px;
  font-size:9.5px;letter-spacing:.4em;text-transform:uppercase;color:rgba(255,255,255,.6);
  text-shadow:0 1px 6px rgba(0,0,0,.6);
}
.scroll-line{width:1px;height:44px;position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(216,191,139,.55),transparent)}
.scroll-line::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,.85);animation:scrollDrip 2.4s var(--ease) infinite}
@keyframes scrollDrip{0%{transform:translateY(-100%)}60%{transform:translateY(100%)}100%{transform:translateY(100%)}}

/* -- hover geometry: expand one world, blur the other (fine pointers) -- */
@media (hover:hover) and (min-width:901px){
  .split-canvas:has(.panel-luxes:hover) .panel-luxes,.split-hero.luxes-hover .panel-luxes{clip-path:polygon(0 0,88% 0,42% 100%,0 100%)}
  .split-canvas:has(.panel-luxes:hover) .panel-overlook,.split-hero.luxes-hover .panel-overlook{clip-path:polygon(88% 0,100% 0,100% 100%,42% 100%)}
  .split-canvas:has(.panel-luxes:hover) .panel-luxes .panel-bg,.split-hero.luxes-hover .panel-luxes .panel-bg{transform:scale(1.07) translateX(2.5%);filter:none}
  .split-canvas:has(.panel-luxes:hover) .panel-overlook .panel-bg,.split-hero.luxes-hover .panel-overlook .panel-bg{filter:blur(14px) saturate(.3) brightness(.42);transform:scale(1.12)}
  .split-canvas:has(.panel-luxes:hover) .panel-luxes .panel-content,.split-hero.luxes-hover .panel-luxes .panel-content{transform:translateX(3%)}
  .split-canvas:has(.panel-luxes:hover) .panel-overlook .panel-content,.split-hero.luxes-hover .panel-overlook .panel-content{opacity:.25;transform:translateY(8px)}

  .split-canvas:has(.panel-overlook:hover) .panel-overlook,.split-hero.overlook-hover .panel-overlook{clip-path:polygon(58% 0,100% 0,100% 100%,10% 100%)}
  .split-canvas:has(.panel-overlook:hover) .panel-luxes,.split-hero.overlook-hover .panel-luxes{clip-path:polygon(0 0,58% 0,10% 100%,0 100%)}
  .split-canvas:has(.panel-overlook:hover) .panel-overlook .panel-bg,.split-hero.overlook-hover .panel-overlook .panel-bg{transform:scale(1.07) translateX(-2.5%);filter:none}
  .split-canvas:has(.panel-overlook:hover) .panel-luxes .panel-bg,.split-hero.overlook-hover .panel-luxes .panel-bg{filter:blur(14px) saturate(.3) brightness(.42);transform:scale(1.12)}
  .split-canvas:has(.panel-overlook:hover) .panel-overlook .panel-content,.split-hero.overlook-hover .panel-overlook .panel-content{transform:translateX(-3%)}
  .split-canvas:has(.panel-overlook:hover) .panel-luxes .panel-content,.split-hero.overlook-hover .panel-luxes .panel-content{opacity:.25;transform:translateY(8px)}

  .split-canvas:has(.panel-luxes:hover) .panel-luxes .panel-scrim,.split-hero.luxes-hover .panel-luxes .panel-scrim{background:linear-gradient(180deg,rgba(12,10,8,.5) 0%,rgba(12,10,8,.16) 40%,rgba(12,10,8,.14) 58%,rgba(12,10,8,.42) 100%)}
  .split-canvas:has(.panel-overlook:hover) .panel-overlook .panel-scrim,.split-hero.overlook-hover .panel-overlook .panel-scrim{background:linear-gradient(180deg,rgba(12,10,8,.5) 0%,rgba(12,10,8,.16) 40%,rgba(12,10,8,.14) 58%,rgba(12,10,8,.42) 100%)}
}

/* -- entrance state: the seam starts as a hairline --
   CRITICAL: without JS, html.js never gets added and every rule in
   this group is inert — the full split simply shows, fully legible. */
html.js .split-hero:not(.wiped) .panel-luxes{clip-path:polygon(50% 0,50% 0,50% 100%,50% 100%)}
html.js .split-hero:not(.wiped) .panel-overlook{clip-path:polygon(50% 0,50% 0,50% 100%,50% 100%)}
html.js .panel-content > *{opacity:0;transform:translateY(26px)}
html.js .panel-index{opacity:0;transform:translateY(14px)}
html.js .hero-medallion{opacity:0;transform:translate(-50%,-50%) scale(.55)}
html.js .hero-scroll-hint{opacity:0}
html.js .seam-light{opacity:0}

/* the wiped state opens everything, staggered like a curtain call */
html.js .split-hero.wiped .panel-content > *{opacity:1;transform:none;transition:opacity .9s var(--ease-snap),transform .9s var(--ease-snap)}
html.js .split-hero.wiped .panel-kicker{transition-delay:.55s}
html.js .split-hero.wiped .panel-title{transition-delay:.66s}
html.js .split-hero.wiped .panel-rule{transition-delay:.82s}
html.js .split-hero.wiped .panel-sub{transition-delay:.9s}
html.js .split-hero.wiped .panel-explore{transition-delay:1.02s}
html.js .split-hero.wiped .panel-index{opacity:1;transform:none;transition:opacity .9s var(--ease) 1.15s,transform .9s var(--ease) 1.15s}
html.js .split-hero.wiped .hero-medallion{opacity:1;transform:translate(-50%,-50%) scale(1);transition:opacity .9s var(--ease-snap) 1.05s,transform .9s var(--ease-snap) 1.05s}
html.js .split-hero.wiped .seam-light{opacity:1;transition:opacity 1.6s var(--ease) .85s}
html.js .split-hero.wiped .hero-scroll-hint{opacity:1;transition:opacity .9s var(--ease) 1.5s}

/* FAILSAFE: if scripts are broken, blocked or half-cached, the hero must
   still open. CSS alone forces the seam apart a few seconds after load —
   independent of every JS path. */
@keyframes heroForceReveal{to{opacity:1;transform:none}}
@keyframes seamOpenL{to{clip-path:polygon(0 0,74% 0,26% 100%,0 100%)}}
@keyframes seamOpenR{to{clip-path:polygon(74% 0,100% 0,100% 100%,26% 100%)}}
@keyframes medallionIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
html.js .split-hero:not(.wiped) .panel-luxes{animation:seamOpenL 1.4s var(--ease-snap) 4.2s forwards}
html.js .split-hero:not(.wiped) .panel-overlook{animation:seamOpenR 1.4s var(--ease-snap) 4.2s forwards}
html.js .split-hero:not(.wiped) .panel-content > *{animation:heroForceReveal .9s var(--ease-snap) 5s forwards}
html.js .split-hero:not(.wiped) .panel-index{animation:heroForceReveal .9s var(--ease) 5.5s forwards}
html.js .split-hero:not(.wiped) .hero-medallion{animation:medallionIn .9s var(--ease-snap) 5.4s forwards}
html.js .split-hero:not(.wiped) .seam-light{animation:heroForceReveal 1.2s var(--ease) 5.2s forwards}
html.js .split-hero:not(.wiped) .hero-scroll-hint{animation:heroForceReveal .9s var(--ease) 5.7s forwards}

@media (prefers-reduced-motion:reduce){
  .panel,.panel-bg,.panel-content,.panel-content > *,.panel-explore,.hero-medallion,.hero-scroll-hint,.scroll-line::after{transition:none!important;animation:none!important}
}

/* shared marquee atoms (the strip below the hero reuses these) */
.mq-track{display:flex;width:max-content;will-change:transform}
.mq-seg{display:flex;align-items:center;flex:none}
.mq-item{font-size:10.5px;letter-spacing:.4em;text-transform:uppercase;color:rgba(245,240,231,.5);white-space:nowrap;padding:0 18px}
.mq-item.alt{color:var(--champagne)}
.mq-sep{width:4px;height:4px;border-radius:50%;background:rgba(216,191,139,.5);flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;padding:15px 30px;border-radius:999px;transition:all .35s var(--ease);white-space:nowrap;cursor:pointer;position:relative;overflow:hidden}
.btn-solid{background:var(--bronze);color:var(--bg);box-shadow:var(--shadow-sm)}
.btn-solid:hover{background:var(--bronze-deep);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-solid::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-20deg);transition:left .55s var(--ease)}
.btn-solid:hover::after{left:130%}
.btn-ghost{border:1px solid rgba(255,255,255,.6);color:#fff;background:rgba(20,20,20,.18);backdrop-filter:blur(4px)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.14);transform:translateY(-2px)}
.btn-ghost.btn-light{border:1px solid rgba(255,255,255,.5)}
.btn-solid:active{background:var(--bronze-deep);transform:translateY(0);box-shadow:inset 0 2px 6px rgba(0,0,0,.25);transition:background .1s ease,transform .1s ease,box-shadow .1s ease}
.btn-ghost:active{transform:translateY(0);background:rgba(255,255,255,.26);transition:background .1s ease,transform .1s ease}


/* ============ MARQUEE ============ */
.marquee{background:var(--charcoal);color:var(--champagne);overflow:hidden;padding:17px 0;border-top:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09)}
.marquee-track{display:flex;align-items:center;width:max-content;animation:marquee 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.mq-item{font-family:var(--font-display);font-style:italic;font-size:15.5px;padding:0 14px;white-space:nowrap;letter-spacing:.02em;color:rgba(216,191,139,.92)}
.mq-item.alt{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:rgba(216,191,139,.8)}
.mq-sep{color:var(--bronze);padding:0 8px;font-size:13px}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ============ TRUST STRIP ============ */
.trust-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 48px;padding:26px 24px;border-bottom:1px solid var(--line);background:var(--bg)}
.trust-item{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(32,32,32,.68)}
.trust-dot{width:7px;height:7px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 3px rgba(141,106,58,.18)}

/* anchor scroll targets clear the fixed header */
section[id],#luxes-gallery,#overlook-gallery,#luxes-location,#overlook-location,#luxes-amenities,#overlook-amenities{scroll-margin-top:96px}

/* sections shared */
.project-section{position:relative;overflow:hidden;padding:120px 32px 48px}
.section-watermark{position:absolute;top:-30px;left:50%;transform:translateX(-50%);font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(150px,22vw,380px);line-height:1;color:rgba(141,106,58,.055);pointer-events:none;user-select:none;white-space:nowrap;z-index:0}
.project-section>*:not(.section-watermark){position:relative;z-index:1}
.section-numeral-row{max-width:1240px;margin:0 auto 44px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);padding-bottom:20px}
.section-numeral{font-family:var(--font-display);font-style:italic;font-size:54px;color:var(--bronze);line-height:1;font-variant-numeric:tabular-nums}
.section-numeral-label{position:relative;padding-left:26px;font-size:11px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:rgba(32,32,32,.68)}
.section-numeral-label::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:36px;background:var(--bronze);opacity:.5}
.section-head{max-width:1240px;margin:0 auto;text-align:center;padding:0 16px}
.eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:10.5px;font-weight:600;letter-spacing:.4em;text-transform:uppercase;color:var(--bronze);margin-bottom:18px}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--bronze);opacity:.6;flex:none}
.section-head .eyebrow::after{content:"";width:30px;height:1px;background:var(--bronze);opacity:.6;flex:none}
.project-hero .eyebrow::before{background:var(--champagne)}
html.js .panel:focus-visible{outline-offset:-5px}
.display{font-family:var(--font-display);font-weight:500;font-size:clamp(40px,5vw,68px);line-height:1.08;letter-spacing:-.015em;color:var(--charcoal)}
.display em{font-style:italic;color:var(--bronze)}
.display.h3{font-size:clamp(30px,3.6vw,50px);margin-bottom:16px}
.section-head p{max-width:640px;margin:0 auto;color:rgba(32,32,32,.68);font-size:15.5px}
.section-head .address{max-width:760px;font-family:var(--font-display);font-style:italic;font-size:17px;color:rgba(32,32,32,.72);margin-top:20px}

/* masked line-reveal for display headings (words slide up out of an overflow mask) */
.display .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.09em;margin-bottom:-.09em}
.display .w i{display:inline-block;font-style:inherit;transform:translateY(115%);transition:transform .95s var(--ease-snap),opacity .95s}
.display.in .w i{transform:translateY(0)}
.display .w i em{font-style:italic}

/* lazy image fade-in */
img.loaded{animation:fadeIn .7s var(--ease) both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* project hero — cinematic rounded card, 62mgmt-style project door */
.project-hero{position:relative;max-width:1240px;margin:0 auto 100px;height:min(80vh,680px);min-height:540px;border-radius:24px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;color:#fff;box-shadow:var(--shadow-lg)}
.project-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.18);will-change:transform}
.project-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.55) 0%,rgba(10,10,10,.18) 45%,rgba(10,10,10,.72) 100%);z-index:1}
/* directional grade: dark scrim on the text side, light on the imagery side */
.hero-luxes::before{background:linear-gradient(100deg,rgba(10,10,10,.9) 0%,rgba(10,10,10,.64) 36%,rgba(10,10,10,.26) 64%,rgba(10,10,10,.04) 100%)}
.hero-overlook::before{background:linear-gradient(80deg,rgba(10,10,10,.04) 0%,rgba(10,10,10,.26) 36%,rgba(10,10,10,.64) 64%,rgba(10,10,10,.9) 100%)}
.project-hero-content{position:relative;z-index:2;width:100%;max-width:740px;padding:0 64px 60px;display:flex;flex-direction:column;align-items:center;gap:22px}
.project-hero .eyebrow{color:var(--champagne)}
.project-hero .eyebrow::before{background:var(--champagne)}
.band-right .project-hero .eyebrow::before{display:none}
.band-right .project-hero .eyebrow::after{content:"";width:30px;height:1px;background:var(--champagne);opacity:.7;flex:none}
.project-hero .display{color:#fff;font-size:clamp(44px,5.2vw,74px);text-shadow:0 2px 34px rgba(0,0,0,.4)}
.project-hero .display em{color:var(--champagne)}
.project-hero .lede{font-family:var(--font-display);font-style:italic;font-size:19.5px;line-height:1.5;color:rgba(255,255,255,.86);text-shadow:0 1px 20px rgba(0,0,0,.4)}
.hero-badges{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.badge{font-size:10px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;background:var(--bronze-deep);color:var(--bg);padding:11px 20px;border-radius:999px;box-shadow:0 4px 18px rgba(0,0,0,.28)}
.badge-outline{background:rgba(12,12,12,.38);border:1px solid rgba(255,255,255,.55);color:#fff;backdrop-filter:blur(6px)}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:4px}

/* asymmetric band alignment (Luxes left / Overlook right) */
.band-left{justify-content:flex-start}
.band-right{justify-content:flex-end}
.band-left .project-hero-content{align-items:flex-start;text-align:left}
.band-right .project-hero-content{align-items:flex-end;text-align:right}
.band-left .hero-actions,.band-left .hero-badges{justify-content:flex-start}
.band-right .hero-actions,.band-right .hero-badges{justify-content:flex-end}

/* stat grid — oversized editorial tiles */
.stat-grid{max-width:1240px;margin:0 auto 100px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat-cell{position:relative;padding:54px 26px 46px;display:flex;flex-direction:column;gap:10px;justify-content:flex-end;border-left:1px solid var(--line);transition:background .3s}
.stat-cell:first-child::before{content:"";position:absolute;top:-1px;left:0;width:72px;height:2px;background:var(--bronze)}
.stat-cell:first-child{border-left:none;padding-left:0}
.stat-cell:hover{background:var(--cream)}
.stat-num{font-family:var(--font-display);font-size:clamp(38px,3.6vw,58px);color:var(--charcoal);line-height:1;font-variant-numeric:tabular-nums;transition:color .3s}
.stat-cell:hover .stat-num{color:var(--bronze)}
.stat-lbl{font-size:10.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:rgba(32,32,32,.68)}
.stat-sub{font-family:var(--font-display);font-style:italic;font-size:14px;color:rgba(32,32,32,.62)}

/* overview */
.overview-grid{max-width:1240px;margin:0 auto 96px;display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.overview-copy p{color:rgba(32,32,32,.72);margin-top:16px;font-size:16px}
.figure-card{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);position:relative;transform:translateZ(0);clip-path:inset(0 0 100% 0);transition:clip-path 1.1s var(--ease-snap) .1s}
.figure-card.revealed{clip-path:inset(0 0 0 0)}
.figure-card img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3.1;transition:transform 1.2s var(--ease-snap)}
.figure-card:hover img{transform:scale(1.05)}
.figure-card figcaption{position:static;padding:14px 4px 0;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:rgba(32,32,32,.6);text-align:left}

/* amenities — editorial hairline ledgers with bronze medallion icons */
.amenities{margin:0 auto 100px;max-width:1240px}
.amenities-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);margin-top:44px;counter-reset:amenity}
.amenity-card{position:relative;padding:30px 26px 34px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);background:transparent;transition:background .35s}
.amenity-card:nth-child(3n+1){border-left:none}
.amenity-card::before{counter-increment:amenity;content:counter(amenity,decimal-leading-zero);position:absolute;top:24px;right:26px;font-family:var(--font-display);font-style:italic;font-size:22px;line-height:1;color:rgba(141,106,58,.75)}
.amenity-card:hover{background:var(--cream)}
.amenity-icon{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:var(--cream);border:1px solid rgba(141,106,58,.3);color:var(--bronze);margin-bottom:16px;transition:background .35s,color .35s,transform .35s var(--ease-snap)}
.amenity-icon svg{width:21px;height:21px}
.amenity-card:hover .amenity-icon{background:var(--bronze);color:#fff;transform:scale(1.06)}
.amenity-card h4,.amenity-card h5{font-family:var(--font-display);font-size:21px;font-weight:500;margin-bottom:8px}
.amenity-card p{font-size:13.5px;color:rgba(32,32,32,.66);font-style:italic;max-width:30ch}
.amenity-groups{display:flex;flex-direction:column;gap:60px;margin-top:44px}
.amenity-group .group-title{font-size:11px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--bronze);display:flex;align-items:center;gap:16px}
.amenity-group .group-title::after{content:"";flex:1;height:1px;background:var(--line)}
.amenity-group .amenities-grid{grid-template-columns:1fr 1fr}
.amenity-group .amenity-card:nth-child(2n+1){border-left:none}
/* Luxes: seven amenities as a numbered spec-list ledger */
#luxes-amenities .amenities-grid{grid-template-columns:1fr}
#luxes-amenities .amenity-card{display:grid;grid-template-columns:72px 64px 1fr;align-items:center;gap:22px;padding:24px 6px;border-left:none}
#luxes-amenities .amenity-card::before{position:static;content:counter(amenity,decimal-leading-zero);font-size:25px}
#luxes-amenities .amenity-icon{margin-bottom:0}
#luxes-amenities .amenity-card p{max-width:46ch;grid-column:3}

/* tables */
.floor-plans{margin:0 auto 100px;max-width:1240px}
/* open editorial ledgers instead of boxed tables */
.table-wrap{margin-top:44px;overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:560px;font-variant-numeric:tabular-nums}
th{font-size:10.5px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;text-align:left;padding:16px 20px;background:transparent;color:rgba(32,32,32,.58);border-bottom:2px solid var(--line-strong)}
td{padding:15px 20px;border-bottom:1px solid var(--line);font-size:14.5px;color:rgba(32,32,32,.8)}
table tbody td:first-child{font-family:var(--font-display);font-weight:500;font-size:15px;color:var(--charcoal)}
tbody tr:last-child td{border-bottom:none}
tbody tr{transition:background .25s}
tbody tr:hover{background:var(--cream)}
td.price{font-family:var(--font-display);font-size:16.5px;color:var(--bronze);white-space:nowrap;font-weight:500}
.table-note{max-width:900px;margin:18px auto 0;font-size:12px;color:rgba(32,32,32,.68);text-align:center}

/* compare */
.compare-section{padding:96px 32px;background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.compare-lede{font-family:var(--font-display);font-style:italic;color:rgba(32,32,32,.65);max-width:680px}
.compare-table th:nth-child(2),.compare-table th:nth-child(3),.compare-table td:nth-child(2),.compare-table td:nth-child(3){text-align:center}
.compare-actions{display:flex;justify-content:center;margin-top:36px}

/* about — manifesto + hairline stat row */
.about-section{padding:96px 32px;max-width:1240px;margin:0 auto}
.about-manifesto{max-width:920px;margin:0 auto 84px;text-align:center}
.about-mark{font-family:var(--font-display);font-style:italic;font-size:112px;line-height:1;color:var(--bronze);display:block;margin-bottom:8px;opacity:.92}
.about-manifesto .display{font-size:clamp(46px,5.6vw,80px)}
.about-manifesto p{max-width:620px;margin:18px auto 0;color:rgba(32,32,32,.72);font-size:16px}
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
/* project team credits */
.project-team{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 44px;margin-top:46px;padding-top:28px;border-top:1px solid var(--line);font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:rgba(32,32,32,.55)}
.project-team b{font-weight:600;color:var(--bronze)}
.about-stat{padding:38px 20px 34px;display:flex;flex-direction:column;gap:8px;text-align:center;border-left:1px solid var(--line);transition:background .3s}
.about-stat:first-child{border-left:none}
.about-stat:hover{background:var(--cream)}

/* CTA band */
.cta-band{max-width:1240px;margin:0 auto 96px;border-radius:20px;padding:76px 32px;text-align:center;color:#fff;position:relative;overflow:hidden;background:linear-gradient(135deg,#2a2a2a 0%,#1a1a1a 55%,#3d2f1a 100%)}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 50% 0%,rgba(216,191,139,.16),transparent)}
.cta-band::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.cta-band .display{color:#fff}
.cta-band .display em{color:var(--champagne)}
.cta-band p{color:rgba(255,255,255,.72);margin-top:10px;position:relative;z-index:1}
.cta-band .display,.cta-band .cta-actions{position:relative;z-index:1}
.cta-actions{display:flex;gap:14px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.rera-line{margin-top:30px;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* gallery */
.gallery-section{margin:0 auto 96px;max-width:1240px}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:210px;gap:14px;margin-top:44px}
.gallery-tile{position:relative;border-radius:12px;overflow:hidden;cursor:zoom-in;background:var(--stone);opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease-snap),transform .8s var(--ease-snap)}
.gallery-tile.revealed{opacity:1;transform:none}
.gallery-tile img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease-snap),filter .5s}
.gallery-tile:hover img{transform:scale(1.07)}
.gallery-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(15,15,15,.7));opacity:0;transition:opacity .4s}
.gallery-tile:hover::after{opacity:1}
/* (tile hover captions removed — clean photography, no text on images) */
.gallery-tile.tall{grid-row:span 2}

/* location — minutes ledger */
.location{margin:0 auto 100px;max-width:1240px}
.landmarks{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);margin-top:44px}
.landmark{padding:30px 26px 34px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);transition:background .35s}
.landmark:nth-child(3n+1){border-left:none}
.landmark:hover{background:var(--cream)}
.landmark .lm-min{display:block;font-family:var(--font-display);font-style:italic;font-size:34px;line-height:1;color:var(--bronze);margin-bottom:14px}
.landmark h4{font-family:var(--font-display);font-size:20px;font-weight:500;margin-bottom:6px}
.landmark p{font-size:13.5px;color:rgba(32,32,32,.66)}

/* contact */
.contact-section{padding:96px 32px;background:var(--charcoal);color:#fff;border-top:4px solid var(--bronze)}
.contact-section .section-numeral-row{border-color:rgba(255,255,255,.16);margin-bottom:48px}
.contact-section .section-numeral-label{color:rgba(255,255,255,.62)}
.contact-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:72px}
.contact-info .display{color:#fff}
.contact-info .display em{color:var(--champagne)}
.contact-info>p{color:rgba(255,255,255,.7);margin-bottom:34px}
.contact-block{margin-bottom:26px}
.contact-block h4{font-size:10.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--champagne);margin-bottom:8px}
.contact-block p{font-size:14.5px;color:rgba(255,255,255,.82);line-height:1.6}
.contact-block a{color:var(--champagne);border-bottom:1px solid rgba(216,191,139,.3);transition:border-color .3s,color .3s}
.contact-block a:hover{color:#fff;border-color:#fff}
/* ---- contact map ---- */
.contact-map{position:relative;margin-top:34px}
.map-frame{position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(216,191,139,.38);box-shadow:var(--shadow-lg);background:#202020}
.map-frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.12),inset 0 -30px 40px -30px rgba(0,0,0,.55)}
.map-frame::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .5s var(--ease);box-shadow:inset 0 0 0 1.5px rgba(216,191,139,.65),inset 0 0 46px rgba(141,106,58,.14)}
.contact-map:hover .map-frame::after{opacity:1}
.map-frame iframe{display:block;width:100%;height:300px;border:0;transform:scale(1.03);transition:transform 1.4s var(--ease)}
.contact-map:hover .map-frame iframe{transform:scale(1.06)}
@media (prefers-reduced-motion:reduce){.map-frame iframe{transform:none;transition:none}}
/* cinematic grayscale-to-color is desktop-only: touch devices have no hover,
   so they keep the full-color map by default */
@media (hover:hover){
  .map-frame iframe{filter:grayscale(1) contrast(1.04) brightness(.94);transition:filter 1s var(--ease),transform 1.4s var(--ease)}
  .contact-map:hover .map-frame iframe{filter:grayscale(0) contrast(1) brightness(1)}
}
.map-chip{position:absolute;left:14px;bottom:14px;z-index:4;display:flex;align-items:center;gap:11px;background:rgba(23,22,20,.88);border:1px solid rgba(216,191,139,.5);border-radius:14px;padding:10px 12px;box-shadow:0 10px 30px rgba(0,0,0,.4);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transform:translateY(14px);transition:opacity .55s var(--ease-snap) .3s,transform .55s var(--ease-snap) .3s}
.map-pin{flex:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(216,191,139,.16);color:var(--champagne);border:1px solid rgba(216,191,139,.5)}
.map-chip-text{min-width:0}
.map-chip-text strong{display:block;font-family:var(--font-display);font-size:14px;font-weight:500;color:#fff;line-height:1.2}
.map-chip-text small{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:1px}
.map-cta{flex:none;font-size:9.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-deep);background:var(--champagne);border-radius:9px;padding:9px 13px;text-decoration:none;transition:background .3s,color .3s,transform .25s}
.map-cta:hover{background:#fff;color:var(--bronze-deep);transform:translateY(-1px)}
/* chip entrance rides the scroll reveal so it is actually visible */
.contact-map.revealed .map-chip{opacity:1;transform:none}
@media (max-width:600px){
  .map-frame iframe{height:240px}
  .map-chip{left:10px;right:10px;bottom:10px}
  .map-cta{margin-left:auto}
}

.rera-cards{display:flex;gap:14px;margin-top:34px}
.rera-card{flex:1;border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:18px;background:rgba(255,255,255,.05);text-align:center}
.rera-card span{display:block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-bottom:6px}
.rera-card strong{font-family:var(--font-display);font-size:18px;color:var(--champagne);letter-spacing:.04em}

.float-field.error input,.float-field.error textarea{border-color:#b3261e}
.float-field.error label{color:#b3261e}
.form-error-msg{display:none;font-size:11.5px;color:#b3261e;margin:-14px 0 16px 4px}
.form-error-msg.show{display:block}

/* contact form */
.contact-form-wrap{background:#fff;color:var(--charcoal);border-radius:20px;padding:44px;box-shadow:var(--shadow-lg)}
.contact-form-wrap>h4{font-family:var(--font-display);font-size:26px;font-weight:500;margin-bottom:26px}
.project-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}
.project-option{border:1.5px solid var(--line-strong);border-radius:12px;padding:16px;text-align:left;cursor:pointer;transition:all .3s;font-family:var(--font-body);font-size:15px;color:var(--charcoal);background:var(--surface)}
.project-option .po-brand{font-family:var(--font-display);font-style:italic;color:var(--bronze);font-size:19px;display:block;line-height:1.1}
.project-option .po-meta{display:block;font-size:11px;color:rgba(32,32,32,.72);margin-top:5px;letter-spacing:.02em}
.project-option.active{border-color:var(--bronze);background:var(--cream);box-shadow:0 0 0 3px rgba(141,106,58,.15)}
.project-option:hover{border-color:var(--bronze)}
.float-field{position:relative;margin-bottom:22px}
.float-field input,.float-field textarea{width:100%;border:1.5px solid var(--line-strong);border-radius:10px;padding:18px 16px 10px;font-family:var(--font-body);font-size:15px;color:var(--charcoal);background:var(--surface);transition:border-color .3s,box-shadow .3s}
.float-field textarea{resize:none;min-height:84px}
.float-field label{position:absolute;left:16px;top:17px;font-size:14px;color:rgba(32,32,32,.45);pointer-events:none;transition:all .25s var(--ease-snap);background:transparent;padding:0 4px}
.float-field input:focus,.float-field textarea:focus{outline:none;border-color:var(--bronze);box-shadow:0 0 0 3px rgba(141,106,58,.14)}
.float-field input:focus~label,.float-field input:not(:placeholder-shown)~label,
.float-field textarea:focus~label,.float-field textarea:not(:placeholder-shown)~label{top:-8px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);background:#fff;font-weight:600}
.submit-btn{width:100%;background:var(--bronze);color:var(--bg);font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;padding:18px;border-radius:999px;transition:all .35s var(--ease);position:relative;overflow:hidden}
.submit-btn:hover{background:var(--bronze-deep);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.submit-btn:active{transform:translateY(0);box-shadow:inset 0 2px 6px rgba(0,0,0,.24);transition:transform .1s ease,box-shadow .1s ease}
.form-disclaimer{font-size:11px;color:rgba(32,32,32,.68);margin-top:14px;text-align:center;line-height:1.6}
.form-success{display:none;text-align:center;padding:60px 20px}
.form-success.show{display:block;animation:fadeUp .6s var(--ease-snap)}
.success-mark{width:72px;height:72px;border-radius:50%;background:var(--bronze);color:#fff;font-size:34px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;box-shadow:var(--shadow-sm)}
.form-success h4{font-family:var(--font-display);font-size:26px;font-weight:500;margin-bottom:10px}
.form-success p{color:rgba(32,32,32,.6)}
fieldset{border:none}
legend{font-size:10.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:rgba(32,32,32,.5);margin-bottom:12px}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ============ FOOTER ============ */
.site-footer{background:#141414;color:rgba(255,255,255,.7);padding:64px 32px 0}
.footer-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.2fr .9fr 1fr;gap:48px;padding-bottom:56px}
.footer-brand .logo-mark-lg{width:56px;height:56px;font-size:30px;border-color:var(--bronze);color:var(--champagne);background:transparent;margin-bottom:16px}
.footer-word{font-family:var(--font-display);font-style:italic;font-size:26px;color:#fff;display:block;margin-bottom:10px}
.footer-brand p{font-size:13.5px;color:rgba(255,255,255,.5);font-style:italic}
.footer-nav h4,.footer-contact h4{font-size:10.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--champagne);margin-bottom:16px}
.footer-nav a{display:block;font-size:14.5px;padding:5px 0;color:rgba(255,255,255,.72);transition:color .3s,transform .3s}
.footer-nav a:hover{color:var(--champagne);transform:translateX(4px)}
.footer-contact p{font-size:14.5px;padding:3px 0}
.footer-contact a{color:rgba(255,255,255,.72);transition:color .3s}
.footer-contact a:hover{color:var(--champagne)}
.footer-legal{max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:12px;color:rgba(255,255,255,.62);padding:22px 0;border-top:1px solid rgba(255,255,255,.1)}
.footer-legal .divider{width:1px;height:12px;background:rgba(255,255,255,.2)}
/* footer social pills */
.footer-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.footer-social a{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.22);padding:9px 16px;border-radius:999px;transition:all .3s var(--ease)}
.footer-social a svg{flex:none}
.footer-social a:hover{color:#fff;border-color:var(--champagne);background:rgba(216,191,139,.09);transform:translateY(-1px)}

/* ============ FLOATING WIDGETS ============ */
/* ============ PERSONAL ADVISOR WIDGET ============ */
.advisor-float{position:fixed;bottom:26px;left:26px;z-index:800;width:60px;height:60px;border-radius:50%;background:radial-gradient(120% 130% at 30% 18%,rgba(216,191,139,.30),rgba(216,191,139,0) 46%),linear-gradient(135deg,#191919,#35312b);border:1px solid rgba(216,191,139,.55);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(16px);transition:all .45s var(--ease-snap);box-shadow:0 12px 34px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.09)}
.advisor-float.visible{opacity:1;visibility:visible;transform:none}
.advisor-float::before{content:"";position:absolute;inset:1px;border-radius:50%;background:radial-gradient(95% 62% at 50% 0%,rgba(255,255,255,.16),rgba(255,255,255,0) 58%);pointer-events:none}
.advisor-float::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(216,191,139,.5);animation:advisorPing 2.8s var(--ease) infinite}
.advisor-float:hover{transform:scale(1.07);box-shadow:0 16px 42px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.12),0 0 24px rgba(216,191,139,.28)}
.advisor-float:active{transform:scale(.97);transition:transform .16s var(--ease-snap)}
.advisor-float:focus-visible{outline:2px solid var(--champagne);outline-offset:3px}
@keyframes advisorPing{0%{transform:scale(.8);opacity:.85}70%{transform:scale(1.3);opacity:0}100%{transform:scale(1.3);opacity:0}}
.advisor-float .ping-dot{position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#7de9a8,#1fae54 70%);border:2px solid #221f1b;box-shadow:0 0 10px rgba(55,196,111,.6),inset 0 1px 1px rgba(255,255,255,.5);z-index:3}
.advisor-tip{position:absolute;left:calc(100% + 14px);top:50%;transform:translateY(-50%) translateX(-6px);background:#fff;color:#202020;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:9px 15px;border-radius:999px;border:1px solid rgba(141,106,58,.25);box-shadow:0 8px 22px rgba(0,0,0,.18);white-space:nowrap;opacity:0;pointer-events:none;transition:all .3s var(--ease)}
.advisor-float:hover .advisor-tip{opacity:1;transform:translateY(-50%) translateX(0)}
.advisor-float svg{position:relative;z-index:2;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35))}
/* chat modal */
.advisor-modal{position:fixed;inset:0;z-index:950;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(12,12,12,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.advisor-modal.open{opacity:1;visibility:visible}
.advisor-card{width:min(430px,100%);max-height:min(660px,calc(100vh - 32px));background:var(--surface);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 44px 130px rgba(0,0,0,.5);transform:translateY(26px) scale(.98);transition:transform .42s var(--ease-snap)}
.advisor-modal.open .advisor-card{transform:none}
.advisor-head{display:flex;align-items:center;gap:12px;padding:15px 18px;background:linear-gradient(135deg,#1e1e1e,#2f2d28);color:#fff}
.advisor-avatar{width:42px;height:42px;flex:none;border-radius:50%;border:1px solid rgba(216,191,139,.6);display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 130% at 30% 18%,rgba(216,191,139,.24),rgba(216,191,139,0) 52%),rgba(216,191,139,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 2px 8px rgba(0,0,0,.18)}
.advisor-avatar svg{width:20px;height:20px;fill:none;stroke:url(#lgAvatarGrad);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}
.advisor-head-text{flex:1;min-width:0}
.advisor-head-text strong{display:block;font-size:14.5px;letter-spacing:.02em;font-weight:600}
.advisor-status{display:flex;align-items:center;gap:6px;margin-top:2px;font-size:11px;color:rgba(255,255,255,.68)}
.advisor-status i{width:7px;height:7px;border-radius:50%;background:#25d366;animation:advisorBlink 2.2s var(--ease) infinite}
@keyframes advisorBlink{50%{opacity:.35}}
.advisor-close{flex:none;background:none;border:none;color:rgba(255,255,255,.75);font-size:15px;cursor:pointer;padding:6px 4px;transition:color .3s}
.advisor-close:hover{color:#fff}
.advisor-body{flex:1;overflow-y:auto;padding:20px 18px 14px;display:flex;flex-direction:column;gap:12px;background:var(--cream)}
.advisor-step{display:none;flex-direction:column;gap:12px}
.advisor-step.active{display:flex}
.advisor-bubble{position:relative;background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:4px 16px 16px 16px;padding:13px 15px;font-size:14.5px;line-height:1.55;color:#2a2a2a;box-shadow:0 2px 10px rgba(0,0,0,.05);max-width:94%;align-self:flex-start;animation:advFade .4s var(--ease-snap) both}
.advisor-bubble b{font-weight:600;color:var(--bronze-deep)}
.typing{display:flex;gap:4px;padding:15px;align-self:flex-start;background:#fff;border-radius:4px 16px 16px 16px;box-shadow:0 2px 10px rgba(0,0,0,.05);animation:advFade .3s both}
.typing i{width:7px;height:7px;border-radius:50%;background:#b9b3a6;animation:typeBounce 1.1s var(--ease) infinite}
.typing i:nth-child(2){animation-delay:.16s}
.typing i:nth-child(3){animation-delay:.32s}
@keyframes typeBounce{0%,60%,100%{transform:none;opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.typing.off{display:none}
.advisor-reply{display:flex;gap:8px;align-self:flex-end;width:100%}
.advisor-reply input{flex:1;min-width:0;border:1.5px solid var(--line-strong);border-radius:12px;padding:13px 14px;font-size:14.5px;background:#fff;color:var(--charcoal);outline:none;transition:border-color .3s,box-shadow .3s}
.advisor-reply input:focus{border-color:var(--bronze);box-shadow:0 0 0 3px rgba(141,106,58,.13)}
.advisor-next{flex:none;background:var(--bronze);color:#fff;border:none;border-radius:12px;padding:0 18px;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .3s,transform .2s}
.advisor-next:hover{background:var(--bronze-deep)}
.advisor-next:active{transform:scale(.97)}
.advisor-projects{display:flex;flex-direction:column;gap:10px;width:100%;align-self:flex-end}
.adv-project{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1.5px solid var(--line-strong);border-radius:14px;padding:14px 16px;text-align:left;cursor:pointer;transition:all .3s var(--ease)}
.adv-project span{font-family:var(--font-display);font-size:16.5px;font-weight:500;color:#202020}
.adv-project small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(32,32,32,.55);margin-top:2px}
.adv-project:hover{border-color:var(--bronze);transform:translateX(4px)}
.adv-project.selected{border-color:var(--bronze);background:rgba(141,106,58,.09);box-shadow:0 0 0 3px rgba(141,106,58,.14)}
.adv-project.selected small{color:var(--bronze-deep)}
.advisor-card-preview{width:100%;align-self:center;margin-top:2px;animation:advFade .5s var(--ease-snap) both}
.advisor-card-preview img{width:100%;display:block;border-radius:14px;border:1px solid rgba(32,32,32,.12);box-shadow:0 14px 34px rgba(32,32,32,.16)}
.advisor-consent{width:100%;font-size:11px;line-height:1.5;color:rgba(32,32,32,.5);text-align:center;padding:2px 6px}
.advisor-email-status{width:100%;font-size:12.5px;line-height:1.5;color:rgba(32,32,32,.55);text-align:center;padding:2px 6px}
.advisor-email-status.sending{color:var(--bronze)}
.advisor-email-status.ok{color:#1e7a3c}
.advisor-email-status.err{color:#b3261e}
.advisor-downloads{display:flex;flex-direction:column;gap:10px;width:100%;align-self:center;margin-top:2px}
.advisor-downloads .btn{width:100%;justify-content:center}
.advisor-downloads .btn.adv-card-dl:not([href*="blob:"]){opacity:.55;pointer-events:none}
.advisor-downloads .btn-ghost{border-color:var(--line-strong);color:var(--charcoal);background:var(--surface)}
.advisor-downloads .btn-ghost:hover{border-color:var(--bronze);color:var(--bronze-deep);background:var(--cream)}
.advisor-done{margin-top:2px;align-self:center;background:none;border:none;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(32,32,32,.5);cursor:pointer;padding:12px 16px;transition:color .3s}
.advisor-done:hover{color:var(--bronze-deep)}
.advisor-progress{display:flex;gap:6px;justify-content:center;padding:13px 12px 15px;background:var(--cream);border-top:1px solid var(--line)}
.advisor-progress i{width:28px;height:3px;border-radius:2px;background:var(--line-strong);transition:background .3s}
.advisor-progress i.done{background:var(--bronze)}
.advisor-progress i.current{background:var(--bronze);opacity:.5}
@keyframes advFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.back-to-top{position:fixed;bottom:26px;right:26px;z-index:800;width:56px;height:56px;border-radius:50%;background:var(--bg);border:1px solid var(--line-strong);color:var(--charcoal);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(16px);transition:all .45s var(--ease-snap);box-shadow:var(--shadow-sm)}
.back-to-top.visible{opacity:1;visibility:visible;transform:none}
.back-to-top:hover{color:var(--bronze);border-color:var(--bronze)}
.progress-ring{position:absolute;inset:0;width:100%;height:100%}
.progress-ring circle{fill:none;stroke:var(--bronze);stroke-width:2.5;stroke-dasharray:150.8;stroke-dashoffset:150.8;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset .2s linear}

/* mobile CTA bar */
.mobile-cta-bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:850;display:none;grid-template-columns:1fr 1fr 1.4fr;gap:10px;padding:10px;background:rgba(250,248,245,.92);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);transform:translateY(140%);transition:transform .5s var(--ease-snap)}
.mobile-cta-bar.visible{transform:none}
.mobile-cta-bar a{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:14px 6px;border:1px solid var(--line-strong);border-radius:10px;color:var(--charcoal);transition:all .3s}
.mobile-cta-bar a.mcta-solid{background:var(--bronze);color:var(--bg);border-color:var(--bronze)}
.mobile-cta-bar a:hover{border-color:var(--bronze);color:var(--bronze)}
.mobile-cta-bar a.mcta-solid:hover{color:#fff}

/* ============ LIGHTBOX ============ */
.lightbox{position:fixed;inset:0;z-index:970;background:rgba(10,10,10,.94);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;padding:40px}
.lightbox.open{opacity:1;visibility:visible}
.lightbox-figure{max-width:min(1200px,92vw);max-height:86vh;display:flex;align-items:center}
.lightbox-figure img{max-width:100%;max-height:76vh;object-fit:contain;border-radius:10px;box-shadow:0 30px 90px rgba(0,0,0,.6)}
.lightbox-close,.lightbox-prev,.lightbox-next{position:fixed;z-index:975;color:#fff;font-size:26px;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;transition:all .3s;background:rgba(255,255,255,.06)}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:var(--bronze);border-color:var(--bronze)}
.lightbox-close{top:26px;right:26px}
.lightbox-prev{left:26px;top:50%;transform:translateY(-50%)}
.lightbox-next{right:26px;top:50%;transform:translateY(-50%)}
.lightbox-prev:hover,.lightbox-next:hover{transform:translateY(-50%) scale(1.06)}

/* ============ EXIT INTENT ============ */
.exit-intent{position:fixed;inset:0;z-index:990;background:rgba(15,15,15,.6);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .45s var(--ease)}
.exit-intent.open{opacity:1;visibility:visible}
.exit-intent-card{background:var(--bg);border-radius:22px;max-width:520px;width:92%;padding:48px 44px;text-align:center;position:relative;box-shadow:var(--shadow-lg);transform:translateY(24px);transition:transform .5s var(--ease-snap)}
.exit-intent.open .exit-intent-card{transform:none}
.exit-intent-card h3{font-family:var(--font-display);font-size:32px;font-weight:500;margin-bottom:14px}
.exit-intent-card p{color:rgba(32,32,32,.65);font-size:15px;margin-bottom:26px}
.exit-actions{display:flex;flex-direction:column;gap:12px}
.exit-actions .btn-ghost{border-color:var(--line-strong);color:var(--charcoal);background:var(--surface)}
.exit-actions .btn-ghost:hover{border-color:var(--bronze);color:var(--bronze);background:var(--cream)}
.exit-intent-close{position:absolute;top:16px;right:20px;font-size:22px;color:rgba(32,32,32,.5);transition:color .3s}
.exit-intent-close:hover{color:var(--charcoal)}
.exit-rera{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(32,32,32,.4);margin-bottom:0!important}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease-snap),transform .8s var(--ease-snap)}
.reveal.revealed{opacity:1;transform:none}

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
  .stat-grid{grid-template-columns:repeat(4,1fr)}
  .overview-grid,.about-grid{grid-template-columns:1fr;gap:40px}
  .amenities-grid{grid-template-columns:1fr 1fr}
  .amenity-card:nth-child(3n+1){border-left:1px solid var(--line)}
  .amenity-card:nth-child(odd){border-left:none}
  .landmarks{grid-template-columns:1fr 1fr}
  .landmark:nth-child(3n+1){border-left:1px solid var(--line)}
  .landmark:nth-child(odd){border-left:none}
  .contact-grid{grid-template-columns:1fr;gap:48px}
}
@media (max-width:900px){
  .header-nav{display:none}
  .menu-btn{display:flex}
  .header-cta{display:none}
  /* -- grand split: panels stack as full-width portraits -- */
  .split-hero{height:auto;min-height:0}
  .split-canvas{position:relative;height:auto}
  .panel{position:relative;inset:auto;height:62vh;min-height:480px;max-height:660px;padding:0}
  .panel-content{max-width:520px}
  .panel-luxes,.panel-overlook{clip-path:none}
  .panel-overlook{margin-top:-1px}
  .panel-bg{inset:0}
  .panel-content{gap:8px}
  .panel-title{font-size:clamp(52px,15vw,84px)}
  .panel-sub{letter-spacing:.24em;font-size:10px}
  .panel-kicker{letter-spacing:.3em;font-size:9px}
  .panel-explore{padding:13px 24px;letter-spacing:.24em}
  .panel-index{display:none}
  .hero-medallion{top:50%;width:56px;height:56px;display:none}
  .hero-scroll-hint{display:none}
  .seam-light{background:none}
  .stat-grid{grid-template-columns:1fr 1fr}
  .stat-cell{border-left:1px solid var(--line);padding:34px 18px 28px}
  .stat-cell:nth-child(odd){border-left:none;padding-left:0}
  .stat-cell:nth-child(n+3){border-top:1px solid var(--line)}
  .about-stats{grid-template-columns:1fr 1fr}
  .about-stat{border-left:1px solid var(--line);padding:28px 16px 24px}
  .about-stat:nth-child(odd){border-left:none}
  .about-stat:nth-child(n+3){border-top:1px solid var(--line)}
  .band-left,.band-right{justify-content:center}
  .band-left .project-hero-content,.band-right .project-hero-content{align-items:center;text-align:center;padding:32px 24px 72px}
  .band-left .hero-actions,.band-left .hero-badges,.band-right .hero-actions,.band-right .hero-badges{justify-content:center}
  .hero-luxes::before,.hero-overlook::before{background:linear-gradient(180deg,rgba(10,10,10,.5) 0%,rgba(10,10,10,.28) 40%,rgba(10,10,10,.78) 100%)}
  .project-hero{min-height:560px}
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:190px}
  .landmarks{grid-template-columns:1fr}
  .landmark{border-left:none}
  .footer-inner{grid-template-columns:1fr;gap:36px}
  .mobile-cta-bar{display:grid}
  body{padding-bottom:92px}
  .advisor-float{bottom:96px}
  .back-to-top{bottom:96px}
}
@media (max-width:600px){
  .project-section{padding:64px 18px 24px}
  .contact-section,.compare-section,.about-section{padding:64px 18px}
  .gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:150px;gap:10px}
  .gallery-tile.tall{grid-row:span 1}
  .project-options{grid-template-columns:1fr}
  .contact-form-wrap{padding:30px 22px}
  .panel-ctas{flex-direction:column;width:100%}
  .panel-ctas .btn{width:100%;justify-content:center}
  .project-title{font-size:clamp(42px,15.5vw,64px)}
  .hero-scroll-hint{display:none}
  .section-numeral{font-size:40px}
  .amenities-grid{grid-template-columns:1fr}
  .amenity-card{border-left:none}
  .landmark{border-left:none}
  .amenity-group .amenities-grid{grid-template-columns:1fr}
  .project-hero-content{padding:0 28px 44px}
}
/* short desktop viewports: let the hero card grow so bottom-anchored content never clips */
@media (max-height:720px){
  .project-hero{height:auto;min-height:600px}
}

/* ============ LOGO IMAGES ============ */
/* logo ships as transparent WebP (from the original PDF art), integrated
   directly on the header. Two stacked variants — ivory on the dark hero,
   charcoal on the light scrolled header — crossfade with the header state. */
.header-logo{position:relative;display:flex;align-items:center}
.header-logo-img{height:46px;width:auto;transition:transform .3s var(--ease),opacity .35s var(--ease)}
.header-logo-img:hover{transform:translateY(-1px)}
.header-logo .logo-on-light{position:absolute;left:0;top:0;opacity:0}
.site-header.is-hero .logo-on-dark{opacity:1}
.site-header.is-hero .logo-on-light{opacity:0}
.site-header.scrolled .logo-on-dark{opacity:0}
.site-header.scrolled .logo-on-light{opacity:1}
.footer-logo-img{height:58px;width:auto;margin-bottom:16px}
.about-logo-img{height:80px;width:auto;margin:0 auto 20px;display:block;opacity:.88;transition:opacity .4s}
.about-logo-img:hover{opacity:1}

/* ============ FLOOR PLAN GALLERY ============ */
.floor-plan-gallery{margin-top:48px}
.fp-gallery-title{font-family:var(--font-display);font-size:22px;font-weight:500;color:var(--charcoal);margin-bottom:24px;display:flex;align-items:center;gap:16px}
.fp-gallery-title::after{content:"";flex:1;height:1px;background:var(--line)}
.fp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.fp-tile{position:relative;border-radius:14px;overflow:hidden;cursor:zoom-in;background:var(--surface);border:1px solid var(--line);transition:all .35s var(--ease);display:flex;flex-direction:column;text-align:left}
.fp-tile:hover{border-color:var(--bronze);box-shadow:0 8px 30px rgba(141,106,58,.12);transform:translateY(-3px)}
.fp-tile:active{transform:translateY(-1px);box-shadow:0 4px 16px rgba(141,106,58,.08)}
.fp-tile img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s var(--ease)}
.fp-tile:hover img{transform:scale(1.04)}
.fp-label{padding:12px 14px;font-family:var(--font-display);font-size:16px;font-weight:500;color:var(--charcoal);line-height:1.3;border-top:1px solid var(--line)}
.fp-label small{display:block;font-family:var(--font-body);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(32,32,32,.55);margin-top:3px}
.fp-tile-wide{grid-column:span 2}
@media(max-width:600px){
  .fp-grid{grid-template-columns:1fr 1fr;gap:12px}
  .fp-tile-wide{grid-column:span 2}
  .fp-label{padding:10px 12px;font-size:14px}
}
@media(max-width:400px){
  .fp-grid{grid-template-columns:1fr}
  .fp-tile-wide{grid-column:span 1}
}

/* ============ VIDEO SHOWCASE ============ */
.video-showcase{max-width:1240px;margin:0 auto 80px;padding:0 16px}
.video-wrapper{position:relative;width:100%;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);background:#000;aspect-ratio:16/9}
.project-video{width:100%;height:100%;object-fit:cover;display:block}
.project-video:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.video-showcase .section-head{margin-bottom:32px}
@media(max-width:768px){
  .video-wrapper{border-radius:14px}
}

/* ============ MOTION PREFERENCE ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  /* departure lounge: no plate animation, content simply appears */
  .hero-plate .plate-inner{opacity:1;transform:none}
  .plate-index,.dep-strip,.hero-marquee{opacity:1;transform:none}
  .dep-strip{transform:translateX(-50%)}
  .mq-track{animation:none!important}
  .display .w i{transform:none}
  .figure-card{clip-path:none}
}

/* ============================================================
   LENIS SMOOTH SCROLL — overrides & polish
   ============================================================ */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* ============================================================
   PREMIUM MICRO-INTERACTIONS
   ============================================================ */
/* Stat cells — subtle scale on hover */
.stat-cell{transition:background .35s var(--ease),transform .35s var(--ease)}
.stat-cell:hover{transform:translateY(-2px)}

/* Amenity cards — lift + glow on hover */
.amenity-card{transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease)}
.amenity-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(141,106,58,.12);background:rgba(243,238,230,.5)}

/* Landmark cards — subtle lift */
.landmark{transition:transform .35s var(--ease),background .35s var(--ease)}
.landmark:hover{transform:translateY(-2px);background:rgba(243,238,230,.3)}

/* Figure cards — enhanced zoom on hover */
.figure-card{transition:clip-path 1.1s var(--ease-snap) .1s,box-shadow .4s var(--ease)}
.figure-card:hover{box-shadow:0 32px 80px rgba(32,32,32,.22)}

/* Gallery tiles — lift + border glow */
.gallery-tile{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.gallery-tile:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 16px 48px rgba(32,32,32,.16)}

/* Floor plan tiles — bronze border glow */
.fp-tile{transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.fp-tile:hover{transform:translateY(-3px);box-shadow:0 12px 36px rgba(141,106,58,.14);border-color:var(--bronze)}

/* CTA band — subtle background shift */
.cta-band{transition:background .4s var(--ease)}
.cta-band:hover{background:rgba(243,238,230,.4)}

/* Table rows — highlight on hover */
tbody tr{transition:background .25s var(--ease)}
tbody tr:hover{background:rgba(243,238,230,.4)}

/* RERA cards — lift */
.rera-card{transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.rera-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}

/* Contact blocks — subtle lift */
.contact-block{transition:transform .3s var(--ease),background .3s var(--ease)}
.contact-block:hover{transform:translateY(-1px);background:rgba(243,238,230,.3)}

/* Footer links — smooth color transition */
.site-footer a{transition:color .3s var(--ease)}
.site-footer a:hover{color:var(--champagne)}

/* Scroll progress bar — smooth width transition */
.scroll-progress{transition:width .15s linear}

/* Advisor float — refined entrance */
.advisor-float{transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s}
.advisor-float.visible{opacity:1;visibility:visible;transform:none}
.advisor-float:hover{transform:scale(1.08);box-shadow:0 16px 40px rgba(0,0,0,.4)}

/* Back to top — refined */
.back-to-top{transition:opacity .4s var(--ease),transform .4s var(--ease),visibility .4s}
.back-to-top.visible{opacity:1;visibility:visible;transform:none}
.back-to-top:hover{transform:translateY(-2px);background:var(--bronze);color:#fff}

/* Mobile CTA bar — smooth slide up */
.mobile-cta-bar{transition:transform .4s var(--ease),opacity .4s var(--ease),visibility .4s}
.mobile-cta-bar.visible{transform:none;opacity:1;visibility:visible}

/* Header CTA button — sheen effect on hover */
.header-cta::before{content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-20deg);transition:left .6s var(--ease)}
.header-cta:hover::before{left:130%}

/* Smooth section transitions */
section{position:relative}
.project-section{will-change:transform}

/* Premium focus ring for all interactive elements */
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px;border-radius:2px;transition:outline-offset .2s var(--ease)}