.clientes{
position:relative;
overflow:hidden;
padding:50px 0;
background: #f7f2e7;
z-index:2;
}

.clientes:before,
.clientes:after{
content:"";
position:absolute;
top:0;
width:120px;
height:100%;
z-index:2;
}

.clientes:before{
left:0;
background:linear-gradient(to right,#FDFAF3,transparent);
}

.clientes:after{
right:0;
background:linear-gradient(to left,#FDFAF3,transparent);
}

.clientes:hover .logos-track{
animation-play-state:paused;
}

.logos-track{
display:flex;
width:max-content;
animation:scrollLogos 30s linear infinite;
will-change:transform;
}

.logos-slide{
display:flex;
align-items:center;
gap:120px;
padding-right:120px;
}

.logos-slide img{
max-height:85px;
width:auto;
opacity:.7;
transition:.4s ease;
}

.logos-slide img:hover{
opacity:1;
}

/* animación */

@keyframes scrollLogos{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}


@media (max-width:900px){

.logos-slide{
gap:60px;
padding-right:60px;
}

.logos-slide img{
height:80px;
}

}