/* ===================================
   SCAMPI - Animations
   =================================== */

/* ===== REVEAL ANIMATION ===== */
.scampi_reveal {
  opacity: 0;
  /* Use forwards to keep the final state active after animation */
}

.scampi_reveal.active {
  /* Separated animation to avoid conflict with hover transitions */
  opacity: 1;
  animation: scampiRevealEnter 0.4s ease-out forwards;
}

@keyframes scampiRevealEnter {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* ===== FLOAT ANIMATIONS ===== */
.scampi_float-slow {
  animation: scampiFloat 6s ease-in-out infinite;
}

.scampi_float-fast {
  animation: scampiFloat 4s ease-in-out infinite reverse;
}

@keyframes scampiFloat {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-20px);
  }

  100% {
    transform: translateY(0px);
  }
}

/* ===== SMOOTH SCROLL ===== */
html {
  scroll-behavior: smooth;
}

/* ===== TEXT OUTLINE (Optional) ===== */