/* Service-card icons and motion. */
.kc-ref__card { isolation: isolate; transition: transform .32s cubic-bezier(.2,.75,.2,1), box-shadow .32s ease; }
.kc-ref__card > img { transition: transform .55s cubic-bezier(.2,.75,.2,1), filter .4s ease; }
.kc-ref__card-icon {
	position: absolute;
	z-index: 3;
	top: 16px;
	left: 16px;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border: 1px solid rgba(255,255,255,.72);
	background: rgba(9,29,49,.9);
	color: #dceefa;
	box-shadow: 0 7px 18px rgba(4,18,31,.25);
	transition: transform .32s cubic-bezier(.2,.75,.2,1), background .32s ease, color .32s ease;
}
.kc-ref__card-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.kc-ref__card > div { transition: background .32s ease, color .32s ease; }

@media (hover: hover) {
	.kc-ref__card:hover { transform: translateY(-8px); box-shadow: 0 18px 34px rgba(9,29,49,.2); }
	.kc-ref__card:hover > img { transform: scale(1.075); filter: saturate(1.08) contrast(1.04); }
	.kc-ref__card:hover .kc-ref__card-icon { transform: scale(1.16); background: #8dbde0; color: #092743; }
	.kc-ref__card:hover > div { background: #e5f1f9; }
}

@media (prefers-reduced-motion: reduce) {
	.kc-ref__card,
	.kc-ref__card > img,
	.kc-ref__card-icon,
	.kc-ref__card > div { transition: none; }
}
