/* ---- Home page dynamic touches ---- */
.hero-accent {
    color: var(--accent);
    text-shadow: 4px 4px 0 #000000;
}
/* Terminal-style caret after the hero kicker. */
.home-hero .kicker::after {
    content: "";
    display: inline-block;
    width: 0.6em;
    height: 1.15em;
    margin-left: 9px;
    vertical-align: -0.22em;
    background: var(--accent);
}
/* Shine sweep across the hero buttons on hover. */
.home-hero .hero-actions .btn {
    position: relative;
    overflow: hidden;
}
.home-hero .hero-actions .btn::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -65%;
    width: 45%;
    background: linear-gradient(100deg, transparent, rgba(255, 245, 205, 0.32), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
}
/* All movement is motion-safe only; reduced-motion users get the static page. */
@media (prefers-reduced-motion: no-preference) {
    @keyframes home-rise {
        from {
            opacity: 0;
            transform: translateY(16px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes home-caret-blink {
        0%, 55% { opacity: 1; }
        56%, 100% { opacity: 0; }
    }

    @keyframes home-dino-bob {
        0%, 100% { transform: translateY(0) rotate(0deg); }
        50% { transform: translateY(-7px) rotate(-2.5deg); }
    }

    @keyframes home-dino-rawr {
        0%, 100% { transform: rotate(0deg) scale(1); }
        25% { transform: rotate(-6deg) scale(1.07); }
        60% { transform: rotate(4deg) scale(1.07); }
    }

    @keyframes home-tile-pan {
        from { transform: scale(1.08) translate3d(-2%, -1.5%, 0); }
        to { transform: scale(1.18) translate3d(2%, 1.5%, 0); }
    }

    /* Staggered entrance: hero copy first, then the tool cards.
       fill-mode is backwards (not forwards) so finished animations release the
       transform property back to the hover transitions. */
    .home-hero .kicker,
    .home-hero h1,
    .home-hero .home-lead,
    .home-hero .hero-actions {
        animation: home-rise 0.55s cubic-bezier(0.22, 1, 0.36, 1) backwards;
    }

    .home-hero h1 { animation-delay: 0.08s; }
    .home-hero .home-lead { animation-delay: 0.16s; }
    .home-hero .hero-actions { animation-delay: 0.24s; }

    .home-cards .home-card {
        animation: home-rise 0.6s cubic-bezier(0.22, 1, 0.36, 1) backwards;
    }

    .home-cards .home-card:nth-child(1) { animation-delay: 0.34s; }
    .home-cards .home-card:nth-child(2) { animation-delay: 0.46s; }

    .home-hero .kicker::after {
        animation: home-caret-blink 1.15s steps(1) infinite;
    }

    .home-dino-icon {
        animation: home-dino-bob 3.6s ease-in-out 1.4s infinite;
    }

    .home-card:hover .home-dino-icon {
        animation: home-dino-rawr 0.55s ease;
    }

    /* Slow Ken Burns pan/zoom on the map previews. Runs on the wrapper (transform)
       so it never collides with the hover scale on the img. Negative delays and
       differing durations desync the three tiles. */
    .home-map-tile-pan {
        animation: home-tile-pan 24s ease-in-out infinite alternate;
        will-change: transform;
    }

    .home-map-tile:nth-child(2) .home-map-tile-pan {
        animation-duration: 29s;
        animation-delay: -11s;
    }

    .home-map-tile:nth-child(3) .home-map-tile-pan {
        animation-duration: 34s;
        animation-delay: -19s;
    }

    /* Hover ripple: tiles zoom in sequence instead of all at once. */
    .home-map-tile:nth-child(2) img { transition-delay: 0.05s; }
    .home-map-tile:nth-child(3) img { transition-delay: 0.1s; }

    .home-hero .hero-actions .btn::after {
        transition: left 0.5s ease;
    }

    .home-hero .hero-actions .btn:hover::after {
        left: 125%;
    }
}