/* Phase 4 — Motion timeline & transitions */

.sc361-motion-engine .sc361-card {
	transition: transform var(--sc361-motion-duration, 600ms) var(--sc361-motion-ease, ease),
		opacity var(--sc361-motion-duration, 600ms) var(--sc361-motion-ease, ease),
		filter var(--sc361-motion-duration, 600ms) ease;
}

.sc361-motion-trans--fade-blur .sc361-card.sc361-motion-trans-active {
	filter: brightness(1.08);
}

.sc361-motion-trans--zoom .sc361-card.sc361-motion-trans-active {
	transform: scale(1.05);
}

.sc361-motion-trans--slide-depth .sc361-card.sc361-motion-trans-active {
	transform: translate3d(0, -8px, 24px);
}

.sc361-motion-trans--black-fade .sc361-card::after {
	content: '';
	position: absolute;
	inset: 0;
	background: #000;
	opacity: 0;
	transition: opacity var(--sc361-motion-duration, 600ms) ease;
	pointer-events: none;
	z-index: 6;
}

.sc361-motion-trans--black-fade .sc361-card.sc361-motion-trans-active::after {
	opacity: 0.25;
}

@media (prefers-reduced-motion: reduce) {
	.sc361-motion-engine .sc361-card {
		transition: none !important;
	}
}