/* Shared EGOHEAD motion, with each product's own accent tokens. */
.cursor-ribbon{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:80;mix-blend-mode:difference;contain:strict;display:none}
.motion-media{--media-x:0px;--media-y:0px;--media-rx:0deg;--media-ry:0deg;--media-blur:0px;transform:perspective(1100px) rotateX(var(--media-rx)) rotateY(var(--media-ry));transform-style:preserve-3d;isolation:isolate}
.motion-media>img{transform:translate3d(var(--media-x),var(--media-y),0) scale(1.035);filter:blur(var(--media-blur));transition:filter .12s;will-change:transform}
.project:hover .motion-media>img{transform:translate3d(var(--media-x),var(--media-y),0) scale(1.06)}
.motion-media:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(135deg,#ffffff00,#ffffff16 40%,#ffffff00 70%);opacity:0;transition:opacity .6s;z-index:6}.media-hover:after{opacity:1}
.zest-live{background:#262A30!important}.zest-live>img{opacity:.19;filter:blur(9px);transform:scale(1.12)!important}.zest-live .art-word{font-family:ui-serif,'New York',Georgia,serif;font-size:clamp(60px,7vw,105px);letter-spacing:-3px;color:#F5F3EE;mix-blend-mode:normal;z-index:5;top:25px}.zest-live .project-go{z-index:8}.zest-live .art-label{color:#F0EAD6;z-index:5}.puzzle-preview{position:absolute;height:65%;aspect-ratio:1;left:50%;top:56%;transform:translate3d(calc(-50% + var(--media-x)),calc(-50% + var(--media-y)),0) rotate(-3deg);display:grid;grid-template-columns:repeat(3,1fr);gap:3px;border-radius:17px;padding:5px;background:#2D323A;box-shadow:0 25px 50px #0005;filter:blur(var(--media-blur));overflow:visible}.puzzle-preview i{background-size:300% 300%;border-radius:5px;box-shadow:0 3px 8px #0003;display:block;aspect-ratio:1}.preview-caption{position:absolute;bottom:27px;right:25px;font-size:9px;letter-spacing:1px;color:#F17C5A}.screen-reel{min-height:600px}.project-art.screen-reel{min-height:0}.screen-reel .reel-frame{position:absolute!important;height:92%!important;width:auto!important;max-width:90%;object-fit:contain;top:50%;left:50%;border-radius:15px;transform:translate(-50%,-50%)!important;filter:blur(var(--media-blur,0px));transition:filter .12s;animation:screen-reel 18s infinite both;animation-delay:calc(var(--reel-index) * -6s)}
@keyframes screen-reel{0%,26%{opacity:1;scale:1}32%,92%{opacity:0;scale:.965}98%,100%{opacity:1;scale:1}}
.hero-visual:not(.screen-reel)>img{animation:media-float 8s ease-in-out infinite}.gallery figure:nth-child(2)>img{animation:media-float 9s ease-in-out -3s infinite}.gallery figure:nth-child(3)>img{animation:media-float 10s ease-in-out -6s infinite}
@keyframes media-float{0%,100%{translate:0 0;rotate:-.7deg}50%{translate:0 -11px;rotate:.7deg}}
/* Keep glyph descenders visible at every reveal position; opacity and transform animate the words. */
.word-mask{display:inline-block;vertical-align:bottom;padding:.12em .035em .3em;margin:-.12em -.035em -.3em;overflow:visible;line-height:inherit}/* Padding belongs on the transformed glyph layer too: Safari/Chrome may rasterize
   that layer to its own bounds even when the outer word mask allows overflow.
   Negative margins preserve wrapping; content-box preserves reveal distance. */
.scroll-word{display:inline-block;padding:.18em .08em .34em;margin:-.18em -.08em -.34em;overflow:visible;transform-box:content-box;transform-origin:50% 100%;will-change:transform,opacity;line-height:inherit}.scroll-heading{overflow:visible}.scroll-copy{opacity:.25;transform:translateY(22px);filter:blur(3px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1),filter .7s ease}.copy-visible{opacity:1;transform:none;filter:none}
.motion-controls{display:flex;justify-content:flex-end;margin:15px 0 0}.motion-toggle{background:none;border:1px solid var(--line,#20212330);color:var(--muted,#626166);padding:12px 17px;border-radius:24px;font:500 12px system-ui;min-height:44px;cursor:pointer}.motion-toggle:focus-visible{outline:3px solid var(--accent,#706088);outline-offset:5px}.personal-page>.motion-controls{margin:20px 4.4%}
.motion-paused .cursor-ribbon{display:none}.motion-paused .scroll-word{opacity:1!important;transform:none!important;filter:none!important}.motion-paused .scroll-copy{opacity:1;transform:none;filter:none}.motion-paused .motion-media,.motion-paused .motion-media>img,.motion-paused .puzzle-preview i{transform:none!important;animation:none!important}.motion-paused .puzzle-preview{transform:translate(-50%,-50%)}.motion-paused .screen-reel .reel-frame{animation:none!important;opacity:0;transform:translate(-50%,-50%)!important}.motion-paused .screen-reel .reel-frame:first-of-type{opacity:1}.motion-paused .hero-visual>img{animation:none!important;translate:0;rotate:0}
@media(max-width:900px){.screen-reel{min-height:535px}}@media(max-width:600px){.screen-reel{min-height:514px}.preview-caption{display:none}.zest-live .art-word{font-size:72px}.puzzle-preview{height:62%;top:56%}.motion-media{transform:none!important}.motion-controls{justify-content:flex-start}.hero-visual:not(.screen-reel)>img{animation-duration:10s}}
@media(hover:none),(pointer:coarse){.cursor-ribbon{display:none}}
@media(prefers-reduced-motion:reduce){.cursor-ribbon{display:none}.scroll-word{opacity:1!important;transform:none!important;filter:none!important}.scroll-copy{opacity:1;transform:none;filter:none;transition:none}.motion-media,.motion-media>img{transform:none!important;animation:none!important}.screen-reel .reel-frame{animation:none;opacity:0;transform:translate(-50%,-50%)!important}.screen-reel .reel-frame:first-of-type{opacity:1}.puzzle-preview{transform:translate(-50%,-50%)}.puzzle-preview i{transform:none!important}.hero-visual>img{translate:0;rotate:0}}

.cursor-wake{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:80;contain:strict}.motion-paused .cursor-wake{display:none}@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.cursor-wake{display:none}}

/* Flat image frames, independently moving depth planes, and an entry wipe. */
.depth-media{position:relative;isolation:isolate;--depth-reveal:1;--media-x:var(--depth-front-x,0px);--media-y:var(--depth-front-y,0px);transform:none!important}.depth-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;border-radius:inherit}.depth-ready>img{opacity:0!important;transform:none!important;animation:none!important}.depth-media:not(.depth-settled){translate:0 calc((1 - var(--depth-reveal))*24px)}.depth-media.depth-fallback>img{clip-path:inset(0 0 calc((1 - var(--depth-reveal))*100%) 0);scale:calc(1 + (1 - var(--depth-reveal))*.05)}.depth-media .project-go,.depth-media .art-word,.depth-media .art-label{z-index:5}.depth-media .klar-orbit{translate:var(--depth-back-x,0px) var(--depth-back-y,0px)}.depth-media .puzzle-preview{translate:var(--depth-front-x,0px) var(--depth-front-y,0px)}.depth-media.screen-reel{clip-path:inset(0 0 calc((1 - var(--depth-reveal))*100%) 0 round 24px)}.depth-media.screen-reel .reel-frame{translate:var(--depth-front-x,0px) var(--depth-front-y,0px)}.depth-media.zest-live{clip-path:inset(0 0 calc((1 - var(--depth-reveal))*100%) 0 round 24px)}.depth-media.zest-live>img{translate:var(--depth-back-x,0px) var(--depth-back-y,0px)}.portrait.depth-media>span{z-index:2}
@media(prefers-reduced-motion:reduce){.depth-media{translate:none!important;clip-path:none!important}.depth-media>img{clip-path:none!important;scale:1!important}.depth-media .klar-orbit,.depth-media .puzzle-preview,.depth-media.screen-reel .reel-frame{translate:none!important}}.motion-paused .depth-media{translate:none!important;clip-path:none!important}.motion-paused .depth-media>img{clip-path:none!important;scale:1!important}.motion-paused .depth-media .klar-orbit,.motion-paused .depth-media .puzzle-preview,.motion-paused .depth-media.screen-reel .reel-frame{translate:none!important}

/* Reel centering is structural, independent of optional pointer/depth variables. */

@media(prefers-contrast:more){.scroll-copy{opacity:1;transform:none;filter:none}.scroll-word{opacity:1!important;transform:none!important;filter:none!important}}