/* ==========================================================================
   AURAX — Performance-First Motion & Scroll Reveal Animations
   ========================================================================== */

/* ==========================================================================
   1. Intersection Observer Scroll Reveals
   ========================================================================== */

.reveal-up {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal-fade {
    opacity: 0;
    transition: opacity 800ms ease;
    will-change: opacity;
}

.reveal-left {
    opacity: 0;
    transform: translateX(-32px);
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal-right {
    opacity: 0;
    transform: translateX(32px);
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal-scale {
    opacity: 0;
    transform: scale(0.96);
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

/* Active Visible State Triggered by JavaScript Observer */
.is-visible {
    opacity: 1 !important;
    transform: translate(0, 0) scale(1) !important;
}

/* ==========================================================================
   2. Staggered Delays for Children
   ========================================================================== */

.reveal-stagger > *:nth-child(1) { transition-delay: 60ms; }
.reveal-stagger > *:nth-child(2) { transition-delay: 120ms; }
.reveal-stagger > *:nth-child(3) { transition-delay: 180ms; }
.reveal-stagger > *:nth-child(4) { transition-delay: 240ms; }
.reveal-stagger > *:nth-child(5) { transition-delay: 300ms; }
.reveal-stagger > *:nth-child(6) { transition-delay: 360ms; }
.reveal-stagger > *:nth-child(7) { transition-delay: 420ms; }
.reveal-stagger > *:nth-child(8) { transition-delay: 480ms; }
.reveal-stagger > *:nth-child(9) { transition-delay: 540ms; }
.reveal-stagger > *:nth-child(10) { transition-delay: 600ms; }

/* ==========================================================================
   3. Subtle Vector & Interactive Motion
   ========================================================================== */

.animated-path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: drawPath 3s ease-in-out forwards;
}

@keyframes drawPath {
    to {
        stroke-dashoffset: 0;
    }
}

/* ==========================================================================
   4. Accessibility: Reduced Motion Override
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .reveal-up,
    .reveal-fade,
    .reveal-left,
    .reveal-right,
    .reveal-scale,
    .reveal-stagger > * {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .animated-path {
        animation: none !important;
        stroke-dashoffset: 0 !important;
    }
}