/* =========================================================
   BITMINT LAB — PREMIUM RESTRAINED MOTION LAYER
   Animation-only enhancement. Existing layout/UI remains intact.
   ========================================================= */

:root {
    --wm-motion-ease: cubic-bezier(.22, 1, .36, 1);
    --wm-motion-soft: cubic-bezier(.2, .75, .25, 1);
}

/* ---------- Shared reveal system ---------- */
.js .wm-motion-reveal {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition:
        opacity .66s var(--wm-motion-soft),
        transform .66s var(--wm-motion-ease),
        filter .66s ease;
    transition-delay: var(--wm-reveal-delay, 0ms);
    will-change: opacity, transform;
}

.js .wm-motion-reveal[data-motion="left"] { transform: translate3d(-28px, 0, 0); }
.js .wm-motion-reveal[data-motion="right"] { transform: translate3d(28px, 0, 0); }
.js .wm-motion-reveal[data-motion="scale"] { transform: scale(.975); }
.js .wm-motion-reveal[data-motion="zoom"] { transform: scale(1.05); }

.js .wm-motion-reveal.is-visible {
    opacity: 1;
    transform: none;
    filter: none;
}

/* ---------- Hero ---------- */
.wm-hero {
    isolation: isolate;
}

.wm-motion-enabled .wm-hero-background::before {
    position: absolute;
    inset: -12%;
    content: "";
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 30%, rgba(0, 208, 132, .055), transparent 30%),
        radial-gradient(circle at 82% 38%, rgba(86, 161, 255, .05), transparent 34%),
        radial-gradient(circle at 58% 82%, rgba(125, 91, 228, .04), transparent 30%);
    transform: translate3d(-1.5%, -1%, 0) scale(1.04);
    animation: wmHeroGradientDrift 24s ease-in-out infinite alternate;
}

.wm-motion-enabled .wm-hero-grid {
    opacity: .34;
    animation: wmHeroGridDrift 34s linear infinite;
    will-change: transform;
}

.wm-motion-enabled .wm-hero-glow {
    will-change: transform;
}

.wm-motion-enabled .wm-hero-glow-one { animation: wmGlowDriftOne 22s ease-in-out infinite alternate; }
.wm-motion-enabled .wm-hero-glow-two { animation: wmGlowDriftTwo 27s ease-in-out infinite alternate; }

.wm-hero-glow-three {
    position: absolute;
    right: 34%;
    bottom: 5%;
    width: min(34vw, 460px);
    height: min(34vw, 460px);
    background: radial-gradient(circle, rgba(126, 91, 228, .10), transparent 68%);
    border-radius: 50%;
    filter: blur(34px);
    opacity: .48;
    pointer-events: none;
    animation: wmGlowDriftThree 31s ease-in-out infinite alternate;
}

.wm-hero-motion-title,
.wm-hero-motion-description,
.wm-hero-motion-actions,
.wm-hero-motion-visual {
    opacity: 0;
    will-change: opacity, transform, filter;
}

.wm-hero-motion-title {
    transform: translate3d(0, 24px, 0);
    filter: blur(7px);
    transition: opacity .78s var(--wm-motion-soft), transform .78s var(--wm-motion-ease), filter .78s ease;
}

.wm-hero-motion-description {
    transform: translate3d(0, 16px, 0);
    transition: opacity .65s ease .16s, transform .65s var(--wm-motion-ease) .16s;
}

.wm-hero-motion-actions {
    transform: translate3d(0, 12px, 0) scale(.985);
    transition: opacity .62s ease .28s, transform .62s var(--wm-motion-ease) .28s;
}

.wm-hero-motion-visual {
    transform: translate3d(0, 15px, 0);
    transition: opacity .8s ease .22s, transform .8s var(--wm-motion-ease) .22s;
}

.wm-hero-motion-in .wm-hero-motion-title,
.wm-hero-motion-in .wm-hero-motion-description,
.wm-hero-motion-in .wm-hero-motion-actions,
.wm-hero-motion-in .wm-hero-motion-visual {
    opacity: 1;
    transform: none;
    filter: blur(0);
}

.wm-hero-motion-in .wm-hero-motion-visual {
    animation: wmHeroFloat 7.8s ease-in-out 1.25s infinite;
}

