/* TekWurld Primary / motion. See motion.php for the class names.

   State classes on an animated element (added and removed by motion.js):
     tw-armed     the element takes part in scroll animation
     tw-from-top  its next reveal wipes downwards (otherwise upwards)
     tw-pre       the instant before a reveal: clipped shut, ready to open
     is-in        it is in the viewport (revealed)
     is-done      the reveal has finished: no animation styles apply at all

   Waiting elements are hidden with opacity and offset only, never with a
   clip-path: an IntersectionObserver also honours the target's own clip-path,
   so a clipped element could not be seen entering the viewport. */

:root{--twm-dur:.8s;--twm-ease:cubic-bezier(.22,.8,.24,1);--twm-delay:0s;--twm-offset:84px}
html{scroll-padding-top:var(--twm-offset)}
html.tw-smooth{scroll-behavior:auto!important}

/* Manual classes start hidden before the script arms them (no flash). */
.tw-motion-ready .tw-wipe-up:not(.tw-armed){opacity:0;transform:translateY(24px)}
.tw-motion-ready .tw-wipe-down:not(.tw-armed){opacity:0;transform:translateY(-24px)}

/* Waiting to enter the viewport. */
.tw-motion-ready .tw-armed:not(.is-in){opacity:0;transform:translateY(24px)}
.tw-motion-ready .tw-armed.tw-from-top:not(.is-in){transform:translateY(-24px)}

/* The start of a reveal: clipped shut from the edge it will open from. */
.tw-motion-ready .tw-armed.tw-pre:not(.is-in){clip-path:inset(100% -40px -40px -40px)}
.tw-motion-ready .tw-armed.tw-pre.tw-from-top:not(.is-in){clip-path:inset(-40px -40px 100% -40px)}

/* Revealing. The negative inset keeps shadows and outlines from being clipped. */
.tw-motion-ready .tw-armed.is-in:not(.is-done){
	opacity:1;
	clip-path:inset(-40px -40px -40px -40px);
	transform:none;
	transition:
		clip-path var(--twm-dur) var(--twm-ease) var(--twm-delay),
		transform var(--twm-dur) var(--twm-ease) var(--twm-delay),
		opacity calc(var(--twm-dur) * .55) ease var(--twm-delay);
}
/* Finished (.is-in.is-done): none of the rules above match, so the element is
   completely normal again: its own hover effects, shadows and overflow work. */

/* Timing helpers. */
.tw-delay-1{--twm-delay:.1s}.tw-delay-2{--twm-delay:.2s}.tw-delay-3{--twm-delay:.3s}
.tw-delay-4{--twm-delay:.4s}.tw-delay-5{--twm-delay:.5s}.tw-delay-6{--twm-delay:.6s}
.tw-dur-fast{--twm-dur:.55s}.tw-dur-slow{--twm-dur:1.3s}

@media (prefers-reduced-motion:reduce){
	.tw-wipe-up,.tw-wipe-down,.tw-armed{opacity:1!important;clip-path:none!important;transform:none!important;transition:none!important}
}
