/* One authored sequence: real work unfolds, becomes a focused preview, then gives way to the brief. */
.cinema-opening{--scene-height:clamp(450px,49vw,710px);padding-top:56px;overflow:clip}.opening-intro{display:grid;grid-template-columns:1.2fr 1fr;align-items:end;gap:55px;padding-bottom:42px}.opening-intro h1{font-size:clamp(44px,5.5vw,78px);font-weight:750;letter-spacing:-.035em;line-height:1.22}.opening-intro h1 span{display:block;white-space:nowrap}.opening-description{padding-bottom:4px}.opening-description>p{font-size:17px;color:#b5b5b5;line-height:1.8}.opening-description>p br:last-child{display:none}.opening-description .hero-actions{margin-top:25px}.opening-runway{position:relative}.opening-sticky{position:relative;padding-top:12px}.opening-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px}.opening-toolbar .showcase-tabs{justify-content:flex-start;margin:0;gap:12px}.opening-toolbar .showcase-tabs button{font-size:15px;padding:10px 16px;position:relative}.opening-toolbar [aria-selected=true]::after{content:"";position:absolute;bottom:-2px;height:2px;left:0;width:100%;background:#fff;transform-origin:left;transform:scaleX(0)}.opening-sticky[data-playing=true] [aria-selected=true]::after{animation:preview-time 7s linear both}.preview-playback{border:0;background:transparent;color:#bbb;min-height:44px;font-size:12px;display:flex;align-items:center;gap:15px;padding:8px 0 8px 12px;white-space:nowrap}.preview-playback span{font-size:17px}.preview-playback:hover{color:#d7ff00}.scene-stage{height:var(--scene-height);position:relative;perspective:1600px;padding:0;margin-top:8px}.artifact-position{position:absolute;top:30px;left:50%;width:64%;max-width:800px;transform:translateX(-50%)}.artifact-main{z-index:3}.artifact-main .artifact-motion{transform:rotateX(13deg) scale(.92);transform-origin:center top}.artifact-entrance{opacity:1;transform:none;filter:none}.artifact-motion{transform-style:preserve-3d}.artifact-left,.artifact-right{width:36%;max-width:440px;top:95px;z-index:1}.artifact-left .artifact-motion{transform:translateX(-100%) translateY(10px) rotateY(22deg) rotateZ(-9deg) scale(.88);transform-origin:right center}.artifact-right .artifact-motion{transform:translateX(100%) translateY(10px) rotateY(-22deg) rotateZ(9deg) scale(.88);transform-origin:left center}.supporting-work{display:block;background:#1b1b1b;border-radius:12px;overflow:hidden;box-shadow:0 26px 55px #0008;outline:1px solid #ffffff24}.supporting-work img{width:100%;height:auto;aspect-ratio:1265/737;object-fit:cover;object-position:top}.supporting-work>span{font-size:15px;display:block;padding:15px 18px}.supporting-work small{display:block;font-size:11px;color:#b2b2b2;margin-top:3px}.cinema-opening .browser-frame{transform:none;animation:none;transition:none;border-radius:12px;border-color:#444;background:#191919;box-shadow:0 35px 65px #0009}.cinema-opening .browser-chrome{font-size:11px;padding:12px 16px}.preview-window{display:block;aspect-ratio:1265/737;overflow:hidden;background:#171d17;position:relative}.preview-scroll-track{width:100%;transform:translateY(0)}.cinema-opening .preview-scroll-track img{display:block;width:100%;height:auto;aspect-ratio:auto;max-height:none;object-fit:contain}.cinema-opening .preview-caption{padding:15px 18px;font-size:15px}.cinema-opening .preview-caption span:last-child{font-size:12px}.scene-footer{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;padding-block:0 25px}.scene-footer .showcase-note{font-size:12px;display:block;margin:0;line-height:1.9;color:#b5b5b5}.scene-footer .showcase-note span{display:block;color:#b5b5b5}.scene-next{font-size:18px;line-height:1.5;color:#b5b5b5;text-align:right}.scene-next strong{font-weight:500;color:#eee}.story-runway{position:relative;margin-top:18px}.story-sticky{display:flex;align-items:center;justify-content:center;min-height:350px}.story-lines{width:100%;text-align:center}.story-line{font-size:clamp(25px,3.5vw,48px);font-weight:650;letter-spacing:-.03em;line-height:1.6;margin:10px 0;color:#ddd}.story-three{color:#d7ff00}.cinema-opening+#about+.work-section{padding-top:55px}.project.in-view .project-image{animation:none}
@keyframes preview-time{to{transform:scaleX(1)}}
@supports(animation-timeline:view()){
 .opening-runway{height:calc(var(--scene-height) + 385px);view-timeline-name:--opening;view-timeline-axis:block;view-timeline-inset:80px 0}
 .opening-sticky{position:sticky;top:80px}
 .artifact-main .artifact-motion{animation:focus-work linear both;animation-timeline:--opening;animation-range:contain 0% contain 100%}
 .artifact-left .artifact-motion{animation:recede-left linear both;animation-timeline:--opening;animation-range:contain 0% contain 100%}
 .artifact-right .artifact-motion{animation:recede-right linear both;animation-timeline:--opening;animation-range:contain 0% contain 100%}
 .scene-next{animation:scene-question linear both;animation-timeline:--opening;animation-range:contain 0% contain 100%}
 .story-runway{height:620px;view-timeline-name:--story;view-timeline-axis:block;view-timeline-inset:80px 0}
 .story-sticky{position:sticky;top:80px;height:min(70dvh,550px)}
 .story-line{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--story;animation-range:entry 75% exit 75%}
 .story-one{animation-name:statement-one}.story-two{animation-name:statement-two}.story-three{animation-name:statement-three}
 @keyframes focus-work{0%{transform:rotateX(13deg) scale(.92)}55%,100%{transform:rotateX(0) scale(1.18)}}
 @keyframes recede-left{0%{transform:translateX(-100%) translateY(10px) rotateY(22deg) rotateZ(-9deg) scale(.88);opacity:1}65%,100%{transform:translateX(-145%) translateY(80px) rotateY(30deg) rotateZ(-15deg) scale(.76);opacity:0}}
 @keyframes recede-right{0%{transform:translateX(100%) translateY(10px) rotateY(-22deg) rotateZ(9deg) scale(.88);opacity:1}65%,100%{transform:translateX(145%) translateY(80px) rotateY(-30deg) rotateZ(15deg) scale(.76);opacity:0}}
 @keyframes scene-question{0%,35%{opacity:0;transform:translateY(15px)}75%,100%{opacity:1;transform:none}}
 @keyframes statement-one{0%,30%{color:#f5f5f2}65%,100%{color:#696969}}
 @keyframes statement-two{0%,15%{color:#696969}40%,65%{color:#f5f5f2}90%,100%{color:#696969}}
 @keyframes statement-three{0%,50%{color:#696969}80%,100%{color:#d7ff00}}
}
@media(max-width:1100px){.opening-intro{grid-template-columns:1.2fr 1fr;gap:32px}.opening-intro h1{font-size:clamp(38px,5.3vw,58px)}.opening-description>p{font-size:15px}.opening-description .hero-actions{gap:20px;flex-wrap:wrap}.opening-description .button{font-size:14px;padding:12px 18px}.opening-description .secondary-button{font-size:13px;min-height:44px}.artifact-position{width:68%}.artifact-left,.artifact-right{width:34%}.cinema-opening{--scene-height:590px}.scene-stage{height:var(--scene-height)}.scene-next{font-size:16px}.opening-toolbar .showcase-tabs{gap:5px}}
@media(max-width:767px){
 .cinema-opening{--scene-height:355px;padding-top:32px}.opening-intro{display:block;padding-bottom:22px}.opening-intro h1{font-size:clamp(32px,8.45vw,40px);letter-spacing:-.03em;line-height:1.3}.opening-description{margin-top:22px;padding:0}.opening-description>p{font-size:15px;line-height:1.85}.opening-description>p br:last-child{display:block}.opening-description .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.opening-description .button{font-size:14px;min-height:50px;justify-content:center;padding:12px 14px;gap:20px}.opening-description .secondary-button{justify-content:center;font-size:13px;border:1px solid #444;border-radius:6px;min-height:50px;gap:16px}.opening-sticky{padding-top:0}.opening-toolbar{gap:8px;align-items:center;width:calc(100% - 32px)}.opening-toolbar .showcase-tabs{gap:0;flex:1;justify-content:space-between}.opening-toolbar .showcase-tabs button{font-size:12px;padding:10px 9px;min-height:44px}.preview-playback{font-size:11px;gap:5px;padding-left:5px}.preview-playback span{font-size:15px}.scene-stage{width:100%;height:355px;margin-top:12px;perspective:900px;overflow:clip}.artifact-position{width:calc(100% - 40px);top:28px;max-width:none}.artifact-main .artifact-motion{transform:rotateX(12deg) scale(.94)}.artifact-left,.artifact-right{width:62%;top:20px;max-width:300px}.artifact-left .artifact-motion{transform:translateX(-32%) translateY(-3px) rotateZ(-12deg) scale(.9)}.artifact-right .artifact-motion{transform:translateX(32%) translateY(-3px) rotateZ(12deg) scale(.9)}.supporting-work{border-radius:10px}.supporting-work>span{font-size:12px;padding:11px 13px}.supporting-work small{font-size:11px}.cinema-opening .browser-frame{border-radius:10px;box-shadow:0 22px 35px #0009}.cinema-opening .browser-chrome{font-size:11px;padding:10px 12px}.browser-controls{font-size:6px}.preview-window{aspect-ratio:1.45}.cinema-opening .preview-caption{font-size:13px;padding:12px}.cinema-opening .preview-caption span:last-child{font-size:11px}.scene-footer{padding:0 0 12px;gap:16px;align-items:flex-start}.scene-footer .showcase-note{font-size:11px;line-height:1.8;flex:1}.scene-next{font-size:13px;line-height:1.6;flex:1}.story-runway{margin-top:0}.story-sticky{min-height:300px}.story-line{font-size:clamp(21px,5.85vw,27px);line-height:1.75;letter-spacing:-.025em;margin:10px 0}.cinema-opening+#about+.work-section{padding-top:40px}
 @supports(animation-timeline:view()){
 .opening-runway{height:610px;view-timeline-inset:72px 0}.opening-sticky{top:72px}.story-runway{height:570px;view-timeline-inset:72px 0}.story-sticky{top:72px;height:410px}
 @keyframes focus-work{0%{transform:rotateX(12deg) scale(.94)}65%,100%{transform:rotateX(0) scale(1.02)}}
 @keyframes recede-left{0%{transform:translateX(-32%) translateY(-3px) rotateZ(-12deg) scale(.9);opacity:1}70%,100%{transform:translateX(-65%) translateY(35px) rotateZ(-18deg) scale(.82);opacity:0}}
 @keyframes recede-right{0%{transform:translateX(32%) translateY(-3px) rotateZ(12deg) scale(.9);opacity:1}70%,100%{transform:translateX(65%) translateY(35px) rotateZ(18deg) scale(.82);opacity:0}}
 }
}
@media(prefers-reduced-motion:reduce){.opening-runway,.story-runway{height:auto}.opening-sticky,.story-sticky{position:relative;top:auto}.artifact-main .artifact-motion{transform:none}.artifact-left .artifact-motion{transform:translateX(-100%) scale(.88)}.artifact-right .artifact-motion{transform:translateX(100%) scale(.88)}.story-sticky{height:auto;min-height:280px}.story-line{color:#ddd}.story-three{color:#d7ff00}.scene-next{opacity:1;transform:none}.opening-sticky[data-playing=true] [aria-selected=true]::after{animation:none}.preview-playback{display:none}}