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

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

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

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px) rotate(var(--rotation, 0deg));
  }
  50% {
    transform: translateY(-20px) rotate(var(--rotation, 0deg));
  }
}

/* Apply animations to sections */
.section-title,
.section-subtitle,
.about-container,
.skills-text,
.skills-grid,
.contact-text,
.contact-form {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.section-title.animate,
.section-subtitle.animate,
.about-container.animate,
.skills-text.animate,
.skills-grid.animate,
.contact-text.animate,
.contact-form.animate {
  opacity: 1;
  transform: translateY(0);
}

.service-card {
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.service-card.animate {
  opacity: 1;
  transform: scale(1);
}

.service-card:nth-child(1) { transition-delay: 0.1s; }
.service-card:nth-child(2) { transition-delay: 0.2s; }
.service-card:nth-child(3) { transition-delay: 0.3s; }

.work-card {
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.work-card.animate {
  opacity: 1;
  transform: scale(1);
}

.work-card:nth-child(1) { transition-delay: 0.1s; }
.work-card:nth-child(2) { transition-delay: 0.2s; }
.work-card:nth-child(3) { transition-delay: 0.3s; }
.work-card:nth-child(4) { transition-delay: 0.4s; }
.work-card:nth-child(5) { transition-delay: 0.5s; }

/* Header Entrance Animations */
.logo {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.logo.animate {
  opacity: 1;
  transform: translateX(0);
}

.main-nav {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.8s ease 0.2s, transform 0.8s ease 0.2s;
}

.main-nav.animate {
  opacity: 1;
  transform: translateY(0);
}

.header-container .btn {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.8s ease 0.4s, transform 0.8s ease 0.4s;
}

.header-container .btn.animate {
  opacity: 1;
  transform: translateX(0);
}

.mobile-nav-toggle {
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.6s ease 0.6s, transform 0.6s ease 0.6s;
}

.mobile-nav-toggle.animate {
  opacity: 1;
  transform: scale(1);
}

/* Floating Icons Animation */
.hero-icons img {
  animation: float 6s ease-in-out infinite;
}

.hero-icons img:nth-child(1) { animation-delay: 0s; }
.hero-icons img:nth-child(2) { animation-delay: 1s; }
.hero-icons img:nth-child(3) { animation-delay: 2s; }
.hero-icons img:nth-child(4) { animation-delay: 3s; }
.hero-icons img:nth-child(5) { animation-delay: 4s; }