/* Manus-style animations for AIKolab */

/* Refined animations for AIKolab agent cards */

/* Card Fade In Animation */
@keyframes cardFadeIn {
  0% {
    opacity: 0;
    transform: translateY(15px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Enhanced hover animation for cards */
.agent-card {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), 
              box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1), 
              border-color 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.agent-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.07), 0 4px 12px rgba(0, 0, 0, 0.05);
}

/* Remove category-specific hover effects as per Manus reference */
.agent-card.category-ai:hover,
.agent-card.category-chat:hover,
.agent-card.category-writing:hover,
.agent-card.category-analytics:hover,
.agent-card.category-audio:hover,
.agent-card.category-vision:hover,
.agent-card.category-data:hover,
.agent-card.category-education:hover,
.agent-card.category-other:hover {
  border-left-color: rgba(0, 0, 0, 0.12); /* Standard hover border color */
}

/* Image hover effects */
.agent-image {
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.agent-image img {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.agent-card:hover .agent-image img {
  transform: scale(1.02);
}

/* Content transition */
.agent-content {
  transition: max-height 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Animation for initially loading cards */
.animate-fade-in {
  animation: cardFadeIn 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  opacity: 0;
}

/* Staggered animation delay for cards in grid */
.grid > .agent-card:nth-child(1) { animation-delay: 0.05s; }
.grid > .agent-card:nth-child(2) { animation-delay: 0.1s; }
.grid > .agent-card:nth-child(3) { animation-delay: 0.15s; }
.grid > .agent-card:nth-child(4) { animation-delay: 0.2s; }
.grid > .agent-card:nth-child(5) { animation-delay: 0.25s; }
.grid > .agent-card:nth-child(6) { animation-delay: 0.3s; }
.grid > .agent-card:nth-child(7) { animation-delay: 0.35s; }
.grid > .agent-card:nth-child(8) { animation-delay: 0.4s; }
.grid > .agent-card:nth-child(9) { animation-delay: 0.45s; }
.grid > .agent-card:nth-child(10) { animation-delay: 0.5s; }
.grid > .agent-card:nth-child(11) { animation-delay: 0.55s; }
.grid > .agent-card:nth-child(12) { animation-delay: 0.6s; }

/* Gradient overlay animation */
.agent-gradient-overlay {
  transition: height 0.5s cubic-bezier(0.16, 1, 0.3, 1), 
              opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Stats line animation */
.agent-stats-line {
  transition: background-color 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Reset scroll position when card is no longer hovered */
.agent-card:not(:hover) .agent-content {
  transition: max-height 0.5s cubic-bezier(0.16, 1, 0.3, 1), scrollTop 0.3s ease;
  scrollbar-width: none;
}

/* Card Float Animation */
@keyframes floatAnimation {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
  100% {
    transform: translateY(0);
  }
}

/* Hover Pulse Animation for Badges */
@keyframes pulseBadge {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
  }
}

/* Background Gradient Animation */
@keyframes gradientShift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Apply animations to elements */
.animate-fade-in {
  animation: cardFadeIn 0.6s ease-out forwards;
}

.manus-card:hover .manus-stat-badge {
  animation: pulseBadge 1.5s infinite;
}

.manus-feed-badge {
  background: linear-gradient(90deg, #FF1F7D, #FF4D8D, #FF1F7D);
  background-size: 200% 200%;
  animation: gradientShift 3s ease infinite;
}

/* Staggered Animation for Cards */
.grid > .manus-card:nth-child(1) { animation-delay: 0.05s; }
.grid > .manus-card:nth-child(2) { animation-delay: 0.1s; }
.grid > .manus-card:nth-child(3) { animation-delay: 0.15s; }
.grid > .manus-card:nth-child(4) { animation-delay: 0.2s; }
.grid > .manus-card:nth-child(5) { animation-delay: 0.25s; }
.grid > .manus-card:nth-child(6) { animation-delay: 0.3s; }
.grid > .manus-card:nth-child(7) { animation-delay: 0.35s; }
.grid > .manus-card:nth-child(8) { animation-delay: 0.4s; }
.grid > .manus-card:nth-child(9) { animation-delay: 0.45s; }
.grid > .manus-card:nth-child(10) { animation-delay: 0.5s; }
.grid > .manus-card:nth-child(11) { animation-delay: 0.55s; }
.grid > .manus-card:nth-child(12) { animation-delay: 0.6s; }

/* Enhanced card transition */
.manus-card {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Enhanced hover effect */
.manus-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
}