.image-marquee { min-inline-size: 0; overflow: clip; container-type: inline-size; }
.image-marquee--fade-edges { min-block-size: 0; --marquee-fade-depth: 6rem; -webkit-mask-image: linear-gradient(to bottom, transparent, #000 var(--marquee-fade-depth), #000 calc(100% - var(--marquee-fade-depth)), transparent); mask-image: linear-gradient(to bottom, transparent, #000 var(--marquee-fade-depth), #000 calc(100% - var(--marquee-fade-depth)), transparent); }
.image-marquee__track { animation: whiteway-marquee-up var(--dur-marquee) linear infinite; will-change: transform; }
.image-marquee--down .image-marquee__track { animation-direction: reverse; }
.image-marquee__set { display: grid; gap: var(--space-4); padding-block-end: var(--space-4); }
.image-marquee__image { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 200 / 356; object-fit: cover; border-radius: var(--radius-media); }
[data-marquee-group][data-marquee-paused="true"] .image-marquee__track,
[data-marquee-group][data-marquee-visible="false"] .image-marquee__track { animation-play-state: paused; }
@keyframes whiteway-marquee-up { from { transform: translateY(-64.5cqw); } to { transform: translateY(calc(-50% - 64.5cqw)); } }
.image-marquee--horizontal { --marquee-card-width: max(15rem, 24.722222cqw); --marquee-offset: calc(-1 * var(--marquee-card-width)); }
.image-marquee--horizontal .image-marquee__track { display: flex; inline-size: max-content; animation-name: whiteway-marquee-left; animation-duration: var(--marquee-duration, var(--dur-marquee)); }
.image-marquee--horizontal .image-marquee__set { display: flex; flex: 0 0 auto; padding-block-end: 0; padding-inline-end: var(--space-4); }
.image-marquee--horizontal .image-marquee__image { flex: 0 0 var(--marquee-card-width); inline-size: var(--marquee-card-width); block-size: auto; aspect-ratio: 356 / 155; }
.image-marquee--right { --marquee-offset: -5.138889cqw; }
.image-marquee--right .image-marquee__track { animation-direction: reverse; }
@keyframes whiteway-marquee-left { from { transform: translateX(var(--marquee-offset)); } to { transform: translateX(calc(-50% + var(--marquee-offset))); } }
@media (prefers-reduced-motion: reduce) { .image-marquee__track { animation: none; transform: translateY(-64.5cqw); } }
@media (prefers-reduced-motion: reduce) { .image-marquee--horizontal .image-marquee__track { animation: none; transform: translateX(var(--marquee-offset)); } }