/*
 * 切页过渡效果 —— 本静态副本的附加层，原站没有此效果。
 * 由 tools/build-site.mjs 注入到每个页面；删除该注入步骤重新构建即可还原。
 *
 * 思路：切页时只让「顶部导航以外」的内容淡出，导航栏本身不参与过渡，
 * 所以新页面加载时导航立刻可见、位置不变，视觉上导航是常驻的，只有下方内容在过渡。
 */

html.fx-on body > *:not(.elementor-location-header) {
	opacity: 0;
}

/* 新页面进入：内容淡入（导航不参与） */
html.fx-on.fx-in body > *:not(.elementor-location-header) {
	opacity: 1;
	transition: opacity 280ms cubic-bezier(.22, .61, .36, 1);
}

/* 离开当前页：内容先淡出，再由 JS 真正跳转 */
html.fx-on.fx-out body > *:not(.elementor-location-header) {
	opacity: 0;
	transition: opacity 160ms ease-in;
}

/* 系统设置了「减少动态效果」时完全不参与，避免眩晕 */
@media (prefers-reduced-motion: reduce) {
	html.fx-on body > *:not(.elementor-location-header) {
		opacity: 1 !important;
		transition: none !important;
	}
}