/* ============================================================
   animations.css — Fade / Slide Up / Hover / Scroll のみ
   派手な演出は禁止（微小・一度きり・reduced-motion 対応）。
   ============================================================ */

/* -------- Keyframes -------- */
@keyframes da-spin    { to { transform: rotate(360deg); } }
@keyframes da-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes da-fade-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* -------- Fade / Slide Up（ワンショット） -------- */
.da-fade-in { animation: da-fade-in var(--da-dur-slow) var(--da-ease-out) both; }
.da-fade-up { animation: da-fade-up var(--da-dur-slow) var(--da-ease-out) both; }

/* -------- Scroll Reveal（main.js が .is-visible を付与） -------- */
.da-reveal {
	opacity: 0;
	transform: translateY(12px);          /* 微小移動のみ（16px超は禁止） */
	transition: opacity var(--da-dur-slow) var(--da-ease-out),
	            transform var(--da-dur-slow) var(--da-ease-out);
	will-change: opacity, transform;
}
.da-reveal.is-visible {
	opacity: 1;
	transform: none;
}
/* 連続要素の軽いスタッガー（inline style で --da-reveal-delay を指定） */
.da-reveal { transition-delay: var(--da-reveal-delay, 0ms); }

/* -------- Hover（持ち上げ） -------- */
.da-hover-raise {
	transition: transform var(--da-dur-fast) var(--da-ease-standard),
	            box-shadow var(--da-dur-fast) var(--da-ease-standard);
}
.da-hover-raise:hover {
	transform: translateY(-2px);
	box-shadow: var(--da-shadow-hover);
}

/* -------- Reduced Motion：動きを止める -------- */
@media (prefers-reduced-motion: reduce) {
	.da-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	.da-fade-in, .da-fade-up { animation: none !important; }
	.da-hover-raise:hover { transform: none; }
}