/* ===== GLOBAL PAGE ANIMATIONS ===== */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

@keyframes slideInFromLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInFromRight {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Hero Title and Description Transition Animations */
.hero-title {
  animation: slideInFromLeft 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.hero-description {
  animation: slideInFromRight 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) 0.2s forwards;
  opacity: 0;
}

.hero-buttons {
  animation: fadeInScale 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) 0.4s forwards;
  opacity: 0;
}

/* Animate Page Hero on View Active */
.page-view.active .page-hero {
  animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

/* Animate Hero Content on Page Load */
.page-view.active .hero-content {
  animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

/* Staggered Content Rows for Home Page */
.page-view.active .content-row {
  opacity: 0; /* Start invisible */
  animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.page-view.active .content-row:nth-child(1) {
  animation-delay: 0.1s;
}
.page-view.active .content-row:nth-child(2) {
  animation-delay: 0.2s;
}
.page-view.active .content-row:nth-child(3) {
  animation-delay: 0.3s;
}
.page-view.active .content-row:nth-child(4) {
  animation-delay: 0.4s;
}
.page-view.active .content-row:nth-child(5) {
  animation-delay: 0.5s;
}
.page-view.active .content-row:nth-child(6) {
  animation-delay: 0.6s;
}

/* Dynamic Content Animation */
.poster-card,
.episode-card-compact,
.related-item {
  animation: fadeInUp 0.6s ease-out;
  /* Note: Removed 'forwards' to ensure hover transform effects still work after animation */
}

/* Ensure dynamic search results promote smooth entry */
.search-result-card {
  animation: fadeInUp 0.4s ease-out;
  animation-fill-mode: backwards;
}

/* Stagger search results */
.search-result-card:nth-child(1) {
  animation-delay: 0.05s;
}
.search-result-card:nth-child(2) {
  animation-delay: 0.1s;
}
.search-result-card:nth-child(3) {
  animation-delay: 0.15s;
}
.search-result-card:nth-child(4) {
  animation-delay: 0.2s;
}
.search-result-card:nth-child(5) {
  animation-delay: 0.25s;
}