/* ==========================================================================
   CALAKAN Enterprise Portal - Animations
   Pure CSS keyframes and motion utilities.
   ========================================================================== */

/* Background gradient shift */
@keyframes bgShift {
    0%   { background-position: 0% 0%; }
    100% { background-position: 100% 100%; }
}

/* Floating particles */
@keyframes floatUp {
    0%   { transform: translateY(0) translateX(0) scale(1); opacity: 0; }
    10%  { opacity: 0.6; }
    90%  { opacity: 0.4; }
    100% { transform: translateY(-110vh) translateX(40px) scale(1.2); opacity: 0; }
}

/* Card entrance */
@keyframes cardIn {
    from { opacity: 0; transform: translateY(20px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Section fade-in */
@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@keyframes slideUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-16px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes scaleIn {
    from { opacity: 0; transform: scale(0.92); }
    to   { opacity: 1; transform: scale(1); }
}

/* Floating Y */
@keyframes floatY {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}

/* Orb float (hero) */
@keyframes orbFloat {
    0%, 100% { transform: translate(-50%, -50%) scale(1); }
    50%      { transform: translate(-50%, -55%) scale(1.08); }
}

/* Spin */
@keyframes spin {
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Pulse dot */
@keyframes pulseDot {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%      { transform: scale(1.4); opacity: 0.6; }
}

/* Pulse glow (brand mark) — alive but professional */
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(91, 141, 239, 0.45), 0 6px 20px rgba(91, 141, 239, 0.25); }
    50%      { box-shadow: 0 0 0 8px rgba(139, 109, 255, 0),  0 10px 28px rgba(139, 109, 255, 0.30); }
}

/* Ripple */
@keyframes ripple {
    to { transform: scale(2.5); opacity: 0; }
}

/* Toast */
@keyframes toastIn {
    from { opacity: 0; transform: translateY(20px) scale(0.95); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes toastOut {
    to { opacity: 0; transform: translateY(20px) scale(0.95); }
}

/* Page transition (body in) */
@keyframes pageIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
body { animation: pageIn 0.5s var(--ease-out) both; }

/* Reveal-on-scroll utility (toggled by JS) */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Stagger helper */
.app-card:nth-child(1) { animation-delay: 0.04s; }
.app-card:nth-child(2) { animation-delay: 0.08s; }
.app-card:nth-child(3) { animation-delay: 0.12s; }
.app-card:nth-child(4) { animation-delay: 0.16s; }
.app-card:nth-child(5) { animation-delay: 0.20s; }
.app-card:nth-child(6) { animation-delay: 0.24s; }
.app-card:nth-child(7) { animation-delay: 0.28s; }
.app-card:nth-child(8) { animation-delay: 0.32s; }
.app-card:nth-child(9) { animation-delay: 0.36s; }

/* Hover lift utility */
.lift { transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease); }
.lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }