/**
 * Keyframes and scroll-reveal behaviour.
 *
 * Every animation here is disabled wholesale under prefers-reduced-motion.
 */

@keyframes nk-marquee {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-50%);
	}
}

@keyframes nk-float-a {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-14px);
	}
}

@keyframes nk-float-b {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(11px);
	}
}

@keyframes nk-rise {
	from {
		opacity: 0;
		transform: translateY(26px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes nk-fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes nk-blob {
	0%,
	100% {
		transform: translate(0, 0) scale(1);
	}

	33% {
		transform: translate(38px, -26px) scale(1.08);
	}

	66% {
		transform: translate(-24px, 20px) scale(0.95);
	}
}

@keyframes nk-sheen {
	0% {
		transform: translateX(-120%);
	}

	100% {
		transform: translateX(220%);
	}
}

@keyframes nk-pulse {
	0%,
	100% {
		opacity: 0.35;
		transform: scale(1);
	}

	50% {
		opacity: 0.9;
		transform: scale(1.35);
	}
}

@keyframes nk-unclip {
	from {
		clip-path: inset(0 0 100% 0);
	}

	to {
		clip-path: inset(0 0 0 0);
	}
}

/* Scroll reveal.
 *
 * Gated on .nk-js, which functions.php sets synchronously in the document head.
 * Without JavaScript the class never appears and every section renders visible,
 * so a script failure can never leave the page blank. */
.nk-js [data-reveal] {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity var(--nk-dur) var(--nk-ease), transform var(--nk-dur) var(--nk-ease);
}

.nk-js [data-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}

	.nk-js [data-reveal] {
		opacity: 1;
		transform: none;
	}
}