/* Team section: two photos stacked in the .main_img frame, cross-fading in a loop.
   The frame keeps main.css's .main_img sizing, radius and scroll-zoom animation. */

.projects .project_case .team_fade {
  position: relative;
  overflow: hidden;
}

.team_fade img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* second photo fades in over the first, holds, then fades out */
.team_fade img:nth-child(2) {
  /* crop from the bottom so the group sits at the same height as in team.png */
  object-position: 50% 100%;
  opacity: 0;
  animation: teamFade 14s ease-in-out infinite;
}

@keyframes teamFade {
  0%, 40% { opacity: 0; }
  50%, 90% { opacity: 1; }
  100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .team_fade img:nth-child(2) {
    animation: none;
  }
}