/* A drifting row of VOLT's concept websites (owner pass, 27 Oct 2026), shared by the homepage and the inner pages. */
.work-strip{overflow:hidden;padding:clamp(30px,5vw,64px) 0 clamp(36px,5vw,70px)}
/* clip the sides only, so the tilted row can rise above the strip instead of being cut flat */
@supports (overflow-x:clip){.work-strip{overflow:visible;overflow-x:clip}}
.work-tilt{transform:rotate(-3deg)}
.work-row{display:flex;width:max-content}
.work-set{display:flex;gap:clamp(12px,1.6vw,22px);padding-right:clamp(12px,1.6vw,22px)}
.work-set img{display:block;width:clamp(170px,23vw,340px);height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:10px;background:#1a1a17}
/* the websites glide sideways without stopping in an endless loop (-50% is exactly three of the six identical sets
   that workStrip() in build-pages.cjs writes, so the row starts over unseen; keep the set count even;
   owner decision 27 Oct 2026: never paused on hover or touch; the homepage's Pause motion button also stops it, an
   agency choice of 28 Oct so that button keeps its promise); with
   reduced motion the row stands still. Each picture also rises in as it enters. */
@media (prefers-reduced-motion: no-preference){.work-row{animation:work-loop 210s linear infinite}}
@keyframes work-loop{to{transform:translateX(-50%)}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.work-set img{animation:strip-rise linear both;animation-timeline:view(block);animation-range:entry 0% entry 70%}
.work-set img:nth-child(2n){animation-range:entry 10% entry 80%}}}
html.motion-paused .work-row{animation-play-state:paused}
@keyframes strip-rise{from{opacity:0;transform:translateY(18px)}}
