/* Strong homepage category carousel override */
.categories .category-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 22px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
    position: relative !important;
    scroll-snap-type: x mandatory !important;
    animation: none !important;
}

.categories .category-grid::-webkit-scrollbar {
    display: none !important;
}

.categories .category-card {
    flex: 0 0 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    width: auto !important;
    scroll-snap-align: center !important;
    margin: 0 !important;
    animation: none !important;
}

.categories .category-card:hover {
    transform: translateY(-8px) !important;
}

.category-grid {
    animation: none !important;
}

.categories .category-track {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 22px !important;
    width: max-content !important;
    animation: categoryMarquee 24s linear infinite !important;
    animation-play-state: running !important;
    will-change: transform !important;
}

.categories .category-grid:hover .category-track {
    animation-play-state: paused !important;
}

@keyframes categoryMarquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

@media (max-width: 900px) {
    .categories .category-card {
        flex: 0 0 34% !important;
        min-width: 34% !important;
        max-width: 34% !important;
    }
}

@media (max-width: 700px) {
    .categories .category-card {
        flex: 0 0 42% !important;
        min-width: 42% !important;
        max-width: 42% !important;
    }
}

@media (max-width: 540px) {
    .categories .category-card {
        flex: 0 0 76% !important;
        min-width: 76% !important;
        max-width: 76% !important;
    }
}
