:root{--ink:#10251f;--sage:#7d9183;--sand:#eee9df;--paper:#faf9f5;--gold:#b39661}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}a{text-decoration:none;color:inherit}.demo{height:32px;padding:0 5%;background:#0b1c17;color:#dce5df;display:flex;align-items:center;justify-content:space-between;font-size:9px}.demo b{color:#d3b77d}.demo a{text-decoration:underline}nav{height:82px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;background:rgba(250,249,245,.94);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:11px}.brand i{font:30px "Manrope";font-style:normal;width:39px;height:39px;border:1px solid var(--ink);display:grid;place-items:center}.brand span{display:flex;flex-direction:column}.brand b{font:15px "Manrope";letter-spacing:.23em}.brand small{font-size:6px;letter-spacing:.3em;color:var(--gold)}.links{display:flex;gap:30px;font-size:10px;font-weight:600}.nav-cta,.contact>a{background:var(--ink);color:white;padding:13px 18px;font-size:9px;font-weight:600}.hero{height:calc(100vh - 114px);min-height:650px;position:relative;color:white;overflow:hidden}.hero-bg{position:absolute;inset:0;background:linear-gradient(125deg,#455e50 0 25%,#98a393 26% 48%,#d9c9b2 49% 67%,#65796a 68%);filter:saturate(.8)}.hero-bg:after{content:"";position:absolute;left:32%;right:10%;top:18%;bottom:0;background:linear-gradient(160deg,#dfd5c6 0 38%,#9c836d 39% 42%,#354d40 43%);clip-path:polygon(12% 16%,84% 0,100% 100%,0 100%)}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,23,17,.82),rgba(6,23,17,.06) 70%)}.hero-copy{position:absolute;left:8%;top:50%;transform:translateY(-55%);z-index:2}.eyebrow{font-size:8px;letter-spacing:.24em;font-weight:600;color:#e2c894}.eyebrow.dark{color:var(--gold)}h1,h2{font:300 65px/1.08 "Manrope";letter-spacing:-.05em;margin:22px 0}h1 em,h2 em{font-style:normal;color:#d8bf8e}.hero-copy p{max-width:450px;line-height:1.8;color:#d0d9d4;font-size:12px}.actions{display:flex;gap:25px;align-items:center;margin-top:32px}.actions>a:first-child{background:white;color:var(--ink);padding:14px 18px;font-size:9px}.actions>a:last-child{font-size:9px}.actions span{margin-left:8px;border:1px solid #ffffff77;border-radius:50%;padding:7px}.hero-facts{position:absolute;right:0;bottom:0;z-index:3;background:rgba(10,30,23,.88);display:grid;grid-template-columns:repeat(3,150px);padding:22px}.hero-facts div{display:flex;flex-direction:column;padding:0 20px;border-right:1px solid #ffffff2b}.hero-facts div:last-child{border:0}.hero-facts small{font-size:6px;letter-spacing:.16em;color:#a8b8b0}.hero-facts b{font:13px "Manrope";margin-top:7px}.statement{text-align:center;padding:125px 12%}.statement h2{font-size:46px}.statement p{max-width:690px;margin:0 auto;color:#68776f;line-height:1.9;font-size:12px}.stats{margin:70px auto 0;max-width:900px;padding-top:30px;border-top:1px solid #dcded8;display:grid;grid-template-columns:repeat(4,1fr)}.stats div{display:flex;flex-direction:column}.stats b{font:31px "Manrope";color:var(--gold)}.stats span{font-size:8px;color:#78867e;margin-top:6px}.gallery{height:680px;display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:1fr 1fr;gap:8px;padding:0 4%}.gallery>div{position:relative;background:linear-gradient(140deg,#4d6658,#c7b79f);overflow:hidden}.gallery>div:after{content:"";position:absolute;inset:13%;background:linear-gradient(135deg,transparent 0 35%,#eee8dc 36% 62%,#718476 63%)}.gallery span{position:absolute;left:20px;bottom:18px;z-index:2;color:white;font-size:7px;letter-spacing:.2em}.g-main{grid-row:1/3}.g-top{background:linear-gradient(140deg,#a89b88,#e3d6c3)!important}.g-bottom{background:linear-gradient(140deg,#273f35,#87988a)!important}.units{padding:125px 7%;background:#eeeae1}.section-title{display:flex;justify-content:space-between;align-items:end}.section-title h2{font-size:42px}.section-title>p{max-width:370px;color:#6f7d75;font-size:11px;line-height:1.8}.unit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px}.unit-grid article{background:var(--paper);padding:20px}.plan{height:250px;background:#e5e4df;position:relative;padding:45px;display:grid;grid-template-columns:1fr 1fr;gap:5px}.plan i{border:2px solid #87938c;position:relative}.plan i:after{content:"";position:absolute;width:35%;height:1px;background:#87938c;left:32%;top:50%}.unit-grid article>small{display:block;margin-top:24px;color:var(--gold);font-size:7px;letter-spacing:.18em}.unit-grid h3{font:26px "Manrope";margin:8px 0}.unit-grid p{font-size:9px;color:#7b8982}.unit-grid article>div:last-child{display:flex;justify-content:space-between;border-top:1px solid #dfe1dc;margin-top:20px;padding-top:15px;font-size:9px}.unit-grid a{color:var(--gold);font-weight:600}.facilities{padding:130px 9%;background:var(--ink);color:white;display:grid;grid-template-columns:1fr 1fr;gap:100px}.facilities h2{font-size:42px}.facilities p{color:#9eb0a8;line-height:1.8;font-size:11px}.facility-list{display:grid;grid-template-columns:1fr 1fr}.facility-list span{padding:22px 0;border-bottom:1px solid #ffffff1f;font:12px "Manrope"}.facility-list b{color:var(--gold);font-size:7px;margin-right:15px}.contact{text-align:center;padding:130px 8%}.contact h2{font-size:43px}.contact p{font-size:11px;color:#74827b;margin-bottom:35px}.contact>a{display:inline-block}footer{height:110px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e0e2dd;font-size:8px;color:#728078}footer>div{display:flex;gap:18px}
@media(max-width:800px){.links{display:none}.nav-cta{font-size:0;padding:12px}.nav-cta:after{content:"Hubungi";font-size:9px}.hero{height:720px}.hero-copy{left:7%;right:7%}h1{font-size:48px}.hero-facts{left:0;grid-template-columns:repeat(3,1fr)}.statement{padding:90px 7%}.gallery{height:500px}.section-title{display:block}.unit-grid{grid-template-columns:1fr}.facilities{grid-template-columns:1fr;gap:45px}.facility-list{grid-template-columns:1fr 1fr}}@media(max-width:520px){nav{padding:0 4%}.hero-facts{grid-template-columns:1fr;padding:15px}.hero-facts div{display:none}.hero-facts div:first-child{display:flex;border:0}.stats{grid-template-columns:1fr 1fr;gap:30px}.gallery{height:600px;grid-template-columns:1fr;grid-template-rows:2fr 1fr}.g-main{grid-row:auto}.g-bottom{display:none}.statement h2,.units h2,.facilities h2,.contact h2{font-size:35px}.facility-list{grid-template-columns:1fr}footer{flex-direction:column;justify-content:center;gap:15px}}

/* Original architectural photography */
.hero-bg{background-image:url("residence-hero.webp");background-size:cover;background-position:center}.hero-bg:after{display:none}.shade{background:linear-gradient(90deg,rgba(5,22,16,.88) 0,rgba(5,22,16,.38) 47%,rgba(5,22,16,.04) 78%)}.gallery>div{background-image:url("residence-hero.webp")!important;background-size:cover!important}.gallery>div:after{display:none}.g-main{background-position:15% center!important}.g-top{background-position:60% 25%!important}.g-bottom{background-position:82% 72%!important}.gallery>div:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(6,24,17,.55))}.unit-grid article{box-shadow:0 18px 35px rgba(30,48,39,.07);transition:transform .25s}.unit-grid article:hover{transform:translateY(-7px)}

/* Photographic unit collection */
.plan{padding:0;background-image:url("residence-hero.webp");background-size:300% 100%;overflow:hidden}.plan:after{content:"View residence";position:absolute;left:14px;bottom:13px;color:white;background:rgba(8,32,24,.74);backdrop-filter:blur(7px);padding:7px 10px;font-size:7px;letter-spacing:.13em;text-transform:uppercase}.plan:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(6,25,18,.48));z-index:0}.plan i{display:none}.plan-a{background-position:0 center}.plan-b{background-position:50% center}.plan-c{background-position:100% center}.unit-grid article:hover .plan{background-size:315% 105%}.unit-grid article .plan{transition:background-size .45s}.units{background-image:linear-gradient(rgba(255,255,255,.02),rgba(255,255,255,.02)),radial-gradient(circle at 5% 20%,rgba(179,150,97,.12),transparent 20%)}