/* ============================================
   ANIMATIONS — GPU-accelerated, smooth
   ============================================ */

@keyframes fadeInUp {
  from { opacity: 0; transform: translate3d(0, 24px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes fadeInDown {
  from { opacity: 0; transform: translate3d(0, -14px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes scaleIn {
  from { opacity: 0; transform: scale3d(0.93, 0.93, 1); }
  to   { opacity: 1; transform: scale3d(1, 1, 1); }
}

@keyframes slideLeft {
  from { opacity: 0; transform: translate3d(-28px, 0, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes slideRight {
  from { opacity: 0; transform: translate3d(28px, 0, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes float {
  0%, 100% { transform: translate3d(0, 0px, 0); }
  50%       { transform: translate3d(0, -10px, 0); }
}

@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.4; transform: scale(0.85); }
}

@keyframes shimmer {
  0%   { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}

@keyframes cardPop {
  0%   { opacity: 0; transform: translate3d(0, 16px, 0) scale(0.97); }
  60%  { opacity: 1; transform: translate3d(0, -2px, 0) scale(1.005); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes ticker-move {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

/* ── Apply classes ────────────────────────────────────── */
.anim-fadeInUp   { animation: fadeInUp   0.55s cubic-bezier(0.22, 1, 0.36, 1) both; }
.anim-scaleIn    { animation: scaleIn    0.55s cubic-bezier(0.22, 1, 0.36, 1) both; }
.anim-slideLeft  { animation: slideLeft  0.6s  cubic-bezier(0.22, 1, 0.36, 1) both; }
.anim-slideRight { animation: slideRight 0.6s  cubic-bezier(0.22, 1, 0.36, 1) both; }
.float { /* disabled - too expensive on integrated GPU */ }
.pulse-dot       { animation: pulse-dot 2s ease-in-out infinite; }

.delay-1 { animation-delay: 0.08s; }
.delay-2 { animation-delay: 0.16s; }
.delay-3 { animation-delay: 0.24s; }
.delay-4 { animation-delay: 0.32s; }

/* Intersection reveal */
.reveal {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  transition: opacity 0.6s cubic-bezier(0.22,1,0.36,1), transform 0.6s cubic-bezier(0.22,1,0.36,1);
}
.reveal.visible { opacity: 1; transform: translate3d(0, 0, 0); }

/* ── Toast ─────────────────────────────────────────────── */
.toast {
  position: fixed; bottom: 28px; left: 50%;
  transform: translate3d(-50%, 80px, 0);
  background: var(--text-primary); color: white;
  padding: 12px 24px; border-radius: var(--radius-pill);
  font-size: 14px; font-weight: 600; z-index: 9999;
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), opacity 0.25s ease;
  opacity: 0; white-space: nowrap; letter-spacing: -0.01em;
}
.toast.show { transform: translate3d(-50%, 0, 0); opacity: 1; }

/* Skeleton shimmer */
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%);
  background-size: 600px 100%;
  animation: shimmer 1.4s infinite;
  border-radius: var(--radius-sm);
}

/* Job card pop */
.job-card-enter { animation: cardPop 0.4s cubic-bezier(0.22, 1, 0.36, 1) both; }

/* Live dot */
.pulse-live {
  width: 8px; height: 8px; border-radius: 50%; background: #22c55e;
  animation: pulse-dot 2s ease-in-out infinite; display: inline-block;
}

.pulse-pink { animation: pulse-dot 2s ease-in-out infinite; }