/* Shared bounded action component: unchanged hit area/background, moving decoration only. */
:is(.mp-selection-main, .mp-equipment-card-motion) .mp-motion-control {
    --mp-control-active: 0;
    --mp-control-ease: cubic-bezier(.22, 1, .36, 1);
    background-color: var(--mp-control-background) !important;
    color: var(--mp-control-color) !important;
    transform: none !important;
    filter: none !important;
    transition: box-shadow 500ms var(--mp-control-ease) !important;
}
.mp-control-window { display: block; position: relative; min-width: 0; overflow: hidden; }
.mp-control-label, .mp-control-copy {
    display: block;
    transition: transform 500ms var(--mp-control-ease), opacity 500ms var(--mp-control-ease);
}
.mp-control-label {
    opacity: calc(1 - var(--mp-control-active));
    transform: translateY(calc(var(--mp-control-active) * -110%)) scale(calc(1 - var(--mp-control-active) * .04));
}
.mp-control-copy {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: var(--mp-control-active);
    transform: translateY(calc((1 - var(--mp-control-active)) * 110%)) scale(calc(.96 + var(--mp-control-active) * .04));
}
.mp-control-copy::before, .mp-control-arrow-copy::before { content: attr(data-label); }
.mp-control-generated-arrow .mp-control-arrow > span:first-child::before { content: attr(data-label); }
.mp-equipment-card-motion .mp-control-generated-arrow::after { content: none !important; }
.mp-control-underlined :is(.mp-control-label, .mp-control-copy) {
    text-decoration: underline;
    text-underline-offset: 4px;
}
.mp-equipment-card-motion .mp-control-underlined :is(.mp-control-label, .mp-control-copy) {
    text-underline-offset: inherit;
}
.mp-equipment-card-motion .mp-header-cta.mp-motion-control:is(:hover, :focus-visible) {
    background-color: var(--mp-control-background) !important;
}
.mp-control-arrow { display: inline-grid; overflow: hidden; flex: none; }
.mp-control-arrow > span { grid-area: 1 / 1; transition: transform 600ms cubic-bezier(.4, 0, .2, 1); }
.mp-control-arrow > span:last-child { transform: translate(-110%, 110%); }
:is(.mp-selection-main, .mp-equipment-card-motion) .mp-motion-control:focus-visible {
    --mp-control-active: 1;
    outline: 3px solid #ad622d;
    outline-offset: 4px;
}
.mp-motion-control:focus-visible .mp-control-arrow > span:first-child { transform: translate(110%, -110%); }
.mp-motion-control:focus-visible .mp-control-arrow > span:last-child { transform: none; }
@media (hover: hover) and (pointer: fine) {
    :is(.mp-selection-main, .mp-equipment-card-motion) .mp-motion-control:hover { --mp-control-active: 1; }
    .mp-motion-control:hover .mp-control-arrow > span:first-child { transform: translate(110%, -110%); }
    .mp-motion-control:hover .mp-control-arrow > span:last-child { transform: none; }
}
:is(.mp-selection-main, .mp-equipment-card-motion) .mp-motion-control:is(:disabled, [aria-disabled="true"]) { --mp-control-active: 0; }
.mp-motion-control:is(:disabled, [aria-disabled="true"]) * { transition: none !important; }
@media (prefers-reduced-motion: reduce) {
    :is(.mp-selection-main, .mp-equipment-card-motion) .mp-motion-control { transition: none !important; }
    .mp-motion-control * { transform: none !important; transition: none !important; }
    .mp-motion-control .mp-control-label { opacity: 1 !important; }
    .mp-motion-control :is(.mp-control-copy, .mp-control-arrow > span:last-child) { visibility: hidden; }
}