/*
 * ImageVault Pro animations: every keyframe the product uses, plus utility classes.
 *
 * Only the resting states below sit outside the motion query, and they are the visible,
 * finished states, so with reduced motion everything is simply there and usable.
 * Animated parts are drawn in their final position; keyframes animate *from* elsewhere.
 */

.ivp-app .ivp-anim-fade-up,
.ivp-app .ivp-anim-fade-in,
.ivp-app .ivp-anim-scale-in,
.ivp-app .ivp-anim-slide-left,
.ivp-app .ivp-anim-slide-right,
.ivp-app .ivp-anim-float,
.ivp-app .ivp-anim-float-slow,
.ivp-app .ivp-anim-glow,
.ivp-app .ivp-anim-shimmer,
.ivp-app .ivp-animate-in,
.ivp-app [data-ivp-reveal] {
	opacity: 1;
}

.ivp-app .ivp-anim-draw,
.ivp-app .ivp-il-draw {
	stroke-dashoffset: 0;
}

.ivp-app .ivp-count {
	font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: no-preference) {

	/* Keyframes ---------------------------------------------------------- */

	@keyframes ivp-fadeUp {
		from { opacity: 0; transform: translate3d(0, var(--ivp-rise, 16px), 0); }
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-fadeIn {
		from { opacity: 0; }
		to { opacity: 1; }
	}

	@keyframes ivp-scaleIn {
		from { opacity: 0; transform: scale(var(--ivp-scale-from, 0.92)); }
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-slideInLeft {
		from { opacity: 0; transform: translate3d(calc(-1 * var(--ivp-slide, 24px)), 0, 0); }
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-slideInRight {
		from { opacity: 0; transform: translate3d(var(--ivp-slide, 24px), 0, 0); }
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-float {
		0%, 100% { transform: translate3d(0, 0, 0); }
		50% { transform: translate3d(0, var(--ivp-float-y, -10px), 0); }
	}

	@keyframes ivp-floatSlow {
		0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
		50% { transform: translate3d(var(--ivp-float-x, 8px), var(--ivp-float-y, -14px), 0) rotate(var(--ivp-float-r, 2deg)); }
	}

	@keyframes ivp-pulseGlow {
		0% { box-shadow: 0 0 0 0 var(--ivp-glow-color), var(--ivp-shadow-glow); }
		70% { box-shadow: 0 0 0 14px transparent, var(--ivp-shadow-glow); }
		100% { box-shadow: 0 0 0 0 transparent, var(--ivp-shadow-glow); }
	}

	@keyframes ivp-pulse {
		0%, 100% { opacity: 1; transform: scale(1); }
		50% { opacity: 0.6; transform: scale(var(--ivp-pulse-scale, 1.08)); }
	}

	@keyframes ivp-spin {
		to { transform: rotate(360deg); }
	}

	@keyframes ivp-shimmer {
		from { background-position: 200% 0; }
		to { background-position: -200% 0; }
	}

	@keyframes ivp-gradientShift {
		0%, 100% { background-position: 0% 50%; }
		50% { background-position: 100% 50%; }
	}

	@keyframes ivp-drawLine {
		from { stroke-dashoffset: var(--ivp-dash, 1); }
		to { stroke-dashoffset: 0; }
	}

	@keyframes ivp-dashMarch {
		to { stroke-dashoffset: calc(-1 * var(--ivp-dash-len, 20)); }
	}

	@keyframes ivp-blobMorph {
		0%, 100% { border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%; }
		33% { border-radius: 70% 30% 46% 54% / 30% 39% 61% 70%; }
		66% { border-radius: 33% 67% 38% 62% / 62% 38% 62% 38%; }
	}

	@keyframes ivp-wiggle {
		0%, 100% { transform: rotate(0deg); }
		20% { transform: rotate(-8deg); }
		40% { transform: rotate(6deg); }
		60% { transform: rotate(-4deg); }
		80% { transform: rotate(2deg); }
	}

	@keyframes ivp-checkPop {
		0% { opacity: 0; transform: scale(0); }
		60% { opacity: 1; transform: scale(1.18); }
		100% { opacity: 1; transform: scale(1); }
	}

	@keyframes ivp-bounceSoft {
		0%, 100% { transform: translate3d(0, 0, 0); }
		30% { transform: translate3d(0, var(--ivp-bounce, -8px), 0); }
		55% { transform: translate3d(0, 0, 0); }
		75% { transform: translate3d(0, calc(var(--ivp-bounce, -8px) / 3), 0); }
	}

	@keyframes ivp-confettiFall {
		0% { opacity: 0; transform: translate3d(0, 0, 0) rotate(0deg); }
		12% { opacity: 1; }
		100% { opacity: 0; transform: translate3d(var(--ivp-drift, 0px), var(--ivp-fall, 600%), 0) rotate(var(--ivp-spin, 540deg)); }
	}

	@keyframes ivp-ripple {
		from { opacity: 0.32; transform: scale(0); }
		to { opacity: 0; transform: scale(var(--ivp-ripple-scale, 4)); }
	}

	@keyframes ivp-twinkle {
		0%, 100% { opacity: 1; transform: scale(1); }
		50% { opacity: 0.25; transform: scale(0.6); }
	}

	@keyframes ivp-drift {
		0%, 100% { transform: translate3d(0, 0, 0); }
		50% { transform: translate3d(var(--ivp-drift-x, 18px), 0, 0); }
	}

	@keyframes ivp-orbit {
		to { transform: rotate(360deg); }
	}

	@keyframes ivp-keyTurn {
		0%, 20% { transform: rotate(0deg); }
		40%, 70% { transform: rotate(-90deg); }
		90%, 100% { transform: rotate(0deg); }
	}

	@keyframes ivp-flapOpen {
		from { transform: scaleY(-1); }
		to { transform: scaleY(1); }
	}

	@keyframes ivp-rise {
		from { opacity: 0; transform: translate3d(0, var(--ivp-rise, 28px), 0); }
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-planeFly {
		0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
		25% { transform: translate3d(6px, -10px, 0) rotate(-4deg); }
		50% { transform: translate3d(12px, -4px, 0) rotate(2deg); }
		75% { transform: translate3d(4px, 6px, 0) rotate(3deg); }
	}

	@keyframes ivp-converge {
		from { opacity: 1; transform: translate3d(var(--ivp-from-x, 0px), var(--ivp-from-y, 0px), 0) scale(1); }
		to { opacity: 0; transform: translate3d(0, 0, 0) scale(0.2); }
	}

	@keyframes ivp-gaugeFill {
		from { stroke-dashoffset: 1; }
	}

	@keyframes ivp-needleSweep {
		from { transform: rotate(var(--ivp-needle-from, -150deg)); }
		to { transform: rotate(0deg); }
	}

	@keyframes ivp-ringFill {
		from { stroke-dashoffset: 100; }
	}

	@keyframes ivp-flicker {
		0%, 100% { transform: scaleY(1); opacity: 1; }
		50% { transform: scaleY(0.78); opacity: 0.85; }
	}

	@keyframes ivp-toastProgress {
		from { transform: scaleX(1); }
		to { transform: scaleX(0); }
	}

	@keyframes ivp-loadingBar {
		from { width: 0; }
		to { width: 85%; }
	}

	@keyframes ivp-indeterminate {
		from { transform: translateX(-100%); }
		to { transform: translateX(260%); }
	}

	@keyframes ivp-revealFailsafe {
		to { opacity: 1; transform: none; }
	}

	@keyframes ivp-shake {
		0%, 100% { transform: translate3d(0, 0, 0); }
		15%, 55% { transform: translate3d(calc(-1 * var(--ivp-shake, 6px)), 0, 0); }
		35%, 75% { transform: translate3d(var(--ivp-shake, 6px), 0, 0); }
	}

	@keyframes ivp-flipOut {
		from { opacity: 1; transform: perspective(1200px) rotateY(0deg); }
		to { opacity: 0; transform: perspective(1200px) rotateY(90deg); }
	}

	@keyframes ivp-flipIn {
		from { opacity: 0; transform: perspective(1200px) rotateY(-90deg); }
		to { opacity: 1; transform: perspective(1200px) rotateY(0deg); }
	}

	@keyframes ivp-keyUnlock {
		0% { transform: rotate(0deg); }
		55% { transform: rotate(-90deg); }
		70% { transform: rotate(-82deg); }
		100% { transform: rotate(-90deg); }
	}

	@keyframes ivp-planeAway {
		0% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
		25% { opacity: 1; transform: translate3d(-14px, 8px, 0) rotate(6deg) scale(1); }
		100% { opacity: 0; transform: translate3d(220px, -160px, 0) rotate(-18deg) scale(0.5); }
	}

	@keyframes ivp-shackleClose {
		0% { transform: translate3d(0, -18px, 0); stroke-dashoffset: 1; }
		60% { transform: translate3d(0, -18px, 0); stroke-dashoffset: 0; }
		85% { transform: translate3d(0, 2px, 0); stroke-dashoffset: 0; }
		100% { transform: translate3d(0, 0, 0); stroke-dashoffset: 0; }
	}

	/* Utilities ---------------------------------------------------------- */

	.ivp-app .ivp-anim-fade-up,
	.ivp-app .ivp-animate-in {
		animation: ivp-fadeUp var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-animate-in {
		animation-delay: calc(var(--ivp-stagger, 0) * var(--ivp-stagger-step));
	}

	.ivp-app .ivp-anim-fade-in {
		animation: ivp-fadeIn var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-scale-in {
		animation: ivp-scaleIn var(--ivp-dur-slow) var(--ivp-ease-spring) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-slide-left {
		animation: ivp-slideInLeft var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-slide-right {
		animation: ivp-slideInRight var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-float {
		animation: ivp-float 6s var(--ivp-ease-in-out) infinite;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-float-slow {
		animation: ivp-floatSlow 11s var(--ivp-ease-in-out) infinite;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-glow {
		animation: ivp-pulseGlow 2.4s ease-out infinite;
	}

	.ivp-app .ivp-anim-shimmer {
		background-image: linear-gradient(90deg, transparent 25%, var(--ivp-skeleton-shine) 50%, transparent 75%);
		background-size: 200% 100%;
		background-repeat: no-repeat;
		animation: ivp-shimmer 1.6s linear infinite;
	}

	.ivp-app .ivp-anim-draw {
		stroke-dasharray: 1;
		animation: ivp-drawLine 1.4s var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-spin {
		animation: ivp-spin 1s linear infinite;
	}

	.ivp-app .ivp-anim-wiggle {
		animation: ivp-wiggle 0.8s var(--ivp-ease-in-out) both;
	}

	.ivp-app .ivp-anim-bounce {
		animation: ivp-bounceSoft 1.6s var(--ivp-ease) infinite;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app .ivp-anim-gradient {
		background-size: 200% 200%;
		animation: ivp-gradientShift 8s var(--ivp-ease-in-out) infinite;
	}

	.ivp-app .ivp-anim-blob {
		animation: ivp-blobMorph 14s var(--ivp-ease-in-out) infinite, ivp-floatSlow 18s var(--ivp-ease-in-out) infinite;
	}

	.ivp-app .ivp-anim-pop {
		animation: ivp-checkPop 0.5s var(--ivp-ease-spring) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	/* Stagger: set --i inline on each child. Placed after the utilities so its delay wins. */
	.ivp-app .ivp-stagger > * {
		animation-delay: calc(var(--i, 0) * var(--ivp-stagger-step));
	}

	/* Scroll reveal (reveal.js adds .ivp-in). Hidden only when JS is known to run, and
	   a failsafe shows the content after 3s even if the observer never fires. */
	.ivp-js .ivp-app [data-ivp-reveal]:not(.ivp-in),
	.ivp-js .ivp-app [data-ivp-reveal="stagger"]:not(.ivp-in) > * {
		opacity: 0;
		animation: ivp-revealFailsafe 1ms 3s forwards;
	}

	.ivp-js .ivp-app [data-ivp-reveal="stagger"]:not(.ivp-in) {
		opacity: 1;
		animation: none;
	}

	.ivp-app [data-ivp-reveal].ivp-in {
		animation: ivp-fadeUp var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: var(--ivp-delay, 0s);
	}

	.ivp-app [data-ivp-reveal="fade"].ivp-in { animation-name: ivp-fadeIn; }
	.ivp-app [data-ivp-reveal="scale"].ivp-in { animation-name: ivp-scaleIn; animation-timing-function: var(--ivp-ease-spring); }
	.ivp-app [data-ivp-reveal="left"].ivp-in { animation-name: ivp-slideInLeft; }
	.ivp-app [data-ivp-reveal="right"].ivp-in { animation-name: ivp-slideInRight; }

	.ivp-app [data-ivp-reveal="stagger"].ivp-in {
		animation: none;
	}

	.ivp-app [data-ivp-reveal="stagger"].ivp-in > * {
		animation: ivp-fadeUp var(--ivp-dur-slow) var(--ivp-ease) both;
		animation-delay: calc(var(--i, 0) * var(--ivp-stagger-step));
	}

	/* Illustration parts. SVG transforms need fill-box so they pivot on themselves. */
	.ivp-app .ivp-illus :where([class*="ivp-il-"]) {
		transform-box: fill-box;
		transform-origin: center;
	}

	.ivp-app .ivp-il-float { animation: ivp-float 6s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-float-slow { animation: ivp-floatSlow 10s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-drift { animation: ivp-drift 9s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-twinkle { animation: ivp-twinkle 2.6s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-pulse { animation: ivp-pulse 2.8s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-spin { animation: ivp-spin 6s linear infinite; }
	.ivp-app .ivp-il-spin-slow { animation: ivp-spin 14s linear infinite; }
	.ivp-app .ivp-il-spin-rev { animation: ivp-spin 9.3s linear infinite reverse; }
	.ivp-app .ivp-il-orbit { animation: ivp-orbit 16s linear infinite; transform-box: view-box; }
	.ivp-app .ivp-il-draw { stroke-dasharray: 1; animation: ivp-drawLine 1.6s var(--ivp-ease) both; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-dash { animation: ivp-dashMarch 1.2s linear infinite; }
	.ivp-app .ivp-il-pop { animation: ivp-checkPop 0.6s var(--ivp-ease-spring) both; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-bounce { animation: ivp-bounceSoft 2.2s var(--ivp-ease) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-wiggle { animation: ivp-wiggle 3.6s var(--ivp-ease-in-out) infinite; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-key { animation: ivp-keyTurn 4.8s var(--ivp-ease-in-out) infinite; transform-box: view-box; }
	.ivp-app .ivp-il-flap { animation: ivp-flapOpen 0.9s var(--ivp-ease) both; animation-delay: var(--ivp-delay, 0.2s); transform-origin: 50% 100%; }
	.ivp-app .ivp-il-rise { animation: ivp-rise 0.9s var(--ivp-ease) both; animation-delay: var(--ivp-delay, 0.6s); }
	.ivp-app .ivp-il-plane { animation: ivp-planeFly 7s var(--ivp-ease-in-out) infinite; }
	.ivp-app .ivp-il-converge { animation: ivp-converge 1.2s var(--ivp-ease) both; animation-delay: var(--ivp-delay, 0s); }
	.ivp-app .ivp-il-gauge { animation: ivp-gaugeFill 2s var(--ivp-ease) both; }
	.ivp-app .ivp-il-needle { animation: ivp-needleSweep 2s var(--ivp-ease-spring) both; transform-box: view-box; }
	.ivp-app .ivp-il-flicker { animation: ivp-flicker 0.35s var(--ivp-ease-in-out) infinite; transform-origin: 50% 0%; }
	.ivp-app .ivp-il-ripple { animation: ivp-ripple 2.4s var(--ivp-ease) infinite; animation-delay: var(--ivp-delay, 0s); --ivp-ripple-scale: 1.6; }
	.ivp-app .ivp-il-confetti { animation: ivp-confettiFall 2.4s var(--ivp-ease) infinite; animation-delay: var(--ivp-delay, 0s); --ivp-fall: 320%; }
}