.logo-grid,
.logo-grid * {
	font-family: Mulish, Helvetica, Arial, sans-serif;
}

.logo-grid {
	--border-color: #cbcbcb;
}

.logo-grid .logo-grid__list {
	display: flex;
	flex-wrap: wrap;
}

.logo-grid .logo-grid__list .logo-grid__list-item {
	position: relative;
	padding: 2px;
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a {
	position: relative;
	display: block;
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	opacity: 0;
	width: 100%;
	height: 100%;
	border: 2px solid #000;
	transition-duration: 0.3s;
	transition-property: opacity;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a {
	--tw-border-opacity: 1;

	padding-bottom: 80%;
	border-width: 1px;
	border-color: rgb(225 225 225 / var(--tw-border-opacity, 1));
	border-radius: 0.25rem;
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a:hover {
	--tw-border-opacity: 1;

	border-color: rgb(5 1 17 / var(--tw-border-opacity, 1));
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a:hover::after {
	opacity: 1;
}

.logo-grid .logo-grid__list .logo-grid__list-item .logo-item a figure {
	--tw-translate-y: -50%;

	position: absolute;
	top: 50%;
	display: block;
	padding: 1rem 1.5rem;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x))
		skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.logo-grid .logo-grid__list .logo-grid__list-item {
	width: 33.333333%;
}

@media (min-width: 1024px) {
	.logo-grid .logo-grid__list .logo-grid__list-item {
		width: 16.666667%;
	}
}

.logo-grid .logo-grid__cta-container {
	display: flex;
	justify-content: center;
}