/* Motion edition: split type / mechanical shutters / floating photographic strips. */
html{scroll-padding-top:40px}.intro-large h1{animation:none;perspective:900px;overflow:visible}.motion-letter{display:inline-block;transform-origin:50% 85%;will-change:transform;backface-visibility:hidden}.intro-large h1 .hand-marked{white-space:nowrap}.motion-on .intro-large h1 .hand-underline{transform-origin:left;animation:pencil-in 1.1s .55s cubic-bezier(.16,1,.3,1) both}
.motion-on .cover-meta{animation:meta-in .7s .15s both}.motion-on .intro-details{animation:meta-in 1s .4s both}.motion-on .header{animation:meta-in .7s both}
@keyframes pencil-in{from{clip-path:inset(0 100% 0 0);transform:rotate(-2deg)}to{clip-path:inset(-20px);transform:none}}
@keyframes meta-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.portfolio-section{position:relative;isolation:isolate;padding-top:55px;padding-bottom:150px;perspective:1800px}.category-heading{position:relative;z-index:2}.category-heading h3{overflow:visible;clip-path:none;transform:none}.category-heading .hand-marked{transform-origin:0 100%;display:inline-block}.carousel-viewport{transform-origin:50% 50%;backface-visibility:hidden}.motion-on .carousel-viewport{will-change:transform,clip-path}.motion-on .category-heading .hand-underline{clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.16,1,.3,1)}.motion-on .portfolio-section.in-scene .hand-underline{clip-path:inset(-20px)}
.chapter-echo{position:absolute;z-index:-1;right:var(--gutter);top:-.17em;font-family:var(--display);font-size:clamp(180px,30vw,490px);font-weight:600;line-height:1;letter-spacing:-.08em;color:transparent;-webkit-text-stroke:1px rgba(238,233,227,.12);pointer-events:none;user-select:none;transform-origin:right center}
.motion-on .category-heading:before{content:'';position:absolute;top:-1px;left:0;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.16,1,.3,1)}.motion-on .in-scene .category-heading:before{transform:scaleX(1)}
.motion-on .carousel-slide button{isolation:isolate}.motion-on .carousel-slide button:before{content:'';position:absolute;inset:0;z-index:2;background:var(--paper);transform:scaleY(0);transform-origin:top;pointer-events:none}.motion-on .strip-revealed .carousel-slide button:before{animation:shutter-open 1.2s cubic-bezier(.77,0,.18,1) both;animation-delay:calc(var(--lane,0)*85ms)}
@keyframes shutter-open{0%{transform:scaleY(1)}100%{transform:scaleY(0)}}
.motion-rail{position:fixed;right:12px;top:40%;height:140px;width:2px;background:rgba(255,255,255,.16);z-index:20;pointer-events:none}.motion-rail:before{content:'';position:absolute;inset:0;transform:scaleY(var(--journey,0));transform-origin:top;background:var(--accent)}.motion-rail span{position:absolute;right:9px;top:-25px;color:var(--accent);font:10px var(--mono)}
.nav-shutters{position:fixed;inset:0;z-index:80;pointer-events:none;display:grid;grid-template-columns:repeat(5,1fr);visibility:hidden}.nav-shutters.playing{visibility:visible}.nav-shutters i{display:block;background:#b6ef39;transform:scaleY(0);transform-origin:bottom}.nav-shutters.playing i{animation:nav-cut .7s cubic-bezier(.76,0,.24,1) both;animation-delay:calc(var(--lane)*35ms)}
@keyframes nav-cut{0%{transform:scaleY(0);transform-origin:bottom}46%{transform:scaleY(1);transform-origin:bottom}47%{transform-origin:top}100%{transform:scaleY(0);transform-origin:top}}
.instagram{perspective:1000px}.instagram p{transform-origin:left center}.contact{perspective:1100px}.contact h2{overflow:visible}.contact h2>span:not(.contact-arrow){transform-origin:0 50%;will-change:transform}.viewer{overflow:hidden}.viewer[open]{animation:viewer-iris .65s cubic-bezier(.16,1,.3,1) both}.viewer-image{perspective:1200px}.viewer-image img{transform-origin:50% 50%}
@keyframes viewer-iris{from{clip-path:polygon(45% 0,55% 0,55% 100%,45% 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}
.carousel-controls button{position:relative;overflow:hidden}.carousel-controls button:hover{transform:translateY(-3px);box-shadow:3px 3px 0 rgba(182,239,57,.25)}.carousel-controls button:active{transform:translateY(0);box-shadow:none}.work-cue span{animation:cue-travel 2.5s cubic-bezier(.65,0,.35,1) infinite}
@keyframes cue-travel{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}
@media(max-width:760px){.portfolio-section{padding-top:26px;padding-bottom:80px}.chapter-echo{font-size:44vw;top:-10px;-webkit-text-stroke-color:rgba(238,233,227,.1)}.motion-rail{display:none}.nav-shutters{grid-template-columns:repeat(5,1fr)}}
@media(prefers-reduced-motion:reduce){.motion-letter,.carousel-viewport,.category-heading .hand-marked,.chapter-echo,.instagram p,.contact h2>span{transform:none!important;opacity:1!important;clip-path:none!important}.motion-on .category-heading .hand-underline{clip-path:none}.nav-shutters,.motion-rail{display:none}.motion-on .carousel-viewport,.motion-letter,.contact h2>span{will-change:auto}}

body{overflow-x:clip}
