/**
 * new4 首页故事线：lx-tile 左右交错 + 进入视口逐个显现（story-steps.js）
 */
.tpl-new4 .lx-story-stack {
	display: flex;
	flex-direction: column;
	gap: clamp(1.25rem, 4vw, 2.25rem);
	max-width: min(52rem, 100%);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(0.25rem, 1.5vw, 0.75rem);
	padding-right: clamp(0.25rem, 1.5vw, 0.75rem);
}

.tpl-new4 .lx-story-step {
	will-change: opacity, transform;
	opacity: 0;
	transition:
		opacity 0.7s ease,
		transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

.tpl-new4 .lx-story-step .lx-tile {
	width: 100%;
	max-width: min(26rem, 100%);
	box-sizing: border-box;
}

.tpl-new4 .lx-story-step--left .lx-tile {
	margin-right: auto;
	margin-left: 0;
}

.tpl-new4 .lx-story-step--right .lx-tile {
	margin-left: auto;
	margin-right: 0;
}

.tpl-new4 .lx-story-step--left {
	transform: translate3d(-28px, 28px, 0);
}

.tpl-new4 .lx-story-step--right {
	transform: translate3d(28px, 28px, 0);
}

.tpl-new4 .lx-story-step.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

@media (max-width: 767.98px) {
	.tpl-new4 .lx-story-step .lx-tile {
		max-width: 100%;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.tpl-new4 .lx-story-step--left,
	.tpl-new4 .lx-story-step--right {
		transform: translate3d(0, 22px, 0);
	}

	.tpl-new4 .lx-story-step.is-visible {
		transform: translate3d(0, 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.tpl-new4 .lx-story-step {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}