/* Components, continued: images fading in (assets/js/reveal.js). Part of the RUB Chair theme. */

/* Soft appearance of images (assets/js/reveal.js): with JavaScript, images
   start transparent and fade in over 0.4 s once loaded. Fallback: should the
   script never run, they appear after 3 s anyway. Not for visitors who
   prefer reduced motion. */
@media (prefers-reduced-motion: no-preference) {
	.rub-js :is(.rub-content, .rub-card) img {
		opacity: 0;
		transition: opacity 0.4s ease-out;
	}

	.rub-js :is(.rub-content, .rub-card) img:not(.is-loaded) {
		animation: rub-img-failsafe 0.4s ease-out 3s forwards;
	}

	.rub-js :is(.rub-content, .rub-card) img.is-loaded {
		opacity: 1;
	}
}

@keyframes rub-img-failsafe {
	to {
		opacity: 1;
	}
}


.rub-card {
	transition: opacity 0.7s ease, transform 0.7s ease, box-shadow var(--rub-transition);
}

.rub-card.rub-reveal {
	opacity: 0;
	transform: translateY(18px);
}

@media (prefers-reduced-motion: reduce) {
	.rub-content img,
	.rub-card img,
	.rub-card {
		transition: none;
	}
}
