/* Mobile uses the same pinned crossfade and dimensional gate as desktop.
   Extra document-scroll distance reveals all copy before/after the transition. */
@media(max-width:900px),(max-height:650px){
 .motion-ready .profiles{height:var(--profiles-height,290svh)}
 .motion-ready .profile-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header) - 74px);min-height:0;overflow:hidden;perspective:1600px}
 .motion-ready .profile-panel{position:absolute;inset:0 0 auto;display:flex;flex-direction:column;align-items:stretch;max-width:100%;width:100%;height:100%;min-height:0;margin:0;padding:12px clamp(20px,5vw,44px) 36px;transform-style:preserve-3d;will-change:transform,opacity,filter}
 .motion-ready .profile-virtual{opacity:calc(1 - var(--cross));transform:translateX(calc(var(--cross)*-10vw)) translateZ(calc(var(--cross)*-200px)) rotateY(calc(var(--cross)*-9deg));filter:blur(calc(var(--cross)*6px));pointer-events:var(--virtual-pointer,auto)}
 .motion-ready .profile-real{opacity:var(--cross);transform:translateX(calc((1 - var(--cross))*12vw)) translateZ(calc((1 - var(--cross))*-160px)) rotateY(calc((1 - var(--cross))*10deg));filter:blur(calc((1 - var(--cross))*6px));pointer-events:var(--real-pointer,none)}
 .motion-ready .profile-panel .profile-visual{order:-1;flex:0 0 auto;width:100%;height:clamp(160px,30svh,300px);min-height:0;max-height:none;margin:0;align-self:stretch;mask-image:linear-gradient(0deg,transparent,#000 7%,#000 94%,transparent)}
 .motion-ready .profile-panel .profile-visual img{width:100%;height:100%;object-fit:contain;object-position:center;max-width:100%}
 .motion-ready .profile-panel .real-visual{clip-path:none;filter:none;transform:none;transition:none}
 .motion-ready .profile-panel .profile-copy{width:100%;padding:0;margin-top:16px;min-width:0;min-height:0;flex:1 1 auto;overflow:hidden;overflow-wrap:anywhere}
 .motion-ready .artist-copy .profile-body{transform:translateY(var(--virtual-read-y,0px))}
 .motion-ready .person-copy .profile-body{transform:translateY(var(--real-read-y,0px))}
 .motion-ready .profile-panel .artist-copy h2{font-size:clamp(36px,9vw,60px);line-height:1.2;letter-spacing:.06em;margin:16px 0 24px}
 .motion-ready .profile-panel .person-copy h2{font-size:clamp(28px,7.5vw,44px);line-height:1.3;letter-spacing:.06em;margin:16px 0}
 .motion-ready .profile-panel .artist-statement{font-size:13px;line-height:2;letter-spacing:.01em}
 .motion-ready .profile-panel .artist-statement p+p{margin-top:18px}
 .motion-ready .profile-panel .statement-ending{font-size:17px;line-height:1.9;margin-top:24px}
 .motion-ready .profile-panel .person-message{font-size:13px;line-height:2}
 .motion-ready .profile-panel .person-subtitle{font-size:19px;line-height:1.5;margin-bottom:20px}
 .motion-ready .profile-panel .profile-facts{gap:0 18px;margin-top:24px}
 .motion-ready .dimension-gate{display:block;position:absolute;inset:-20% -10%;pointer-events:none;z-index:10;opacity:var(--gate);transform:perspective(900px) rotateY(calc((var(--cross) - .5)*40deg)) scale(calc(.55 + var(--cross)*.65));filter:drop-shadow(0 0 20px #d5e8ff70)}
 .dimension-gate>span{position:absolute;inset:0 25%;border-radius:50%;border:1px solid #e6f2ffbf;box-shadow:inset 10px 0 45px #8bb9ec40,15px 0 90px #b4d1f52b,-20px 0 60px #d4e8ff40;background:radial-gradient(ellipse at center,transparent 55%,#b9d7fc24 62%,#e7f4ff70 63%,transparent 65%);backdrop-filter:blur(4px)}
 .dimension-gate>i{position:absolute;inset:10% 30%;border:1px solid #e3efff80;border-radius:50%;transform:rotate(20deg) scaleX(.45)}
 .motion-ready .profile-chapters{display:flex;align-items:center;justify-content:center;gap:12px;position:absolute;bottom:8px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);white-space:nowrap;font:8px var(--mono);letter-spacing:.1em;color:#a8b9cf;z-index:15}
 .profile-chapters .chapter-line{width:52px;height:1px;background:linear-gradient(90deg,#dcecff calc(var(--cross)*100%),#45566a calc(var(--cross)*100%))}
 .profile-chapters .chapter-real{font-family:var(--sans)}
}
@media(max-height:500px) and (min-width:601px){
 .motion-ready .profile-stage{height:calc(100svh - var(--header) - 24px)}
 .motion-ready .profile-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding:12px 5vw 32px;align-items:start}
 .motion-ready .profile-panel .profile-visual{height:calc(100svh - var(--header) - 70px);grid-row:1;min-height:150px}
 .motion-ready .profile-virtual .profile-visual{grid-column:2}.motion-ready .profile-virtual .profile-copy{grid-column:1;grid-row:1}
 .motion-ready .profile-real .profile-visual{grid-column:1}.motion-ready .profile-real .profile-copy{grid-column:2;grid-row:1}
 .motion-ready .profile-panel .profile-copy{height:100%;margin-top:0;padding-top:0}
}

/* Equal mobile image frames and a closer artist crop. Copy remains scroll-revealed. */
@media(max-width:600px){.motion-ready .profile-panel .profile-visual{height:clamp(230px,38svh,340px)}.motion-ready .profile-panel .virtual-visual img{width:100%;height:100%;object-fit:cover;object-position:50% 0%;max-width:100%;margin:0}.motion-ready .profile-panel .real-visual img{width:100%;height:100%;object-fit:contain;object-position:center bottom}.duality-artist-photo img{object-fit:cover;object-position:50% 34%}}

/* Match mobile portrait origins, reserve reading space above the dock. */
@media(max-width:600px){
 .motion-ready .profile-stage{height:calc(100svh - var(--header) - 86px)}
 .motion-ready .profile-panel{padding-top:22px;padding-bottom:40px}
 .motion-ready .profile-panel .profile-visual{height:clamp(220px,35svh,310px);mask-image:linear-gradient(0deg,transparent,#000 8%,#000 97%,transparent)}
 .motion-ready .profile-panel .virtual-visual img{object-position:50% 0%}
 .motion-ready .profile-panel .real-visual img{padding-top:18px;object-fit:cover;object-position:50% 0%;box-sizing:border-box}
 .motion-ready .profile-panel .profile-copy{margin-top:18px}
 .motion-ready .profile-chapters{bottom:10px}
}
/* Raise both subjects inside their frames, keeping a clear margin above the head. */
@media(max-width:600px){.motion-ready .profile-stage{height:calc(100svh - var(--header) - 100px)}.motion-ready .profile-panel .virtual-visual img{object-position:50% 12%}.motion-ready .profile-panel .real-visual img{padding-top:6px;object-position:50% 0%}}
