/* Global site styles */

/* Keyframes */
@keyframes fade {
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes rise {
    from {
        transform: translateY(12px);
    }

    to {
        transform: translateY(0);
    }
}

/* Utility: Animations für Elemente mit [data-animate] */
.anim {
    opacity: 0;
}

.anim-fade {
    transform: translateY(0);
}

.anim-up {
    transform: translateY(12px);
}

.reveal {
    opacity: 1;
    animation: fade .6s ease-out forwards;
}

    .reveal.anim-up {
        animation: rise .6s ease-out forwards, fade .6s ease-out forwards;
    }


/* Creator Schriftzug – Buchstaben-Animation */
.creator-letters span {
    opacity: 0;
    display: inline-block;
    transform: translateY(10px);
    animation: creatorFade 0.45s ease-out forwards;
}

@keyframes creatorFade {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Network background canvas (Home) --- */
#bg-network {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0; /* Canvas liegt hinten */
    pointer-events: none; /* Klicks gehen durch */
    background: #07080d; /* Fallback, falls JS aus ist */
}

/* Sicherstellen, dass dein Content über dem Canvas liegt */
body > header,
body > main,
body > footer {
    position: relative;
    z-index: 1;
}