/* ============================================================
   animations.css — Keyframes + reveal/utility classes
   ============================================================ */

/* ---- Reveal (used by .reveal elements, triggered by animations.js) ---- */
.reveal {
    opacity: 0;
    transform: translateY(12px) scale(0.99);
    transition:
        opacity 1100ms var(--ease-out),
        transform 1100ms var(--ease-out);
    will-change: opacity, transform;
}
.reveal.is-visible {
    opacity: 1;
    transform: none;
}

/* ---- Float (gentle vertical drift) ---- */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}
.float { animation: float 10s ease-in-out infinite; }

/* ---- Pulse (subtle scale heartbeat) ---- */
@keyframes pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 12px 30px -10px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.12); }
    50%      { transform: scale(1.025); box-shadow: 0 18px 38px -12px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.12); }
}
.pulse {
    animation: pulse 6s ease-in-out infinite;
    animation-delay: 1.5s;
}
.pulse:hover { animation-play-state: paused; }

/* ---- Shimmer (slow gradient sheen across text/element) ---- */
@keyframes shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}
.shimmer {
    background-image: linear-gradient(
        110deg,
        currentColor 0%,
        currentColor 40%,
        rgba(255,255,255,0.85) 50%,
        currentColor 60%,
        currentColor 100%
    );
    background-size: 200% 100%;
    -webkit-background-clip: text;
            background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: shimmer 12s linear infinite;
}

/* ---- Rise (entrance lift) ---- */
@keyframes rise {
    from { opacity: 0; transform: translateY(28px) scale(0.97); filter: blur(6px); }
    to   { opacity: 1; transform: none; filter: blur(0); }
}
.rise { animation: rise 1.4s var(--ease-out) both; }

/* ---- Slow drift (used by ambient layers) ---- */
@keyframes drift-x {
    from { transform: translateX(-20px); }
    to   { transform: translateX(20px); }
}
@keyframes drift-y {
    from { transform: translateY(-10px); }
    to   { transform: translateY(10px); }
}

/* ---- FX canvas styling ---- */
#fx-canvas {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: var(--z-fx);
    pointer-events: none;
    mix-blend-mode: screen;
    opacity: 0.85;
}

@media (prefers-reduced-motion: reduce) {
    .float, .pulse, .shimmer { animation: none !important; }
    .reveal { opacity: 1; transform: none; }
    #fx-canvas { display: none; }
}