/* Feature cards — demo animations (home) */

.fcard__art[data-fc-demo] {
	overflow: visible;
}

.fcard__art[data-fc-demo] .fc-cursor {
	left: 0;
	top: 0;
	margin: 0;
	will-change: transform;
	pointer-events: none;
	transition: transform 0.08s ease-out;
}

.fcard__art[data-fc-demo] .fc-cursor.is-pressing {
	transition: transform 0.06s ease-in;
}

.fc-slot {
	transition: background-color 0.22s var(--ease-out), border-color 0.22s var(--ease-out), color 0.22s var(--ease-out), transform 0.12s var(--ease-out);
}

.fc-slot.is-tap {
	transform: scale(0.96);
}

.fc-bar {
	transform-origin: bottom center;
	transform: scaleY(0);
}

.fc-chart.is-animate .fc-bar {
	animation: fc-bar-grow 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.fc-chart.is-animate .fc-bar:nth-child(1) {
	animation-delay: 0.05s;
}

.fc-chart.is-animate .fc-bar:nth-child(2) {
	animation-delay: 0.12s;
}

.fc-chart.is-animate .fc-bar:nth-child(3) {
	animation-delay: 0.2s;
}

.fc-chart.is-animate .fc-bar:nth-child(4) {
	animation-delay: 0.28s;
}

.fc-chart.is-animate .fc-bar:nth-child(5) {
	animation-delay: 0.36s;
}

@keyframes fc-bar-grow {
	from {
		transform: scaleY(0);
	}
	to {
		transform: scaleY(1);
	}
}

.fc-confirm {
	transition: background-color 0.35s var(--ease-out), border-color 0.35s var(--ease-out), color 0.35s var(--ease-out), transform 0.35s var(--ease-out);
}

.fc-confirm.is-confirmed {
	background: oklch(52% 0.14 145);
	border-color: oklch(45% 0.12 145);
	color: oklch(98% 0.02 145);
	transform: translateX(-50%) scale(1.02);
}

.fc-confirm.is-confirmed::before {
	color: oklch(98% 0.02 145);
}

.fcard__art[data-fc-demo="confirm"] .fc-cursor {
	opacity: 0;
}

.fcard__art[data-fc-demo="confirm"].is-demo-ready .fc-cursor {
	opacity: 1;
	transition: opacity 0.25s var(--ease-out), transform 0.08s ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.fc-chart.is-animate .fc-bar {
		animation: none;
		transform: scaleY(1);
	}

	.fcard__art[data-fc-demo] .fc-cursor {
		display: none;
	}
}