/* Shared motion layer. All content stays visible until JavaScript opts in. */
.motion-progress {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2000;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, #a41c1e 0%, #055c26 58%, #f5a623 100%);
	transform: scaleX(0);
	transform-origin: left center;
	pointer-events: none;
}

.motion-word-mask {
	display: inline-block;
	overflow: hidden;
	vertical-align: bottom;
}

.motion-word {
	display: inline-block;
}

/* Keep generated word wrappers inline even inside headings with block-level spans. */
html body span.motion-word-mask,
html body span.motion-word {
	display: inline-block !important;
}

html.motion-fallback .motion-word {
	animation: motionWordEnter .7s cubic-bezier(.2,.75,.25,1) both;
	animation-delay: calc(.08s + var(--motion-word-index, 0) * 28ms);
}

html.motion-fallback [data-motion-reveal]:not(.motion-revealed) {
	opacity: 0;
	transform: translate3d(-26px, 20px, 0) scale(.96);
}

html.motion-fallback [data-motion-reveal][data-motion-direction="right"]:not(.motion-revealed) {
	transform: translate3d(26px, 20px, 0) scale(.96);
}

html.motion-fallback .construction-page .kk-services-section .kk-project-card[data-motion-reveal]:not(.motion-revealed) {
	clip-path: inset(100% 0 0 0);
	transform: perspective(900px) translate3d(0, 72px, 0) scale(.92, .72) rotateX(-12deg);
	transform-origin: center bottom;
}

html.motion-fallback .construction-page .kk-services-section .kk-project-card[data-motion-reveal] {
	transition: opacity .85s ease, transform 1s cubic-bezier(.2,.75,.25,1), clip-path 1s cubic-bezier(.2,.75,.25,1);
}

html.motion-fallback [data-motion-reveal] {
	transition: opacity .72s ease, transform .72s cubic-bezier(.2,.75,.25,1);
}

html.motion-fallback [data-motion-image]:not(.motion-revealed) {
	clip-path: inset(0 100% 0 0);
	transform: scale(1.12);
}

html.motion-fallback [data-motion-image] {
	transition: clip-path 1s cubic-bezier(.2,.75,.25,1), transform 1s cubic-bezier(.2,.75,.25,1);
}

.motion-zoom-frame {
	overflow: hidden;
}

.motion-zoom-frame > [data-motion-image] {
	transition: transform .8s cubic-bezier(.2,.75,.25,1);
}

.motion-zoom-frame:hover > [data-motion-image] {
	transform: scale(1.06);
}

.motion-page-enter {
	animation: motionPageEnter .42s cubic-bezier(.2,.7,.2,1) both;
}

.motion-page-leaving {
	opacity: 0;
	transition: opacity .18s ease;
}

.navbar,
.navbar-main {
	transition: box-shadow .3s ease, background-color .3s ease;
}

.navbar.motion-scrolled,
.navbar-main.motion-scrolled {
	box-shadow: 0 8px 28px rgba(12, 28, 20, .12);
}

.motion-magnetic {
	translate: var(--motion-magnet-x, 0px) var(--motion-magnet-y, 0px);
	transition: translate .22s cubic-bezier(.2,.75,.25,1);
}

.motion-tilt {
	transition: rotate .24s ease, box-shadow .35s ease;
}

@keyframes motionPageEnter {
	from { opacity: .82; }
	to { opacity: 1; }
}

@keyframes motionWordEnter {
	from { opacity: 0; transform: translate3d(0, 110%, 0); }
	to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes motionDropdownEnter {
	from { opacity: 0; transform: translate3d(0, 8px, 0) scale(.985); }
	to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@media (min-width: 992px) {
	.navbar .dropdown-menu.show,
	.navbar .nav-item.dropdown:hover > .dropdown-menu {
		transform-origin: top center;
		animation: motionDropdownEnter .22s cubic-bezier(.2,.75,.25,1) both;
	}
}

@media (prefers-reduced-motion: reduce) {
	.motion-page-enter,
	.motion-page-leaving {
		animation: none !important;
		transition: none !important;
	}

	html.motion-reduced .motion-word {
		animation: none !important;
	}

	.motion-magnetic,
	.motion-tilt,
	.motion-word-mask,
	.motion-word {
		translate: none !important;
		rotate: none !important;
		transform: none !important;
		will-change: auto;
	}

	.motion-progress {
		transition: none !important;
	}
}