@keyframes wmHeroGradientDrift {
    0% { transform: translate3d(-1.5%, -1%, 0) scale(1.04); }
    100% { transform: translate3d(1.5%, 1.2%, 0) scale(1.07); }
}
@keyframes wmHeroGridDrift {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(18px, 14px, 0); }
}
@keyframes wmGlowDriftOne {
    from { transform: translate3d(-8px, -6px, 0) scale(.98); }
    to { transform: translate3d(22px, 16px, 0) scale(1.05); }
}
@keyframes wmGlowDriftTwo {
    from { transform: translate3d(8px, 4px, 0) scale(1.02); }
    to { transform: translate3d(-24px, 18px, 0) scale(.96); }
}
@keyframes wmGlowDriftThree {
    from { transform: translate3d(-10px, 8px, 0) scale(.98); }
    to { transform: translate3d(18px, -18px, 0) scale(1.06); }
}
@keyframes wmHeroFloat {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -8px, 0); }
}

/* ---------- Product ecosystem ---------- */
@media (hover: hover) and (pointer: fine) {
    .wm-product-card:hover {
        transform: translateY(-5px);
    }
    .wm-product-card:hover .wm-product-icon {
        transform: scale(1.05);
    }
    .wm-product-card a i,
    .wm-product-card .fa-arrow-right {
        transition: transform .28s var(--wm-motion-ease);
    }
    .wm-product-card:hover a i,
    .wm-product-card:hover .fa-arrow-right {
        transform: translateX(3px);
    }
}

/* ---------- Featured product ---------- */
.wm-motion-bullet {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
    transition: opacity .46s ease, transform .46s var(--wm-motion-ease);
    transition-delay: var(--wm-bullet-delay, 0ms);
}
.wm-motion-bullet.is-visible {
    opacity: 1;
    transform: none;
}

/* ---------- Custom software solutions ---------- */
@media (hover: hover) and (pointer: fine) {
    .wm-custom-service-card:hover { transform: translateY(-4px); }
    .wm-custom-service-card:hover .wm-custom-service-icon { transform: scale(1.045); }
}

/* ---------- Why Bitmint Lab ---------- */
.wm-why-feature-card .wm-why-card-icon {
    transition: transform .3s var(--wm-motion-ease);
}
@media (hover: hover) and (pointer: fine) {
    .wm-why-feature-card:hover .wm-why-card-icon { transform: scale(1.04); }
}

/* ---------- Development process ---------- */
.wm-process-line-progress {
    animation: none !important;
    transform: scaleX(0);
    transform-origin: left center;
    will-change: transform;
}

.wm-process-step .wm-process-step-marker,
.wm-process-step .wm-process-card,
.wm-process-step .wm-process-icon {
    transition:
        transform .4s var(--wm-motion-ease),
        box-shadow .4s ease,
        border-color .4s ease,
        opacity .4s ease;
}

.wm-process-step:not(.is-process-active) .wm-process-step-marker {
    opacity: .72;
    transform: scale(.94);
}

.wm-process-step.is-process-active .wm-process-step-marker {
    opacity: 1;
    transform: scale(1);
}

.wm-process-mobile-progress {
    display: none;
}

/* ---------- Industries ---------- */
.wm-industry-icon { transition: transform .3s var(--wm-motion-ease); }
@media (hover: hover) and (pointer: fine) {
    .wm-industry-card:hover { transform: translateY(-4px); }
    .wm-industry-card:hover .wm-industry-icon { transform: scale(1.045); }
}

/* ---------- About ---------- */
.wm-about-zoom-reveal {
    transform-origin: center;
}
.wm-motion-enabled .wm-about-glow-one { animation: wmAboutGlowOne 26s ease-in-out infinite alternate; }
.wm-motion-enabled .wm-about-glow-two { animation: wmAboutGlowTwo 31s ease-in-out infinite alternate; }
@keyframes wmAboutGlowOne {
    from { transform: translate3d(0, -8px, 0); }
    to { transform: translate3d(18px, 16px, 0); }
}
@keyframes wmAboutGlowTwo {
    from { transform: translate3d(5px, 8px, 0); }
    to { transform: translate3d(-16px, -12px, 0); }
}

