/**
 * Shared CTA icon set (inc/cta-icon.php, medallion_render_cta_icon()) —
 * selectable per-button via an "Icon" field on Image + Text's CTA, the
 * "Let's Make It Real" Content Blocks layout, and the Site Options–driven
 * global "Let's Make It Real" banner. All three share this one stylesheet
 * so the icon looks and animates identically no matter which button it's
 * in.
 *
 * Each icon's hover animation is scoped to just its own animated PART
 * (.cta-icon-arrow for Download, .cta-icon-pin for Location Pin) — never
 * the whole .cta-icon svg — and triggered off whichever button wraps it.
 * .image-text-cta, .lmir-button, and .combo-save-pdf (single-combinations.php's
 * "Save selections to PDF") are the CTA button classes in the project so
 * far; add another here if a future button type needs these icons too.
 */

.cta-icon {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

/* ---- Download: the tray stays put; the arrow drops down into it,
   fades out, then reappears at the top and repeats. ---- */

.image-text-cta:hover .cta-icon-arrow,
.lmir-button:hover .cta-icon-arrow,
.combo-save-pdf:hover .cta-icon-arrow {
	animation: cta-icon-drop 1.1s ease-in-out infinite;
}

@keyframes cta-icon-drop {
	0% {
		transform: translateY(0);
		opacity: 1;
	}
	35% {
		transform: translateY(2.5px);
		opacity: 1;
	}
	50% {
		transform: translateY(2.5px);
		opacity: 0;
	}
	51% {
		transform: translateY(-2.5px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

/* ---- Location Pin: a small hop, per chat. ---- */

.image-text-cta:hover .cta-icon-pin,
.lmir-button:hover .cta-icon-pin {
	animation: cta-icon-bounce 0.6s ease-in-out infinite;
}

@keyframes cta-icon-bounce {
	0%,
	100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-3px);
	}
}

/* Respect reduced-motion preferences — both icons still work fine sitting
   still; only the hover animation is skipped. */
@media (prefers-reduced-motion: reduce) {
	.image-text-cta:hover .cta-icon-arrow,
	.lmir-button:hover .cta-icon-arrow,
	.combo-save-pdf:hover .cta-icon-arrow,
	.image-text-cta:hover .cta-icon-pin,
	.lmir-button:hover .cta-icon-pin {
		animation: none;
	}
}