/* Shared page navigation: the camera travels through a lit abstract corridor. */
.depth-flight { position:fixed; inset:0; z-index:10000; overflow:hidden; pointer-events:none; opacity:0; background:#190e20; contain:strict; }
.depth-flight canvas { display:block; width:100%; height:100%; }
.depth-logo { position:absolute; top:50%; left:50%; display:block; width:clamp(108px,18vw,210px); height:auto; transform:translate(-50%,-50%); object-fit:contain; filter:drop-shadow(0 4px 24px rgba(0,0,0,.5)); will-change:transform; }
.depth-caption { position:absolute; top:72%; left:50%; width:min(75%,640px); transform:translate(-50%,-50%); text-align:center; color:#fff7ee; text-shadow:0 2px 28px #120c21; }
.depth-caption span { display:block; margin-bottom:12px; font-size:10px; font-weight:750; letter-spacing:.24em; color:#d9b39e; }
.depth-caption strong { display:block; font-family:Georgia,serif; font-size:clamp(23px,3vw,40px); font-weight:400; line-height:1.2; }
.depth-leaving #app { transform-origin:50% 45vh; animation:depth-away .95s cubic-bezier(.7,0,.3,1) both; will-change:transform,opacity; }
.depth-arriving #app { transform-origin:50% 45vh; animation:depth-return .48s ease-out both; }
.depth-arriving { background:#190e20; }
@keyframes depth-away { 0% { transform:scale(1); opacity:1; } 35% { opacity:.4; } 100% { transform:scale(.91); opacity:0; } }
@keyframes depth-return { from { transform:scale(1.045); opacity:0; } to { transform:scale(1); opacity:1; } }
@media(max-width:600px) { .depth-caption { width:82%; top:73%; } .depth-caption span { font-size:9px; letter-spacing:.18em; } }
@media(prefers-reduced-motion:reduce) { .depth-flight { display:none; } .depth-leaving #app,.depth-arriving #app { animation:none; transform:none; opacity:1; } }