﻿/* ==========================================================================
   Motion: scroll reveals, hero entrance, decorative floats
   Content is only hidden when js/main.js has marked the page as enhanced.
   ========================================================================== */

@keyframes fade-up {
    from {
        opacity: 0;
        transform: translateY(24px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes float {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }
}

@keyframes spin-slow {
    to {
        transform: rotate(360deg);
    }
}

.js [data-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
    transition-delay: var(--reveal-delay, 0ms);
}

    .js [data-reveal].is-visible {
        opacity: 1;
        transform: translateY(0);
    }

.hero-visual .hero-blob {
    animation: fade-up 1s var(--ease) both;
}

.home-hero .eyebrow,
.home-hero h1,
.home-hero .lead,
.home-hero .hero-actions,
.home-hero .trust-line {
    animation: fade-up 0.9s var(--ease) both;
}

.home-hero h1 {
    animation-delay: 0.1s;
}

.home-hero .lead {
    animation-delay: 0.2s;
}

.home-hero .hero-actions {
    animation-delay: 0.3s;
}

.home-hero .trust-line {
    animation-delay: 0.4s;
}

.page-hero-inner > * {
    animation: fade-up 0.9s var(--ease) both;
}

    .page-hero-inner > *:nth-child(2) {
        animation-delay: 0.12s;
    }

    .page-hero-inner > *:nth-child(3) {
        animation-delay: 0.24s;
    }

.deco-dot,
.deco-square {
    animation: float 6s ease-in-out infinite;
}

.deco-square {
    animation-delay: -2s;
}

.deco-ring {
    animation: spin-slow 40s linear infinite;
}

.service-visual .icon-box {
    animation: float 5s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .js [data-reveal] {
        opacity: 1;
        transform: none;
    }
}
