/* =========================================================
   PREMIUM REVEAL SYSTEM
   Slow / Smooth / Modern
========================================================= */

.reveal {

    --reveal-duration: 1.35s;
    --reveal-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --delay: 0ms;

    opacity: 0;

    visibility: hidden;

    transition:
        opacity var(--reveal-duration) var(--reveal-ease) var(--delay),
        transform var(--reveal-duration) var(--reveal-ease) var(--delay),
        filter var(--reveal-duration) var(--reveal-ease) var(--delay);

    will-change:
        opacity,
        transform,
        filter;

    backface-visibility: hidden;

    transform: translate3d(0, 50px, 0);

    filter: blur(8px);
}


/* =========================================================
   UP
========================================================= */

.reveal-up {

    transform:
        translate3d(0, 70px, 0)
        scale(0.985);

}


/* =========================================================
   LEFT
========================================================= */

.reveal-left {

    transform:
        translate3d(-80px, 0, 0)
        scale(0.985);

}


/* =========================================================
   RIGHT
========================================================= */

.reveal-right {

    transform:
        translate3d(80px, 0, 0)
        scale(0.985);

}


/* =========================================================
   SCALE
========================================================= */

.reveal-scale {

    transform:
        scale(0.90);

}


/* =========================================================
   ROTATE
========================================================= */

.reveal-rotate {

    transform:
        translate3d(0, 50px, 0)
        rotate(2deg)
        scale(0.98);

}


/* =========================================================
   ACTIVE STATE
========================================================= */

.reveal.is-visible {

    opacity: 1;

    visibility: visible;

    transform:
        translate3d(0, 0, 0)
        scale(1)
        rotate(0);

    filter: blur(0);

}


/* =========================================================
   INDUSTRY CARDS
========================================================= */

.industry-card {

    transition:
        transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.7s ease;

    will-change: transform;

}


.industry-card:hover {

    transform:
        translateY(-12px);

}


/* =========================================================
   CARD IMAGE
========================================================= */

.industry-card-image {

    overflow: hidden;

}


.industry-card-image img {

    width: 100%;

    display: block;

    transform: scale(1);

    transition:
        transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);

    will-change: transform;

}


.industry-card:hover
.industry-card-image img {

    transform: scale(1.07);

}


/* =========================================================
   HERO IMAGE
========================================================= */

.industries-hero-image {

    overflow: hidden;

}


.industries-hero-image img {

    width: 100%;

    display: block;

    transition:
        transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);

}


.industries-hero-image:hover img {

    transform: scale(1.035);

}


/* =========================================================
   FEATURE ICON
========================================================= */

.feature-icon {

    transition:
        transform 0.7s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.6s ease;

}


.industry-feature:hover
.feature-icon {

    transform:
        translateY(-6px)
        scale(1.05);

}


/* =========================================================
   LEARN MORE ARROW
========================================================= */

.industry-link i {

    display: inline-block;

    transition:
        transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);

}


.industry-link:hover i {

    transform:
        translateX(8px);

}


/* =========================================================
   SLIDER ARROWS
========================================================= */

.industry-arrow {

    transition:
        transform 0.6s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.5s ease,
        background-color 0.4s ease;

}


.industry-arrow:hover {

    transform:
        scale(1.08);

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reveal,
    .industry-card,
    .industry-card-image img,
    .industries-hero-image img,
    .feature-icon,
    .industry-link i,
    .industry-arrow {

        transition: none !important;

        animation: none !important;

        transform: none !important;

        filter: none !important;

    }

}