/* Spatial hero: CSS geometry, local assets, natural scroll. */
.spatial-scene{--scene-progress:0;--pointer-x:0;--pointer-y:0;--light-x:55%;--light-y:32%;--shadow-x:15px;--shadow-y:25px;perspective:1200px;animation:none!important;isolation:isolate}
.spatial-heading{position:absolute;top:12px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:6;font-size:7px;letter-spacing:.13em;color:#b7bdac}
.spatial-heading .spatial-pause{position:static;font-size:8px;letter-spacing:0;min-height:30px}
.spatial-light{position:absolute;inset:-20%;pointer-events:none;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#d6e56b26,transparent 43%);opacity:calc(1 - var(--scene-progress) * .3);z-index:-1}
.spatial-grid{position:absolute;inset:35% -10% -7%;background:linear-gradient(#d6e56b16 1px,transparent 1px),linear-gradient(90deg,#d6e56b16 1px,transparent 1px);background-size:38px 38px;transform:perspective(650px) rotateX(64deg) rotateZ(calc(-18deg + var(--pointer-x) * 5deg + var(--scene-progress) * 9deg)) translateY(calc(var(--pointer-y) * 9px));mask-image:radial-gradient(ellipse,#000 15%,transparent 72%);pointer-events:none;z-index:-1}
.spatial-camera{position:absolute;inset:0;perspective:1100px;transform:translateY(calc(var(--scene-progress) * 55px)) scale(calc(1 - var(--scene-progress) * .17));transform-origin:50% 60%}
.architecture{position:absolute;left:52%;top:49%;width:300px;height:400px;transform:translate(-50%,-50%) translate3d(calc(var(--pointer-x) * 9px),calc(var(--pointer-y) * 6px),0) scale(calc(1 - var(--scene-progress) * .16));opacity:calc(1 - var(--scene-progress) * .6);pointer-events:none}
.architecture-model{position:absolute;width:280px;height:330px;left:10px;top:5px;transform-style:preserve-3d;transform:rotateX(calc(-19deg - var(--pointer-y) * 7deg)) rotateY(calc(-32deg + var(--pointer-x) * 14deg + var(--scene-progress) * 12deg));transform-origin:50% 70%;}
.architecture-tower{position:absolute;left:50px;top:225px;width:180px;height:36px;transform-style:preserve-3d}
.architecture-floor{--floor:0;position:absolute;inset:0;transform-style:preserve-3d;transform:translateY(calc(var(--floor) * -34px))}
.architecture-floor:nth-child(2){--floor:1}.architecture-floor:nth-child(3){--floor:2}.architecture-floor:nth-child(4){--floor:3}.architecture-floor:nth-child(5){--floor:4;transform:translateY(-136px) translateX(7px) scaleX(.92)}.architecture-floor:nth-child(6){--floor:5;transform:translateY(-170px) translateX(13px) scaleX(.85)}.architecture-floor:nth-child(7){--floor:6;transform:translateY(-204px) translateX(20px) scaleX(.77)}
.architecture-floor>i{position:absolute;display:block;backface-visibility:hidden;border-top:5px solid #e1e2cf;border-bottom:3px solid #a9b09a;background:repeating-linear-gradient(90deg,transparent 0 21px,#e4e5d38c 21px 24px),linear-gradient(130deg,#8b9c9280,#334d4b 55%,#b6c8ac);box-shadow:inset 0 2px #fff4}
.architecture-floor .face-front{width:180px;height:36px;transform:translateZ(65px);filter:brightness(calc(.95 + var(--pointer-x) * .2))}
.architecture-floor .face-right{width:130px;height:36px;left:25px;transform:rotateY(90deg) translateZ(90px);filter:brightness(calc(.65 + var(--pointer-x) * .2))}
.architecture-floor .face-left{width:130px;height:36px;left:25px;transform:rotateY(-90deg) translateZ(90px);filter:brightness(calc(.8 - var(--pointer-x) * .2))}
.architecture-floor .face-top{width:180px;height:130px;top:-47px;transform:rotateX(90deg) translateZ(18px);border:0;background:linear-gradient(135deg,#f3f2ec,#c5cdb4);box-shadow:inset 0 0 0 5px #eef0e4}
.architecture-floor:last-child .face-top{background:linear-gradient(90deg,#cad38c 0 30%,#6c7959 30% 70%,#cad38c 70%);box-shadow:inset 0 0 0 9px #e3e6d5}
.architecture-plinth{position:absolute;width:280px;height:220px;left:0;top:150px;transform:rotateX(90deg);background:linear-gradient(120deg,#929d7e,#d6e56b 52%,#7f8c60);box-shadow:0 0 0 5px #d6e56b25,0 0 35px #d6e56b20;outline:1px solid #e3ebba;border-radius:12px}
.architecture-shadow{position:absolute;left:0;top:275px;width:290px;height:90px;border-radius:50%;background:radial-gradient(ellipse,#0008,transparent 70%);transform:translate(var(--shadow-x),var(--shadow-y)) rotate(-18deg) scaleX(1.25);filter:blur(12px)}
.architecture-tree{position:absolute;top:245px;width:16px;height:24px;border-radius:60% 60% 45% 45%;background:radial-gradient(ellipse at 35% 20%,#b5c47e,#526b4d 65%);box-shadow:0 8px 0 -6px #aaa583;transform:translateZ(85px)}
.tree-one{left:25px}.tree-two{left:235px}.tree-three{left:251px;top:229px;transform:translateZ(-45px)}
.architecture-caption{position:absolute;bottom:22px;left:0;width:100%;text-align:center;font-size:6px;letter-spacing:.18em;color:#aeb99e}
.spatial-panel{position:absolute;display:block;border-radius:11px;box-shadow:var(--shadow-x) var(--shadow-y) 50px #0005;border:1px solid #f3f2ec44;transition:box-shadow .3s,border-color .3s;background:var(--ivory);color:var(--ink);padding:11px;transform-style:flat}
.spatial-panel>span{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:7px;font-weight:600;letter-spacing:.1em;margin-bottom:10px}.spatial-panel>span i{font-style:normal;font-size:12px}.spatial-panel>img{width:100%;height:100px;object-fit:cover;object-position:50% 15%;border-radius:4px;display:block}.spatial-panel>strong{display:block;font-size:14px;letter-spacing:-.035em;margin:11px 0 5px}.spatial-panel>small{display:block;font-size:7px;line-height:1.5;color:#555e4d}
.spatial-property{left:0;top:70px;width:35%;transform:translate3d(calc(var(--pointer-x) * 19px + var(--scene-progress) * 3px),calc(var(--pointer-y) * 14px + var(--scene-progress) * 135px),25px) rotateY(calc(8deg + var(--pointer-x) * 4deg)) rotateZ(calc(-7deg + var(--scene-progress) * 7deg));z-index:3}
.spatial-brochure{right:-1%;top:230px;width:31%;transform:translate3d(calc(var(--pointer-x) * 28px - var(--scene-progress) * 5px),calc(var(--pointer-y) * 20px - var(--scene-progress) * 25px),50px) rotateY(calc(-12deg + var(--pointer-x) * 5deg)) rotateZ(calc(8deg - var(--scene-progress) * 8deg));z-index:4}
.spatial-brochure>img{height:auto;aspect-ratio:1364/845;object-fit:contain}.spatial-brochure>strong{font-size:13px}
.spatial-api{left:5%;bottom:52px;width:47%;background:#151719f5;color:var(--ivory);border-color:#d6e56b65;padding:18px;transform:translate3d(calc(var(--pointer-x) * 35px + var(--scene-progress) * 105px),calc(var(--pointer-y) * 25px - var(--scene-progress) * 70px),65px) rotateY(calc(5deg + var(--pointer-x) * 4deg)) rotateZ(calc(-4deg + var(--scene-progress) * 4deg));z-index:5}
.spatial-api>span{color:var(--citrus);margin-bottom:13px}.spatial-api code{display:block;font:11px/1.9 Consolas,monospace}.spatial-api code>b{color:var(--citrus)}.spatial-api code>em{font-style:normal;color:#afb7a5;font-size:9px}.spatial-api>small{color:#b8c0af;margin-top:10px}
.spatial-panel:hover{border-color:var(--citrus);box-shadow:var(--shadow-x) var(--shadow-y) 60px #0007,0 0 0 2px #d6e56b33}.spatial-panel:focus-visible{outline:2px solid var(--citrus);outline-offset:5px}
.spatial-scene .hero-scene-label{bottom:0;font-size:6px;letter-spacing:.1em}.hero-scene-label>a{color:var(--citrus)}
.journey-stage{--arrival:1}.journey-stage .journey-object{transform:translateY(calc((1 - var(--arrival)) * 35px)) scale(calc(.94 + var(--arrival) * .06));transform-origin:center}
@media(max-width:1100px) and (min-width:801px){.architecture{left:51%;transform:translate(-50%,-50%) scale(.86)}.spatial-property{width:39%;top:65px}.spatial-brochure{width:35%;top:230px;right:3%}.spatial-api{width:56%;left:0;bottom:35px}.spatial-panel>strong{font-size:12px}.spatial-api code{font-size:10px}}
@media(max-width:800px){.spatial-scene{margin-top:12px}.spatial-heading{top:0;font-size:6px}.spatial-heading .spatial-pause{font-size:7px}.spatial-camera{transform:none}.architecture{top:48%;left:51%;transform:translate(-50%,-50%) scale(.78);opacity:1}.spatial-grid{inset:35% -10% 0;transform:perspective(650px) rotateX(64deg) rotateZ(-18deg)}.spatial-property{top:45px;width:35%;transform:rotate(-6deg);padding:8px}.spatial-property>img{height:80px}.spatial-brochure{top:185px;right:0;width:32%;padding:8px;transform:rotate(7deg)}.spatial-panel>span{font-size:5px;margin-bottom:6px}.spatial-panel>strong{font-size:11px;margin:8px 0 4px}.spatial-panel>small{font-size:6px}.spatial-api{width:48%;left:2%;bottom:38px;padding:12px;transform:rotate(-3deg)}.spatial-api code{font-size:9px}.spatial-api code>em{font-size:7px}.spatial-scene .hero-scene-label{font-size:5px;bottom:0}.journey-stage .journey-object{transform:none}}
@media(max-width:480px){.architecture{transform:translate(-50%,-50%) scale(.67);top:46%;left:53%}.spatial-property{width:39%;top:48px}.spatial-brochure{width:36%;top:180px}.spatial-api{width:59%;bottom:34px}.spatial-property>img{height:73px}.spatial-scene .hero-scene-label{letter-spacing:.03em}}
@media(prefers-reduced-motion:reduce){.spatial-camera,.journey-stage .journey-object{transform:none!important}.spatial-panel{transition:none}.spatial-grid{transform:perspective(650px) rotateX(64deg) rotateZ(-18deg)}.spatial-pause{display:none!important}}