/* Service cards with circular illustrations and a trailing accent. */
.home [data-itlu-section="quick-links"]:has(> .itlu-quick-links--cards-circle) {
	background: var(--itlu-color-surface-alt);
	box-shadow: 0 0 0 100vmax var(--itlu-color-surface-alt);
	clip-path: inset(-8px -100vmax);
}

[data-itlu-section="quick-links"]:has(> .itlu-quick-links--cards-circle) .itlu-section-header {
	position: relative;
	padding-bottom: 2rem;
	margin-bottom: 1.75rem;
}

[data-itlu-section="quick-links"]:has(> .itlu-quick-links--cards-circle) .itlu-section-header::before {
	content: "";
	position: absolute;
	inset: auto 0 8px 32px;
	height: 2px;
	background: var(--itlu-color-border);
}

[data-itlu-section="quick-links"]:has(> .itlu-quick-links--cards-circle) .itlu-section-header::after {
	content: "";
	position: absolute;
	inset: auto auto 0 0;
	width: 18px;
	height: 18px;
	background: var(--itlu-color-primary);
}

[data-itlu-section="quick-links"]:has(> .itlu-quick-links--cards-circle) .itlu-section-header__title {
	margin: 0;
	color: var(--itlu-color-heading);
}

.itlu-quick-links.itlu-quick-links--cards-circle ul {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
}

.itlu-quick-links.itlu-quick-links--cards-circle :is(a, .itlu-quick-links__content) {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: 100px minmax(0, 1fr);
	align-items: center;
	align-content: center;
	justify-items: stretch;
	gap: 10px;
	min-height: 100px;
	padding: 0 22px 0 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--itlu-color-heading);
	text-align: start;
	text-decoration: none;
}

.itlu-quick-links.itlu-quick-links--cards-circle :is(a, .itlu-quick-links__content)::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0 0 0 50px;
	border: 1px solid var(--itlu-color-border);
	border-right: 10px solid var(--itlu-color-primary);
	background: var(--itlu-color-surface);
	box-shadow: 0 2px 8px #00000012, inset -9px 0 12px -11px #00000065;
}

.itlu-quick-links.itlu-quick-links--cards-circle .itlu-quick-links__media {
	display: grid;
	place-items: center;
	width: 100px;
	height: 100px;
	padding: 24px;
	border: 3px solid transparent;
	border-radius: 50%;
	background: linear-gradient(var(--itlu-color-surface), var(--itlu-color-surface)) padding-box, conic-gradient(from 220deg, var(--itlu-color-primary) 0deg 188deg, var(--itlu-color-border) 188deg 360deg) border-box;
}

.itlu-quick-links.itlu-quick-links--cards-circle .itlu-quick-links__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.itlu-quick-links.itlu-quick-links--cards-circle .itlu-quick-links__media .itlu-icon {
	width: 100%;
	height: 100%;
	padding: 0;
	background: transparent;
	color: var(--itlu-color-primary);
}

.itlu-quick-links.itlu-quick-links--cards-circle strong {
	min-width: 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

.itlu-quick-links.itlu-quick-links--cards-circle :is(a, .itlu-quick-links__content) > span:not(.itlu-quick-links__media) {
	grid-column: 2;
	padding-bottom: .75rem;
}

.itlu-quick-links.itlu-quick-links--cards-circle a:is(:hover, :focus-visible) {
	color: var(--itlu-color-primary-hover);
}

.itlu-quick-links.itlu-quick-links--cards-circle a:is(:hover, :focus-visible)::before {
	border-right-color: var(--itlu-color-primary-hover);
	box-shadow: 0 3px 10px #00000020;
}

@media (max-width: 74.99rem) {

	.itlu-quick-links.itlu-quick-links--cards-circle ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media (max-width: 39.99rem) {

	.itlu-quick-links.itlu-quick-links--cards-circle ul {
		grid-template-columns: minmax(0, 1fr);
	}

	.itlu-quick-links.itlu-quick-links--cards-circle :is(a, .itlu-quick-links__content) {
		grid-template-columns: 80px minmax(0, 1fr);
		min-height: 80px;
	}

	.itlu-quick-links.itlu-quick-links--cards-circle :is(a, .itlu-quick-links__content)::before {
		left: 40px;
		border-right-width: 8px;
	}

	.itlu-quick-links.itlu-quick-links--cards-circle .itlu-quick-links__media {
		width: 80px;
		height: 80px;
		padding: 18px;
	}

	.itlu-quick-links.itlu-quick-links--cards-circle strong {
		font-size: 1.0625rem;
	}

}

@media (forced-colors: active) {

	.itlu-quick-links.itlu-quick-links--cards-circle .itlu-quick-links__media {
		border-color: CanvasText;
	}

	.itlu-quick-links.itlu-quick-links--cards-circle a::before {
		border-color: LinkText;
	}

}