/*
  WPCode → CSS Snippet → UP Moto Hero Animations
  Insertion: Site Wide Header (<head>)
*/

@keyframes upm-hero-image-in {
	from { opacity: 0.9; }
	to { opacity: 1; }
}

@keyframes upm-hero-title-in {
	from { opacity: 0; transform: translate3d(-28px, 0, 0); }
	to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes upm-hero-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes upm-dust-a {
	0%   { transform: translate(0, 0); opacity: 0; }
	8%   { opacity: 0.75; }
	100% { transform: translate(90px, -35px); opacity: 0; }
}

@keyframes upm-dust-b {
	0%   { transform: translate(0, 0); opacity: 0; }
	10%  { opacity: 0.65; }
	100% { transform: translate(-70px, -50px); opacity: 0; }
}

@keyframes upm-dust-c {
	0%   { transform: translate(0, 0); opacity: 0; }
	12%  { opacity: 0.8; }
	100% { transform: translate(55px, 40px); opacity: 0; }
}

.upm-hero__image {
	animation: upm-hero-image-in 1s ease-out both;
	transform: none !important;
}

.upm-hero__title {
	opacity: 0;
	animation: upm-hero-title-in 0.8s ease-out both;
}

.upm-hero__subtitle {
	opacity: 0;
	animation: upm-hero-fade-in 0.8s ease-out 0.2s both;
}

.upm-hero__cta {
	opacity: 0;
	animation: upm-hero-fade-in 0.8s ease-out 0.35s both;
}

@keyframes upm-hero-scroll-bob {
	0%, 100% { transform: translateX(-50%) translateY(0); }
	50%      { transform: translateX(-50%) translateY(6px); }
}

@keyframes upm-hero-chevron-a {
	0%, 100% { opacity: 0.35; transform: translateY(0); }
	50%      { opacity: 1; transform: translateY(7px); }
}

@keyframes upm-hero-chevron-b {
	0%, 100% { opacity: 0.55; transform: translateY(0); }
	50%      { opacity: 1; transform: translateY(9px); }
}

@keyframes upm-hero-lights-glow {
	0%   { filter: brightness(1) drop-shadow(0 0 0 rgba(255, 220, 160, 0)); }
	35%  { filter: brightness(1.12) drop-shadow(0 0 18px rgba(255, 210, 140, 0.35)); }
	100% { filter: brightness(1) drop-shadow(0 0 8px rgba(255, 210, 140, 0.12)); }
}

.upm-hero.is-intro-lighting .upm-hero__lights.is-lit {
	animation: upm-hero-lights-glow 2.4s ease-out 650ms 1 both;
}

.upm-hero.is-intro-idle .upm-hero__scroll-hint,
.upm-hero.is-intro-done .upm-hero__scroll-hint {
	animation: upm-hero-scroll-bob 2.4s ease-in-out infinite;
}

.upm-hero.is-intro-done:not(.is-intro-idle) .upm-hero__scroll-hint:not(.is-hidden) {
	opacity: 1;
	visibility: visible;
}

html.upm-hero-intro-lock {
	overflow: hidden !important;
	scrollbar-gutter: stable;
}

html.upm-hero-intro-lock body {
	overflow: hidden !important;
	touch-action: none;
}

html.upm-safari-native.upm-hero-intro-lock,
html.upm-safari-native.upm-hero-intro-lock body {
	overflow: auto !important;
	overflow-y: auto !important;
	touch-action: pan-y !important;
	height: auto !important;
	position: relative !important;
}

html.lenis.upm-hero-intro-lock,
html.lenis.upm-hero-intro-lock body {
	overflow: hidden !important;
}

@media (max-width: 900px), (hover: none) and (pointer: coarse) {
	html.upm-hero-intro-lock,
	html.upm-hero-intro-lock body {
		overflow: auto !important;
		overflow-y: auto !important;
		touch-action: pan-y !important;
		height: auto !important;
		position: static !important;
	}

	/* Hero fixed ozadje ne sme biti pod headerjem — odstrani miganje */
	.upm-hero__media {
		top: var(--upm-header-h, 72px) !important;
		height: calc(var(--hero-section-height, 100vh) - var(--upm-header-h, 72px)) !important;
		min-height: calc(var(--hero-section-height, 100vh) - var(--upm-header-h, 72px)) !important;
	}

	.upm-hero__media.is-past {
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
	}
}

html.upm-safari-native .upm-hero__media.is-past {
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: none !important;
	z-index: 0 !important;
}

.upm-hero.is-offscreen,
.upm-hero.is-offscreen * {
	animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
	.upm-hero__image,
	.upm-hero__title,
	.upm-hero__subtitle,
	.upm-hero__cta,
	.upm-hero__dust i,
	.upm-hero__scroll-hint,
	.upm-hero__lights {
		animation: none !important;
	}

	.upm-hero__title,
	.upm-hero__subtitle,
	.upm-hero__cta {
		opacity: 1 !important;
		transform: none !important;
	}

	.upm-hero__scroll-hint {
		display: none !important;
	}

	.upm-hero__lights.is-lit {
		opacity: 1 !important;
		filter: none !important;
	}

	.upm-hero__cta {
		transition: none !important;
	}
}

/* Hero gumb — preglasi stari scale3d hover iz Elementor widgeta */
.upm-hero a.upm-hero__cta,
a.upm-hero__cta {
	text-decoration: none !important;
}

.upm-hero a.upm-hero__cta:hover,
.upm-hero a.upm-hero__cta:focus-visible,
a.upm-hero__cta:hover,
a.upm-hero__cta:focus-visible {
	transform: translateY(-4px) !important;
	border-color: rgba(255, 76, 46, 0.22) !important;
	box-shadow: 0 24px 56px rgba(17, 17, 17, 0.14) !important;
	background:
		linear-gradient(135deg, rgba(17, 17, 17, 0.2) 0%, transparent 42%),
		#ff4c2e !important;
	color: #ffffff !important;
	font-weight: 400 !important;
	text-decoration: none !important;
	filter: none !important;
	outline: none !important;
}

.upm-hero a.upm-hero__cta:focus-visible,
a.upm-hero__cta:focus-visible {
	outline: 2px solid rgba(255, 76, 46, 0.45) !important;
	outline-offset: 3px;
}