/* ═══════════════════════════════════════════
   Reveel motion library
   Reusable @keyframes for use across templates.
   ═══════════════════════════════════════════ */

/* ───── Float — gentle vertical bob ───── */
@keyframes reveel-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

/* ───── Breathe — opacity pulse ───── */
@keyframes reveel-breathe {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

/* ───── Heartbeat ───── */
@keyframes reveel-heartbeat {
    0%, 100% { transform: scale(1); }
    15% { transform: scale(1.15); }
    30% { transform: scale(1); }
    45% { transform: scale(1.1); }
    60% { transform: scale(1); }
}

/* ───── Twinkle — opacity + scale combined ───── */
@keyframes reveel-twinkle {
    0%, 100% { opacity: 0; transform: scale(0); }
    50% { opacity: 1; transform: scale(1); }
}

/* ───── Pulse — radial glow expansion ───── */
@keyframes reveel-pulse {
    0%, 100% { box-shadow: 0 0 0 0 var(--accent-warm-glow, rgba(232, 168, 124, 0.4)); opacity: 1; }
    50% { box-shadow: 0 0 0 10px transparent; opacity: 0.7; }
}

/* ───── Drift A — slow horizontal-vertical wander ───── */
@keyframes reveel-drift-a {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(-40px, 30px) scale(1.1); }
    66% { transform: translate(20px, -20px) scale(0.95); }
}

/* ───── Drift B — counter-cyclical to drift-a ───── */
@keyframes reveel-drift-b {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(60px, -40px) scale(1.15); }
}

/* ───── Fade-in upward ───── */
@keyframes reveel-fade-in-up {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ───── Fade-in downward ───── */
@keyframes reveel-fade-in-down {
    from { opacity: 0; transform: translateY(-20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ───── Scale-in ───── */
@keyframes reveel-scale-in {
    from { opacity: 0; transform: scale(0.85); }
    to { opacity: 1; transform: scale(1); }
}

/* ───── Shimmer — diagonal sweep, useful for skeletons / button reveals ───── */
@keyframes reveel-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}