
/* Menghilangkan padding container */
#partner-slider .container-fluid { padding: 0 !important; }

.logo-slider-container {
width: 100%;
overflow: hidden; /* Sembunyikan bagian yang keluar layar */
background: #f8f9fa;
padding: 20px 0;
position: relative;
}

/* Bayangan halus di kiri dan kanan agar terlihat 'fading' saat masuk/keluar */
.logo-slider-container::before,
.logo-slider-container::after {
content: "";
height: 100%;
position: absolute;
width: 150px;
z-index: 2;
pointer-events: none;
}
.logo-slider-container::before {
left: 0;
top: 0;
background: linear-gradient(to right, #f8f9fa 0%, rgba(248, 249, 250, 0) 100%);
}
.logo-slider-container::after {
right: 0;
top: 0;
background: linear-gradient(to left, #f8f9fa 0%, rgba(248, 249, 250, 0) 100%);
}

/* Track yang berputar secara infinite */
.logo-slide-track {
display: flex;
width: calc(250px * 14); /* (Lebar item + margin) * total item (termasuk duplikat) */
animation: scroll-logo 30s linear infinite; /* Kecepatan 30 detik per putaran */
}

/* Berhenti saat di-hover (opsional, keren buat UX) */
.logo-slide-track:hover {
animation-play-state: paused;
}

.partner-slide {
width: 250px;
height: 100px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 30px;
}

.partner-slide img {
max-width: 100%;
max-height: 80px;
object-fit: contain;
/* Langsung Berwarna */
filter: grayscale(0%);
opacity: 1;
transition: transform 0.3s ease;
}

.partner-slide img:hover {
transform: scale(1.1);
}

/* Keyframe Animasi Jalan */
@keyframes scroll-logo {
0% {
    transform: translateX(0);
}
100% {
    transform: translateX(calc(-250px * 7)); /* Geser sejauh jumlah logo unik (7) */
}
}

/* Responsive Adjustments */
@media (max-width: 768px) {
.partner-slide { width: 180px; }
.logo-slide-track { width: calc(180px * 14); }
@keyframes scroll-logo {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-180px * 7)); }
}
.logo-slider-container::before, .logo-slider-container::after { width: 50px; }
}