/**
 * Horizon Core: ENTRANCE MOTION on the home page (tenant setting `entrance_motion`), HORIZON-20261002-060.
 * Loaded only for a tenant with the setting, on its home page (Render/entrance-motion.php).
 *
 * Her old site (a creator site, Phase 1a review row A1) faded the hero words up, slid her cutout in from the right
 * and faded the three badges up one after another, each over 2s. Same feeling, faster (Alex: about 0.7-0.9s), and
 * built so it cannot cost anything:
 *  - transform and opacity only: nothing moves in the layout, so no layout shift;
 *  - the photo slides 48px, not "100% off-screen" (her old slide made the page up to 667px wider for 2s), inside
 *    the hero, which clips it;
 *  - nothing is hidden unless the visitor's device allows motion (prefers-reduced-motion), and the badges are only
 *    hidden once the head script has run, so without it they simply show.
 */

@media (prefers-reduced-motion: no-preference) {
	@keyframes hp-motion-rise {
		from { opacity: 0; transform: translateY(24px); }
		to   { opacity: 1; transform: none; }
	}
	@keyframes hp-motion-slide {
		from { opacity: 0; transform: translateX(48px); }
		to   { opacity: 1; transform: none; }
	}

	body.hp-motion.home .hp-hero .hp-hero__eyebrow,
	body.hp-motion.home .hp-hero .hp-hero__title,
	body.hp-motion.home .hp-hero .hp-hero__tagline,
	body.hp-motion.home .hp-hero .hp-hero__cta {
		animation: hp-motion-rise 0.7s cubic-bezier(0.2, 0.65, 0.25, 1) both;
	}
	body.hp-motion.home .hp-hero .hp-hero__title   { animation-delay: 0.08s; }
	body.hp-motion.home .hp-hero .hp-hero__tagline { animation-delay: 0.16s; }
	body.hp-motion.home .hp-hero .hp-hero__cta     { animation-delay: 0.24s; }

	body.hp-motion.home .hp-hero .hp-hero__bg {
		animation: hp-motion-slide 0.9s cubic-bezier(0.2, 0.65, 0.25, 1) 0.05s both;
	}

	/* The badge band: each badge fades up once, the first time the band comes on screen. */
	html.hp-motion-js body.hp-motion.home .hp-feature-cards--band .hp-feature-card {
		opacity: 0;
		transform: translateY(16px);
		transition: opacity 0.6s ease-out, transform 0.6s ease-out;
	}
	html.hp-motion-js body.hp-motion.home .hp-feature-cards--band.hp-in .hp-feature-card {
		opacity: 1;
		transform: none;
	}
	html.hp-motion-js body.hp-motion.home .hp-feature-cards--band .hp-feature-card:nth-child(2) { transition-delay: 0.12s; }
	html.hp-motion-js body.hp-motion.home .hp-feature-cards--band .hp-feature-card:nth-child(3) { transition-delay: 0.24s; }
}
