*{box-sizing:border-box;margin:0;padding:0}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:root{--bg:#F3F0E9;--ink:#141312;--acc:#E2481F;--acc2:#FF8A62;--mute:#6E6A63;--line:#D8D2C6;--pad:20px;--r:6px;--ease:cubic-bezier(.2,.7,.2,1)}
html{scroll-behavior:smooth;scroll-padding-top:76px}
html,body{overflow-x:clip}
body{background:var(--bg);color:var(--ink);font-family:'General Sans',system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:10px 14px;border-radius:4px;z-index:100}
.skip:focus{left:8px}
.dot{width:8px;height:8px;border-radius:9px;background:var(--acc);flex:none;display:inline-block}

/* pills */
.pill{background:var(--ink);color:var(--bg);padding:12px 20px;border-radius:99px;font-weight:500;font-size:14px;display:inline-flex;gap:8px;align-items:center;justify-content:center;white-space:nowrap;transition:transform .3s var(--ease),background .3s}
.pill:hover{transform:translateY(-2px)}
.pill.acc{background:var(--acc);color:#fff}
.pill.acc:hover{background:#c93c16}
.pill.big{padding:17px 26px;font-size:16px}
.pill.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.pill.light{background:var(--bg);color:var(--ink)}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(243,240,233,.92);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);transition:box-shadow .3s}
.nav.scrolled{box-shadow:0 1px 0 var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:12px var(--pad);font-size:14px;font-weight:500;gap:16px}
.nl{display:none}
.brand img{height:40px;width:auto}
.nr{display:flex;align-items:center;gap:10px}
.nr .tel,.nr .pill{display:none}
.burger{width:44px;height:44px;border-radius:99px;background:var(--ink);display:grid;place-content:center;gap:6px}
.burger span{display:block;width:18px;height:1.5px;background:var(--bg);transition:transform .35s var(--ease)}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.menu{position:fixed;inset:68px 0 0 0;z-index:49;background:var(--bg);padding:24px var(--pad) calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.menu[hidden]{display:none}
.menu ul li{border-bottom:1px solid var(--line)}
.menu ul a{display:flex;align-items:baseline;gap:16px;padding:16px 0;font-family:'Cabinet Grotesk',sans-serif;font-weight:800;font-size:42px;letter-spacing:-.03em;line-height:1}
.menu ul i{font-style:normal;min-width:20px;font-family:'General Sans';font-size:13px;font-weight:500;color:var(--acc);letter-spacing:0}
.menu-f{display:grid;gap:14px;margin-top:28px}
.menu-f p{color:var(--mute);font-size:15px;text-align:center}
.js .menu.open ul li{animation:mIn .5s var(--ease) both}
.menu.open ul li:nth-child(2){animation-delay:.04s}.menu.open ul li:nth-child(3){animation-delay:.08s}.menu.open ul li:nth-child(4){animation-delay:.12s}.menu.open ul li:nth-child(5){animation-delay:.16s}
@keyframes mIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
body.locked{overflow:hidden}

/* hero */
.mega{font-family:'Cabinet Grotesk',sans-serif;font-weight:800;line-height:.82;letter-spacing:-.045em;padding:18px var(--pad) 22px;display:grid;grid-template-columns:1fr;font-size:28.5vw}
.mega span{display:block}
.mega .m2{text-align:right}
.mega .sub{order:3;font-family:'General Sans',sans-serif;font-weight:500;font-size:14px;letter-spacing:0;line-height:1.45;color:var(--mute);margin-top:16px}
.js .mega .m1,.js .mega .m2{animation:rise 1s var(--ease) both}
.js .mega .m2{animation-delay:.08s}
.js .mega .sub{animation:fade 1s .3s both}
@keyframes rise{from{opacity:0;transform:translateY(.18em)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.heroimg{margin:0 var(--pad);aspect-ratio:4/5;overflow:hidden;position:relative;border-radius:var(--r);background:#ddd6c9}
.heroimg img{width:100%;height:100%;object-fit:cover;object-position:62% 45%;transform:scale(1.04);transition:transform 1.6s var(--ease)}
.js .heroimg img{animation:zoom 1.8s var(--ease) both}
@keyframes zoom{from{transform:scale(1.12)}to{transform:scale(1.04)}}
.tag{position:absolute;left:14px;bottom:14px;right:14px;background:var(--bg);padding:12px 14px;border-radius:4px;font-size:13px;font-weight:500;display:flex;gap:10px;align-items:center;width:max-content;max-width:calc(100% - 28px)}
.meta{display:grid;grid-template-columns:1fr 1fr;margin:0 var(--pad);border-bottom:1px solid var(--line)}
.meta>div{padding:18px 0 18px 16px;border-top:1px solid var(--line)}
.meta>div:nth-child(odd){padding-left:0;border-right:1px solid var(--line)}
.meta>div:nth-child(-n+2){border-top:0}
.meta dt{font-size:13px;color:var(--mute)}
.meta dd{color:var(--ink);font-weight:500;font-size:16px;margin-top:4px}

/* sections */
.sec{padding:84px var(--pad)}
.lbl{font-size:12px;font-weight:500;color:var(--acc);letter-spacing:.06em;text-transform:uppercase;display:flex;gap:10px;align-items:center}
h2{font-family:'Cabinet Grotesk',sans-serif;font-weight:800;font-size:clamp(46px,13vw,96px);line-height:.92;letter-spacing:-.035em;margin:16px 0 0}
.lead{font-size:19px;line-height:1.5;max-width:640px}
.intro{display:grid;gap:24px}
.nums{display:grid;grid-template-columns:1fr 1fr;gap:34px 16px;margin-top:56px}
.nums li{border-top:2px solid var(--ink);padding-top:14px}
.nums b{font-family:'Cabinet Grotesk',sans-serif;font-weight:800;font-size:64px;letter-spacing:-.04em;line-height:1;display:block;font-variant-numeric:tabular-nums}
.nums small{font-size:.4em;letter-spacing:-.01em}
.nums li>span{font-size:14px;color:var(--mute)}
.split{display:grid;gap:14px;margin-top:56px}
.split figure{position:relative;overflow:hidden;border-radius:var(--r)}
.split img{width:100%;aspect-ratio:4/3;object-fit:cover}
figcaption{font-size:13px;color:var(--mute);margin-top:10px}
.split figcaption{position:absolute;left:12px;bottom:12px;margin:0;background:var(--bg);color:var(--ink);padding:7px 11px;border-radius:4px;font-weight:500;font-size:12px}

/* residences */
.res{padding-top:0}
.res-grid{display:grid;gap:28px;margin-top:40px}
.res-img{position:relative;border-radius:var(--r);overflow:hidden}
.res-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.badge{position:absolute;top:14px;left:14px;background:var(--acc);color:#fff;font-family:'Cabinet Grotesk';font-weight:800;font-size:22px;letter-spacing:-.02em;padding:8px 14px;border-radius:4px}
.spec>div{display:flex;justify-content:space-between;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-size:15px}
.spec>div:first-child{border-top:2px solid var(--ink)}
.spec dt{color:var(--mute)}
.spec dd{font-weight:500;text-align:right}
.fp{margin-top:24px;background:#fff;border-radius:var(--r);padding:20px;display:grid;gap:16px}
.fp b{display:block;font-family:'Cabinet Grotesk';font-weight:800;font-size:26px;letter-spacing:-.02em;line-height:1.05}
.fp span{color:var(--mute);font-size:14px;display:block;margin-top:4px}
.fp .pill{justify-self:start}

/* amenities */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:40px}
.tile{background:#fff;border-radius:var(--r);padding:16px;min-height:142px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .4s var(--ease),background .3s}
.tile:hover{transform:translateY(-3px)}
.tile i{font-style:normal;font-size:12px;color:var(--mute)}
.tile b{font-family:'Cabinet Grotesk',sans-serif;font-weight:700;font-size:22px;letter-spacing:-.02em;line-height:1.02}
.tile.acc{background:var(--acc);color:#fff}.tile.acc i{color:#ffd9cc}
.note{margin-top:20px;color:var(--mute);font-size:14px}

/* location */
.dark{background:var(--ink);color:var(--bg)}
.dark .lbl{color:var(--acc2)}
.dark .lbl .dot{background:var(--acc2)}
.locg{display:grid;gap:36px;margin-top:36px}
.row{display:grid;grid-template-columns:1fr auto;grid-template-areas:"pl b" "km b";padding:18px 0;border-bottom:1px solid #34312d;align-items:center;column-gap:16px}
.row:first-child{border-top:1px solid #34312d}
.row .pl{grid-area:pl;font-size:17px}
.row .km{grid-area:km;color:#9b968d;font-size:13px}
.row b{grid-area:b;font-family:'Cabinet Grotesk',sans-serif;font-weight:800;font-size:38px;letter-spacing:-.03em;white-space:nowrap}
.row small{font-size:17px;font-weight:600;letter-spacing:0}
.addr{color:#b5b0a6;font-size:14px;margin:22px 0 18px}
.locimg{border-radius:var(--r);overflow:hidden}
.locimg img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* gallery: horizontal strip */
.gal-head{display:grid;gap:12px}
.gal-head .note{margin:0}
#gallery{overflow:hidden}
.hs{margin:36px calc(var(--pad) * -1) 0;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.hs::-webkit-scrollbar{display:none}
.hs-track{display:flex;gap:12px;padding:0 var(--pad);width:max-content}
.hs-item{margin:0;height:min(62vh,520px);flex:none;scroll-snap-align:start;display:flex;flex-direction:column}
.hs-item .gbtn{flex:none;height:calc(100% - 30px);width:auto;aspect-ratio:var(--ar);border-radius:var(--r);overflow:hidden;background:#ddd6c9;display:block}
.hs-item img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.hs-item .gbtn:hover img{transform:scale(1.04)}
.hs-item figcaption{display:flex;gap:12px;font-size:13px;width:0;min-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:10px;line-height:20px}
.hs-item figcaption i{font-style:normal;color:var(--acc);font-weight:500}
.gs .hs{overflow:visible;scroll-snap-type:none}
/* visit */
.visit{padding:0 var(--pad) 84px}
.visit-in{display:grid;gap:28px;border-top:1px solid var(--line);padding-top:56px}
.visit-img{border-radius:var(--r);overflow:hidden}
.visit-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.visit-txt .lead{margin-top:18px;color:#3a3733}
.btns{display:grid;gap:10px;margin-top:28px}

/* footer */
.foot{background:var(--ink);color:#cfcac0;padding:56px var(--pad) calc(96px + env(safe-area-inset-bottom));font-size:14px}
.foot-top{display:grid;grid-template-columns:1fr 1fr;gap:32px 16px}
.flogo{grid-column:1/-1;height:52px;width:auto;filter:brightness(0) invert(.94)}
.fcol h3{font-family:'Cabinet Grotesk';font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--acc2);margin-bottom:10px}
.fcol p{line-height:1.7}
.fcol a:hover,.foot-b a:hover{color:#fff}
.rera{margin-top:40px;padding:18px 0;border-top:1px solid #34312d;border-bottom:1px solid #34312d;font-size:13px;word-break:break-word;color:#b5b0a6}
.rera b{color:#fff;font-weight:600;margin-right:6px}
.foot-b{display:flex;flex-direction:column;gap:8px;margin-top:20px;font-size:12px;color:#8f8a81}
.foot-b a{text-decoration:underline;text-underline-offset:3px}

/* mobile bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:1fr 2fr;gap:8px;padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));background:rgba(243,240,233,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .4s var(--ease)}
.mbar.show{transform:none}
.mbar a{display:flex;align-items:center;justify-content:center;height:48px;border-radius:99px;font-weight:500;font-size:15px}
.mb-call{box-shadow:inset 0 0 0 1.5px var(--ink)}
.mb-wa{background:var(--acc);color:#fff}

/* lightbox */
.lb{position:fixed;inset:0;z-index:90;background:rgba(20,19,18,.94);display:grid;place-items:center;padding:20px}
.lb[hidden]{display:none}
.lb img{max-width:100%;max-height:88vh;border-radius:4px}
.lb-x{position:absolute;top:14px;right:14px;width:46px;height:46px;border-radius:99px;background:var(--bg);color:var(--ink);font-size:26px;line-height:1}

/* motion extras */
.progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--acc);transform:scaleX(0);transform-origin:0 50%;z-index:70;pointer-events:none}
.marquee{overflow:hidden;margin:44px calc(var(--pad) * -1) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}
.mq-track{display:flex;width:max-content;animation:mq 38s linear infinite}
.mq-track>span{display:flex;align-items:center;gap:28px;padding-right:28px;white-space:nowrap;font-family:'Cabinet Grotesk',sans-serif;font-weight:800;font-size:clamp(40px,7vw,96px);letter-spacing:-.035em;line-height:1}
.mq-track .sep{width:.32em;height:.32em;border-radius:50%;background:var(--acc);display:inline-block;flex:none}
@keyframes mq{to{transform:translateX(-50%)}}
.row{position:relative}
.bar{position:absolute;left:0;bottom:-1px;height:2px;width:calc(var(--w) * 100%);background:var(--acc2);transform-origin:0 50%}
.js .bar{transform:scaleX(0);transition:transform 1.4s var(--ease) .2s}
.js .row.in .bar{transform:scaleX(1)}
.ln{display:inline-block;overflow:hidden;vertical-align:top;padding:.06em .02em .14em;margin:-.06em -.02em -.14em}
.ln>span{display:inline-block;will-change:transform}
.mega .ch{display:inline-block;will-change:transform}
.mega .mk{display:block;white-space:nowrap;overflow:hidden;padding:.04em .04em .16em;margin:-.04em -.04em -.16em}
.cursor{display:none}
@media (hover:hover) and (pointer:fine){
  .cursor{display:block;position:fixed;top:0;left:0;z-index:80;pointer-events:none;width:0;height:0}
  .cursor span{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;background:var(--acc);transition:transform .35s var(--ease),background .3s,opacity .3s;display:grid;place-items:center;font-size:3px;color:#fff;font-weight:600;letter-spacing:.02em}
  .cursor.link span{transform:scale(3.2);background:rgba(226,72,31,.18)}
  .cursor.view span{transform:scale(6);background:var(--acc)}
  .cursor.view span::after{content:"View";}
  .cursor.hide span{opacity:0}
}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

.gs .mega .m1,.gs .mega .m2{animation:none;opacity:0}
.gs .heroimg{clip-path:inset(49.5% 0 49.5% 0)}
.gs .heroimg img{animation:none;transform:scale(1.1)}
.gs .pill{transition:background .3s}
.gs .pill:hover{transform:none}
.gs .hs-item{height:clamp(260px,calc(100svh - 380px),600px)}
@media (min-width:1000px){.gs .hs-item{height:clamp(320px,calc(100svh - 330px),620px)}.hs-item .gbtn{aspect-ratio:auto;width:clamp(460px,calc(var(--ar) * 62vh),980px)}.hs-item .gbtn{min-width:34vw}}
.gs #gallery{min-height:100svh;padding-top:96px;padding-bottom:48px}

/* reveals */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
.js .rv.in{opacity:1;transform:none}

@media (min-width:600px){
  :root{--pad:32px}
  .tiles{grid-template-columns:repeat(3,1fr)}
  .btns{display:flex;flex-wrap:wrap}
  .fp{grid-template-columns:1fr auto;align-items:center}
  .fp .pill{justify-self:end}
  .heroimg{aspect-ratio:3/2}
}
@media (min-width:1000px){
  :root{--pad:48px}
  .mbar{display:none}
  .foot{padding-bottom:40px}
  .nav-in{display:grid;grid-template-columns:1fr auto 1fr;padding:16px var(--pad)}
  .nl{display:flex;gap:30px}
  .nl a{position:relative}
  .nl a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
  .nl a:hover::after{transform:scaleX(1)}
  .brand img{height:46px}
  .nr{justify-content:flex-end;gap:24px}
  .nr .tel,.nr .pill{display:inline-flex}
  .burger,.menu{display:none!important}
  .mega{display:flex;justify-content:space-between;align-items:flex-end;font-size:13.6vw;padding:20px calc(var(--pad) - 8px) 26px}
  .mega .sub{order:0;align-self:flex-start;text-align:right;max-width:200px;margin-top:12px;font-size:15px}
  .heroimg{aspect-ratio:auto;height:min(560px,62vh);min-height:440px}
  .heroimg img{object-position:center 40%}
  .tag{left:24px;bottom:24px;padding:14px 18px}
  .meta{grid-template-columns:repeat(4,1fr)}
  .meta>div,.meta>div:nth-child(odd){padding:24px 0 24px 20px;border-top:0;border-right:1px solid var(--line)}
  .meta>div:first-child{padding-left:0}
  .meta>div:last-child{border-right:0}
  .sec{padding:120px var(--pad)}
  .res{padding-top:0}
  .intro{grid-template-columns:5fr 7fr;gap:60px;align-items:end}
  .lead{font-size:22px;line-height:1.45}
  .nums{grid-template-columns:repeat(4,1fr);gap:20px;margin-top:80px}
  .nums b{font-size:clamp(72px,6.7vw,104px)}
  .split{grid-template-columns:1fr 1fr;gap:20px;margin-top:80px}
  .split img{aspect-ratio:auto;height:560px}
  .split figcaption{left:20px;bottom:20px;font-size:13px}
  .res-grid{grid-template-columns:7fr 5fr;gap:56px;align-items:start;margin-top:56px}
  .res-img img{aspect-ratio:auto;height:600px}
  .badge{top:22px;left:22px;font-size:28px}
  .spec>div{padding:19px 0;font-size:16px}
  .tiles{grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
  .tile{padding:26px;min-height:200px}
  .tile b{font-size:30px}
  .locg{grid-template-columns:1fr 1fr;gap:60px;margin-top:48px}
  .row{grid-template-columns:1fr auto 110px;grid-template-areas:"pl b km";padding:26px 0}
  .row .pl{font-size:20px}
  .row .km{text-align:right;font-size:15px}
  .row b{font-size:42px}
  .row small{font-size:20px}
  .locimg,.locimg img{height:100%}
  .locimg img{aspect-ratio:auto;min-height:520px}
  .gal-head{grid-template-columns:1fr auto;align-items:end}
  .hs-item{height:min(66vh,600px)}
  .hs-track{gap:20px}
  .visit{padding:0 var(--pad) 120px}
  .visit-in{grid-template-columns:5fr 6fr;gap:64px;align-items:center;padding-top:96px}
  .visit-img img{aspect-ratio:4/5;max-height:640px}
  .visit h2{font-size:clamp(64px,6.2vw,92px)}
  .foot-top{grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
  .flogo{grid-column:auto}
  .foot-b{flex-direction:row;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mq-track{animation:none!important}
  .js .bar{transform:none}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
}