/*
 * 滚动动效 —— 对标 echomachinery.com 的 reveal / stagger-reveal / parallax。
 *
 * 参考站用 GSAP + ScrollTrigger 驱动，但 **GSAP 没被归档抓下来**
 * （assets/ 下只有 3 个自有 js，index.Bvu9zNsI.js 和 ScrollTrigger.7Zy99s9Q.js 都不在），
 * 所以这块冻结不了，用 IntersectionObserver 等价实现，数值照抄参考站：
 *
 *   .reveal          opacity 0→1，duration .3s，ease none，触发点「元素顶部到视口 88%」
 *   .stagger-reveal  直接子元素依次进场，delay = index × .05s，duration .25s
 *   .parallax        y = innerHeight × data-parallax-speed × .5，随滚动 scrub
 *   #siteHeader      滚过 80px 加 .scrolled（header.css 里已有 10 条 .scrolled 规则）
 *
 * 参考站还有 .counter（数字滚动），但全站 163 页**一处都没用**，是死代码，不实现。
 *
 * 🚩 起始态用 `.ki-motion .reveal` 而不是裸 `.reveal`，这是**故意和参考站不同的一处**。
 * 参考站写的是全局 `.reveal{opacity:0}`，意味着 JS 一旦没跑起来
 * （报错、被拦截、浏览器不支持 IntersectionObserver），那些元素就**永久不可见**。
 * 我们让 motion.js 启动时给 <html> 加 .ki-motion，没加就什么都不隐藏——
 * 动效退化成"没有动效"，而不是"内容消失"。
 */

/* 起始态：只在 JS 确认能接管之后才隐藏 */
.ki-motion .reveal,
.ki-motion .stagger-reveal > * {
	opacity: 0;
}

.ki-motion .reveal.ki-in,
.ki-motion .stagger-reveal > .ki-in {
	opacity: 1;
}

/* duration/ease 照抄参考站 GSAP 的参数：.3s / .25s，ease "none" = linear */
.ki-motion .reveal {
	transition: opacity 0.3s linear;
}

.ki-motion .stagger-reveal > * {
	transition: opacity 0.25s linear;
}

/*
 * hero 区是**纯 CSS 动画**，参考站原本就不靠 JS：
 *   .hero .reveal{animation:fadeInUp 1s var(--ease) forwards;opacity:0}
 * 首屏元素等 IntersectionObserver 回调再显示会有可见延迟，所以这里保持它原样，
 * 并盖掉上面的 transition 起始态。
 */
.ki-motion .hero .reveal,
.ki-motion .ki-home-hero .reveal {
	animation: ki-fade-in-up 1s var(--ease, cubic-bezier(0.22, 1, 0.36, 1)) forwards;
	transition: none;
}

@keyframes ki-fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(32px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.parallax {
	will-change: transform;
}

/*
 * 用户在系统里关了动效就一律直接显示。
 * 参考站没做这条，但它是无障碍基线，加它不改变视觉结果、只改变到达方式。
 */
@media (prefers-reduced-motion: reduce) {
	.ki-motion .reveal,
	.ki-motion .stagger-reveal > * {
		opacity: 1;
		animation: none;
		transition: none;
	}
}

/*
 * parallax 的 transform 是 JS 写在 style 属性上的，CSS 盖不掉（除非 !important，
 * 而 !important 是本项目的禁令）。所以 reduced-motion 下**由 motion.js 直接不启动
 * parallax**，见 motion.js 的 prefersReduced 判断。这里只留注释说明为什么没有对应规则。
 */