/* ==========================================================================
   B-1901 — Motion primitives
   Used by main.js scroll-reveal observer and page banners.
   ========================================================================== */

.reveal {
    opacity: 0;
    transform: translateY(20px);
    transition:
        opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}
.reveal.revealed {
    opacity: 1;
    transform: none;
}
.reveal.delay-1 { transition-delay: 0.08s; }
.reveal.delay-2 { transition-delay: 0.16s; }
.reveal.delay-3 { transition-delay: 0.24s; }
.reveal.delay-4 { transition-delay: 0.32s; }

/* Subtle pulse for status dots / live indicators */
@keyframes pulseDot {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    50%      { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
}
.pulse-dot { animation: pulseDot 2s infinite; }

/* Shimmer placeholder (loading state) */
@keyframes shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}
.shimmer {
    background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 40%, #f1f5f9 80%);
    background-size: 800px 100%;
    animation: shimmer 1.6s linear infinite;
}

/* Accessibility: respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .reveal { opacity: 1; transform: none; }
}

/* Responsive layout fixes (kept from previous file) */
@media (max-width: 768px) {
    .about-grid   { grid-template-columns: 1fr !important; }
    .contact-grid { grid-template-columns: 1fr !important; }
}