/* Motion layer for the suppressor page. Product data and controls remain unchanged. */
.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console {
    --model-direction: 1;
    transform-style: preserve-3d;
}

.suppressor-info-page .suppressor-live-stock[hidden] {
    display: none !important;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-visual {
    overflow: hidden;
    isolation: isolate;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-visual::before {
    position: absolute;
    z-index: 0;
    width: 62%;
    aspect-ratio: 1;
    content: "";
    border-radius: 50%;
    background: radial-gradient(circle, rgba(239, 122, 34, 0.24), rgba(239, 122, 34, 0) 68%);
    filter: blur(18px);
    animation: suppressor-halo 7s ease-in-out infinite;
    pointer-events: none;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-visual img {
    animation: suppressor-idle-float 6s ease-in-out infinite;
    will-change: transform, opacity, filter;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-copy > * {
    transition: opacity 0.18s ease, transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-switching .suppressor-model-visual img {
    animation-play-state: paused;
    opacity: 0;
    transform: translate3d(calc(var(--model-direction) * 34px), 5px, 0) rotate(calc(var(--model-direction) * 1.4deg)) scale(0.97);
    filter: blur(5px) saturate(0.75) drop-shadow(0 14px 18px rgba(0, 0, 0, 0.2));
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-switching .suppressor-model-copy > * {
    opacity: 0;
    transform: translate3d(calc(var(--model-direction) * 16px), 0, 0);
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-visual img {
    animation: suppressor-model-arrive 0.44s cubic-bezier(0.18, 0.84, 0.32, 1.2) both;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > * {
    animation: suppressor-copy-arrive 0.34s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > :nth-child(2) { animation-delay: 35ms; }
.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > :nth-child(3) { animation-delay: 65ms; }
.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > :nth-child(4) { animation-delay: 95ms; }
.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > :nth-child(5) { animation-delay: 125ms; }
.suppressor-info-page.suppressor-motion-enabled .suppressor-model-console.is-arriving .suppressor-model-copy > :nth-child(6) { animation-delay: 155ms; }

.suppressor-info-page.suppressor-motion-enabled .suppressor-card {
    --card-rotate-x: 0deg;
    --card-rotate-y: 0deg;
    --card-image-x: 0px;
    --card-image-y: 0px;
    --card-lift: 0px;
    --reveal-y: 0px;
    transform: perspective(900px) translateY(calc(var(--reveal-y) + var(--card-lift))) rotateX(var(--card-rotate-x)) rotateY(var(--card-rotate-y));
    transform-style: preserve-3d;
    transition: opacity 0.55s ease var(--reveal-delay, 0ms), transform 0.2s ease, border-color 0.2s ease, box-shadow 0.24s ease;
    will-change: transform;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-card:hover,
.suppressor-info-page.suppressor-motion-enabled .suppressor-card:focus-visible {
    --card-lift: -5px;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-card-media img {
    transform: translate3d(var(--card-image-x), var(--card-image-y), 18px) scale(1.015);
    transition: transform 0.2s ease, filter 0.2s ease;
    will-change: transform;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-card:hover .suppressor-card-media img,
.suppressor-info-page.suppressor-motion-enabled .suppressor-card:focus-visible .suppressor-card-media img {
    filter: drop-shadow(0 18px 18px rgba(0, 0, 0, 0.28)) saturate(1.06);
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-reveal {
    --reveal-y: 20px;
    transition-delay: var(--reveal-delay, 0ms);
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-reveal.is-visible {
    --reveal-y: 0px;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-process-card,
.suppressor-info-page.suppressor-motion-enabled .suppressor-page-cta {
    transition: opacity 0.55s ease var(--reveal-delay, 0ms), transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.25s ease, box-shadow 0.25s ease;
}

.suppressor-info-page.suppressor-motion-enabled .suppressor-process-card:hover {
    transform: translateY(-5px);
    border-color: rgba(239, 122, 34, 0.38);
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.28);
}

@keyframes suppressor-idle-float {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.35deg); }
    50% { transform: translate3d(0, -8px, 0) rotate(0.35deg); }
}

@keyframes suppressor-halo {
    0%, 100% { opacity: 0.45; transform: scale(0.92); }
    50% { opacity: 0.82; transform: scale(1.08); }
}

@keyframes suppressor-model-arrive {
    from {
        opacity: 0;
        transform: translate3d(calc(var(--model-direction) * -30px), 6px, 0) rotate(calc(var(--model-direction) * -1.2deg)) scale(0.97);
        filter: blur(4px) saturate(0.8) drop-shadow(0 14px 18px rgba(0, 0, 0, 0.2));
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotate(0) scale(1);
        filter: drop-shadow(0 22px 26px rgba(0, 0, 0, 0.28)) contrast(1.04) saturate(1.02);
    }
}

@keyframes suppressor-copy-arrive {
    from { opacity: 0; transform: translate3d(calc(var(--model-direction) * -13px), 0, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (max-width: 820px) {
    .suppressor-info-page.suppressor-motion-enabled .suppressor-card {
        transform: translateY(var(--reveal-y));
    }

    .suppressor-info-page.suppressor-motion-enabled .suppressor-card:hover,
    .suppressor-info-page.suppressor-motion-enabled .suppressor-card:focus-visible {
        --card-lift: 0px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .suppressor-info-page:not(.suppressor-motion-enabled) *,
    .suppressor-info-page:not(.suppressor-motion-enabled) *::before,
    .suppressor-info-page:not(.suppressor-motion-enabled) *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}
