/* Header stays in normal flow; the full 16:9 room begins below it without a zoom crop. */
.hero-room{background:#640910;color:#fff0f3;isolation:isolate}
.portrait-stage{--portrait-x:50%;--portrait-y:45%;position:relative;overflow:hidden}
.portrait-plane{position:relative;min-height:max(780px,56.25vw);isolation:isolate;background:radial-gradient(ellipse at 48% 35%,#810e15,#4e060c 100%)}
.room-background{position:absolute;inset:0;z-index:0;display:block;pointer-events:none}
.portrait-image{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center top}
.room-copy{position:relative;z-index:3;width:40%;max-width:570px;margin-left:6%;padding:58px 0 68px;transform:perspective(1400px) rotateY(2deg) skewY(-.5deg);transform-origin:left center;text-shadow:1px 2px 3px #310308b3}
.hero-room .eyebrow{font-size:10px;letter-spacing:.12em;color:#f3c8d4;line-height:1.7;margin-bottom:22px}
.hero-room h1{font-size:clamp(58px,5.35vw,86px);line-height:.99;color:#fff0f3;letter-spacing:-.047em;text-shadow:1px 2px 0 #551015,3px 5px 12px #2c030966}
.hero-room h1 em{color:#ffb0ca}
.hero-room .hero-description{max-width:520px;margin-top:26px;font-size:17px;line-height:1.6;color:#f5dae2}
.hero-room .hero-description p+p{margin-top:14px}
.hero-room .hero-description strong{font-weight:700;color:#fff3f7}
.hero-room .hero-description .hero-adult-note{padding:16px 18px;border:1px solid #ff91b478;border-left:3px solid #ff91b4;background:#19080cb3;color:#fff0f3;font-style:italic}
.hero-room .hero-actions{margin-top:26px;gap:28px;flex-wrap:wrap;align-items:center}
.hero-room .button-light{background:transparent;border-color:#f5aec79e;color:#fff0f5;padding:13px 21px;min-height:52px;text-shadow:1px 1px 2px #310308}
.hero-room .button-light:hover{background:#ff91b414;border-color:#fff0f5}
.hero-room .text-link{color:#ffd5e3}
.hero-room .hero-actions .text-link{border-bottom:1px solid #f5aec780}
.hero-room :focus-visible{outline-color:#ffb0ca}

.room-effects{position:absolute;inset:0;z-index:2;pointer-events:none}
.portrait-entry-marker{position:absolute;left:72%;top:35%;width:2px;height:2px;opacity:0}
.portrait-glow,.portrait-wisp,.portrait-reflection{position:absolute;pointer-events:none}
.portrait-glow{inset:0;opacity:0;mix-blend-mode:screen;background:radial-gradient(ellipse 12% 29% at 56% 40%,#ff629a9c,transparent 75%),radial-gradient(ellipse 12% 27% at 89% 38%,#ff629a9c,transparent 75%),radial-gradient(ellipse 22% 18% at 74% 69%,#ff679ecc,transparent 76%)}
.portrait-wisp{opacity:0;border-radius:50%;mix-blend-mode:screen;background:radial-gradient(ellipse at 48% 75%,#ff9ec16b,transparent 66%);filter:blur(7px)}
.portrait-wisp::before{content:"";position:absolute;inset:6% 27%;border-left:2px solid #ffc1d97a;border-radius:50%;transform:rotate(13deg);filter:blur(2px)}
.portrait-wisp-left{left:49%;top:25%;width:15%;height:42%}
.portrait-wisp-right{right:3%;top:23%;width:15%;height:42%}
.portrait-wisp-trunk{left:62%;top:53%;width:24%;height:32%}
.portrait-reflection{inset:0;z-index:1;opacity:0;background:radial-gradient(circle at var(--portrait-x) var(--portrait-y),#ffd7e712,transparent 56%);transition:opacity .25s}
.portrait-stage.is-tracking .portrait-reflection{opacity:1}
.haunted-portrait.is-awake .portrait-glow{animation:portrait-spectral-light 3s ease-in-out both}
.haunted-portrait.is-awake .portrait-wisp{animation:portrait-rising-wisp 2.6s ease-out both}
.haunted-portrait.is-awake .portrait-wisp-right{animation-delay:.16s}
.haunted-portrait.is-awake .portrait-wisp-trunk{animation-delay:.28s}
@keyframes portrait-spectral-light{0%,100%{opacity:0}30%{opacity:.78}65%{opacity:.43}}
@keyframes portrait-rising-wisp{0%{opacity:0;transform:translateY(10%) scale(.92)}25%{opacity:.65}100%{opacity:0;transform:translateY(-24%) scale(1.08)}}

/* Tall compositions leave real wall above the figure, with content-driven room height. */
@media(max-width:1100px){
 .portrait-plane{min-height:0;padding-bottom:88vw;transform:none}
 .portrait-image{top:auto;bottom:0;height:auto;object-fit:contain;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000)}
 .room-copy{width:min(600px,calc(100% - 88px));max-width:none;margin:0 auto;padding:44px 0 12px;transform:none}
 .hero-room h1{font-size:clamp(54px,6.8vw,72px)}
 .hero-room .hero-description{max-width:600px}
 .hero-room .hero-actions{flex-direction:row}
 .room-effects{top:auto;bottom:0;height:150vw}
 .portrait-entry-marker{left:50%;top:55%}
 .portrait-glow{background:radial-gradient(ellipse 20% 20% at 27% 63%,#ff629a9c,transparent 75%),radial-gradient(ellipse 19% 22% at 77% 64%,#ff629a9c,transparent 75%),radial-gradient(ellipse 33% 14% at 51% 80%,#ff679ecc,transparent 76%)}
 .portrait-wisp-left{left:12%;top:52%;width:29%;height:31%}
 .portrait-wisp-right{right:9%;top:54%;width:28%;height:29%}
 .portrait-wisp-trunk{left:28%;top:75%;width:40%;height:17%}
}
@media(max-width:600px){
 .portrait-plane{padding-bottom:133vw}
 .room-copy{width:calc(100% - 48px);padding:34px 0 8px}
 .hero-room .eyebrow{font-size:9px;letter-spacing:.08em;margin-bottom:18px}
 .hero-room h1{font-size:clamp(46px,12.4vw,68px)}
 .hero-room .hero-description{font-size:16px;line-height:1.6;margin-top:22px}
 .hero-room .hero-description p+p{margin-top:13px}
 .hero-room .hero-actions{gap:21px;margin-top:24px}
 .hero-room .button-light{font-size:14px;gap:26px;min-height:48px;padding:12px 16px}
 .hero-room .hero-actions .text-link{font-size:14px}
 .room-effects{height:calc(100vw * 2030 / 680)}
 .portrait-entry-marker{top:61%}
 .portrait-glow{background:radial-gradient(ellipse 22% 13% at 18% 69%,#ff629a9c,transparent 75%),radial-gradient(ellipse 20% 15% at 80% 69%,#ff629a9c,transparent 75%),radial-gradient(ellipse 36% 10% at 51% 82%,#ff679ecc,transparent 76%)}
 .portrait-wisp-left{left:4%;top:59%;width:30%;height:23%}
 .portrait-wisp-right{right:3%;top:59%;width:27%;height:23%}
 .portrait-wisp-trunk{left:26%;top:76%;width:44%;height:15%}
}
@media(prefers-reduced-motion:reduce){
 .portrait-plane{transform:none!important;transition:none!important}
 .portrait-wisp,.portrait-reflection{display:none}
 .haunted-portrait.is-awake .portrait-glow{animation:none!important;opacity:.3}
}
