/* Core Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes borderPulse {
  0% { opacity: 0.3; filter: blur(4px); }
  100% { opacity: 0.8; filter: blur(8px); }
}

@keyframes floatAmbient {
  0% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-10px) rotate(2deg); }
  100% { transform: translateY(0px) rotate(0deg); }
}

/* Classes to apply animations via JS Intersection Observer */
.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }

/* Subtle Ambient Effects */
.floating-element {
  animation: floatAmbient 6s ease-in-out infinite;
}

/* Image reveal */
.reveal-image {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.2s cubic-bezier(0.77, 0, 0.175, 1);
}

.reveal-image.is-revealed {
  clip-path: inset(0 0 0 0);
}