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

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

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
  40% {transform: translateY(-10px);}
  60% {transform: translateY(-5px);}
}

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

.animate-fadeInUp {
  animation: fadeInUp 0.5s ease-out forwards;
}

.stagger-1 { animation-delay: 0.1s; }
.stagger-2 { animation-delay: 0.2s; }
.stagger-3 { animation-delay: 0.3s; }
.stagger-4 { animation-delay: 0.4s; }

.scroll-indicator {
  animation: bounce 2s infinite;
  margin-top: 40px;
}

.loader-leaf {
  animation: rotateLeaf 1.2s linear infinite;
  width: 60px;
  height: 60px;
  fill: var(--brand-sage);
}

.tab-content {
  animation: fadeIn 0.3s ease-in-out;
}