/* =================================================================
   APPLE-STYLE SCROLL REVEAL ANIMATIONS
   Global — include on every page
   ================================================================= */

/* Base reveal: fade + rise + scale + blur */
.reveal {
    opacity: 0;
    transform: translateY(40px) scale(0.97);
    filter: blur(4px);
    transition:
        opacity 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        filter 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: opacity, transform, filter;
}

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

/* Hero / page header: gentler, wider entrance */
.reveal-header {
    opacity: 0;
    transform: translateY(24px);
    filter: blur(2px);
    transition:
        opacity 1.1s cubic-bezier(0.16, 1, 0.3, 1),
        transform 1.1s cubic-bezier(0.16, 1, 0.3, 1),
        filter 1.1s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform, filter;
}

.reveal-header.revealed {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Large content blocks: longer travel */
.reveal-section {
    opacity: 0;
    transform: translateY(50px);
    filter: blur(3px);
    transition:
        opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        filter 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-delay: 0.1s;
    will-change: opacity, transform, filter;
}

.reveal-section.revealed {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Stagger delays for grid children */
.reveal-stagger-1 { transition-delay: 0.06s; }
.reveal-stagger-2 { transition-delay: 0.12s; }
.reveal-stagger-3 { transition-delay: 0.18s; }
.reveal-stagger-4 { transition-delay: 0.24s; }
.reveal-stagger-5 { transition-delay: 0.30s; }
.reveal-stagger-6 { transition-delay: 0.36s; }
.reveal-stagger-7 { transition-delay: 0.42s; }
.reveal-stagger-8 { transition-delay: 0.48s; }

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .reveal,
    .reveal-header,
    .reveal-section {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }
}
