/* The physical hanger and knob are transparent image assets. Only the card
   rotates: its transform origin is the center of the stationary door knob. */
body:has(.not-found-scene) #main{padding-top:88px}
.not-found-scene{
 --hanger-height:clamp(460px,74svh,680px);
 background:var(--navy);color:var(--sand);min-height:calc(100svh - 88px);
 position:relative;display:flex;flex-direction:column;align-items:center;
 justify-content:center;padding:22px 24px 38px;overflow:hidden;
}
.not-found-stage{height:var(--hanger-height);width:calc(var(--hanger-height) * .666667);position:relative;flex-shrink:0}
.not-found-hanger{position:absolute;inset:0;transform-origin:50.1% 17.77%;animation:hotel-hanger-sway 4.8s ease-in-out infinite;will-change:transform}
.not-found-card{width:100%;height:100%;object-fit:contain;filter:drop-shadow(8px 16px 12px #0005)}
.not-found-domain{position:absolute;top:6%;left:25%;width:50%;text-align:center;color:var(--ink);font:500 12px/1.2 var(--sans);letter-spacing:.015em}
.not-found-copy{position:absolute;top:31%;left:25%;width:50%;color:#111}
/* Reference: small serif 404 immediately above tightly set, regular sans copy.
   Sizes scale with the physical card, so the composition survives resizing. */
.not-found-code{color:#111;font:400 calc(var(--hanger-height) * .05)/1 Georgia,'Times New Roman',serif;letter-spacing:-.045em;margin:0}
.not-found-copy h1{color:#111;font:400 calc(var(--hanger-height) * .06)/.98 Arial,Helvetica,sans-serif;letter-spacing:-.06em}
.not-found-copy h1 span{display:block;margin-top:calc(var(--hanger-height) * .03);font:inherit;font-size:calc(var(--hanger-height) * .058)}
.not-found-curly-arrow{position:absolute;top:60.5%;left:50%;width:27%;height:auto;pointer-events:none}
.not-found-brand{position:absolute;bottom:4.5%;left:calc(50% - 26px);width:52px;height:52px;object-fit:contain}
.not-found-knob{position:absolute;z-index:2;width:24%;height:auto;left:38.1%;top:9.77%;filter:drop-shadow(2px 12px 7px #0008);pointer-events:none}
.not-found-actions{display:flex;justify-content:center;position:relative;margin-top:18px}
.not-found-properties.btn{position:absolute;top:75%;left:50%;transform:translateX(-50%);width:46%;background:#a7e0fd;color:var(--ink);border-color:#a7e0fd;border-radius:999px;min-height:38px;padding:9px 8px;font-size:13px;text-align:center;transition:background .2s}
.not-found-properties.btn:hover{background:#d2efff;border-color:#d2efff;transform:translateX(-50%)}
.not-found-hanger:focus-within{animation-play-state:paused}
.not-found-home{color:#d3e3e7;font:400 12px/1.5 var(--sans);text-decoration:underline;text-underline-offset:4px}
.not-found-home:hover{color:#fff}
.not-found-scene a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.not-found-home:focus-visible{outline-color:#a7e0fd}
.not-found-static .not-found-hanger,.animations-disabled .not-found-hanger{animation:none;transform:rotate(-5deg);will-change:auto}
@keyframes hotel-hanger-sway{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}
@media(max-width:1050px){body:has(.not-found-scene) #main{padding-top:80px}.not-found-scene{min-height:calc(100svh - 80px)}}
@media(max-width:640px){
 body:has(.not-found-scene) #main{padding-top:74px}
 .not-found-scene{--hanger-height:clamp(460px,70svh,550px);min-height:calc(100svh - 74px);padding:24px 16px 38px}
 .not-found-domain{font-size:10px}
}
@media(max-width:360px){.not-found-scene{--hanger-height:460px}}
@media(prefers-reduced-motion:reduce){.not-found-hanger{animation:none;transform:rotate(-5deg);will-change:auto}.not-found-properties.btn{transition:none}}
