/**
 * Premium scroll reveal — vidljiviji “travel / resort” ulaz, jednokratno (.is-revealed).
 * Klase: .reveal, .reveal-up, .reveal-left, .reveal-right, .reveal-rotate-left, .reveal-rotate-right
 */

:root {
	/* Izraženiji “resort” ulaz: veći hod + duže trajanje */
	--cmrok-reveal-dur: 1.45s;
	--cmrok-reveal-dur-opacity: 1.25s;
	/* Lagani zalet, dug meki završetak */
	--cmrok-reveal-ease: cubic-bezier(0.18, 0.98, 0.32, 1);
	--cmrok-reveal-shift: 80px;
}

.reveal,
.reveal-up,
.reveal-left,
.reveal-right,
.reveal-rotate-left,
.reveal-rotate-right {
	opacity: 0;
	transition:
		opacity var(--cmrok-reveal-dur-opacity) var(--cmrok-reveal-ease),
		transform var(--cmrok-reveal-dur) var(--cmrok-reveal-ease);
	transition-delay: var(--cmrok-reveal-delay, 0ms);
	will-change: transform, opacity;
}

/* Zadano: blagi pomak odozdo (kao reveal-up) */
.reveal {
	transform: translate3d(0, var(--cmrok-reveal-shift), 0);
}

.reveal-up {
	transform: translate3d(0, var(--cmrok-reveal-shift), 0);
}

.reveal-left {
	transform: translate3d(calc(-1 * var(--cmrok-reveal-shift)), 0, 0);
}

.reveal-right {
	transform: translate3d(var(--cmrok-reveal-shift), 0, 0);
}

.reveal-rotate-left {
	transform: translate3d(calc(-0.85 * var(--cmrok-reveal-shift)), 36px, 0) rotate(-2.5deg);
}

.reveal-rotate-right {
	transform: translate3d(calc(0.85 * var(--cmrok-reveal-shift)), 36px, 0) rotate(2.5deg);
}

.reveal.is-revealed,
.reveal-up.is-revealed,
.reveal-left.is-revealed,
.reveal-right.is-revealed,
.reveal-rotate-left.is-revealed,
.reveal-rotate-right.is-revealed {
	opacity: 1;
	transform: translate3d(0, 0, 0) rotate(0deg);
	will-change: auto;
}

/* Podnožje se ne animira (niti ako netko naknadno doda reveal klase). */
footer.reveal,
footer.reveal-up,
footer.reveal-left,
footer.reveal-right,
footer.reveal-rotate-left,
footer.reveal-rotate-right,
footer .reveal,
footer .reveal-up,
footer .reveal-left,
footer .reveal-right,
footer .reveal-rotate-left,
footer .reveal-rotate-right {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
	filter: none !important;
	will-change: auto !important;
}

@media (prefers-reduced-motion: reduce) {
	.reveal,
	.reveal-up,
	.reveal-left,
	.reveal-right,
	.reveal-rotate-left,
	.reveal-rotate-right {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		will-change: auto !important;
	}
}
