/* The image and screen now share ONE transformed plane. No independent card perspective. */
.slide-projector-enabled .hero-visual.circular-hero{overflow:visible;isolation:auto}
.projected-slide-stage{position:relative;width:100%;height:560px;perspective:1600px}
.slide-projector-enabled .projected-slide-stage .projection-plane{left:50%;top:50%;width:min(calc(100% - 72px),920px);height:auto;aspect-ratio:1.9;transform:translate(-50%,-50%) perspective(1600px) rotateX(calc(-8deg + var(--scene-y)*-.45deg)) rotateY(calc(2deg + var(--scene-x)*.6deg));transform-origin:center;transition:transform 1s;opacity:1}
.slide-projector-enabled[data-projector="on"] .projected-slide-stage .projection-plane{opacity:1}
.slide-projector-enabled[data-projector="starting"] .projected-photo{animation:slide-screen-warmup 1.5s ease both}
@keyframes slide-screen-warmup{0%{opacity:0}18%{opacity:.13}31%{opacity:.07}49%{opacity:.5}60%{opacity:.35}100%{opacity:1}}
.slide-projector-enabled .projected-slide-stage .projection-sheet{position:absolute;inset:0;background:#eeeae1;border-radius:3px;opacity:1;overflow:hidden;transform:translateZ(3px);box-shadow:inset 0 0 30px #fff5}
.projected-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:none;border-radius:0;opacity:1}
.slide-projector-enabled[data-projector="off"] .projected-photo{opacity:0}
.slide-projector-enabled .projected-slide-stage .projection-sheet::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,#fff8df14,transparent 45%,#0d091012),repeating-linear-gradient(0deg,#ffffff02 0px,#ffffff02 1px,transparent 1px,transparent 3px);box-shadow:inset 0 0 18px #00000012}
.projected-slide-stage .screen-surface{inset:0;background:linear-gradient(100deg,#fff5e70a,transparent 65%);mix-blend-mode:screen}
.projected-slide-stage .screen-edge{border:1px solid #eee9debb;border-right:3px solid #8b8880;border-bottom:2px solid #b1aca1;border-radius:3px;box-shadow:inset 0 0 0 1px #fff2;transform:translateZ(5px);pointer-events:none}
.projected-slide-stage .screen-thickness{background:#827c71;transform:translate3d(5px,3px,-5px);border-radius:3px;box-shadow:3px 3px 4px #0005}
.slide-advance{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:3px;background:transparent;cursor:pointer;transform:translateZ(7px);padding:0}
.slide-advance:focus-visible{outline:2px solid #fff1c9;outline-offset:7px}
.slide-projector-enabled[data-projector="off"] .projector-slide-controls,.slide-projector-enabled[data-projector="starting"] .projector-slide-controls{visibility:hidden}
.slide-projector-enabled[data-projector="starting"] .projected-slide-stage,.slide-projector-enabled[data-projector="on"] .projected-slide-stage{visibility:visible}
.projector-slide-controls{position:absolute;right:var(--controls-right,20px);bottom:0;display:flex;gap:7px;z-index:3;opacity:.75}
.projector-slide-controls button{width:44px;height:44px;font:inherit;font-size:20px;border:1px solid #fff8e84d;border-radius:50%;color:#fff8e8;background:#14121680;cursor:pointer}
.projector-slide-controls button:hover{background:#fff8e825;opacity:1}
.projector-slide-controls button:focus-visible{outline:2px solid #fff1c9;outline-offset:3px}
.slide-projector-enabled #openingProjector .projection-cast-shadow{left:calc(var(--screen-left) + 30px);top:calc(var(--screen-top) + 12px);transform:translate(calc(12px + var(--scene-x)*-8px + var(--photo-shadow-drift)),calc(8px + var(--scene-y)*-5px));filter:blur(19px);transition:opacity 1.5s,transform 1.4s;opacity:0}
.slide-projector-enabled #openingProjector[data-state="on"] .projection-cast-shadow{opacity:.83}
.slide-projector-enabled #openingProjector[data-state="off"] .projection-cast-shadow{opacity:.5}
.slide-projector-enabled .projection-spill{left:calc(var(--screen-left) + 15%);top:calc(var(--screen-top) - 32px);width:calc(var(--screen-width) + 16%);height:calc(var(--screen-height) + 120px);transform:translate(calc(20px + var(--scene-x)*-12px),calc(var(--scene-y)*-8px));border-radius:25%;filter:blur(42px);mask-image:linear-gradient(90deg,transparent,#000 20%,#000 85%,transparent)}
.slide-projector-enabled #openingProjector[data-state="on"] .projection-spill{opacity:.61}
.slide-projector-enabled .projection-room-light{background:radial-gradient(ellipse at 85% 43%,var(--projection-color-0),transparent 52%),radial-gradient(ellipse at 85% 58%,var(--projection-color-1),transparent 45%)}
.slide-projector-enabled .projection-floor{left:20%;right:0}
.slide-projector-enabled .projector-beam{opacity:0}
.slide-projector-enabled #openingProjector[data-state="on"] .projector-beam{opacity:.42}
.slide-click .projection-sheet{animation:slide-shutter 210ms ease-out}
@keyframes slide-shutter{0%{filter:brightness(.6)}45%{filter:brightness(.88)}100%{filter:brightness(1)}}
@media(max-width:1000px) and (min-width:701px){.projected-slide-stage{height:460px}}
@media(max-width:700px){.projected-slide-stage{height:310px}.slide-projector-enabled .projected-slide-stage .projection-plane{width:calc(100% - 24px);aspect-ratio:1.5;transform:translate(-50%,-50%) perspective(1000px) rotateX(-8deg) rotateY(2deg)}.projector-slide-controls{bottom:0;gap:5px}.projector-slide-controls button{width:40px;height:40px;min-height:44px;min-width:44px}.slide-projector-enabled .projection-spill{left:calc(var(--screen-left) + 14%);filter:blur(28px)}}
@media(prefers-reduced-motion:reduce){.slide-projector-enabled .projected-slide-stage *{animation:none!important;transition:none!important}}

/* Cinema from the far-left middle row: a fixed eye-level camera, not a tilted tablet. */
.slide-projector-enabled .projected-slide-stage{perspective:none;height:560px}
.slide-projector-enabled .projected-slide-stage .projection-plane{width:min(calc(100% - 100px),1060px);aspect-ratio:2.05;transform:translate(-50%,-50%) perspective(1800px) rotateY(-29deg) rotateX(-1deg);transform-origin:center;transition:none}
.slide-projector-enabled .projected-slide-stage .projection-sheet{inset:10px;background:#f2f1eb;border-radius:0;transform:none;box-shadow:inset 0 0 38px #25232a18}
.slide-projector-enabled .projected-slide-stage .projection-sheet::after{background:linear-gradient(90deg,#fff9e91c,transparent 30%,#08071024),repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 3px);box-shadow:inset 0 0 24px #00000016}
.projected-slide-stage .screen-surface{transform:none;border-radius:0;background:linear-gradient(90deg,#fff9e912,transparent 40%,#0000000c);mix-blend-mode:soft-light}
.projected-slide-stage .screen-edge{border:10px solid #09090b;border-radius:0;transform:none;box-shadow:inset 0 0 3px #000,0 0 0 1px #ffffff0c;z-index:2}
.projected-slide-stage .screen-thickness{background:#060608;transform:translate3d(2px,1px,-3px);border-radius:0;box-shadow:6px 4px 12px #0009}
.slide-advance{transform:none;border-radius:0;z-index:3}
.screen-corner{position:absolute;width:0;height:0;pointer-events:none}
.screen-corner.tl{left:0;top:0}.screen-corner.tr{right:0;top:0}.screen-corner.br{right:0;bottom:0}.screen-corner.bl{left:0;bottom:0}
.slide-projector-enabled #openingProjector{background:radial-gradient(ellipse at 64% 40%,#28252c 0%,#151419 58%,#0d0c10 100%)}
.slide-projector-enabled #openingProjector .projection-cast-shadow{left:0;top:0;width:100%;height:100%;border-radius:0;transform:translate(42px,9px);filter:blur(16px);background:#010103;transition:opacity 1.5s}
.slide-projector-enabled #openingProjector[data-state="off"] .projection-cast-shadow{opacity:.8}
.slide-projector-enabled #openingProjector[data-state="on"] .projection-cast-shadow{opacity:.86}
.slide-projector-enabled .projection-spill{left:calc(var(--screen-left) + 8%);top:calc(var(--screen-top) - 34px);width:calc(var(--screen-width) + 14%);height:calc(var(--screen-height) + 110px);transform:translate(40px,4px);filter:blur(52px);border-radius:18%;mask-image:linear-gradient(90deg,transparent,#000 35%,#000 80%,transparent)}
.slide-projector-enabled #openingProjector[data-state="on"] .projection-spill{opacity:.36}
.slide-projector-enabled .projection-room-light{background:radial-gradient(ellipse at 90% 46%,var(--projection-color-0),transparent 57%),radial-gradient(ellipse at 80% 62%,var(--projection-color-1),transparent 50%)}
.slide-projector-enabled .projection-floor{opacity:0!important}
.slide-projector-enabled #openingProjector[data-state="on"] .projector-beam{opacity:.22}
@media(max-width:1000px) and (min-width:701px){.slide-projector-enabled .projected-slide-stage{height:440px}.slide-projector-enabled .projected-slide-stage .projection-plane{width:calc(100% - 65px);transform:translate(-50%,-50%) perspective(1400px) rotateY(-27deg) rotateX(-1deg)}}
@media(max-width:700px){.slide-projector-enabled .projected-slide-stage{height:280px}.slide-projector-enabled .projected-slide-stage .projection-plane{width:calc(100% - 24px);aspect-ratio:1.8;transform:translate(-50%,-50%) perspective(850px) rotateY(-25deg) rotateX(-1deg)}.slide-projector-enabled .projected-slide-stage .projection-sheet{inset:5px}.projected-slide-stage .screen-edge{border-width:5px}.slide-projector-enabled #openingProjector .projection-cast-shadow{transform:translate(22px,5px);filter:blur(12px)}}
/* Centered, pointer-controlled screen: one shared image/surface/corner geometry. */
body.slide-projector-enabled .projected-slide-stage .projection-plane{transform:translate(-50%,-50%) perspective(1800px) rotateY(calc(var(--scene-x)*16deg)) rotateX(calc(var(--scene-y)*-9deg));will-change:transform}
body.slide-projector-enabled .hero-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0;width:100%}
body.slide-projector-enabled .hero-copy h1{width:100%;text-align:center}
body.slide-projector-enabled .projector-switch-row{justify-content:center;margin:14px auto 0}
body.slide-projector-enabled .projector-slide-controls{left:50%;right:auto;transform:translateX(-50%);bottom:0}
body.slide-projector-enabled .projected-slide-stage .projection-sheet::after{background:radial-gradient(ellipse at calc(35% + var(--scene-x)*24%) calc(45% + var(--scene-y)*20%),#fff6df20,transparent 65%),linear-gradient(90deg,#fff9e911,transparent 35%,#08071018);box-shadow:inset 0 0 24px #00000016}
body.slide-projector-enabled .projected-slide-stage .screen-surface{background:linear-gradient(calc(100deg + var(--scene-x)*24deg),#fff5db14,transparent 45%,#00000014);opacity:calc(.8 + var(--scene-x)*.2)}
body.slide-projector-enabled #openingProjector .projection-cast-shadow{transform:translate(calc(42px + var(--scene-x)*18px),calc(9px + var(--scene-y)*12px));transition:opacity 1.5s}
body.slide-projector-enabled #openingProjector[data-state="on"] .projector-beam{opacity:calc(.22 + var(--scene-x)*.06)}
@media(max-width:700px){body.slide-projector-enabled .projected-slide-stage .projection-plane{transform:translate(-50%,-50%) perspective(850px) rotateY(calc(var(--scene-x)*12deg)) rotateX(calc(var(--scene-y)*-7deg))}body.slide-projector-enabled #openingProjector .projection-cast-shadow{transform:translate(calc(22px + var(--scene-x)*10px),calc(5px + var(--scene-y)*8px))}}
@media(prefers-reduced-motion:reduce){body.slide-projector-enabled .projected-slide-stage .projection-plane{will-change:auto}}
/* A suspended light-transmitting screen, not a panel attached to a wall. */
body.slide-projector-enabled #openingProjector .projection-cast-shadow{display:none!important}
body.slide-projector-enabled .projected-slide-stage .screen-thickness{display:none}
body.slide-projector-enabled .projected-slide-stage .screen-edge{display:none;border:0;box-shadow:none}
body.slide-projector-enabled .projected-slide-stage .projection-sheet{inset:0}
body.slide-projector-enabled #openingProjector::after{background:linear-gradient(180deg,#08080c33,transparent 26%,transparent 80%,#08080c22)}
body.slide-projector-enabled .projection-room-light{filter:blur(34px);background:radial-gradient(ellipse at calc(30% + var(--scene-x)*15%) 15%,var(--projection-color-0),transparent 70%),radial-gradient(ellipse at 90% 45%,var(--projection-color-1),transparent 65%),radial-gradient(ellipse at 50% 100%,var(--projection-color-2),transparent 75%);mix-blend-mode:screen}
body.slide-projector-enabled #openingProjector[data-state="on"] .projection-room-light{opacity:.66}
body.slide-projector-enabled .projection-spill{inset:-14% -12%;width:124%;height:135%;transform:translate(calc(var(--scene-x)*22px),calc(var(--scene-y)*14px));filter:blur(68px);border-radius:0;mask-image:none;mix-blend-mode:screen}
body.slide-projector-enabled .spill-echo{filter:saturate(1.6) brightness(.85);transition:opacity .8s}
body.slide-projector-enabled .spill-echo.is-current{opacity:.85}
body.slide-projector-enabled #openingProjector[data-state="on"] .projection-spill{opacity:.76}
body.slide-projector-enabled #openingProjector[data-state="on"] .projector-beam{opacity:calc(.46 + var(--scene-x)*.1)}
body.slide-projector-enabled .hero-copy h1{display:flex;justify-content:center;align-items:baseline;white-space:nowrap;gap:0}
body.slide-projector-enabled .projector-period{display:inline-flex;vertical-align:baseline;position:relative;width:.32em;height:.32em;min-width:44px;min-height:44px;border:0;border-radius:50%;padding:0;margin:0 0 0 -.015em;background:none;box-shadow:none;font-size:inherit;letter-spacing:normal;align-self:baseline;transform:translateY(.035em)}
body.slide-projector-enabled .projector-period::before{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);width:.105em;height:.105em;min-width:10px;min-height:10px;box-shadow:0 0 18px #ff352ba0,inset 0 1px 2px #ffd5ce99}
body.slide-projector-enabled .projector-period:active::before{transform:translateX(-50%) scale(.9)}
body.slide-projector-enabled .projector-period[aria-pressed="true"]::before{box-shadow:0 0 25px #ffe8aeb0,inset 0 1px 2px #fff9}
body.slide-projector-enabled .slide-click .projection-sheet{animation:projector-slide-flutter .28s ease-out}
@keyframes projector-slide-flutter{0%{filter:brightness(.72);transform:translateY(1px)}22%{filter:brightness(.92);transform:translateY(-1px)}44%{filter:brightness(.8);transform:translateY(.5px)}68%{filter:brightness(1.06);transform:translateY(-.3px)}100%{filter:brightness(1);transform:none}}
@media(prefers-reduced-motion:reduce){body.slide-projector-enabled .slide-click .projection-sheet{animation:none!important}}
/* Fine film grain over the room's light field, keeping the photographs crisp. */
body.slide-projector-enabled #openingProjector::before{content:"";position:absolute;inset:0;z-index:9;pointer-events:none;background:url('assets/projector-grain.svg') repeat;background-size:192px 192px;mix-blend-mode:soft-light;opacity:.2}
body.slide-projector-enabled .projector-period[aria-pressed="false"]::before{animation:projector-standby-pulse 2.4s ease-in-out infinite}
@keyframes projector-standby-pulse{0%,100%{box-shadow:0 0 8px #ff352b66,inset 0 1px 2px #ffd5ce99;filter:brightness(.88)}50%{box-shadow:0 0 22px #ff352bd0,0 0 38px #ff352b44,inset 0 1px 2px #ffd5ce99;filter:brightness(1.16)}}
@media(prefers-reduced-motion:reduce){body.slide-projector-enabled .projector-period::before{animation:none!important}}
/* First-use cue: attached to the dot, independent of the folding letters. */
body.slide-projector-enabled .projector-play-hint{position:absolute;left:50%;top:calc(100% + 7px);transform:translateX(-50%);white-space:nowrap;font-family:Arial,sans-serif;font-size:11px;font-weight:400;font-style:normal;line-height:1.4;letter-spacing:.035em;color:#4c403b;text-transform:none;pointer-events:none;opacity:.85;transition:opacity .25s ease}
body.slide-projector-enabled .play-hint-dismissed .projector-play-hint{opacity:0;visibility:hidden}
body.slide-projector-enabled .projector-period[aria-pressed="false"]::before{animation:projector-standby-pulse 2.4s ease-in-out 1}
@media(prefers-reduced-motion:reduce){body.slide-projector-enabled .projector-period[aria-pressed="false"]::before{animation:none!important}.projector-play-hint{transition:none!important}}