@font-face{font-family:'Marcellus';src:url(vendor/fonts/Marcellus-Regular.ttf) format('truetype');font-display:block}
@font-face{font-family:'Jost';src:url(vendor/fonts/Jost.ttf) format('truetype');font-weight:100 900;font-display:block}
@property --r{syntax:'<percentage>';inherits:false;initial-value:0%}
@property --w{syntax:'<percentage>';inherits:false;initial-value:0%}

:root{--olive:#3E4A17;--olive2:#2F3811;--sage:#8E9A72;--stone:#EFEDE6;--ink:#2B2B24;--copper:#B8692B;--champ:#E2B98A;
  --ease:cubic-bezier(.22,.7,.18,1);--easeio:cubic-bezier(.65,0,.35,1)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:#000;overflow:hidden}
body{cursor:default}
body.idle,body.idle *{cursor:none!important}
#stage{position:absolute;left:50%;top:50%;width:2112px;height:1152px;transform-origin:0 0;overflow:hidden;background:#000;
  font-family:'Jost',sans-serif;font-weight:300;color:var(--ink);-webkit-font-smoothing:antialiased}

/* frames */
.frame{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.3s var(--easeio),visibility 0s 1.3s;overflow:hidden;contain:strict}
.frame.cur{opacity:1;visibility:visible;transition:opacity 1.3s var(--easeio),visibility 0s 0s;z-index:2}
/* outgoing frame stays opaque underneath while the next one fades in over it; its words leave first */
.frame.out{opacity:1;visibility:visible;transition:none;z-index:1}
.frame.out :is(.blk,.h1,.h2,.eyebrow,.kicker,.wordmark,.close,.pp,.answer,.mores,.pillars,.partner,.partners-row,.proofs,.price,.w-head,.g-head,.wl,.reveal-line,.mp-title,.mp-card,.clc,.film-hint,.ticks){opacity:0!important;transition:opacity .35s ease!important}
.frame.entering [data-s].on,.frame.stepping [data-s].on{transition-delay:calc(var(--d,0s) + .35s)}
.frame.far{display:none}
.stone{background:var(--stone)}
.olive{background:var(--olive);color:var(--stone)}
.olive.deep{background:var(--olive2)}
.dark,.black{background:#000;color:#fff}
.paper{background:radial-gradient(120% 90% at 40% 30%,#F4F1E8 0%,#E9E4D6 100%)}

/* build steps */
[data-s]{opacity:0;transform:translateY(26px);transition:opacity .35s ease 0s,transform 1.2s var(--ease) 0s;pointer-events:none}
[data-s].on{transition:opacity .9s var(--ease),transform 1.2s var(--ease)}
[data-s].on{opacity:1;transform:none;transition-delay:var(--d,0s);pointer-events:auto}
.frame:is(.entering,.stepping) :is(.par,.vidwrap,.shade,.mp,.aerial,.acc,.worlds,.gal,.fp,.sec,.partner-img)[data-s].on{transition-delay:0s}
.frame.stepping .par[data-s]:not(.on),.frame.stepping .vidwrap[data-s]:not(.on),.frame.stepping .shade[data-s]:not(.on){transition:opacity 1.6s var(--easeio)}
.par[data-s],.vidwrap[data-s],.shade[data-s],.mp[data-s],.aerial[data-s],.acc[data-s],.worlds[data-s],.gal[data-s],.fp[data-s],.sec[data-s],.partner-img[data-s]{transform:none;transition:opacity 1.6s var(--easeio)}

/* media */
.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.par{position:absolute;inset:-30px;transform:translate3d(calc(var(--mx,0)*-18px),calc(var(--my,0)*-12px),0)}
.par.p2{transform:translate3d(calc(var(--mx,0)*-30px),calc(var(--my,0)*-16px),0)}
.par[data-s]{transform:translate3d(calc(var(--mx,0)*-18px),calc(var(--my,0)*-12px),0)}
.par.p2[data-s]{transform:translate3d(calc(var(--mx,0)*-30px),calc(var(--my,0)*-16px),0)}
.vidwrap{position:absolute;inset:0}
.kb{transform-origin:50% 45%;will-change:transform}
.frame.cur .kb.go{animation:kb var(--kbt,30s) linear forwards}
@keyframes kb{from{transform:scale(1.0)}to{transform:scale(1.09)}}
.kb.tilt{transform-origin:50% 20%}
.frame.cur .kb.tilt.go{animation:kbtilt var(--kbt,30s) linear forwards}
@keyframes kbtilt{from{transform:scale(1.12) translateY(-4%)}to{transform:scale(1.04) translateY(3%)}}

.shade{position:absolute;inset:0;pointer-events:none}
.shade.radial{background:radial-gradient(70% 60% at 50% 48%,rgba(10,12,6,.55) 0%,rgba(10,12,6,.15) 60%,rgba(0,0,0,.45) 100%)}
.shade.left{background:linear-gradient(90deg,rgba(14,17,7,.78) 0%,rgba(14,17,7,.45) 38%,rgba(0,0,0,0) 65%),linear-gradient(0deg,rgba(0,0,0,.35),rgba(0,0,0,0) 30%)}
.shade.bottom{background:linear-gradient(0deg,rgba(10,12,6,.75) 0%,rgba(10,12,6,0) 55%)}
.shade.full{background:rgba(22,27,10,.78)}
.shade.olive-l{background:linear-gradient(90deg,rgba(62,74,23,.62) 0%,rgba(62,74,23,.3) 30%,rgba(62,74,23,0) 50%),linear-gradient(0deg,rgba(0,0,0,.3),rgba(0,0,0,0) 28%)}
.shade.topscrim{background:radial-gradient(62% 40% at 50% 22%,rgba(10,12,6,.62),rgba(10,12,6,0) 100%),linear-gradient(0deg,rgba(10,12,6,.4),rgba(10,12,6,0) 30%)}
.shade.closescrim{background:radial-gradient(60% 46% at 50% 30%,rgba(10,12,6,.6),rgba(10,12,6,0) 100%)}
.sweep{position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;
  background:linear-gradient(105deg,rgba(255,240,215,0) 35%,rgba(255,236,200,.55) 50%,rgba(255,240,215,0) 65%);background-size:300% 100%;background-position:120% 0}
.frame.cur .sweep{animation:sweep 7s 1.2s var(--easeio) forwards}
@keyframes sweep{to{background-position:-30% 0}}

.pattern{position:absolute;inset:0;opacity:.09;pointer-events:none;background:url(media/img/jali-tile.png) 0 0/1056px 406px repeat}
.pattern.light{opacity:.1;filter:invert(1) brightness(1.6) sepia(.4)}

/* type */
.blk{position:absolute}
.eyebrow{font-family:'Jost';font-weight:400;font-size:22px;letter-spacing:.32em;color:var(--copper);margin-bottom:26px}
.dark .eyebrow,.olive .eyebrow,.blk.light .eyebrow{color:var(--champ)}
.eyebrow.abs{position:absolute}
.eyebrow.center{text-align:center}
.h1{font-family:'Marcellus',serif;font-weight:400;font-size:84px;line-height:1.08;letter-spacing:.04em;color:var(--olive)}
.h1.xl{font-size:112px}
.h2{font-family:'Marcellus',serif;font-weight:400;font-size:54px;line-height:1.14;letter-spacing:.03em;color:var(--olive)}
.dark .h1,.dark .h2,.olive .h1,.olive .h2,.blk.light .h1{color:#F4EFE4;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.lead{font-family:'Marcellus',serif;font-size:40px;line-height:1.3;margin-top:30px;letter-spacing:.02em;color:var(--olive)}
.dark .lead,.olive .lead{color:#EDE5D3}
.body{font-size:32px;line-height:1.5;margin-top:26px;color:#4a4a3e}
.dark .body,.blk.light .body{color:#E9E3D6}
.kicker{position:absolute;font-size:26px;letter-spacing:.42em;color:#EDE2CD}
.kicker.center{left:0;right:0;text-align:center}
.rera{position:absolute;left:0;right:0;bottom:30px;text-align:center;font-size:15px;letter-spacing:.18em;color:rgba(240,232,216,.7)}
.ph{color:#C2410C!important}
.ph.filled{color:inherit!important}
.dark .ph:not(.filled),.dark .ph:not(.filled) *{color:#F2A36B!important}

/* wordmark */
.wordmark{position:absolute;left:0;right:0;top:390px;text-align:center;color:#F3ECDD;text-shadow:0 4px 40px rgba(0,0,0,.4)}
.wm-the{font-family:'Marcellus';font-size:58px;letter-spacing:.5em;padding-left:.5em}
.wm-b{font-family:'Marcellus';font-size:196px;letter-spacing:.14em;line-height:1.05;padding-left:.14em}
.wordmark.small{position:relative;top:auto;margin-top:70px}
.wordmark.small .wm-the{font-size:36px}
.wordmark.small .wm-b{font-size:110px}
/* the official lockup (THE BUNGALOWS / MAX ESTATES), client vector, inline so it works from file:// */
.wordmark.lock{top:330px}
.wordmark.lock .lockup{display:block;width:1300px;height:auto;margin:0 auto;filter:drop-shadow(0 4px 40px rgba(0,0,0,.4))}
.wordmark.small.lock{top:auto}
.wordmark.small.lock .lockup{width:760px}

/* F2 */
.pillars{position:absolute;left:150px;right:150px;top:560px;display:flex;gap:28px;transform:none}
.pillar{flex:1;border-top:2px solid var(--copper);padding-top:26px}
.pillar b{display:block;font-family:'Marcellus';font-weight:400;font-size:30px;letter-spacing:.06em;color:var(--olive);line-height:1.25;min-height:76px}
.pillar span{display:block;font-size:25px;line-height:1.4;color:#5a5a4c;margin-top:14px}
.reel{position:absolute;left:150px;right:120px;top:340px;height:540px;display:flex;gap:18px;align-items:flex-end;transform:none}
.tile{position:relative;flex:1;height:400px;overflow:hidden;border-radius:2px;cursor:pointer;transition:opacity .9s var(--ease),transform 1.2s var(--ease),flex 1s var(--ease),height 1s var(--ease)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 6s var(--ease)}
.tile:hover img{transform:scale(1.06)}
.tile i{position:absolute;left:0;right:0;bottom:0;padding:60px 8px 16px 12px;font-style:normal;font-size:22px;letter-spacing:.08em;white-space:nowrap;color:#fff;background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,0))}
.tile.big{position:absolute;right:0;bottom:0;width:603px;height:600px;flex:none}   /* R10: arrives on click 2 at its final size */
#f2 .reel{transition:opacity .9s var(--ease),padding-right 1s var(--ease)}
#f2.s1 .reel{padding-right:621px}
.tile.big i{font-family:'Marcellus';font-size:30px;letter-spacing:.24em}
.tile.focus{flex:3.2}
#f2.s1 .tile:not(.big){opacity:.35}

/* F3 archive prints */
.print{position:absolute;display:flex;flex-direction:column;background:#F7F3E8;padding:16px 16px 0;box-shadow:0 30px 60px -20px rgba(40,32,10,.45),0 2px 6px rgba(40,32,10,.2);cursor:zoom-in}
.print img{display:block;width:100%;flex:1 1 auto;min-height:0;height:auto;object-fit:cover;filter:sepia(.35) contrast(1.02)}
.print i{position:static;flex:none;padding:12px 0 14px;font-style:normal;font-size:22px;line-height:1.25;letter-spacing:.1em;color:#6a5f45}
.pr-scott{left:980px;top:90px;width:700px;height:500px;rotate:-1.5deg}
.pr-gaz{left:1200px;top:625px;width:640px;height:390px;rotate:1deg}
.pr-moti{left:1560px;top:250px;width:440px;height:600px;rotate:1.8deg}
.print.zoomed{z-index:20;transform:translate(var(--zx),var(--zy)) scale(var(--zs))!important;rotate:0deg;cursor:zoom-out;transition:transform 1s var(--ease),rotate 1s var(--ease)}
.aerial{position:absolute;left:560px;top:100px;width:430px;height:800px;overflow:hidden;box-shadow:0 30px 60px -20px rgba(40,32,10,.45)}
.aerial img{width:100%;height:100%;object-fit:cover;filter:sepia(.45) contrast(1.05);object-position:50% 100%;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28%);mask-image:linear-gradient(180deg,transparent 0,#000 28%)}
.aerial i{position:absolute;left:0;right:0;bottom:0;padding:110px 20px 20px;font-style:normal;font-size:22px;line-height:1.25;letter-spacing:.1em;color:#f3ead6;text-shadow:0 1px 8px rgba(0,0,0,.6);background:linear-gradient(0deg,rgba(28,22,10,.82),rgba(28,22,10,.55) 40%,rgba(28,22,10,0))}
.pr-lut{left:150px;top:190px;width:360px;height:500px;rotate:-1.2deg;z-index:2}
.pr-idx{left:150px;top:610px;width:396px;height:320px;rotate:1.4deg}

/* F4 */
.mores{position:absolute;left:150px;top:300px;transform:none}
.more{font-family:'Marcellus';font-size:120px;line-height:1.2;color:#F2EBDA;letter-spacing:.02em}
.more[data-s]{transform:translateX(-40px);filter:blur(8px);transition:opacity .7s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.more.on{transform:none;filter:none}
.answer{position:absolute;left:150px;top:330px;width:1800px}

/* F5 film */
.film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.film-hint{position:absolute;right:30px;bottom:24px;font-size:16px;letter-spacing:.2em;color:rgba(255,255,255,.0);transition:color .5s}
body:not(.idle) #f5.cur .film-hint{color:rgba(255,255,255,.35)}

.reveal-line{position:absolute;left:0;right:0;bottom:640px;margin:0 auto;width:1500px;text-align:center;font-size:88px;line-height:1.1;text-wrap:balance;text-shadow:0 4px 40px rgba(0,0,0,.55);isolation:isolate}
.reveal-line::before{content:"";position:absolute;inset:-160px -260px;background:radial-gradient(closest-side,rgba(22,20,12,.6),rgba(22,20,12,0));z-index:-1}

/* F7 */
.ticks{list-style:none;margin-top:40px}
.ticks li{font-size:30px;line-height:1.85;color:#EFE8DA;opacity:0;transform:translateX(-20px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.ticks li::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--champ);vertical-align:middle;margin-right:24px}
.on .ticks li{opacity:1;transform:none;transition-delay:var(--d)}
.acc{position:absolute;inset:0;display:flex;background:#000}
.pane{position:relative;flex:1 1 0;min-width:0;overflow:hidden;transition:flex-grow 1.4s var(--easeio);cursor:pointer}
.pane+.pane{box-shadow:inset 3px 0 0 rgba(0,0,0,.55)}
.pane img,.pane video{position:absolute;left:50%;top:0;height:100%;width:2112px;object-fit:cover;transform:translateX(-50%) scale(1.04);transition:transform 6s var(--ease),filter 1.2s;filter:brightness(.6) saturate(.8)}
.pane.open img,.pane.open video{filter:none;transform:translateX(-50%) scale(1)}
/* call 12 Nov: the portrait clips (1056 x 1152) stand full height, centred, on the olive pattern */
/* round 2: the open pane is full screen (the others fold away); .full is set once the arrival strip has shown */
.acc.full .pane{flex-grow:0}
.acc.full .pane.open{flex-grow:1;box-shadow:none}

/* F8 walkway, round 2: the full render as a portrait panel at full height, words on the olive */
.walk-bg{position:absolute;inset:0;background:var(--olive)}
.walk{position:absolute;right:0;top:0;width:864px;height:1152px;overflow:hidden;box-shadow:-30px 0 60px -20px rgba(0,0,0,.45)}
.walk img{width:100%;height:100%;object-fit:cover;display:block}
.walk[data-s]{transform:translateX(60px);transition:opacity 1.6s var(--easeio),transform 1.8s var(--ease)}
.walk.on{transform:none}
.walk-bg[data-s]{transform:none;transition:opacity 1.6s var(--easeio)}

/* F8 masterplan */
.mp{position:absolute;inset:0;background:radial-gradient(90% 80% at 50% 40%,#E7E5DB 0%,#B9BBA6 100%);overflow:hidden}
.mp-view{position:absolute;inset:0;perspective:2200px;perspective-origin:50% 30%}
.mp-plane{position:absolute;left:0;top:0;width:3200px;height:1893px;transform-origin:0 0;transform-style:preserve-3d;will-change:transform}
.mp-img{position:absolute;inset:0;width:100%;height:100%;box-shadow:0 80px 160px rgba(30,40,10,.35)}
.mp-light{position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;background:linear-gradient(120deg,rgba(255,245,220,.0) 20%,rgba(255,240,205,.55) 45%,rgba(255,245,220,0) 70%);background-size:250% 100%;animation:mplight 14s linear infinite}
@keyframes mplight{from{background-position:130% 0}to{background-position:-30% 0}}
.mp-fog{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(226,226,214,.95) 0%,rgba(226,226,214,0) 32%),radial-gradient(120% 80% at 50% 60%,rgba(0,0,0,0) 60%,rgba(40,48,20,.35) 100%)}
.mp-title{position:absolute;left:150px;top:90px;transition:opacity 1s}
.mp.carded .mp-title{opacity:0}
.mp-title .h2{color:var(--olive)}.mp-title .eyebrow{color:var(--copper)}
.pin{position:absolute;width:0;height:0;transform-style:preserve-3d;cursor:pointer}
.pin .stand{position:absolute;left:0;bottom:0;transform-origin:50% 100%;transform:rotateZ(calc(var(--rot) * -1)) rotateX(calc(var(--tilt) * -1));transform-style:preserve-3d}
.pin .stem{position:absolute;left:-1px;bottom:0;width:2px;height:90px;background:linear-gradient(0deg,rgba(184,105,43,.2),var(--copper))}
.pin .disc{position:absolute;left:-36px;bottom:86px;width:72px;height:72px;border-radius:50%;background:var(--olive);color:#F3ECDD;border:2px solid var(--champ);
  font-family:'Marcellus';font-size:32px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.35);transition:transform .5s var(--ease),background .5s}
.pin .lab{position:absolute;left:52px;bottom:30px;white-space:nowrap;font-family:'Marcellus';font-size:42px;color:var(--olive);background:rgba(243,240,230,.92);padding:6px 16px;border-radius:2px;opacity:0;transform:translateX(-10px);transition:opacity .5s,transform .5s}
.pin:hover .lab,.pin.act .lab{opacity:1;transform:none}
.mp.carded .pin.act .lab{opacity:0}
.pin.act .disc{background:var(--copper);transform:scale(1.25)}
/* round 2: the highlight sits flat on the plan, ringing the plan's own number circle (60 px on the plane) */
.pin .mark,.pin .pulse{position:absolute;left:-40px;top:-40px;width:80px;height:80px;border-radius:50%;pointer-events:auto}
.pin .mark{border:4px solid var(--copper);box-shadow:0 0 0 5px rgba(184,105,43,.16);transition:transform .6s var(--ease),border-width .6s,box-shadow .6s,background .6s}
.pin .pulse{border:3px solid var(--copper);opacity:0;animation:pinpulse 2.4s ease-out infinite}
@keyframes pinpulse{from{transform:scale(1);opacity:.85}to{transform:scale(2.1);opacity:0}}
.pin.act .mark{border-width:6px;background:var(--copper);box-shadow:0 0 0 9px rgba(184,105,43,.3),0 0 34px 6px rgba(184,105,43,.55);transform:scale(1.18)}
.pin.act .pulse{animation-duration:1.6s}
.pin .mark i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-style:normal;font-family:'Marcellus';font-size:38px;line-height:1;color:#F3ECDD;opacity:0;transition:opacity .6s}
.pin.act .mark i{opacity:1}
.pin .ring{position:absolute;left:-40px;bottom:-14px;width:80px;height:28px;border-radius:50%;border:2px solid var(--copper);opacity:.7;animation:ring 2.4s ease-out infinite}
@keyframes ring{from{transform:scale(.4);opacity:.9}to{transform:scale(1.8);opacity:0}}
.mp-card{position:absolute;right:70px;top:70px;width:900px;height:900px;background:#111;box-shadow:0 40px 90px rgba(0,0,0,.45);opacity:0;transform:translateX(80px);transition:opacity 1s var(--ease),transform 1.2s var(--ease);pointer-events:none;overflow:hidden}
.mp.carded .mp-card{opacity:1;transform:none;pointer-events:auto}
.mp-card-cap{transition:opacity .35s ease;z-index:2}
.mp-card.swap .mp-card-cap{opacity:0}
.mp-card-img{position:absolute;inset:0;background-size:cover;background-position:50% 50%;opacity:0;transition:opacity .8s ease}
.mp-card-img.vis{opacity:1}
.mp-card-img.go{animation:kb 20s linear forwards}
.mp-card-cap{position:absolute;left:0;right:0;bottom:0;padding:120px 40px 34px;background:linear-gradient(0deg,rgba(20,24,8,.85),rgba(0,0,0,0));color:#F3ECDD}
.mp-card-cap b{display:inline-block;font-family:'Marcellus';font-weight:400;font-size:34px;width:64px;height:64px;border-radius:50%;border:2px solid var(--champ);text-align:center;line-height:60px;margin-right:22px;vertical-align:middle}
.mp-card-cap span{font-family:'Marcellus';font-size:46px;vertical-align:middle;letter-spacing:.03em}

/* F9 round 2: the club's B is the brand monogram (client vector, inline), set at cap height */
.h1 .mono{display:inline-block;height:.72em;width:auto;vertical-align:baseline;margin:0 .02em 0 .06em;filter:drop-shadow(0 2px 30px rgba(0,0,0,.35))}

/* F9 worlds */
.worlds{position:absolute;inset:0;background:var(--olive2)}
.w-head{position:absolute;left:150px;top:90px;width:1700px;transition:opacity .8s}
.w-head .h2{text-wrap:balance}
.w-head .h2{color:#F3ECDD}
.world{position:absolute;inset:0;cursor:pointer;clip-path:inset(var(--t) var(--wr) var(--b) var(--l) round 4px);transition:clip-path 1.3s var(--easeio),opacity .8s var(--wd,0s),z-index 0s 1.3s;z-index:1}
.world.type{cursor:default}
.world.type .wm{background:#4A5720}
.world.type .wl{bottom:auto;top:calc(var(--t) + 40px);width:520px}
.world.type .wl b{font-size:36px}
.world.type .wl span{font-family:'Marcellus';font-size:30px;color:var(--champ)}
.world.nudge .wm{animation:nudge .6s var(--ease)}
@keyframes nudge{40%{filter:brightness(1.25)}}
.world .wm{position:absolute;inset:0;overflow:hidden;background:var(--olive)}
.world .wm img,.world .wm video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:translate(var(--cx),var(--cy)) scale(var(--ws,.66));transition:transform 1.3s var(--easeio),filter 1s;filter:brightness(.8)}
.world .wm::after{content:'';position:absolute;left:0;right:0;bottom:var(--b);height:220px;pointer-events:none;background:linear-gradient(0deg,rgba(10,10,4,.62),rgba(10,10,4,.3) 45%,transparent);transition:opacity .8s}
.world.open .wm::after{opacity:0}
.world .wl{position:absolute;left:calc(var(--l) + 28px);bottom:calc(var(--b) + 24px);width:560px;transition:left 1.3s var(--easeio),bottom 1.3s var(--easeio)}
.world .wl b{display:block;font-family:'Marcellus';font-weight:400;font-size:38px;letter-spacing:.02em;color:#F6EFDF;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.world .wl span{display:block;font-size:24px;line-height:1.4;color:#EDE4D0;margin-top:10px;max-height:0;opacity:0;overflow:hidden;transition:opacity .8s,max-height .8s}
.world.type .wl span{max-height:200px;opacity:1}
.world:hover .wm img{filter:brightness(1)}
.world.open{clip-path:inset(0 0 0 0 round 0);z-index:5;transition:clip-path 1.3s var(--easeio),opacity .8s,z-index 0s}
.world.open .wm img,.world.open .wm video{transform:none;filter:none}
.world.open .wl{left:150px;bottom:150px;width:900px;animation:wlin 1.7s both}
@keyframes wlin{0%,62%{opacity:0}100%{opacity:1}}
.world.closing{clip-path:inset(0 0 0 0 round 0)!important;z-index:4!important;transition:none!important}
.world.open .wl b{font-size:84px}
.world.open .wl span{font-size:34px;max-height:300px;opacity:1}
.world.open::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,18,6,.7),rgba(0,0,0,0) 50%);pointer-events:none;z-index:-0}
.world .wl{z-index:2}
.worlds.has-open .w-head{opacity:0}
.worlds:not(.in) .world{opacity:0}

/* F9 gallery */
.gal{position:absolute;inset:0;background:var(--olive2)}
.g-head{position:absolute;left:150px;top:80px}
.g-head .h2{color:#F3ECDD}
.gi{position:absolute;overflow:hidden;cursor:zoom-in;opacity:0;transform:translateY(30px) scale(.98);transition:opacity 1s var(--ease),transform 1.2s var(--ease);box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.gal.on .gi{opacity:1;transform:none;transition-delay:var(--d)}
.gi img,.gi video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 6s var(--ease)}
.gi:hover img{transform:scale(1.05)}
.gi figcaption{position:absolute;left:0;right:0;bottom:0;padding:70px 22px 18px;font-family:'Marcellus';font-size:28px;letter-spacing:.02em;color:#F6EFDF;text-shadow:0 2px 20px rgba(0,0,0,.5),0 1px 6px rgba(0,0,0,.35);background:linear-gradient(0deg,rgba(10,10,4,.62),rgba(10,10,4,.3) 45%,transparent)}
.gi-a{left:150px;top:250px;width:560px;height:710px}
.gi-b{left:728px;top:250px;width:399px;height:346px}
.gi-c{left:1145px;top:250px;width:399px;height:346px}
.gi-d{left:1562px;top:250px;width:400px;height:346px}
.gi-e{left:728px;top:614px;width:399px;height:346px}
.gi-f{left:1145px;top:614px;width:399px;height:346px}
.gi-g{left:1562px;top:614px;width:400px;height:346px}
.gi.zoomed{z-index:20;transform:translate(var(--zx),var(--zy)) scale(var(--zs))!important;cursor:zoom-out;transition:transform 1s var(--ease)}

/* F10 floor plate */
/* F10 core layout (round 2): the other direction's floorplate animation, champagne line on deep olive */
.cl-svg{position:absolute;left:0;top:0;width:2112px;height:1152px;overflow:visible;filter:drop-shadow(0 0 4px rgba(214,182,118,.38))}
.cl-svg [data-s],.cl-svg [data-s].on{transform:none}
.cl-cam{transform-origin:0 0;transition:transform 1.8s var(--easeio)}
.cl-cam.snap{transition:none}
.cl-cam > *{transition:opacity 1.2s var(--easeio)}
#f10.solo .cl-cam > :not(.res-a):not(.lobby-a):not(.cl-fx){opacity:0;pointer-events:none}
.cl-cam path[stroke]{stroke:#D2B278;stroke-width:1.25px;vector-effect:non-scaling-stroke;stroke-opacity:.9}
.cl-cam #e406{stroke:#E6CA92;stroke-width:2.4px}
#f10.solo .cl-cam #e7{stroke:#E6CA92;stroke-width:2.4px}
.cl-cam g[fill="#bfc2ad"]{fill:rgba(206,174,112,.62)}
.cl-cam g[fill="#ffffff"]{fill:rgba(240,226,192,.55)}
.cl-cam g[fill="#7e4300"]{fill:#F0D394}
.cl-cam .area{fill:rgba(220,205,160,.045)}
.cl-cam.drawin path[stroke]{stroke-dasharray:1;stroke-dashoffset:1;animation:cldraw 1.9s cubic-bezier(.45,0,.25,1) forwards;animation-delay:calc(var(--d,0s) + .5s)}
.cl-cam.drawin g[fill]{opacity:0;animation:clfade 1.4s ease 2s forwards}
@keyframes cldraw{to{stroke-dashoffset:0}}
@keyframes clfade{to{opacity:1}}
.cl-light{opacity:0;transition:opacity 1.3s ease;cursor:pointer}
.cl-light.on{opacity:1}
.cl-light.soft{opacity:.5}
.cl-glow{opacity:0;transform:scale(.7);transform-box:fill-box;transform-origin:center;transition:opacity 1.1s ease,transform 1.1s ease;pointer-events:none}
.cl-glow.on{opacity:1;transform:scale(1)}
.cl-gaps{pointer-events:none}
.cl-gap{transform-box:fill-box;transform-origin:center;animation:clbreathe 5.6s ease-in-out infinite}
@keyframes clbreathe{0%,100%{opacity:.45;transform:scale(.86)}50%{opacity:1;transform:scale(1)}}
.cl-arc{fill:none;stroke:#F0D394;stroke-width:3px;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.cl-arcg.on .cl-arc{stroke-dashoffset:0;transition:stroke-dashoffset 2.6s var(--easeio) 1.5s}
.cl-tick{fill:none;stroke:#D9BB80;stroke-width:2px;vector-effect:non-scaling-stroke;opacity:0}
.cl-arcg.on .cl-tick{opacity:.8;transition:opacity .9s ease 3.6s}
.cl-ld{fill:none;stroke:#D9BB80;stroke-width:2px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.on > .cl-ld{stroke-dashoffset:0;transition:stroke-dashoffset 1s var(--ease) var(--d,0s)}
.cl-dot{fill:#F0D394;opacity:0}
.on > .cl-dot{opacity:1;transition:opacity .6s ease var(--d,0s)}
.clc{position:absolute;font-family:'Marcellus',serif;font-size:42px;line-height:1.12;color:#EFE2C4;white-space:nowrap;text-shadow:0 2px 18px rgba(12,14,4,.8)}
#f10 .h1.champ{color:var(--champ)}
.mat{position:absolute;right:0;top:0;bottom:0;width:560px;overflow:hidden}
.mat[data-s]{transform:translateX(100%);transition:transform 1.6s var(--easeio),opacity 1s}
.mat.on{transform:none}
.mat img{width:100%;height:100%;object-fit:cover;object-position:30% 50%}

/* F11 LiveWell without boxes (R3c, from round2-parts/livewell/proto): stage px, plate = true 16:9 so a 16:9 render shows whole */
#f11 .lw-eb{position:absolute;left:0;right:0;top:150px;text-align:center;font-size:24px;letter-spacing:.26em;margin:0}
#f11 .lw-h{position:absolute;left:0;right:0;top:212px;text-align:center;font-size:92px;line-height:1.08;letter-spacing:.04em}
#f11 .lw-p{position:absolute;left:50%;top:356px;width:1180px;margin:0 0 0 -590px;text-align:center;font-size:34px;line-height:1.5}
#f11 .lw-nm{position:absolute;top:880px;width:340px;margin-left:-170px;text-align:center;font-weight:400;font-size:23px;line-height:1.45;letter-spacing:.2em;color:var(--olive)}
#f11 .lw-eb2{left:150px;top:150px;font-size:24px;letter-spacing:.26em}
#f11 .lw-col{position:absolute;left:150px;top:690px;width:590px}
#f11 .lw-col b{display:block;font-weight:400;font-size:60px;line-height:1.1;letter-spacing:.04em;color:var(--olive)}
#f11 .lw-col span{display:block;font-size:32px;line-height:1.5;color:#4a4a3e;margin-top:22px}
#f11 .lw-plate{position:absolute;left:800px;top:207px;width:1312px;height:738px;overflow:hidden;clip-path:inset(369px 0px 369px 0px);z-index:1}
#f11 .lw-plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.001)}
#f11 .lw-ln{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:5}
#f11 .lw-ln path{fill:none;stroke:var(--copper);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}

/* F12 partners */
.partner-img{position:absolute;right:0;top:0;bottom:0;width:820px;overflow:hidden}
.partner-img img{width:100%;height:100%;object-fit:cover}
.partner.lead-p{position:absolute;left:150px;top:330px;width:1100px}
.role{font-size:24px;letter-spacing:.24em;color:var(--copper);margin-top:20px}
.partners-row{position:absolute;left:150px;top:560px;width:1100px;display:flex;flex-direction:column;gap:34px;transform:none}
.partners-row .partner{border-top:1px solid rgba(62,74,23,.3);padding-top:22px}
.partners-row h3{font-family:'Marcellus';font-weight:400;font-size:44px;color:var(--olive);letter-spacing:.04em}
.partners-row .role{margin-top:8px;font-size:20px}
.partners-row .partner{opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.partners-row.on .partner{opacity:1;transform:none;transition-delay:var(--d)}
#f12.s1 .lead-p{transform:translateY(-140px)}
#f12 .lead-p{transition:opacity .9s var(--ease),transform 1.2s var(--ease)}

/* F13 price (R6): "INR 30,000 psf" is the peak under the plateau, the sentence reads top to bottom; the benefit is the second beat */
.price{position:absolute;inset:0;text-align:center;color:var(--olive)}
.pr-lead{position:absolute;left:0;right:0;top:198px;font-size:48px;color:var(--ink)}
.pr-peak{position:absolute;left:0;right:0;top:392px;line-height:1;white-space:nowrap}
.pr-v{font-size:150px;letter-spacing:.02em}
.pr-u{font-size:64px;margin-left:.1em}
.pr-tail{position:absolute;left:0;right:0;top:574px;font-size:46px;letter-spacing:.22em}
/* R10 (client 13 Nov): the Special Benefit is set like the price above it, same face and size, in orange; the bracket line stays small */
.pr-lead2{top:704px;color:var(--copper)}
.pr-peak2{top:774px;color:var(--copper)}
.pr-ben{position:absolute;left:0;right:0;top:948px}
.pr-note{font-size:32px;color:var(--ink)}

/* FPP payment plan (R6): the client's first table as text on the stone surface, thin rules, no boxes; sized for the back of a 400-seat room */
.pp{position:absolute;left:236px;right:236px;top:54px;color:var(--ink)}
.pp-lab{font-size:30px;letter-spacing:.12em;color:var(--copper);text-align:center}
.pp-h{font-size:56px;line-height:1.15;color:var(--olive);text-align:center;margin-top:8px}
.pp-t{margin-top:26px}
.pp-r{display:grid;grid-template-columns:1fr 560px;align-items:center;border-top:1.5px solid rgba(62,74,23,.3);padding:11px 0}
.pp-r:last-child{border-bottom:1.5px solid rgba(62,74,23,.3)}
.pp-hd{border-top:0;padding:0 0 10px;color:var(--copper)}
.pp-hd .pp-m,.pp-hd .pp-v{font-size:30px;letter-spacing:.12em}
.pp-m{font-size:37px;line-height:1.18;padding-left:28px}
.pp-sub{font-size:27px;line-height:1.25;margin-top:3px;color:rgba(43,43,36,.78)}
.pp-v{font-size:37px;line-height:1.18;text-align:center}
.pp-v.pct{font-size:50px;line-height:1}
.pp-r.em{background:rgba(184,105,43,.09);color:var(--olive)}
.pp-r.em .pp-v{color:var(--copper)}

/* F14 close */
.close{position:absolute;left:180px;right:180px;top:220px;text-align:center;transform:none}
.close-line{font-family:'Marcellus';font-size:58px;line-height:1.35;letter-spacing:.04em;color:#F6EFE0;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.close-line .w{opacity:0;display:inline-block;transform:translateY(12px);filter:blur(6px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s}
.close.on .close-line .w{opacity:1;transform:none;filter:none}
.close .kicker{position:relative;margin-top:30px;font-size:22px}

/* journey line */
#journey{position:absolute;left:0;top:0;z-index:10;pointer-events:none;overflow:visible}
#j-line,.jl{stroke:var(--lc,#B8692B);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke 1.4s}
#j-ghost{stroke:var(--lc,#B8692B);stroke-width:2;opacity:.16;stroke-linecap:round;stroke-linejoin:round;transition:stroke 1.4s,opacity 1s}
#j-tip{fill:var(--lc)}
#j-tip-glow{fill:var(--lc);opacity:.7}
#journey.champ{--lc:#E2B98A}
#journey.copper{--lc:#B8692B}
#journey.quiet{opacity:.55}
#j-drawn path{transition:opacity .4s}
#journey.hide{opacity:0;transition:opacity .4s}
#journey{transition:opacity .6s}
.dropshadow :is(#j-line,.jl){filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}

#foot{position:absolute;left:0;right:0;bottom:14px;z-index:11;text-align:center;font-size:15px;letter-spacing:.2em;color:rgba(246,239,223,.85);text-shadow:0 1px 6px rgba(0,0,0,.85);pointer-events:none;transition:color 1s}
#foot.ink{color:rgba(40,35,25,.8);text-shadow:0 0 6px rgba(255,255,255,.85)}
#black{position:absolute;inset:0;background:#000;z-index:50;opacity:0;pointer-events:none;transition:opacity .8s}
#black.on{opacity:1}
#hud{position:absolute;right:24px;top:18px;z-index:60;font-size:16px;letter-spacing:.2em;color:rgba(255,255,255,.6);background:rgba(0,0,0,.4);padding:6px 12px;display:none}
body.hud #hud{display:block}

/* QC-3 */
.frame.out :is(.reel,.tile,.print,.aerial,.cl-svg,.mat,.sec,.gal,.worlds,.mp,.partner-img,.walk){opacity:0!important;transition:opacity .6s ease!important}
#f9 .gal:has(.gi.zoomed)~.g-head,#f9:has(.gi.zoomed) .g-head{opacity:0;transition:opacity .4s}
#f3:has(.print.zoomed) .blk{opacity:0;transition:opacity .4s}
.aerial{z-index:3}
.pr-idx i,.print i{text-wrap:balance}
.film-hint{display:none}
#foot{width:fit-content;margin:0 auto;padding:2px 12px;border-radius:2px}
#foot{background:transparent;transition:color .6s,background-color .6s}
#foot.ink{background:transparent;transition:color .6s .8s}   /* R10: no box behind the legal line anywhere */
#foot{color:rgba(255,255,255,.92);text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 8px rgba(0,0,0,.6)}
#foot.ink{color:rgba(30,26,18,.88);text-shadow:0 0 5px rgba(255,255,255,.8)}

/* FT the towers rise: canvas plate, SVG line work, labels in the deck's own type */
.tw-cv,.tw-svg{position:absolute;left:0;top:0;width:2112px;height:1152px;pointer-events:none}
.tw-svg{overflow:visible}
.tw-svg path{fill:none;stroke:var(--champ);stroke-linecap:round;stroke-linejoin:round}
.tw-svg .tw-glow path{stroke:#fff1d2}
.tw-lab{position:absolute;left:0;top:0;width:600px;opacity:0;will-change:transform,opacity;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.tw-n{font-family:'Jost';font-weight:400;font-size:22px;letter-spacing:.32em;color:var(--champ);margin-bottom:14px}
.tw-low{width:400px;text-align:center}
.tw-low .tw-n{margin:0;padding-left:.32em}
.tw-f{font-family:'Marcellus';font-size:40px;line-height:1.25;letter-spacing:.04em;color:#F4EFE4;white-space:nowrap}
.frame.out .tw-lab{opacity:0!important;transition:opacity .35s ease!important}

/* F15 the facade (call 12 Nov): lockup 1085 px across BUNGALOWS (svg 1088 px), top of THE at y 388; rule and HERITAGE
   RESIDENCES keep the placement sheet's 26 px gaps below the vector's MAX ESTATES line (bottom at y 714) */
#f15 .fc-scrim{background:radial-gradient(ellipse 1500px 900px at 1056px 560px,rgba(14,18,10,.66) 0,rgba(14,18,10,.42) 70%,rgba(14,18,10,.34) 100%)}
#f15 .fc-scrim[data-s]{transition:opacity .8s var(--easeio)}
#f15 .fc-lock{position:absolute;left:0;right:0;top:388px;color:#F4EFE4}
#f15 .fc-lock .lockup{display:block;width:1088px;height:auto;margin:0 auto}
#f15 .fc-rule{position:absolute;left:936px;top:740px;width:240px;height:2px;background:rgba(244,239,228,.55)}
#f15 .fc-hr{position:absolute;left:0;right:0;top:764px;line-height:1;text-align:center;font-family:'Jost';font-weight:400;font-size:34px;letter-spacing:.34em;padding-left:.34em;color:rgba(244,239,228,.9)}
.frame.out :is(.fc-lock,.fc-rule,.fc-hr){opacity:0!important;transition:opacity .35s ease!important}

/* R3b, the B Club as one move with the line as its cause (Gurleen on the live link, 13 Nov: from the line to the picture
   opening it did not feel seamless). Every step on F9 takes 1.0 s on the line's own easing and starts with the line's
   stretch (deck.js gives the line 1.0 s here). Grid to a world: the tile grows from its place. World to world, world to the
   gallery, gallery to the pool, intro to grid and the arrival from the masterplan: the next picture rises out of the line
   behind a soft 160 px edge while the last one stays still underneath; Back sinks it into the line. Words leave in the
   first third and arrive in the last third. */
@property --rv{syntax:'<number>';inherits:false;initial-value:1}
#f9 .rv{--lb:92px;--up:calc(var(--lb) + (100% + 160px - var(--lb)) * var(--rv));--dn:calc(var(--lb) - (var(--lb) + 40px) * var(--rv));
  -webkit-mask-image:linear-gradient(to top,#000 calc(var(--up) - 160px),transparent var(--up)),linear-gradient(to top,transparent var(--dn),#000 calc(var(--dn) + 40px));
  mask-image:linear-gradient(to top,#000 calc(var(--up) - 160px),transparent var(--up)),linear-gradient(to top,transparent var(--dn),#000 calc(var(--dn) + 40px));
  -webkit-mask-composite:source-in;mask-composite:intersect}
#f9 .par.rv{--lb:122px}
#f9.rise-in{transition:none!important;background:transparent}
#f8.out.under .mp{opacity:1!important;transition:none!important}   /* the settled map stays under the rising clubhouse picture */
#f9 :is(.vidwrap,.shade,.worlds,.gal,.par)[data-s]{transition:opacity 0s}
#f9.stepping :is(.vidwrap,.shade,.worlds,.gal,.par)[data-s]:not(.on){transition:opacity 0s 1s}
#f9 .blk[data-s]{transition:opacity .33s ease,transform 0s .33s}
#f9 .blk[data-s].on{transition:opacity .4s ease .6s,transform .4s var(--ease) .6s}
#f9 .worlds,#f9 .gal{transform-origin:50% 1060px}
#f9 .worlds .world{opacity:1}
#f9 .w-head{transition:none}
#f9 .gi{opacity:1;transform:none;transition:transform 1s var(--ease)}
#f9 .world{transition:clip-path 1s var(--easeio),z-index 0s 1s}
#f9 .world.open{transition:clip-path 1s var(--easeio),z-index 0s}
#f9 .world .wm img,#f9 .world .wm video{transition:transform 1s var(--easeio),filter 1s var(--easeio)}
#f9 .world .wl{transition:left 0s .5s,bottom 0s .5s,width 0s .5s}
#f9 .world .wl b{transition:font-size 0s .5s}
#f9 .world.open .wl{animation:none}
#f9 .world:is(.closing,.sinking){clip-path:inset(0 0 0 0 round 0)}
#f9 .world.closing{z-index:4}
#f9 .world.sinking{z-index:6}
#f9 .world:is(.closing,.sinking) .wm :is(img,video){transform:none;filter:none}
#f9 .world:is(.closing,.sinking) .wm::after{opacity:0}
#f9 .world:is(.closing,.sinking)::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,18,6,.7),rgba(0,0,0,0) 50%);pointer-events:none}
#f9 .world:is(.closing,.sinking) .wl{left:150px;bottom:150px;width:900px}
#f9 .world:is(.closing,.sinking) .wl b{font-size:84px}
#f9 .world:is(.closing,.sinking,.still),#f9 .world:is(.closing,.sinking,.still) :is(.wm img,.wm video,.wl,.wl b),#f9 .world:is(.closing,.sinking,.still) .wm::after{transition:none}

/* R4b/R4c steadiness on weak GPUs (client's Windows laptop): nothing moves at rest on the masterplan, no transform on a playing clip */
.mp-plane,.pin,.pin .stand{transform-style:flat}        /* plan and pins are one flat layer: no coplanar 3D re-sorting */
.pin .pulse,.pin .ring{display:none;animation:none}      /* were infinite pulses on every pin */
.mp-light{animation:none;background-position:50% 0}      /* was a 14 s infinite soft-light sweep repainting the plan */
.pane video,.pane.open video{margin-left:-1056px;transform:none;transition:filter 1.2s}   /* whole-pixel, untransformed clip (was translateX(-50%) scale 1.04 to 1 over 6 s while playing) */

/* R5 touch: phones and tablets only. These elements are made in touch mode only (deck.js, touch section) */
body.touch{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
#t-hint,#t-skip{position:fixed;right:16px;bottom:14px;z-index:70;border-radius:22px;background:rgba(20,18,12,.5);color:rgba(246,239,223,.92);font:400 13px/1 'Jost',sans-serif;letter-spacing:.1em}
#t-hint{padding:8px 15px;pointer-events:none;opacity:0;animation:t-in .8s 1.4s forwards}
#t-hint.away,#t-hint.gone{animation:none;opacity:0;transition:opacity .5s}
@keyframes t-in{to{opacity:1}}
#t-skip{display:none;padding:11px 20px;border:1px solid rgba(246,239,223,.45);font-size:14px}
#t-skip.on{display:block}
#t-play{position:fixed;left:50%;top:50%;z-index:70;display:none;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:rgba(20,18,12,.45);border:1.5px solid rgba(246,239,223,.8)}
#t-play.on{display:block}
#t-play i{position:absolute;left:33px;top:26px;border-style:solid;border-width:15px 0 15px 24px;border-color:transparent transparent transparent rgba(246,239,223,.95)}
#t-rot{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;background:rgba(14,13,10,.86);color:#F6EFDF;font:300 20px/1.3 'Jost',sans-serif;letter-spacing:.06em;text-align:center}
#t-rot span::before{content:'';display:block;width:28px;height:46px;margin:0 auto 18px;border:2px solid currentColor;border-radius:6px;animation:t-turn 2.4s ease-in-out infinite}
@keyframes t-turn{0%,30%{transform:rotate(0)}60%,100%{transform:rotate(-90deg)}}
@media (orientation:portrait) and (max-width:700px){#t-rot{display:flex}#t-hint{display:none}}

/* R7 Architectural authorship (Gurleen 13 Nov, Piyush: the index plan was hiding behind the other prints): the hand-coloured index plan
   is the whole background, as in the first Mac deck; a soft stone wash on the right carries the words; the two other prints sit small
   in the empty paper on the right, clear of the plan's drawing. */
.idxbg{position:absolute;inset:0;overflow:hidden;z-index:0}
.idxbg[data-s]{transform:none;transition:opacity 1.6s var(--easeio)}
.idxbg img{position:absolute;left:-88px;top:0;width:2200px;height:1152px;object-fit:cover;object-position:50% 47%}
.idxbg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(239,233,220,0) 60%,rgba(239,233,220,.84) 68%,rgba(239,233,220,.92) 92%,rgba(239,233,220,.98) 100%)}
.idx-blk{z-index:2}
.idx-blk .h1.xl{font-size:68px}
.idx-blk .lead{text-wrap:balance}
.idx-cap{position:absolute;left:60px;top:1000px;z-index:2;font-style:normal;font-size:22px;letter-spacing:.1em;color:#4a4130;text-shadow:0 0 6px #efe9dc,0 0 12px #efe9dc,0 0 20px #efe9dc,0 0 30px #efe9dc}
#f3 .pr-lut{left:1470px;top:640px;width:250px;height:350px;rotate:-1.2deg;z-index:2}
#f3 .pr-aer{left:1750px;top:660px;width:250px;height:350px;rotate:1.2deg;z-index:2}
#f3 .pr-aer img{object-position:50% 100%;filter:sepia(.45) contrast(1.05)}

/* R8 no text caret, no selection, no focus ring anywhere (see deck.js) */
html,html *{caret-color:transparent!important;outline:none!important;-webkit-user-select:none!important;user-select:none!important}

/* R9 (client 13 Nov): square renders shown whole, zoomed out: the penthouse pool and the tower arrival lobby stand at full height
   in the middle, the same picture softly blurred fills the sides. The picture box is 1152 px square at whole pixels, no transform. */
.pane.whole .bk,.pane.whole.open .bk{filter:blur(42px) brightness(.5) saturate(.85);transform:translateX(-50%) scale(1.16);transition:none}
.pane.whole .fg,.pane.whole.open .fg{width:1152px;left:480px;margin-left:0;transform:none;object-fit:cover;box-shadow:0 0 90px rgba(0,0,0,.55);transition:filter 1.2s}
.pane.whole:not(.open) .fg{left:50%;margin-left:-576px}

/* R9 masterplan (client 13 Nov): the elevated walkway and the courtyard open full screen; the card grows to the whole frame and back */
.mp-card{transition:opacity 1s var(--ease),transform 1.2s var(--ease),right 1.1s var(--easeio),top 1.1s var(--easeio),width 1.1s var(--easeio),height 1.1s var(--easeio)}
.mp.big .mp-card{right:0;top:0;width:2112px;height:1152px;box-shadow:none}
.mp.big .mp-card-cap{padding-bottom:66px}
#foot.side{right:820px}
/* R10 LiveWell: three full-screen renders after the main slide, above the page's own line */
#f11 .lw-full{z-index:3}