/**
 * 通用前端动效（配合 inc/ui-effects/index.php 使用）
 *
 * .wjc-reveal        进入视口时淡入 + 上移到位，只播一次
 * --wjc-delay        错开延迟，例如 style="--wjc-delay:150ms"
 *
 * 安全策略：初始隐藏只在 JS 成功接管后才生效（html.wjc-fx-ready）。
 * 也就是说 JS 没加载 / 报错 / 被优化插件延迟执行时，内容一律照常显示，
 * 不会出现「元素永远 opacity:0 看不见」的情况。
 */

/* ==================== 进场动画 ==================== */
.wjc-reveal,
[data-wjc-reveal] {
	transition:
		opacity 0.75s cubic-bezier(0.22, 0.61, 0.36, 1),
		transform 0.75s cubic-bezier(0.22, 0.61, 0.36, 1);
	transition-delay: var(--wjc-delay, 0ms);
}

/* 只有 JS 接管后，未进场的元素才隐藏 */
html.wjc-fx-ready .wjc-reveal:not(.is-revealed),
html.wjc-fx-ready [data-wjc-reveal]:not(.is-revealed) {
	opacity: 0;
	transform: translate3d(0, 22px, 0);
	will-change: opacity, transform;
}

/* 进场变体：从左 / 从右 / 缩放 */
html.wjc-fx-ready .wjc-reveal--left:not(.is-revealed) {
	transform: translate3d(-26px, 0, 0);
}

html.wjc-fx-ready .wjc-reveal--right:not(.is-revealed) {
	transform: translate3d(26px, 0, 0);
}

html.wjc-fx-ready .wjc-reveal--zoom:not(.is-revealed) {
	transform: scale(0.965);
}

/* ==================== 通用悬停微交互 ==================== */
/* 卡片抬起：给需要抬起的元素加 .wjc-hover-lift */
.wjc-hover-lift {
	transition:
		transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
		box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (hover: hover) {
	.wjc-hover-lift:hover {
		transform: translateY(-6px);
		box-shadow: 0 18px 42px rgba(17, 24, 39, 0.14);
	}
}

/* 按钮/箭头按下反馈 */
.wjc-press {
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.wjc-press:active {
	transform: scale(0.96);
}

/* ==================== 降低动效偏好 ==================== */
@media (prefers-reduced-motion: reduce) {
	html.wjc-fx-ready .wjc-reveal:not(.is-revealed),
	html.wjc-fx-ready [data-wjc-reveal]:not(.is-revealed) {
		opacity: 1;
		transform: none;
	}

	.wjc-reveal,
	[data-wjc-reveal] {
		transition: none !important;
	}

	.wjc-hover-lift:hover {
		transform: none !important;
		box-shadow: none !important;
	}

	.wjc-press:active {
		transform: none !important;
	}
}