.icon-with-headings-hover .container {
	display: flex;
	justify-content: center;
	gap: 16px;
}

.icon-with-headings-hover .container .card {
	position: relative;
	overflow: hidden;
	display: flex;
	padding: var(--gaps-spaces-card-margins-lg, 40px) var(--gaps-spaces-card-margins-sm, 24px);
	flex-direction: column;
	align-items: center;
	gap: 30px;
	flex: 1 0 0;
	border-radius: var(--Radius-Card-Sm, 16px);
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.10);
	background: radial-gradient(
		170.34% 127.97% at 9.98% 90.95%,
		rgba(204, 224, 255, 0.10) 18.77%,
		rgba(151, 162, 243, 0.10) 63.68%,
		rgba(0, 97, 255, 0.10) 100%
	), #0A1B5F;
}

.icon-with-headings-hover .container .card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: radial-gradient(
		170.34% 127.97% at 9.98% 90.95%,
		#CCE0FF 18.77%,
		#97A2F3 63.68%,
		#0061FF 100%
	), #0A1B5F;
	opacity: 0;
	transition: opacity 1s ease;
	z-index: 0;
}

.icon-with-headings-hover .container .card:hover::before {
	opacity: 1;
}

.icon-with-headings-hover .container .card:hover * {
	color: #0A1B5F !important;
	transition: color 1s ease;
}
.icon-with-headings-hover .container .card h4 {
	text-align: center;
}
.icon-with-headings-hover .container .card > * {
	position: relative;
	z-index: 1;
}

.icon-with-headings-hover .container .card .img-wrapper {
	background-color: var(--openlane-blue-100);
	border-radius: 100px;
	padding: 12px;
	transition: background-color 1s ease,;
}

.icon-with-headings-hover .container .card:hover .img-wrapper {
	background-color: white;
}

.icon-with-headings-hover .container .card * {
	color: white;
}

@media (max-width: 1440px) {}

/* Desktop Lg */
@media (max-width: 1024px) {}

/* Desktop Sm */
@media (max-width: 767px) {
	.icon-with-headings-hover .container  {
		flex-direction: column;
	}
	.icon-with-headings-hover .container .card {
		overflow: visible;
	}
}

/* Tablet */
@media (max-width: 390px) {}

/* Mobile */