.leonlab-tilt-card {
	position: relative;
	--leonlab-tilt-rx: 0deg;
	--leonlab-tilt-ry: 0deg;
	--leonlab-tilt-gx: 50%;
	--leonlab-tilt-gy: 50%;
}

.leonlab-tilt-card__inner {
	max-width: 520px;
	margin: 0 auto;
	border-radius: 22px;
	border: 1px solid rgba(148, 163, 184, 0.35);
	background: rgba(255, 255, 255, 0.68);
	backdrop-filter: blur(10px);
	padding: 20px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.12);
	transform-style: preserve-3d;
	transform: rotateX(var(--leonlab-tilt-rx)) rotateY(var(--leonlab-tilt-ry)) scale(var(--leonlab-tilt-scale, 1.02));
	transition: transform 120ms ease;
	position: relative;
	overflow: hidden;
}

.leonlab-tilt-card__badge {
	display: inline-flex;
	justify-self: start;
	padding: 7px 12px;
	border-radius: 999px;
	border: 1px solid rgba(148, 163, 184, 0.40);
	font-weight: 900;
	font-size: 12px;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	opacity: 0.82;
}

.leonlab-tilt-card__title {
	margin: 12px 0 10px 0;
	font-size: 24px;
	letter-spacing: -0.02em;
}

.leonlab-tilt-card__text {
	margin: 0;
	opacity: 0.88;
}

.leonlab-tilt-card--glare .leonlab-tilt-card__glare {
	position: absolute;
	inset: -40%;
	background: radial-gradient(circle at var(--leonlab-tilt-gx) var(--leonlab-tilt-gy), rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0) 55%);
	pointer-events: none;
	mix-blend-mode: overlay;
}

@media (prefers-reduced-motion: reduce) {
	.leonlab-tilt-card__inner {
		transition: none;
		transform: none;
	}
}
