/**
 * Elementor Partner Logos Widget — default look.
 * Logos scaled to a common height, centered in equal cells, subtle
 * grayscale that lifts to full color on hover. Everything here is
 * overridable from the widget's controls.
 */

.epl-logos {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	column-gap: 40px;
	row-gap: 40px;
	align-items: center;
	justify-items: center;
}

@media (max-width: 1024px) {
	.epl-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.epl-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.epl-logos__item {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	min-width: 0;
}

.epl-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	padding: 0;
	background-color: transparent;
	border: 0 solid transparent;
	border-radius: 0;
	text-decoration: none;
	transition: background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.epl-logo:hover,
.epl-logo:focus { text-decoration: none; }

.epl-logo__img {
	display: block;
	width: auto;
	max-width: 100%;
	height: 64px;
	object-fit: contain;
	object-position: center;
	filter: grayscale(100%);
	opacity: 0.7;
	transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}
.epl-logo:hover .epl-logo__img,
.epl-logo:focus .epl-logo__img {
	filter: grayscale(0%);
	opacity: 1;
}

.epl-logo__name {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	.epl-logo, .epl-logo__img { transition: none; }
}
