/* Base Animation Classes */
.fade-in {
  opacity: 0;
  animation: fadeIn 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.slide-up {
  opacity: 0;
  transform: translateY(30px);
  animation: slideUp 1s cubic-bezier(0.16, 1, 0.3, 1) 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; }

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

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

/* Ambient Effects */
.parallax-slow {
  animation: subtleZoom 20s infinite alternate linear;
}

@keyframes subtleZoom {
  from { transform: scale(1); }
  to { transform: scale(1.08); }
}

/* Image Reveal Overlay */
.image-reveal {
  position: relative;
  overflow: hidden;
}

.image-reveal::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-bg-primary);
  z-index: 1;
  animation: revealRight 1.2s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

@keyframes revealRight {
  0% { transform: translateX(0); }
  100% { transform: translateX(100%); }
}

/* Smooth Scrolling Wrapper */
html {
  scroll-behavior: smooth;
}