:root{--champagne:#cfb17a;--champagne-light:#ead8b5;--black:#05090d;--pearl:#f4f0e8}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.gallery-item{margin:0}
body{background:var(--pearl)}
.site-header{padding:1.1rem 3vw;background:linear-gradient(180deg,rgba(3,7,11,.84),rgba(3,7,11,.18),transparent);transition:padding .35s,background .35s,transform .35s}
.site-header.scrolled{padding:.65rem 3vw;background:rgba(4,9,14,.86);backdrop-filter:blur(24px) saturate(130%)}
.header-inner{max-width:1680px;grid-template-columns:auto 1fr auto}
.brand{position:relative;letter-spacing:.34em}.brand:after{content:"";position:absolute;left:0;bottom:-.6rem;width:2rem;height:1px;background:var(--champagne);transition:width .45s}.brand:hover:after{width:100%}.brand-logo{width:138px;height:auto;filter:invert(1) brightness(1.6);opacity:.92}.premium-footer .brand-logo{width:190px}
.nav{justify-self:center;padding:.35rem;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.055);backdrop-filter:blur(18px);gap:.2rem}
.nav>a:not(.nav-cta),.nav-more>button{padding:.62rem .82rem;border-radius:999px}
.nav>a:not(.nav-cta):after{display:none}.nav>a:not(.nav-cta):hover,.nav>a[aria-current="page"],.nav-more>button:hover{background:rgba(255,255,255,.1);color:var(--champagne-light)}
.nav-cta{position:absolute;right:0;top:50%;transform:translateY(-50%);overflow:hidden;border-radius:999px;padding:.78rem 1.15rem}
.nav-cta:after,.button:after{content:"";position:absolute;top:-60%;left:-90%;width:55%;height:220%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:rotate(22deg);transition:left .65s}
.nav-cta:hover:after,.button:hover:after{left:145%}
.nav-more{position:relative}.nav-more>button{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;cursor:pointer}.nav-more-panel{position:absolute;top:calc(100% + 1rem);left:50%;transform:translate(-50%,-8px);width:260px;padding:.7rem;background:rgba(4,9,14,.96);border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 60px rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:.25s}.nav-more:hover .nav-more-panel,.nav-more:focus-within .nav-more-panel,.nav-more.open .nav-more-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}.nav-more-panel a{display:block;padding:.8rem .9rem;border-bottom:1px solid rgba(255,255,255,.08)}.nav-more-panel a:last-child{border:0}.nav-more-panel small{display:block;color:rgba(255,255,255,.42);font-size:.56rem;letter-spacing:.06em;margin-top:.1rem}
.hero-lux .hero-media:after{background:linear-gradient(90deg,rgba(2,6,10,.83) 0%,rgba(2,6,10,.42) 43%,rgba(2,6,10,.08) 70%),linear-gradient(0deg,rgba(2,6,10,.82),transparent 50%)}.hero-lux .hero-media img{object-position:center 54%}.hero-lux .hero-content{max-width:1680px}.hero-lux h1{max-width:940px}.hero-lux .visual-note{position:absolute;right:2rem;bottom:2rem;color:rgba(255,255,255,.55);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;writing-mode:vertical-rl}
.hero-scroll{position:absolute;z-index:4;left:50%;bottom:1.5rem;width:1px;height:54px;background:rgba(255,255,255,.2);overflow:hidden}.hero-scroll:after{content:"";position:absolute;top:-100%;left:0;width:100%;height:65%;background:var(--champagne);animation:scrollLine 2.1s ease-in-out infinite}@keyframes scrollLine{to{top:130%}}
.button{position:relative;overflow:hidden;border-radius:999px;padding:1rem 1.35rem}.button .arrow{transition:transform .3s}.button:hover .arrow{transform:translateX(4px)}
.usp-stage{padding:2rem 6vw 10rem}.usp-stage-inner{max-width:1450px;margin:auto}.usp-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(23,32,41,.18)}.usp-card{position:relative;padding:2.2rem 2rem 3rem;border-right:1px solid rgba(23,32,41,.18);overflow:hidden}.usp-card:last-child{border:0}.usp-card:before{content:attr(data-no);position:absolute;right:.5rem;top:-.3rem;font:400 6rem/1 var(--serif);color:rgba(23,32,41,.045)}.usp-card b{display:block;font:400 1.75rem var(--serif);margin:.65rem 0}.usp-card p{margin:0;color:#687078}.usp-card a{display:inline-block;margin-top:1.2rem;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid}
.project-ribbon{display:grid;grid-template-columns:.72fr 1.28fr;min-height:80vh;background:var(--black);color:#fff}.project-ribbon-media{overflow:hidden}.project-ribbon-media img{height:100%;object-fit:cover;transition:transform 1.2s}.project-ribbon:hover img{transform:scale(1.035)}.project-ribbon-copy{display:flex;flex-direction:column;justify-content:center;padding:8vw}.project-ribbon-copy h2{font:400 clamp(3.4rem,6vw,6.5rem)/.92 var(--serif);letter-spacing:-.045em;margin:.6rem 0 1.5rem}.project-ribbon-copy p{max-width:580px;color:rgba(255,255,255,.62)}.project-ribbon-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.5rem}.project-ribbon-stats b{display:block;color:var(--champagne);font:400 1.8rem var(--serif)}.project-ribbon-stats span{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.image-reveal{clip-path:none}.image-reveal img{transition:transform 1s ease}.image-reveal:hover img{transform:scale(1.02)}
.lux-page-hero{min-height:82vh;position:relative;display:flex;align-items:flex-end;color:#fff;padding:10rem 6vw 6rem;overflow:hidden}.lux-page-hero>img{position:absolute;inset:0;height:100%;object-fit:cover}.lux-page-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,6,10,.88),rgba(2,6,10,.28)),linear-gradient(0deg,rgba(2,6,10,.84),transparent 55%)}.lux-page-hero-inner{position:relative;z-index:2;max-width:1380px;width:100%;margin:auto}.lux-page-hero h1{font:400 clamp(4.2rem,8vw,8rem)/.88 var(--serif);letter-spacing:-.05em;margin:0;max-width:1050px}.lux-page-hero p{max-width:650px;color:rgba(255,255,255,.7)}
.level-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}.level-tabs button{border:1px solid rgba(23,32,41,.18);background:transparent;padding:.8rem 1rem;cursor:pointer;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.level-tabs button[aria-selected="true"]{background:var(--night);color:#fff}.level-panel[hidden]{display:none}.level-panel{display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:center}.level-panel h2{font:400 clamp(3rem,5vw,5.5rem)/.95 var(--serif)}.amenity-list{columns:2;gap:2rem;padding:0;list-style:none}.amenity-list li{break-inside:avoid;padding:.65rem 0;border-bottom:1px solid rgba(23,32,41,.14);font-size:.78rem}
.area-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(23,32,41,.14)}.area-card{background:var(--pearl);padding:3rem;min-height:310px}.area-card span{color:var(--champagne);font:400 2rem var(--serif)}.area-card h2{font-size:2.4rem}.area-card p{color:#626a72}
.mm2h-table{border-top:1px solid rgba(23,32,41,.18)}.mm2h-row{display:grid;grid-template-columns:.8fr repeat(3,1fr);border-bottom:1px solid rgba(23,32,41,.18)}.mm2h-row>*{padding:1rem;border-right:1px solid rgba(23,32,41,.14)}.mm2h-row strong{color:var(--gold)}
.whatsapp{border-radius:999px;transition:transform .3s,box-shadow .3s}.whatsapp:hover{transform:translateY(-3px);box-shadow:0 18px 55px rgba(0,0,0,.28)}
@media(max-width:1050px){.nav{position:fixed;border:0;border-radius:0;padding:15vh 8vw}.nav-more{width:100%}.nav-more>button{width:100%;padding:.4rem 0;text-align:left;font-size:1.05rem}.nav-more-panel{position:static;transform:none;width:100%;opacity:1;visibility:visible;background:transparent;border:0;box-shadow:none;padding:.4rem 0 0 1rem}.nav-more-panel a{font-size:.82rem;padding:.48rem 0}.nav-more-panel small{display:none}.nav-cta{position:static;transform:none}.usp-grid{grid-template-columns:1fr 1fr}.usp-card:nth-child(2){border-right:0}.project-ribbon{grid-template-columns:1fr}.project-ribbon-media{height:68vh}.level-panel{grid-template-columns:1fr}}
@media(max-width:680px){.hero-lux .hero-media img{object-position:58% center}.hero-lux .visual-note{right:.75rem;bottom:6.2rem}.hero-scroll{display:none}.usp-stage{padding:1rem 6vw 6rem}.usp-grid{grid-template-columns:1fr}.usp-card{border-right:0;border-bottom:1px solid rgba(23,32,41,.18);padding:2rem 0}.project-ribbon-media{height:58vh}.project-ribbon-copy{padding:5rem 6vw 7rem}.project-ribbon-stats{grid-template-columns:1fr 1fr}.lux-page-hero{min-height:72vh;padding:9rem 6vw 4rem}.lux-page-hero h1{font-size:3.7rem}.amenity-list{columns:1}.area-grid{grid-template-columns:1fr}.area-card{padding:2rem;min-height:0}.mm2h-table{overflow-x:auto}.mm2h-row{min-width:720px}.whatsapp{border-radius:0}}
@media(prefers-reduced-motion:reduce){.hero-scroll:after{animation:none}.image-reveal{clip-path:none}.nav-cta:after,.button:after{display:none}}
.facility-media-stack{position:relative;min-height:620px;padding:0 5rem 5rem 0}.facility-media-stack>img:first-child{width:100%;height:560px;object-fit:cover}.facility-media-stack .facility-plan{position:absolute;right:0;bottom:0;width:225px;height:285px;object-fit:contain;background:#f7f4ee;padding:1rem;box-shadow:0 20px 55px rgba(7,16,25,.2);transition:transform .45s}.facility-media-stack:hover .facility-plan{transform:translateY(-8px) rotate(-1deg)}
.gallery-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1rem}.gallery-item{position:relative;overflow:hidden;min-height:520px;background:var(--night)}.gallery-item.wide{grid-column:1/-1;min-height:70vh}.gallery-item.tall{min-height:760px}.gallery-item img{height:100%;object-fit:cover;transition:transform 1.1s}.gallery-item:hover img{transform:scale(1.035)}.gallery-item figcaption{position:absolute;left:1.3rem;right:1.3rem;bottom:1.3rem;color:#fff;font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;text-shadow:0 2px 15px #000}
.viewing-steps{counter-reset:steps;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(23,32,41,.18)}.viewing-step{counter-increment:steps;padding:2.5rem;border-right:1px solid rgba(23,32,41,.18)}.viewing-step:before{content:"0" counter(steps);display:block;color:var(--gold);font:400 2rem var(--serif);margin-bottom:3rem}.viewing-step h2{font-size:2.5rem}.viewing-step p{color:#667078}
.menu{position:relative;border:0;width:74px;height:42px;padding:0;color:transparent;font-size:0}.menu:before,.menu:after{content:"";position:absolute;left:14px;right:14px;height:1px;background:#fff;transition:.35s}.menu:before{top:15px}.menu:after{bottom:15px}.menu-open .menu:before{top:20px;transform:rotate(45deg)}.menu-open .menu:after{bottom:21px;transform:rotate(-45deg)}
.nav-scrim{display:none}
@media(max-width:1050px){.nav-scrim{display:block;position:fixed;z-index:55;inset:0;background:rgba(2,6,10,.65);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:.35s}.menu-open .nav-scrim{opacity:1;visibility:visible}.nav{left:auto;width:min(440px,94vw);align-items:stretch;padding:7.5rem 2.4rem 2.2rem;gap:.3rem;box-shadow:-25px 0 80px rgba(0,0,0,.35)}.nav:before{content:"CLOUTHAUS · KLCC";display:block;color:var(--gold);font-size:.62rem;letter-spacing:.2em;margin-bottom:1.6rem}.nav>a:not(.nav-cta),.nav-more>button{font:400 1.9rem/1.15 var(--serif);letter-spacing:-.02em;text-transform:none;padding:.55rem 0;border-radius:0}.nav-more-panel{display:grid;grid-template-columns:1fr 1fr;gap:.2rem .8rem;padding:.7rem 0 1.2rem}.nav-more-panel a{font:600 .68rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;border:0}.nav-cta{margin-top:auto;border-radius:999px;padding:1rem!important;font:800 .72rem/1 var(--sans)!important;letter-spacing:.08em!important;text-transform:uppercase!important}.facility-media-stack{min-height:580px}.premium-footer .footer-grid{grid-template-columns:1fr 1fr 1fr}.premium-footer .footer-brand{grid-column:1/-1}}
@media(max-width:680px){.brand-logo{width:116px}.menu{width:52px}.nav{width:94vw;padding:6.8rem 1.7rem 1.5rem}.nav>a:not(.nav-cta),.nav-more>button{font-size:1.6rem}.nav-more-panel{grid-template-columns:1fr}.facility-media-stack{min-height:520px;padding:0 2rem 4rem 0}.facility-media-stack>img:first-child{height:470px}.facility-media-stack .facility-plan{width:170px;height:225px}.gallery-grid{grid-template-columns:1fr}.gallery-item,.gallery-item.tall,.gallery-item.wide{grid-column:auto;min-height:58vh}.viewing-steps{grid-template-columns:1fr}.viewing-step{border-right:0;border-bottom:1px solid rgba(23,32,41,.18);padding:2.2rem 0}.viewing-step:before{margin-bottom:1.5rem}.premium-footer .footer-grid{grid-template-columns:1fr}}

/* V4 — one-line desktop navigation and a stable, scrollable mobile drawer. */
.header-inner{width:100%;grid-template-columns:auto minmax(0,1fr);align-items:center;min-height:48px}
.brand{display:inline-flex;align-items:center}
.nav{justify-self:end;align-items:center;white-space:nowrap;padding:.3rem;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(4,9,14,.28);backdrop-filter:blur(18px) saturate(120%);gap:.04rem;font-size:.63rem;letter-spacing:.09em;box-shadow:0 10px 35px rgba(0,0,0,.12)}
.nav>a:not(.nav-cta),.nav-more>button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:.66rem .64rem;line-height:1}
.nav-cta{position:relative;right:auto;top:auto;transform:none;display:inline-flex;align-items:center;justify-content:center;min-height:40px;margin-left:.28rem;padding:.7rem 1rem;white-space:nowrap;line-height:1}
.nav-cta:hover{transform:translateY(-2px)}
.brand:after{display:none}
.home-gallery{display:grid;grid-template-columns:.72fr 1.1fr .72fr;min-height:92vh;background:#0a1117;color:#fff;overflow:hidden}
.home-gallery-copy{align-self:center;padding:7vw 4vw 7vw 6vw}
.home-gallery-copy h2{font:400 clamp(3.1rem,5vw,5.7rem)/.94 var(--serif);letter-spacing:-.045em;margin:.5rem 0 1.5rem}
.home-gallery-copy>p:not(.eyebrow){color:rgba(255,255,255,.62);max-width:440px}
.home-gallery-copy .text-link{display:inline-block;margin-top:1.3rem;color:var(--champagne-light);font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.manifesto-foot{grid-column:2;margin:3rem 0 0;max-width:850px}
.home-gallery figure{position:relative;margin:0;overflow:hidden;background:#060b10}
.home-gallery img{width:100%;height:100%;object-fit:cover}
.home-gallery figcaption{position:absolute;z-index:2;left:1.2rem;bottom:1.2rem;color:#fff;font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;text-shadow:0 2px 15px #000}
.home-gallery-main{min-height:92vh}
.home-gallery-pair{display:grid;grid-template-rows:1fr 1fr}
.home-gallery-pair figure{min-height:46vh}

@media(max-width:1180px){
  .site-header.scrolled{backdrop-filter:none;background:rgba(4,9,14,.98)}
  .hero-index{display:none}
  .header-inner{grid-template-columns:1fr auto}
  .menu{display:block;z-index:72}
  .nav-scrim{display:block;position:fixed;z-index:55;inset:0;background:rgba(2,6,10,.7);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:.35s}
  .menu-open .nav-scrim{opacity:1;visibility:visible}
  .nav{position:fixed;z-index:60;top:0;right:0;bottom:0;left:auto;width:min(430px,100vw);height:100dvh;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:.2rem;padding:6.8rem 2.2rem 1.6rem;border:0;border-radius:0;background:rgba(4,9,14,.985);backdrop-filter:none;box-shadow:-25px 0 80px rgba(0,0,0,.38);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;transform:translateX(102%);transition:transform .38s ease}
  .menu-open .nav{transform:translateX(0)}
  .menu-open .whatsapp{opacity:0;visibility:hidden;pointer-events:none}
  .nav:before{content:"CLOUTHAUS · KLCC";display:block;color:var(--champagne);font-size:.62rem;letter-spacing:.2em;margin-bottom:1.15rem}
  .nav>a:not(.nav-cta),.nav-more>button{flex:0 0 auto;width:100%;font:400 1.72rem/1.15 var(--serif);letter-spacing:-.02em;text-transform:none;text-align:left;padding:.48rem 0;border-radius:0}
  .nav-more{flex:0 0 auto;width:100%;min-width:0}
  .nav-more>button{pointer-events:none;color:rgba(255,255,255,.5);font:700 .62rem/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;margin-top:.55rem}
  .nav-more-panel,.nav-more:hover .nav-more-panel,.nav-more:focus-within .nav-more-panel,.nav-more.open .nav-more-panel{position:static!important;display:grid;grid-template-columns:1fr 1fr;gap:.18rem .8rem;width:100%!important;min-width:0;padding:.35rem 0 .9rem!important;margin:0;opacity:1!important;visibility:visible!important;transform:none!important;background:transparent;border:0;box-shadow:none}
  .nav-more-panel a{display:block;min-width:0;padding:.48rem 0;font:700 .67rem/1.25 var(--sans);letter-spacing:.07em;text-transform:uppercase;border:0;white-space:normal}
  .nav-more-panel small{display:none}
  .nav-cta{position:static;flex:0 0 auto;margin:auto 0 0;border-radius:999px;padding:1rem!important;font:800 .72rem/1 var(--sans)!important;letter-spacing:.08em!important;text-align:center!important;text-transform:uppercase!important}
  .home-gallery{grid-template-columns:1fr 1fr}
  .manifesto-foot{grid-column:auto;margin-left:0}
  .home-gallery-copy{grid-column:1/-1;padding:6rem 6vw 3rem}
  .home-gallery-main{min-height:68vh}
  .home-gallery-pair figure{min-height:34vh}
}

@media(max-width:680px){
  .site-header,.site-header.scrolled{padding:.85rem 4vw}
  .brand-logo{width:112px}
  .menu{display:block!important;justify-self:end;width:48px;height:44px;background:rgba(4,9,14,.46);border:1px solid rgba(255,255,255,.2);border-radius:999px}
  .nav{width:100vw;padding:6.2rem 1.4rem max(1.2rem,env(safe-area-inset-bottom))}
  .nav>a:not(.nav-cta){font-size:1.52rem;padding:.38rem 0}
  .nav-more-panel,.nav-more:hover .nav-more-panel,.nav-more:focus-within .nav-more-panel,.nav-more.open .nav-more-panel{grid-template-columns:1fr 1fr!important;gap:.08rem .7rem!important}
  .nav-more-panel a{font-size:.64rem;padding:.44rem 0}
  .home-gallery{grid-template-columns:1fr}
  .home-gallery-copy{padding:5rem 6vw 2.8rem}
  .home-gallery-copy h2{font-size:3.25rem}
  .home-gallery-main{min-height:72vh}
  .home-gallery-pair{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .home-gallery-pair figure{min-height:42vh}
  .home-gallery figcaption{left:.8rem;bottom:.8rem;font-size:.52rem}
  .hero-lux .hero-content{padding-bottom:11rem}
  .hero-index{position:absolute;left:6vw;right:6vw;bottom:4.8rem;margin:0;text-align:right}
  .hero-index b{font-size:2rem}
  .hero-index span{display:block;max-width:250px;margin-left:auto}
  .hospitality-copy>.button{margin-top:1.35rem}
  .whatsapp small{display:none}
}