/* .client {
    position: relative;
    width: 100%;
    padding: 0 var(--p-x);
    margin-bottom: 218rem;
}

.client__clients {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 40rem;
    row-gap: 80rem;
}

.client__clients__card {
    position: relative;
    width: 72rem;
    height: 72rem;
}


.client__clients__card img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    height: 100%;
    object-fit: contain;
    width: 72rem;
}

.client__clients__card:hover .client__clients__card--unhover, .client__clients__card--hover {
    opacity: 0;
}

.client__clients__card:hover .client__clients__card--hover, .client__clients__card--unhover {
    opacity: 1;
} */


.client {
    display: flex;
    flex-direction: column;
    row-gap: 80rem;
    overflow: hidden;
    margin-bottom: 218rem;
}

.client__clients {
    display: flex;
    gap: 40rem;
}

.client__clients.move_right {
    animation: move_right 20s infinite linear;
}

.client__clients.move_left {
    animation: move_left 20s infinite linear;
}

.client__clients__card {
    width: 72rem;
    height: 72rem;
}

.client__clients__card img {
    height: 100%;
    object-fit: contain;
    width: 72rem;
}

/* animations */
@keyframes move_left {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-112rem * 13));
    }
}

@keyframes move_right {
    0% {
        transform: translateX(calc(-112rem * 13));
    }
    100% {
        transform: translateX(0);
    }
}

/* ========================== */
/*           desktop          */
/* ========================== */

@media screen and (min-width: 768px) {
    .client__clients__card {
        width: 128rem;
        height: 128rem;
    }

    .client__clients__card img {
	    width: 128rem;
    }

    /* animations */
    @keyframes move_left {
        0% {
            transform: translateX(0);
        }
        100% {
            transform: translateX(calc(-168rem * 13));
        }
    }

    @keyframes move_right {
        0% {
            transform: translateX(calc(-168rem * 13));
        }
        100% {
            transform: translateX(0);
        }
    }
}