/* =====================================================
   animations.css — keyframes + scroll-reveal states
   ===================================================== */

@keyframes status-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(63, 143, 122, 0.5); }
    70%  { box-shadow: 0 0 0 8px rgba(63, 143, 122, 0); }
    100% { box-shadow: 0 0 0 0 rgba(63, 143, 122, 0); }
}

@keyframes blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@keyframes fade-slide-up {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Scroll-reveal: elements start hidden, animations.js adds .in-view on scroll */
.hero, .about, .services, .skills, .portfolio, .timeline, .testimonials, .blog-home, .contact,
.service-card, .portfolio-card, .testimonial-card {
    opacity: 0;
    animation: none;
}

.hero.in-view, .about.in-view, .services.in-view, .skills.in-view, .portfolio.in-view,
.timeline.in-view, .testimonials.in-view, .blog-home.in-view, .contact.in-view,
.service-card.in-view, .portfolio-card.in-view, .testimonial-card.in-view {
    animation: fade-slide-up 0.6s var(--ease) forwards;
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }

    .hero, .about, .services, .skills, .portfolio, .timeline, .testimonials, .blog-home, .contact,
    .service-card, .portfolio-card, .testimonial-card {
        opacity: 1;
        animation: none !important;
    }

    .status-dot, .status-cursor, .typing-text {
        animation: none !important;
    }
}