/**
 * data-reveal: 画面内に入ったらふわっと浮かび上がる汎用の登場演出。
 * GSAP非依存（IntersectionObserverのみ）。TOP・アーカイブのカード/セクションで使う。
 */
[data-reveal] {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity var(--duration-slow) var(--ease-out-expo),
		transform var(--duration-slow) var(--ease-out-expo);
}

[data-reveal].is-in-view {
	opacity: 1;
	transform: none;
}

/**
 * data-reveal="scale": タグ・ピルなど小さな要素向けの縮小→拡大バリアント。
 * スクロールギミックに少し変化をつけるため、基本のフェードアップと使い分ける。
 */
[data-reveal="scale"] {
	transform: scale(0.85);
}

[data-reveal="scale"].is-in-view {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	[data-reveal] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}