/* ---------- Final CTA ---------- */
.wm-final-cta {
    isolation: isolate;
}
.wm-motion-enabled .wm-final-cta-background::after {
    position: absolute;
    inset: -10%;
    content: "";
    pointer-events: none;
    background: radial-gradient(circle at 50% 48%, rgba(0, 208, 132, .10), transparent 43%);
    transform: scale(.96);
    opacity: .55;
    animation: wmFinalGlow 9s ease-in-out infinite alternate;
}
.wm-final-motion-ready .wm-final-heading-motion {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition: opacity .7s ease, transform .7s var(--wm-motion-ease);
}
.wm-final-motion-ready .wm-final-button-motion {
    opacity: 0;
    transform: scale(.96);
    transition: opacity .58s ease .18s, transform .58s var(--wm-motion-ease) .18s;
}
.wm-final-motion-in .wm-final-heading-motion,
.wm-final-motion-in .wm-final-button-motion {
    opacity: 1;
    transform: none;
}
.wm-final-motion-in .wm-final-button-motion {
    animation: wmFinalButtonEntrance .72s var(--wm-motion-ease) .5s 1 both;
}
@keyframes wmFinalGlow {
    from { transform: translate3d(-1%, 0, 0) scale(.96); opacity: .42; }
    to { transform: translate3d(1%, -1%, 0) scale(1.04); opacity: .68; }
}
@keyframes wmFinalButtonEntrance {
    0%, 100% { transform: scale(1); }
    52% { transform: scale(1.025); }
}

/* ---------- Navbar glass transition ---------- */
.wm-header .wm-navbar {
    transition:
        min-height .32s ease,
        background-color .32s ease,
        border-color .32s ease,
        box-shadow .32s ease,
        backdrop-filter .32s ease;
}
.wm-header.wm-header-scrolled .wm-navbar {
    background: rgba(255, 255, 255, .88);
    -webkit-backdrop-filter: blur(14px) saturate(135%);
    backdrop-filter: blur(14px) saturate(135%);
    border-bottom-color: rgba(23, 40, 61, .08);
    box-shadow: 0 10px 30px rgba(20, 20, 38, .055);
}

/* SlickNav: hamburger → X + slide/fade menu + staggered links */
.wm-header .slicknav_icon-bar {
    transition: transform .28s var(--wm-motion-ease), opacity .2s ease;
    transform-origin: center;
}
.wm-header .slicknav_open .slicknav_icon-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.wm-header .slicknav_open .slicknav_icon-bar:nth-child(2) { opacity: 0; transform: scaleX(.4); }
.wm-header .slicknav_open .slicknav_icon-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.wm-header .slicknav_nav {
    transform-origin: top center;
}
.wm-header .slicknav_nav[style*="display: block"],
.wm-header .slicknav_nav:not([style*="display: none"]) {
    animation: wmMobileMenuOpen .3s var(--wm-motion-ease) both;
}
.wm-header .slicknav_nav a {
    animation: wmMobileLinkIn .32s var(--wm-motion-ease) both;
    animation-delay: var(--wm-menu-delay, 0ms);
}
@keyframes wmMobileMenuOpen {
    from { opacity: 0; transform: translate3d(0, -8px, 0); }
    to { opacity: 1; transform: none; }
}
@keyframes wmMobileLinkIn {
    from { opacity: 0; transform: translate3d(0, -5px, 0); }
    to { opacity: 1; transform: none; }
}

/* ---------- Optional desktop cursor glow ---------- */
.wm-cursor-glow {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle, rgba(0, 208, 132, .035), rgba(86, 161, 255, .018) 36%, transparent 68%);
    transition: opacity .4s ease;
    will-change: transform;
}
.wm-cursor-glow.is-visible { opacity: 1; }

/* ---------- Mobile / coarse-pointer rules ---------- */
@media (max-width: 991px), (pointer: coarse) {
    .wm-cursor-glow { display: none !important; }
}

