/* Motion stays behind the existing content and never delays the first frame. */
.showcase-motion{position:relative;isolation:isolate}
.showcase-motion>.prx-shell,.showcase-motion>.ev-shell{position:relative;z-index:1}
.showcase-motion::before,.showcase-motion::after{content:"";position:absolute;pointer-events:none;z-index:0}
.showcase-motion::before{inset:-20%;background:radial-gradient(ellipse at 76% 36%,#b5212938,transparent 37%),radial-gradient(ellipse at 23% 72%,#e7394214,transparent 35%);animation:showcase-glow 16s ease-in-out infinite alternate}
.showcase-motion::after{inset:-12%;background:repeating-linear-gradient(125deg,transparent 0 142px,#ffffff06 143px 144px,transparent 145px 286px);mask-image:linear-gradient(90deg,transparent,#0009 40%,#000,transparent);animation:showcase-lines 22s ease-in-out infinite alternate}
.showcase-motion .prx-image-stage{animation:showcase-float 7s ease-in-out infinite;transform-origin:50% 60%}
.showcase-motion .prx-visual{animation:showcase-enter .9s cubic-bezier(.2,.7,.2,1) both}
.showcase-motion .ev-report-sheet{animation:showcase-paper 7s ease-in-out infinite}
.showcase-motion .ev-material .ev-photo{animation:showcase-breathe 12s ease-in-out infinite alternate}
.showcase-motion .ev-factory .ev-photo{animation:showcase-breathe 15s -5s ease-in-out infinite alternate-reverse}
.showcase-motion .ev-card{transition:border-color .3s,box-shadow .3s}
.showcase-motion .ev-card:hover,.showcase-motion .ev-card:focus-visible{border-color:#ed555c90;box-shadow:0 10px 28px #0003}
.showcase-motion .prx-detail a span,.showcase-motion .prx-all span,.showcase-motion .ev-request span{display:inline-block;transition:transform .3s}
.showcase-motion .prx-detail a:hover span,.showcase-motion .ev-request:hover span{transform:translate(3px,-3px)}
.showcase-motion .prx-all:hover span{transform:translate(3px,3px)}
.showcase-motion .prx-controls button{transition:background .2s,border-color .2s,transform .2s}
.showcase-motion .prx-controls button:active{transform:scale(.94)}
.showcase-motion .prx-foot,.showcase-motion .ev-footer{flex-wrap:wrap}
.showcase-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;flex-shrink:0;border:1px solid #ffffff24;border-radius:999px;padding:0 13px;background:#15151580;color:#bcbcc0;font:11px Arial,sans-serif;cursor:pointer;transition:color .2s,border-color .2s}
.showcase-toggle:hover{color:white;border-color:#ef6269}.showcase-toggle:focus-visible{outline:2px solid #ef6269;outline-offset:4px}
.showcase-toggle::before{content:"Ⅱ";font-size:12px}.showcase-toggle[aria-pressed=true]::before{content:"▷"}
.showcase-motion:not(.motion-running)::before,.showcase-motion:not(.motion-running)::after,.showcase-motion:not(.motion-running) :is(.prx-image-stage,.prx-visual,.ev-report-sheet,.ev-photo),.showcase-motion.motion-paused::before,.showcase-motion.motion-paused::after,.showcase-motion.motion-paused :is(.prx-image-stage,.prx-visual,.ev-report-sheet,.ev-photo){animation-play-state:paused}
@keyframes showcase-glow{from{transform:translate3d(-3%,-1%,0) scale(.97)}to{transform:translate3d(4%,3%,0) scale(1.06)}}
@keyframes showcase-lines{from{transform:translate3d(-22px,0,0)}to{transform:translate3d(22px,12px,0)}}
@keyframes showcase-float{0%,100%{translate:0 3px;rotate:-.7deg}50%{translate:0 -10px;rotate:1deg}}
@keyframes showcase-paper{0%,100%{translate:0 2px;rotate:-1deg}50%{translate:0 -7px;rotate:2deg}}
@keyframes showcase-breathe{from{scale:1.015;translate:-2px 0}to{scale:1.06;translate:3px -3px}}
@keyframes showcase-enter{from{transform:translateY(14px) scale(.97)}to{transform:translateY(0) scale(1)}}
/* Audit: a quiet document grid and a travelling scan line, not the product glow. */
.ev-hero.showcase-motion::before{inset:0;background:linear-gradient(0deg,transparent 40%,#e7444b0b 49%,#e7444b24 50%,transparent 51%);animation:audit-scan 13s ease-in-out infinite alternate}
.ev-hero.showcase-motion::after{inset:0;background:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:96px 96px;mask-image:linear-gradient(100deg,transparent,#0009);animation:none}
@keyframes audit-scan{from{transform:translateY(-24%)}to{transform:translateY(30%)}}
/* Production: moving segments follow three manufacturing routes over the original photo. */
.pr-hero.showcase-motion::before,.pr-hero.showcase-motion::after{display:none}
.pr-hero.showcase-motion .pr-hero-content{z-index:3}
.pr-hero.showcase-motion .pr-hero-bottom{align-items:center;flex-wrap:wrap;gap:16px}
.production-flow{position:absolute;inset:0;z-index:2;pointer-events:none;mask-image:linear-gradient(90deg,#0002,#0009 60%,#000)}
.production-flow svg{width:100%;height:100%;fill:none;stroke-width:1;vector-effect:non-scaling-stroke}
.production-flow-rails{stroke:#ffffff1c}
.production-flow-pulses{stroke:#ef5b60;stroke-width:2;stroke-dasharray:80 1800;animation:production-travel 12s linear infinite}
.production-flow-pulses path:nth-child(2){stroke:#ffffff65;stroke-dasharray:50 680}
.production-flow-pulses path:nth-child(3){stroke:#ef5b6090;stroke-dasharray:40 1120}
@keyframes production-travel{from{stroke-dashoffset:1880}to{stroke-dashoffset:0}}
.showcase-motion:not(.motion-running) .production-flow-pulses,.showcase-motion.motion-paused .production-flow-pulses,.showcase-motion:not(.motion-running) .pr-hero-bottom i,.showcase-motion.motion-paused .pr-hero-bottom i{animation-play-state:paused}
@media(max-width:760px){.showcase-motion::after{opacity:.6}.showcase-motion::before{background:radial-gradient(ellipse at 70% 40%,#b5212929,transparent 50%)}.showcase-motion .prx-foot{gap:12px}.showcase-toggle{font-size:10px}.showcase-motion .ev-footer{padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.showcase-motion::before,.showcase-motion::after,.showcase-motion *{animation:none!important;transition:none!important}.showcase-toggle{display:none}}
