.wct-active {
	perspective: 1200px;
}

.wct-active > .wct-card {
	transform-style: preserve-3d;
	transform: rotateX(var(--wct-rx, 0deg)) rotateY(var(--wct-ry, 0deg)) scale(var(--wct-scale, 1));
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
	position: relative;
}

.wct-active > .wct-card.wct-hover {
	transition: transform 0.12s linear, box-shadow 0.3s ease;
	box-shadow: var(--wct-shadow-x, 0px) var(--wct-shadow-y, 24px) 48px rgba(14, 15, 18, 0.18) !important;
}

.wct-active > .wct-card > * {
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.wct-active > .wct-card.wct-hover > :nth-child(1) {
	transform: translateZ(60px);
}

.wct-active > .wct-card.wct-hover > :nth-child(2) {
	transform: translateZ(40px);
}

.wct-active > .wct-card.wct-hover > :nth-child(3) {
	transform: translateZ(24px);
}

.wct-active > .wct-card::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background: radial-gradient(circle at var(--wct-gx, 50%) var(--wct-gy, 50%), rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0) 55%);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.wct-active > .wct-card.wct-hover::after {
	opacity: 1;
}