/* Cinematic 2.5D: photo-textured hinged glazing, recessed portal, camera dolly. */
.architecture-journey { height:340svh; }
.journey-sticky { background:radial-gradient(ellipse at 50% 30%,#203544,#07111b 72%); }
.journey-scene { perspective:none; }
.cinema-house { position:absolute; width:max(100vw,177.683svh); aspect-ratio:1672/941; left:50%; top:50%; margin:0; transform:translate(-50%,-50%) scale(var(--camera-scale,1)); transform-origin:50% 55%; opacity:var(--house-opacity,1); will-change:transform,opacity; }
.house-exterior { position:absolute; inset:0; background:url('../assets/effects/house-cinematic-v4.png') center/cover no-repeat; clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,32.2% 37.6%,32.2% 72%,67.6% 72%,67.6% 37.6%,32.2% 37.6%); }
.house-portal { position:absolute; left:32.2%; top:37.6%; width:35.4%; height:34.4%; perspective:1200px; transform-style:preserve-3d; }
.portal-recess { position:absolute; inset:0; display:grid; place-items:center; background:linear-gradient(90deg,#0b1117,#20323b 14%,#102532 50%,#20323b 86%,#0b1117); box-shadow:inset 0 0 38px 16px #000b; border:5px solid #292820; }
.portal-recess::before { content:""; position:absolute; inset:7% 9%; border:1px solid #cf9b5960; box-shadow:0 -3px 20px #d5933424; }
.portal-recess::after { content:""; position:absolute; left:0; right:0; bottom:0; height:16%; background:linear-gradient(#7a6140,#28333b); clip-path:polygon(10% 0,90% 0,100% 100%,0 100%); opacity:.5; }
.portal-emblem { width:68%; opacity:var(--inner-logo,0); filter:drop-shadow(0 4px 8px #0008); }
.portal-emblem img { width:100%; height:auto; }
.glass-leaf { position:absolute; top:0; bottom:0; width:50%; background-image:url('../assets/effects/house-cinematic-v4.png'); background-size:564.972% 290.698%; border:2px solid #363931; box-shadow:inset 0 0 0 1px #a5987140,0 12px 24px #0007; backface-visibility:hidden; transform-style:preserve-3d; }
.glass-leaf::after { content:""; position:absolute; inset:0; background:linear-gradient(120deg,#cee6ff14,transparent 38%,#d9edff22 55%,transparent 65%); border-right:3px solid #1a211f; }
.leaf-left { left:0; background-position:39.125% 57.317%; transform-origin:left center; transform:rotateY(calc(-1 * var(--door-angle,0deg))); }
.leaf-right { right:0; background-position:60.632% 57.317%; transform-origin:right center; transform:rotateY(var(--door-angle,0deg)); }
.portal-lintel { position:absolute; top:-2%; left:-1%; right:-1%; height:3%; background:linear-gradient(#141918,#8d7853,#1e2423); box-shadow:0 3px 12px #000a; }
.cinema-vignette { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,#03101b99,transparent 38%,transparent 72%,#06101bbf); }
.journey-copy { top:14%; left:7%; max-width:520px; }
.journey-copy h2 { font-size:clamp(2.1rem,4.2vw,4rem); text-shadow:0 4px 22px #000; }
.journey-copy>span { font-size:10px; }
.cinema-brand { position:absolute; top:16%; left:50%; width:min(530px,60vw); transform:translateX(-50%); opacity:var(--brand-opacity,0); }
.cinema-brand img { width:100%; height:auto; }
.concept-caption { position:absolute; bottom:11%; right:5%; color:#ffffffa6; font-size:8px; letter-spacing:1.6px; opacity:var(--house-opacity,1); }
.journey-final { bottom:13%; padding:22px 32px; transform:translate(-50%,var(--arrival-y,24px)); }
.journey-final h2 { font-size:clamp(1.9rem,3.3vw,3rem); }
.journey-final a { margin-top:12px; }
.journey-status { font-size:10px; }
@media(max-width:768px) { .architecture-journey { height:300svh; } .cinema-house { width:max(155vw,155svh); } .journey-copy { top:17%; left:6%; } .journey-copy h2 { font-size:2.4rem; } .journey-copy p { max-width:260px; } .cinema-brand { top:23%; width:82vw; } .journey-final { bottom:13%; padding:20px 16px; } .journey-final h2 { font-size:2rem; } .journey-status { gap:10px; font-size:8px; } .concept-caption { bottom:12%; font-size:6px; } }
@media(prefers-reduced-motion:reduce) { .architecture-journey { height:100svh; min-height:650px; } .cinema-house,.concept-caption,.journey-copy { display:none; } .cinema-brand { opacity:1; } .journey-final { opacity:1; visibility:visible; transform:translateX(-50%); } }