/* Scroll reveal animations — bezalel Host */
html {
    scroll-behavior: smooth;
}

.js [data-reveal] {
    opacity: 0;
    will-change: opacity, transform, filter;
    transition:
        opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.85s cubic-bezier(0.16, 1, 0.3, 1),
        filter 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.js [data-reveal="fade-up"] {
    transform: translateY(48px);
}

.js [data-reveal="fade-down"] {
    transform: translateY(-36px);
}

.js [data-reveal="fade-left"] {
    transform: translateX(-56px);
}

.js [data-reveal="fade-right"] {
    transform: translateX(56px);
}

.js [data-reveal="scale-up"] {
    transform: scale(0.88) translateY(24px);
}

.js [data-reveal="zoom-in"] {
    transform: scale(0.94);
}

.js [data-reveal="blur-up"] {
    transform: translateY(32px);
    filter: blur(10px);
}

.js [data-reveal].is-revealed {
    opacity: 1;
    transform: none;
    filter: none;
}

/* Staggered grid children feel more premium */
.bento-grid [data-reveal].is-revealed .bento-icon {
    animation: reveal-icon-pop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes reveal-icon-pop {
    0% {
        transform: scale(0.6);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Hero entrance on load */
.header-banner [data-reveal].is-revealed h1 {
    animation: reveal-hero-text 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes reveal-hero-text {
    0% {
        letter-spacing: 0.06em;
        opacity: 0.7;
    }
    100% {
        letter-spacing: normal;
        opacity: 1;
    }
}

/* Subtle glow line under section headers when revealed */
.bento-header-wrapper[data-reveal].is-revealed::after {
    content: "";
    display: block;
    width: 72px;
    height: 4px;
    margin: 20px auto 0;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb, #8b5cf6, #06b6d4);
    animation: reveal-line-grow 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.bento-header-wrapper[style*="transparent"]::after,
.bento-header-wrapper.bg-accent-dark::after,
.bento-header-wrapper.bg-accent-1::after {
    display: none;
}

@keyframes reveal-line-grow {
    0% {
        width: 0;
        opacity: 0;
    }
    100% {
        width: 72px;
        opacity: 1;
    }
}

/* Footer blocks */
.footer-content-item[data-reveal].is-revealed,
.footer-content-list[data-reveal].is-revealed {
    animation: reveal-footer-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes reveal-footer-rise {
    0% {
        transform: translateY(20px);
    }
    100% {
        transform: translateY(0);
    }
}

/* Keep hover lift working after reveal */
.bento-item[data-reveal].is-revealed:hover {
    transform: translateY(-5px) scale(1.01);
}

.bento-item[data-reveal="scale-up"].is-revealed:hover,
.bento-item[data-reveal="zoom-in"].is-revealed:hover {
    transform: translateY(-5px) scale(1.01);
}

/* Accordion items */
.accordion-item[data-reveal].is-revealed {
    animation: reveal-accordion 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes reveal-accordion {
    0% {
        transform: translateX(-12px);
        opacity: 0.6;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

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

    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }

    .bento-grid [data-reveal].is-revealed .bento-icon,
    .header-banner [data-reveal].is-revealed h1,
    .footer-content-item[data-reveal].is-revealed,
    .footer-content-list[data-reveal].is-revealed,
    .accordion-item[data-reveal].is-revealed {
        animation: none !important;
    }

    .bento-header-wrapper[data-reveal].is-revealed::after {
        display: none;
    }
}