.clients_section {
    padding: 100px 0;
    background: linear-gradient(135deg, #eef2ff, #fdf4ff);
}

.clients_title {
    font-weight: 800;
    font-size: 32px;
    color: #4f46e5;
}

.clients_subtitle {
    color: #6b7280;
    font-size: 15px;
}

/* CARD */
.client_card {
    height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;

    border-radius: 20px;
    background: linear-gradient(145deg, #ffffff, #f1f5ff);

    box-shadow: 0 10px 30px rgba(0,0,0,0.08);

    position: relative;
    overflow: hidden;

    transition: all 0.4s ease;

    /* FLOATING ANIMATION */
    animation: floatCard 5s ease-in-out infinite;
}

/* FLOAT KEYFRAMES */
@keyframes floatCard {
    0% {
        transform: translateY(0px) scale(1);
    }
    50% {
        transform: translateY(-12px) scale(1.02);
    }
    100% {
        transform: translateY(0px) scale(1);
    }
}

/* GLOW BORDER */
.client_card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 20px;
    padding: 2px;

    background: linear-gradient(120deg, #6366f1, #06b6d4, #ec4899, #8b5cf6);
    background-size: 300% 300%;

    animation: gradientMove 6s linear infinite;

    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;

    opacity: 0.7;
}

/* ANIMATED GRADIENT */
@keyframes gradientMove {
    0% { background-position: 0% }
    100% { background-position: 300% }
}

/* SHINE EFFECT */
.client_card::after {
    content: "";
    position: absolute;
    top: -100%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.5),
        transparent
    );
    transform: rotate(25deg);
    animation: shineMove 6s infinite;
}

@keyframes shineMove {
    0% { top: -100%; }
    100% { top: 100%; }
}

/* IMAGE */
.client_card img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;

    /* COLORFUL NA */
    filter: none;

    transition: 0.4s ease;
}

/* HOVER */
.client_card:hover {
    transform: scale(1.07) rotate(1deg);
    box-shadow: 0 25px 60px rgba(0,0,0,0.15);
}

.client_card:hover img {
    transform: scale(1.15);
}