Build an infinite horizontal logo marquee.

TECHNIQUE
Render the logo list twice inside one flex track, then animate the track with transform: translateX(0) to translateX(-50%) over 40s linear infinite. Because the content is duplicated, the reset at -50% is invisible. Do not use JavaScript timers or scroll position for this.

STYLING
Logos render at 28px height, in the muted colour at 60% opacity, going to full opacity on hover of the individual logo. Gap of 3.5rem between them.

Mask both edges so logos fade out rather than being clipped:
mask-image: linear-gradient(to right, transparent, black 12%, black 88%, transparent).

INTERACTION
On hover of the whole strip, set animation-play-state: paused. This is the point of the component — a marquee nobody can read is decoration, not proof.

Above the strip, one line of small centred muted text stating what the logos represent.

RULES
Under prefers-reduced-motion, do not animate at all: render a single static row, wrap it, and centre it. Keep the track's will-change: transform only while it is animating.