.cew-logos {
	position: relative;
}

.cew-logos__viewport {
	overflow: hidden;
	padding: 10px 0;
}

/* La cinta: se mueve por JavaScript con transform */
.cew-logos__track {
	display: flex;
	width: max-content;
	will-change: transform;
}

.cew-logos .cew-logos__set {
	display: flex;
	flex: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cew-logos__item {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 170px;
	height: 80px;
	margin: 0 16px 0 0;
	padding: 16px;
	border-radius: 8px;
	background-color: #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.cew-logos__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.cew-logos__img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	object-fit: contain;
	transition: filter 0.3s ease, opacity 0.3s ease;
}

/* Escala de grises, y color original al pasar el mouse o enfocar */
.cew-logos--grayscale .cew-logos__img {
	filter: grayscale(100%);
}

.cew-logos--grayscale .cew-logos__item:hover .cew-logos__img,
.cew-logos--grayscale .cew-logos__item:focus-within .cew-logos__img {
	filter: none;
}

.cew-logos__item:hover .cew-logos__img,
.cew-logos__item:focus-within .cew-logos__img {
	opacity: 1;
}

/* Si el visitante prefiere menos movimiento: sin animación, logos en cuadrícula */
.cew-logos.is-static .cew-logos__track {
	width: auto;
}

.cew-logos.is-static .cew-logos__set {
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
}

.cew-logos.is-static .cew-logos__item {
	margin-bottom: 16px;
}

.cew-logos__empty {
	margin: 0;
	color: #777;
}

/* Arrastrar con clic sostenido */
.cew-logos__viewport {
	/* Deja que el dedo mueva la cinta en horizontal sin bloquear el scroll vertical */
	touch-action: pan-y;
}

.cew-logos.is-draggable .cew-logos__viewport {
	cursor: grab;
	-webkit-user-select: none;
	user-select: none;
}

.cew-logos.is-dragging,
.cew-logos.is-dragging * {
	cursor: grabbing !important;
}

.cew-logos__img {
	-webkit-user-drag: none;
}