.cec-carousel {
    overflow: hidden;
    white-space: nowrap;
    position: relative;
}
.cec-carousel-track {
    display: flex;
    width: max-content;
    gap: 10px;
    animation: scroll var(--scroll-speed, 30s) linear infinite;
}
.cec-carousel-item img {
    max-height: 150px;
    transition: transform 0.3s ease;
}
.cec-carousel-item{
    border: 1px solid #eae7e7;
    border-radius: 10px;
    overflow: hidden;
}
.cec-carousel-item:hover img {
    transform: scale(1.1);
}
.cec-carousel:hover .cec-carousel-track {
    animation-play-state: paused;
}

@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.cec-carousel::before,
.cec-carousel::after {
  content: '';
  position: absolute;
  top: 0;
  width: 100px; /* adjust width as needed */
  height: 200%;
  z-index: 2;
  pointer-events: none;
}

.cec-carousel::before {
  left: 0;
  background: linear-gradient(to right, white, transparent);
}

.cec-carousel::after {
  right: 0;
  background: linear-gradient(to left, white, transparent);
}