@media (max-width: 767px) {
    .js .wm-motion-reveal,
    .js .wm-motion-reveal[data-motion="left"],
    .js .wm-motion-reveal[data-motion="right"],
    .js .wm-motion-reveal[data-motion="scale"],
    .js .wm-motion-reveal[data-motion="zoom"] {
        transform: translate3d(0, 16px, 0) scale(.995);
        filter: none;
        transition-duration: .5s;
    }

    .js .wm-motion-reveal.is-visible { transform: none; }

    .wm-motion-enabled .wm-hero-background::before,
    .wm-motion-enabled .wm-hero-grid,
    .wm-motion-enabled .wm-hero-glow,
    .wm-hero-glow-three,
    .wm-motion-enabled .wm-about-glow-one,
    .wm-motion-enabled .wm-about-glow-two {
        animation: none !important;
    }

    .wm-hero-glow-three { display: none; }
    .wm-hero-motion-in .wm-hero-motion-visual { animation: none; }

    .wm-product-card:active,
    .wm-custom-service-card:active,
    .wm-industry-card:active {
        transform: scale(.992);
        transition-duration: .14s;
    }

    .wm-process-line { display: none; }

    .wm-process-mobile-progress {
        position: absolute;
        top: 15px;
        bottom: 15px;
        left: 28px;
        z-index: 1;
        display: block;
        width: 2px;
        background: linear-gradient(to bottom, #00d084, #5d8cff, #775ee8);
        border-radius: 99px;
        transform: scaleY(0);
        transform-origin: top center;
        will-change: transform;
    }

    .wm-process-step::before {
        background: rgba(31, 61, 81, .09) !important;
    }

    .wm-motion-enabled .wm-final-cta-background::after {
        animation: none;
        opacity: .45;
    }
}

@media (max-width: 575px) {
    .wm-process-mobile-progress { left: 23px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
    }

    .wm-motion-reveal,
    .wm-motion-bullet,
    .wm-hero-motion-title,
    .wm-hero-motion-description,
    .wm-hero-motion-actions,
    .wm-hero-motion-visual,
    .wm-final-heading-motion,
    .wm-final-button-motion {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        animation: none !important;
        transition: none !important;
    }

    .wm-hero-background::before,
    .wm-hero-grid,
    .wm-hero-glow,
    .wm-hero-glow-three,
    .wm-about-glow,
    .wm-final-cta-background::after,
    .wm-cursor-glow {
        animation: none !important;
        display: none !important;
    }

    .wm-process-line-progress,
    .wm-process-mobile-progress {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}

/* =========================================================
   MOTION FIX v2 — single reveal engine, no WOW conflicts
   ========================================================= */
.webmint-reveal.wm-motion-reveal {
    visibility: visible !important;
    animation-name: none !important;
}

/* Hero should never inherit generic reveal visibility/transform animation. */
.wm-hero .webmint-reveal {
    visibility: visible !important;
    animation: none !important;
}

/* Keep the requested illustration float perceptible but extremely subtle. */
.wm-hero-motion-in .wm-hero-motion-visual {
    animation: wmHeroFloatV2 12s ease-in-out 1.4s infinite !important;
}
@keyframes wmHeroFloatV2 {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -3px, 0); }
}

/* Slightly stronger reveal distance so animations are actually visible, still restrained. */
.js .wm-motion-reveal {
    transform: translate3d(0, 30px, 0);
    transition-duration: .72s;
}
.js .wm-motion-reveal[data-motion="left"] { transform: translate3d(-34px, 0, 0); }
.js .wm-motion-reveal[data-motion="right"] { transform: translate3d(34px, 0, 0); }
.js .wm-motion-reveal[data-motion="scale"] { transform: translate3d(0, 8px, 0) scale(.955); }
.js .wm-motion-reveal[data-motion="zoom"] { transform: scale(1.055); }
.js .wm-motion-reveal.is-visible { transform: none; }

/* Clear one-time CTA state: never continuously pulse the button. */
.wm-final-motion-in .wm-final-button-motion {
    animation: wmFinalButtonEntrance .72s var(--wm-motion-ease) .5s 1 both !important;
}

@media (max-width: 767px) {
    .wm-hero-motion-in .wm-hero-motion-visual { animation: none !important; }
    .js .wm-motion-reveal,
    .js .wm-motion-reveal[data-motion="left"],
    .js .wm-motion-reveal[data-motion="right"],
    .js .wm-motion-reveal[data-motion="scale"],
    .js .wm-motion-reveal[data-motion="zoom"] {
        transform: translate3d(0, 18px, 0) scale(.99);
        transition-duration: .52s;
    }
    .js .wm-motion-reveal.is-visible { transform: none; }
}