/* Owner-approved preview scope: homepage and MPPFO 4, UA/RU/EN. */
.mp-motion-pilot {
    --mp-pilot-ease: cubic-bezier(.22, 1, .36, 1);
    --mp-pilot-control: 500ms;
    --mp-pilot-heading: 1300ms;
    --mp-pilot-photo: 1600ms;
}

/* Stable hit area; only decorative content rolls. */
.mp-design-0799.mp-motion-pilot .mp-pilot-button {
    --mp-pilot-hover: 0;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background-color: var(--mp-pilot-button-background) !important;
    color: var(--mp-pilot-button-color) !important;
    transform: none !important;
    filter: none !important;
    transition: box-shadow var(--mp-pilot-control) var(--mp-pilot-ease) !important;
}
.mp-pilot-label-window { position: relative; display: block; overflow: hidden; min-width: 0; }
/* Absolute copies do not receive the anchor's propagated text decoration.
 * Paint it on both layers, so plain Hero links keep their underline on hover. */
.mp-pilot-underlined :is(.mp-pilot-label, .mp-pilot-label-copy) {
    text-decoration: underline;
    text-underline-offset: 5px;
}
.mp-pilot-label, .mp-pilot-label-copy {
    display: block;
    transition: transform var(--mp-pilot-control) var(--mp-pilot-ease), opacity var(--mp-pilot-control) var(--mp-pilot-ease);
}
.mp-pilot-label {
    opacity: calc(1 - var(--mp-pilot-hover));
    transform: translateY(calc(var(--mp-pilot-hover) * -110%)) scale(calc(1 - var(--mp-pilot-hover) * .04));
}
.mp-pilot-label-copy {
    position: absolute;
    inset: 0;
    opacity: var(--mp-pilot-hover);
    transform: translateY(calc((1 - var(--mp-pilot-hover)) * 110%)) scale(calc(.96 + var(--mp-pilot-hover) * .04));
    pointer-events: none;
}
.mp-design-0799.mp-motion-pilot .mp-pilot-button:focus-visible {
    --mp-pilot-hover: 1;
    outline: 2px solid #17242c;
    outline-offset: 4px;
}
@media (hover: hover) and (pointer: fine) {
    .mp-design-0799.mp-motion-pilot .mp-pilot-button:hover { --mp-pilot-hover: 1; }
}

/* Same arrow footprint as the existing pseudo-element; long labels stay still. */
.mp-motion-07102 .mp-design-0799.mp-motion-pilot .mp-pilot-link::after { display: none; }
.mp-pilot-arrow { display: inline-grid; overflow: hidden; height: 1em; font-size: .92em; line-height: 1; flex: none; }
.mp-pilot-arrow > span { grid-area: 1 / 1; transition: transform 600ms cubic-bezier(.4, 0, .2, 1); }
.mp-pilot-arrow > span:last-child { transform: translate(-110%, 110%); }
.mp-pilot-link:focus-visible .mp-pilot-arrow > span:first-child { transform: translate(110%, -110%); }
.mp-pilot-link:focus-visible .mp-pilot-arrow > span:last-child { transform: none; }
@media (hover: hover) and (pointer: fine) {
    .mp-pilot-link:hover .mp-pilot-arrow > span:first-child { transform: translate(110%, -110%); }
    .mp-pilot-link:hover .mp-pilot-arrow > span:last-child { transform: none; }
}

/* The existing observer remains the sole reveal scheduler. Cancel only the
 * ancestor/heading transforms that would animate these same pilot elements twice. */
.mp-pilot-ready .mp-design-0799.mp-motion-pilot .mp-pilot-frame,
.mp-pilot-ready .mp-design-0799.mp-motion-pilot .mp102-sequence .mp-pilot-heading {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    animation: none !important;
    transition: none !important;
    will-change: auto;
}
.mp-pilot-line { display: block; overflow: hidden; overflow: clip; overflow-clip-margin: .06em; }
.mp-pilot-line-inner { display: block; white-space: nowrap; }
.mp-pilot-ready .mp-pilot-heading:not(.is-mp102-visible) .mp-pilot-line-inner { transform: translateY(110%); }
.mp-pilot-ready .mp-pilot-heading.is-mp102-visible .mp-pilot-line-inner {
    animation: mp-pilot-line-in var(--mp-pilot-heading) var(--mp-pilot-ease) calc(var(--mp-pilot-line-order) * 85ms) both;
}
@keyframes mp-pilot-line-in {
    from { transform: translateY(110%); }
    to { transform: none; }
}

/* A stationary photo frame prevents content collisions. No change to source media. */
.mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo {
    --mp-pilot-photo-rest: none;
    /* Observe the whole stationary frame; clipping the observed box to zero
       prevents IntersectionObserver from ever reaching its entry threshold. */
    clip-path: none !important;
    transition: none;
}
.mp-pilot-ready .mp-motion-pilot #equipment .mp-pilot-photo { --mp-pilot-photo-rest: scale(1.02); }
.mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo > img {
    /* Keep the entire machine discernible on entry. A full-height wipe looked
       like an abrupt vertical jump even though the frame never moved. */
    opacity: .4;
    clip-path: none !important;
    transform: scale(1.1) !important;
    transition: opacity var(--mp-pilot-photo) cubic-bezier(.25, .1, .25, 1), transform var(--mp-pilot-photo) cubic-bezier(.25, .1, .25, 1) !important;
}
.mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo-eager > img { opacity: .8; }
.mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo:where(.is-mp102-visible) > img {
    opacity: 1;
    transform: var(--mp-pilot-photo-rest) !important;
}
.mp-pilot-ready .mp-design-0799.mp-motion-pilot .mp-pilot-photo.mp-pilot-settled,
.mp-pilot-ready .mp-design-0799.mp-motion-pilot .mp-pilot-photo.mp-pilot-settled > img { will-change: auto; }

@media (max-width: 720px) {
    .mp-motion-pilot { --mp-pilot-heading: 1100ms; --mp-pilot-photo: 1300ms; }
}
@media (prefers-reduced-motion: reduce) {
    .mp-design-0799.mp-motion-pilot .mp-pilot-button,
    .mp-motion-pilot .mp-pilot-button *,
    .mp-motion-pilot .mp-pilot-link *,
    .mp-motion-pilot .mp-pilot-heading *,
    .mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo,
    .mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo > img {
        transform: none !important;
        animation: none !important;
        transition: none !important;
        clip-path: none !important;
    }
    .mp-pilot-ready .mp-motion-pilot :is(#equipment, .mp-catalog-hero) .mp-pilot-photo > img { opacity: 1 !important; }
    .mp-motion-pilot .mp-pilot-label { opacity: 1 !important; }
    .mp-motion-pilot .mp-pilot-label-copy,
    .mp-motion-pilot .mp-pilot-arrow > span:last-child { visibility: hidden; }
}