:root {
    --motion-ease: cubic-bezier(.22, 1, .36, 1);
    --motion-duration: 720ms;
}

.motion-progress {
    position: fixed;
    z-index: 1001;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    pointer-events: none;
    transform: scaleX(var(--motion-progress, 0));
    transform-origin: 0 50%;
    background: linear-gradient(90deg, #7657ff, #b47bff 60%, #7f8cff);
    transition: transform 120ms linear;
}

.mega-menu {
    transform: translate3d(0, 10px, 0) scale(.985);
    transform-origin: 50% 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 240ms var(--motion-ease), transform 360ms var(--motion-ease);
}

.nav-item:hover > .mega-menu,
.nav-item:focus-within > .mega-menu,
.nav-item.is-open > .mega-menu { opacity: 1; transform: translate3d(0, 0, 0) scale(1); pointer-events: auto; }

.language-switch__menu {
    transform: translateY(8px) scale(.98);
    transform-origin: 100% 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms var(--motion-ease), transform 260ms var(--motion-ease);
}

.language-switch[open] .language-switch__menu { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.language-switch--mobile .language-switch__menu { transform: translateX(-50%) translateY(8px) scale(.98); }
.language-switch--mobile[open] .language-switch__menu { transform: translateX(-50%) translateY(0) scale(1); }

.hero__media { transform: translate3d(var(--motion-hero-x, 0px), var(--motion-hero-y, 0px), 0); transition: transform 900ms var(--motion-ease); }

html:not(.motion-reduced) { scroll-behavior: smooth; }

body.motion-active .motion-fade-up {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition: opacity var(--motion-duration) var(--motion-ease), transform var(--motion-duration) var(--motion-ease);
    transition-delay: var(--motion-delay, 0ms);
    will-change: opacity, transform;
}

body.motion-active .motion-fade-up.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

body.motion-active .motion-scale-in {
    opacity: 0;
    transform: scale(.97);
    transition: opacity 650ms var(--motion-ease), transform 650ms var(--motion-ease);
    transition-delay: var(--motion-delay, 0ms);
}

body.motion-active .motion-scale-in.is-visible { opacity: 1; transform: scale(1); }

.motion-hover-lift { transition: transform 500ms var(--motion-ease), box-shadow 500ms var(--motion-ease); }

@media (max-width: 900px) {
    .hero__media { transform: none; transition: none; }
}

@media (hover: hover) and (pointer: fine) {
    .motion-hover-lift:hover { transform: translateY(-6px); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    body.motion-active .motion-fade-up,
    body.motion-active .motion-scale-in { opacity: 1; transform: none; transition: none; }
    .motion-hover-lift, .hero__media { transition: none; transform: none; }
    .motion-progress { display: none; }
}