#works .portfolio-carousel{position:relative;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-inline:contain;touch-action:pan-x;mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent)}
#works .portfolio-machine{position:relative;isolation:isolate;padding:46px 28px 83px;overflow:hidden;border:1px solid #536675;box-shadow:0 26px 65px #06131f45,inset 0 0 0 2px #182938;background:#07111b url('assets/forge-conveyor-v2.webp') center 72% / cover no-repeat}
#works .portfolio-machine::before{content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(180deg,#02091373 0%,#02091340 24%,#02091300 58%,#02091314 100%);pointer-events:none}
#works .portfolio-carousel{z-index:1}
#works .conveyor-rail{position:absolute;z-index:2;left:14px;right:14px;bottom:16px;height:17px;overflow:hidden;border-top:1px solid #b7d4db8c;border-bottom:2px solid #080e13;background:linear-gradient(180deg,#95a6a746,#111f27d9 28%,#060c12eb 70%,#89979955);box-shadow:0 -7px 13px #080b12a6,0 5px 4px #000b}
#works .conveyor-rail::before{content:"";position:absolute;inset:2px 0;background:repeating-linear-gradient(90deg,#39464b8c 0 4px,#0a121ae0 5px 71px,#65727899 72px 75px,#09131ab5 76px 80px);animation:conveyor-tread .9s linear infinite}
#works .conveyor-rail::after{content:"";position:absolute;inset:2px 0;background:repeating-linear-gradient(90deg,transparent 0 37px,#f4a8589c 38px 40px,transparent 41px 80px);mix-blend-mode:screen;opacity:.52;animation:conveyor-tread .9s linear infinite}
#works .conveyor-rail-glow{position:absolute;inset:-6px 0;background:linear-gradient(90deg,transparent,#eda24d45 50%,transparent);pointer-events:none}
#works .conveyor-workers{position:absolute;z-index:4;inset:0;pointer-events:none;overflow:hidden}
#works .conveyor-worker{position:absolute;left:-60px;bottom:9px;width:46px;height:46px;filter:drop-shadow(0 0 4px #31bfff88);animation:dede-walk-across 11s linear infinite;will-change:left}
#works .conveyor-worker img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;animation:dede-walk-step var(--step,.36s) steps(2,end) infinite}
#works .conveyor-worker:nth-child(1){animation-duration:10.4s;animation-delay:-1.7s;bottom:10px;width:44px;height:44px;--step:.31s}
#works .conveyor-worker:nth-child(2){animation-duration:12.2s;animation-delay:-7.9s;bottom:15px;width:39px;height:39px;--step:.43s}
#works .conveyor-worker:nth-child(3){animation-duration:9.1s;animation-delay:-3.2s;bottom:6px;width:50px;height:50px;--step:.27s}
#works .conveyor-worker:nth-child(4){animation-duration:13.5s;animation-delay:-10.8s;bottom:17px;width:42px;height:42px;--step:.48s}
#works .conveyor-worker:nth-child(5){animation-duration:10.9s;animation-delay:-5.6s;bottom:8px;width:47px;height:47px;--step:.34s}
#works .conveyor-worker:nth-child(6){animation-duration:8.7s;animation-delay:-8.1s;bottom:13px;width:38px;height:38px;--step:.29s}
#works .conveyor-worker:nth-child(7){animation-duration:14.2s;animation-delay:-1.1s;bottom:5px;width:45px;height:45px;--step:.4s}
@keyframes conveyor-tread{to{background-position-x:80px}}
@keyframes dede-walk-across{from{left:-60px}to{left:calc(100% + 20px)}}
@keyframes dede-walk-step{0%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-3px) rotate(3deg)}100%{transform:translateY(0) rotate(-3deg)}}
#works .portfolio-carousel::-webkit-scrollbar{display:none}
#works .portfolio-paths{position:relative;display:flex;width:max-content;gap:18px;margin:0;padding:10px 0 18px}
#works .portfolio-path{position:relative;flex:0 0 clamp(285px,33vw,430px);width:clamp(285px,33vw,430px);min-height:405px;display:flex;flex-direction:column;grid-template-columns:none;grid-template-rows:none;background:#07172591;color:#e7f5f7;border:1px solid #9ac2d0a8;box-shadow:0 4px 0 #0c141c,0 8px 0 #687078,0 13px 17px #000b,0 30px 60px #000b, inset 0 0 0 1px #c4e3ea23}
#works .portfolio-path:hover{border-color:#6ae9f0;box-shadow:0 20px 48px #0b263a42}
#works .path-number{grid-column:auto;padding:17px 20px;color:#75dce7}
#works .path-image{position:relative;grid-column:auto;grid-row:auto;height:235px;min-height:0;flex:none}
#works .path-image::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#03121c55,#03111db8)}
#works .path-image img{opacity:.64;filter:brightness(.74) saturate(.78) contrast(1.08);transition:opacity .6s ease,filter .6s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
#works .portfolio-path:hover .path-image img,#works .portfolio-path:focus-visible .path-image img{opacity:.9;filter:brightness(.9) saturate(1.02) contrast(1.02);transform:scale(1.05)}
#works .path-body{grid-column:auto;grid-row:auto;padding:22px 20px 26px}
#works .path-body small{color:#adc8d2}
#works .path-body i{color:#69e2ee}
#works .portfolio-path[aria-hidden="true"]{user-select:none}
@media(max-width:600px){#works .portfolio-machine{padding:25px 13px 58px;background-position:center bottom}#works .portfolio-path{flex-basis:min(80vw,310px);width:min(80vw,310px);min-height:350px}#works .path-image{height:190px}#works .path-body strong{font-size:24px}#works .path-body small{font-size:11px}#works .portfolio-paths{gap:18px}#works .conveyor-rail{left:8px;right:8px;bottom:9px}#works .conveyor-worker:nth-child(1){animation-duration:6.2s;animation-delay:-1s;width:36px;height:36px}#works .conveyor-worker:nth-child(2){animation-duration:6.8s;animation-delay:-4.4s;width:32px;height:32px}#works .conveyor-worker:nth-child(3){animation-duration:5.7s;animation-delay:-2s;width:41px;height:41px}#works .conveyor-worker:nth-child(4){animation-duration:7.5s;animation-delay:-6s;width:34px;height:34px}#works .conveyor-worker:nth-child(5){animation-duration:6.1s;animation-delay:-3.1s;width:38px;height:38px}#works .conveyor-worker:nth-child(6){animation-duration:5.2s;animation-delay:-4.8s;width:31px;height:31px}#works .conveyor-worker:nth-child(7){animation-duration:7.1s;animation-delay:-.4s;width:37px;height:37px}}
@media(prefers-reduced-motion:reduce){#works .portfolio-path:hover{transform:none}#works .path-image img{transition:none}#works .conveyor-rail::before,#works .conveyor-rail::after,#works .conveyor-worker,#works .conveyor-worker img{animation:none}#works .conveyor-worker{left:8%}#works .conveyor-worker:nth-child(2){left:29%}#works .conveyor-worker:nth-child(3){left:50%}#works .conveyor-worker:nth-child(4){left:71%}#works .conveyor-worker:nth-child(n+5){display:none}}