/* ────────────────────────────────────────────────────────────
   03-animations.css — Scroll-triggered entrance animations
   Uses @keyframes + animation instead of transition so it
   never conflicts with component-level transition properties
   (e.g. box-shadow hover transitions on .card).
   ──────────────────────────────────────────────────────────── */

@keyframes hfgp-fade-up {
	from {
		opacity: 0;
		transform: translateY(28px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Hidden initial state — JS adds this on page load */
.will-animate {
	opacity: 0;
	transform: translateY(28px);
}

/* Revealed — JS adds this when the element enters the viewport */
.will-animate.is-visible {
	animation: hfgp-fade-up 0.55s ease both;
	animation-delay: var(--anim-delay, 0s);
}

@media (prefers-reduced-motion: reduce) {
	.will-animate {
		opacity: 1;
		transform: none;
	}
	.will-animate.is-visible {
		animation: none;
	}
}