.nomon-case-stack__stack {
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
}

.nomon-case-stack__card {
	cursor: inherit;
	-webkit-user-drag: none;
	transform-origin: 50% 0;
	transition:
		transform 0.8s var(--ease-nomon),
		opacity 0.6s ease;
}

/* The dragged card tracks the pointer 1:1; the transition returns on release. */
.nomon-case-stack__stack.is-dragging {
	cursor: grabbing;
}

.nomon-case-stack__stack.is-dragging .nomon-case-stack__card {
	transition: none;
}

.nomon-case-stack__card img {
	-webkit-user-drag: none;
}

/* Every caption shares one grid cell, so swapping them never shifts the row. */
.nomon-case-stack__caption {
	grid-area: 1 / 1;
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	transition:
		opacity 0.5s ease,
		transform 0.6s var(--ease-nomon);
}

.nomon-case-stack__caption.is-active {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

/* The leaving card flies past the content edge; `clip` keeps sticky elements working, unlike `hidden`. */
.site-content:has(.nomon-case-stack) {
	overflow-x: clip;
}

@media (prefers-reduced-motion: reduce) {
	.nomon-case-stack__card,
	.nomon-case-stack__caption {
		transition: opacity 0.3s ease;
	}
}
