/* Preview only: restrained motion, no layout shifts. */
.button,.social-mark,.linkedin-card,.project-link,.review-controls button{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,color .25s,background .25s,border-color .25s}
.button .ui-icon,.project-link .ui-icon,.linkedin-card-arrow{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.project-watch{overflow:hidden}.project-watch img{transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .4s}.project-play{transition:background .35s,box-shadow .35s}
nav>a:not(.button){position:relative}nav>a:not(.button)::after{content:"";position:absolute;left:0;bottom:-7px;height:2px;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .25s}
@media(hover:hover) and (pointer:fine){
.button:hover{transform:translateY(-3px);box-shadow:0 8px 24px #ff630f24}.button:hover .ui-icon,.project-link:hover .ui-icon,.linkedin-card:hover .linkedin-card-arrow{transform:translate(3px,-3px)}
.project-watch:hover img{transform:scale(1.035);filter:brightness(1.04)}.project-watch:hover .project-play{background:#ff630fe6;box-shadow:0 0 0 8px #ff630f20}
.social-mark:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0002}.linkedin-card:hover{transform:translateY(-3px)}nav>a:not(.button):hover::after{transform:scaleX(1)}
}
.button:active,.social-mark:active,.linkedin-card:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.project-watch:hover img,.button:hover,.social-mark:hover,.linkedin-card:hover{transform:none}}
/* Showreel: bring the control inward, animate only the cover image. */
.showreel-cover{overflow:hidden;isolation:isolate;align-items:center;padding:0 0 0 30%;background:none}
.showreel-cover::before{content:"";position:absolute;inset:0;z-index:-2;background:url('assets/serj-showreel-cover.png') center/cover no-repeat;transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.showreel-cover::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 45%,#02090d35);pointer-events:none}
.showreel-cover .play-circle{align-self:center;margin:0;flex-shrink:0;transition:background .3s,box-shadow .3s}
@media(hover:hover) and (pointer:fine){.showreel-cover:hover::before{transform:scale(1.035)}.showreel-cover:hover .play-circle{box-shadow:0 0 0 8px #ff630f20}}
@media(prefers-reduced-motion:reduce){.showreel-cover:hover::before{transform:none}}