﻿/* ── Wrapper ── */
.ixc-carousel-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 16px 0;
    /* fade edges */
    -webkit-mask-image: linear-gradient( to right, transparent 0%, black 8%, black 92%, transparent 100% );
    mask-image: linear-gradient( to right, transparent 0%, black 8%, black 92%, transparent 100% );
}

/* ── Track ── */
.ixc-carousel-track {
    display: flex;
    gap: 16px;
    width: max-content;
    animation: scroll-left 28s linear infinite;
    will-change: transform;
}

    .ixc-carousel-track.paused,
    .ixc-carousel-wrapper:hover .ixc-carousel-track {
        animation-play-state: paused;
    }

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* ── Cards ── */
@media (max-width: 700px) {
    .ixc-carousel-item {
        flex: 0 0 90px !important;
        width: 90px !important;
        height: 90px !important;
    }
}

.ixc-carousel-item {
    flex: 0 0 150px;
    width: 150px;
    height: 150px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .ixc-carousel-item:hover {
        transform: scale(1.06);
        box-shadow: 0 0 0 2px #fff4, 0 8px 32px #0008;
    }

    .ixc-carousel-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        filter: grayscale(20%);
        transition: filter 0.3s ease;
    }

    .ixc-carousel-item:hover img {
        filter: grayscale(0%);
    }
