/* Simple entrance + float animations for home page */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translateX(24px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeSoft {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes floatSoft {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
    100% {
        transform: translateY(0);
    }
}


/* ===== Home page animations (only when data-page="home") ===== */

body[data-page="home"] .hero-content {
    opacity: 0;
    animation: fadeUp 0.75s ease-out 0.05s forwards;
}

body[data-page="home"] .hero-visual {
    opacity: 0;
    animation: fadeRight 0.8s ease-out 0.15s forwards;
}

/* Gentle floating of the hero illustration */
body[data-page="home"] .hero-visual-frame {
    animation: floatSoft 6s ease-in-out 1.2s infinite;
}

/* Impact cards – staggered */
body[data-page="home"] .impact-card {
    opacity: 0;
    transform: translateY(12px);
    animation: fadeSoft 0.7s ease-out 0.4s forwards;
}
body[data-page="home"] .impact-card:nth-child(2) {
    animation-delay: 0.5s;
}
body[data-page="home"] .impact-card:nth-child(3) {
    animation-delay: 0.6s;
}
body[data-page="home"] .impact-card:nth-child(4) {
    animation-delay: 0.7s;
}

/* Map preview + projects + ribbon + CTA */
body[data-page="home"] .map-preview-card,
body[data-page="home"] .project-card,
body[data-page="home"] .japan-ribbon-inner,
body[data-page="home"] .cta-inner {
    opacity: 0;
    transform: translateY(14px);
    animation: fadeSoft 0.7s ease-out 0.65s forwards;
}

/* Slight stagger for project cards */
body[data-page="home"] .project-card:nth-child(1) {
    animation-delay: 0.65s;
}
body[data-page="home"] .project-card:nth-child(2) {
    animation-delay: 0.75s;
}
body[data-page="home"] .project-card:nth-child(3) {
    animation-delay: 0.85s;
}
body[data-page="home"] .project-card:nth-child(4) {
    animation-delay: 0.95s;
}
body[data-page="home"] .project-card:nth-child(5) {
    animation-delay: 1.05s;
}