/**
 * VG Step 6 motion. Content stays visible unless JS opts in.
 * prefers-reduced-motion: no movement.
 */
.vg-reveal {
	opacity: 1;
	transform: none;
}

html.vg-motion-on .vg-reveal {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 0.45s ease, transform 0.45s ease;
}

html.vg-motion-on .vg-reveal.is-in {
	opacity: 1;
	transform: none;
}

html.vg-motion-on .vg-hero-rise {
	animation: vg-hero-rise 0.7s ease both;
}

@keyframes vg-hero-rise {
	from { opacity: 1; transform: translateY(18px); }
	to { opacity: 1; transform: none; }
}

html.vg-motion-on .vg-hero-rise,
html.vg-motion-on .vg-hero-rise h1,
html.vg-motion-on .vg-hero-rise .sa-vg-hero-subhead,
html.vg-motion-on .vg-hero-rise .sa-vg-hero-lede,
html.vg-motion-on .vg-hero-rise .sa-vg-hero-actions {
	opacity: 1;
}

html.vg-motion-on .vg-hero-drift,
html.vg-motion-on .sa-vg-hero-map-network {
	animation: vg-hero-drift 28s ease-in-out infinite alternate;
}

@keyframes vg-hero-drift {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-10px, 8px, 0); }
}

html.vg-motion-on .sa-vg-feature-card:hover,
html.vg-motion-on .sa-vg-product-card:hover,
html.vg-motion-on .sa-vis-section:hover,
html.vg-motion-on .vg-pricing .vg-plan:hover {
	transform: translateY(-4px);
	box-shadow: var(--vg-shadow-card-strong, 0 22px 50px rgba(11, 28, 36, 0.10));
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

html.vg-motion-on .sa-vg-feature-card__icon:hover,
html.vg-motion-on .vg-icon-nudge:hover {
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	html.vg-motion-on .vg-reveal,
	html.vg-motion-on .vg-hero-rise,
	html.vg-motion-on .vg-hero-drift,
	html.vg-motion-on .sa-vg-hero-map-network,
	html.vg-motion-on .sa-vg-feature-card,
	html.vg-motion-on .sa-vg-product-card,
	html.vg-motion-on .sa-vis-section,
	html.vg-motion-on .vg-pricing .vg-plan,
	html.vg-motion-on .sa-vg-feature-card__icon {
		animation: none !important;
		transition: none !important;
		transform: none !important;
		opacity: 1 !important;
	}
}
