/* «Галерея работ»: бегущая лента слева направо. Без JS и при reduce-motion — обычный горизонтальный скролл. */
.works-gallery { --wg-h: 16rem; --wg-gap: .75rem; overflow: clip; }
.works-gallery__viewport { margin-top: 1.5rem; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; padding-block: .25rem; -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.works-gallery__track { display: flex; width: max-content; margin: 0; padding: 0; list-style: none; will-change: transform; }
.works-gallery__item { flex: none; height: var(--wg-h); aspect-ratio: 4 / 3; margin: 0 var(--wg-gap) 0 0; }
.works-gallery__item a { display: block; height: 100%; overflow: hidden; border-radius: var(--r-lg); background: var(--surface-2); }
.works-gallery__item a:focus-visible { outline: 3px solid var(--accent, currentColor); outline-offset: 2px; }
.works-gallery__item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.works-gallery__item a:is(:hover, :focus-visible) img { transform: scale(1.05); }
.works-gallery.is-running .works-gallery__viewport { overflow: hidden; }
.works-gallery.is-running .works-gallery__track { animation: works-gallery-run var(--wg-dur, 60s) linear infinite; }
.works-gallery.is-running:is(:hover, :focus-within) .works-gallery__track,
.works-gallery.is-offscreen .works-gallery__track { animation-play-state: paused; }
@keyframes works-gallery-run { from { transform: translate3d(calc(-1 * var(--wg-shift, 50%)), 0, 0); } to { transform: translate3d(0, 0, 0); } }
@media (max-width: 600px) { .works-gallery { --wg-h: 12rem; --wg-gap: .5rem; } }
@media (prefers-reduced-motion: reduce) { .works-gallery.is-running .works-gallery__track { animation: none; } .works-gallery__item img { transition: none; } }
