body.stereo-page { background: #fff; }
.stereo-main { width: min(1080px, calc(100% - 96px)); margin: 28px auto 110px; }
.stereo-back { display: inline-block; color: #333; text-decoration: none; margin-bottom: 32px; }
.stereo-back:hover { text-decoration: underline; text-underline-offset: 3px; }
.stereo-main .project-header { padding: 34px 0 56px; }
.stereo-main .project-header h1 { margin: 0; }
.stereo-series { display: flex; flex-direction: column; gap: clamp(80px, 13vw, 170px); }
.stereo-work { position: relative; width: 100%; margin: 0 auto; touch-action: pan-y pinch-zoom; user-select: none; }
.stereo-work.is-portrait { width: min(680px, 100%); }
.stereo-work > img { display: block; width: 100%; height: auto; -webkit-user-drag: none; }
.stereo-work > canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.stereo-work:focus-visible { outline: 1px solid #666; outline-offset: 6px; }
.stereo-main .stereo-statement { margin-top: clamp(120px, 18vw, 240px); }
.stereo-statement:has(> :empty):not(:has(p)) { display: none; }
.stereo-main .stereo-statement .project-text { margin-top: 0; margin-bottom: 0; }
@media (max-width: 700px) {
  .stereo-main { width: calc(100% - 32px); margin: 22px auto 72px; }
  .stereo-main .project-header { padding: 28px 0 40px; }
  .stereo-series { gap: 76px; }
}
