/* ==================================================
   FARMNOVA AI
   PLATFORM — ANIMATIONS
================================================== */


/* ==================================================
   HERO ENTRANCE
================================================== */

.platform-hero-content {
    animation:
        platformContentReveal 0.8s ease both;
}


@keyframes platformContentReveal {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ==================================================
   ORBITS
================================================== */

.orbit-one {
    animation:
        platformOrbitRotate 18s linear infinite;
}

.orbit-two {
    animation:
        platformOrbitRotateReverse 25s linear infinite;
}


@keyframes platformOrbitRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes platformOrbitRotateReverse {

    from {
        transform: rotate(360deg);
    }

    to {
        transform: rotate(0deg);
    }

}


/* ==================================================
   CORE
================================================== */

.platform-core {
    animation:
        platformCoreFloat 4s ease-in-out infinite;
}


@keyframes platformCoreFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


/* ==================================================
   FLOATING CARDS
================================================== */

.farmer-card {
    animation:
        platformCardFloatOne 4s ease-in-out infinite;
}

.farm-card {
    animation:
        platformCardFloatTwo 5s ease-in-out infinite;
}

.location-card {
    animation:
        platformCardFloatThree 4.5s ease-in-out infinite;
}


@keyframes platformCardFloatOne {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-9px);
    }

}


@keyframes platformCardFloatTwo {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(8px);
    }

}


@keyframes platformCardFloatThree {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-7px);
    }

}


/* ==================================================
   REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce) {

    .platform-hero-content,
    .orbit-one,
    .orbit-two,
    .platform-core,
    .platform-floating-card {
        animation: none;
    }

}
/* ==================================================
   PLATFORM STAGE ANIMATION
================================================== */

.platform-stage {
    opacity: 0;
    transform: translateY(25px);

    animation:
        platformStageReveal
        0.7s
        ease
        forwards;
}

.platform-stage:nth-child(2) {
    animation-delay: 0.1s;
}

.platform-stage:nth-child(3) {
    animation-delay: 0.2s;
}

.platform-stage:nth-child(4) {
    animation-delay: 0.3s;
}

.platform-stage:nth-child(5) {
    animation-delay: 0.4s;
}


@keyframes platformStageReveal {

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ==================================================
   JOURNEY
================================================== */

.platform-journey-step {
    opacity: 0;
    transform: translateY(20px);

    animation:
        journeyStepReveal
        0.7s
        ease
        forwards;
}

.platform-journey-step:nth-child(1) {
    animation-delay: 0.1s;
}

.platform-journey-step:nth-child(2) {
    animation-delay: 0.2s;
}

.platform-journey-step:nth-child(3) {
    animation-delay: 0.3s;
}

.platform-journey-step:nth-child(4) {
    animation-delay: 0.4s;
}


@keyframes journeyStepReveal {

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ==================================================
   ACCESSIBILITY
================================================== */

@media (prefers-reduced-motion: reduce) {

    .platform-stage,
    .platform-journey-step {
        animation: none;

        opacity: 1;

        transform: none;
    }

}