/* ===================================
   PREMIUM MORPH REVEAL ANIMATION
   (Replace old animation css)
=================================== */

.reveal{
    opacity: 0;
    transform: scale(0.82) translateY(45px);
    filter: blur(8px);
    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.22,1,0.36,1),
        filter 0.8s ease;
}

.reveal.active{
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: blur(0);
}

/* stagger delays */

.delay-1{ transition-delay: 0.08s; }
.delay-2{ transition-delay: 0.16s; }
.delay-3{ transition-delay: 0.24s; }
.delay-4{ transition-delay: 0.32s; }
.delay-5{ transition-delay: 0.40s; }
.delay-6{ transition-delay: 0.48s; }

/* ===================================
   HERO TEXT ANIMATION (PREMIUM)
=================================== */

/* Main Heading */

.hero-title{
    opacity: 0;
    transform: translateY(55px);
    animation: heroUp 1s ease forwards;
    animation-delay: 0.5s;
}

/* Subtitle */

.hero-subtitle{
    opacity: 0;
    transform: translateY(45px);
    animation: heroUp 1s ease forwards;
    animation-delay: 1.0s;
}

/* Button */

.hero-btn{
    opacity: 0;
    transform: translateY(35px);
    animation: heroUp 1s ease forwards;
    animation-delay: 1.1s;
}

/* Keyframes */

@keyframes heroUp{

    from{
        opacity: 0;
        transform: translateY(55px);
        filter: blur(8px);
    }

    to{
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }

}