/* FADE UP ANIMATION */
.fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* DELAYS */
.delay-1 { transition-delay: 0.2s; }
.delay-2 { transition-delay: 0.4s; }
.delay-3 { transition-delay: 0.6s; }
.delay-4 { transition-delay: 0.8s; }

/* FLOAT ANIMATION */
@keyframes float {
  0% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(30px, 50px) rotate(5deg); }
  100% { transform: translate(-20px, 20px) rotate(-5deg); }
}

/* TYPEWRITER CURSOR */
.cursor {
  display: inline-block;
  width: 3px;
  background-color: var(--primary);
  margin-left: 5px;
  animation: blink 1s infinite;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* HEART BEAT */
.heart {
  display: inline-block;
  animation: heartBeat 1.5s infinite;
}

@keyframes heartBeat {
  0% { transform: scale(1); }
  15% { transform: scale(1.3); }
  30% { transform: scale(1); }
  45% { transform: scale(1.15); }
  60% { transform: scale(1); }
}

/* SCROLL INDICATOR */
.scroll-indicator {
  width: 25px;
  height: 45px;
  border: 2px solid var(--text-muted);
  border-radius: 20px;
  margin: 10px auto;
  position: relative;
}

.scroll-dot {
  width: 4px;
  height: 8px;
  background: var(--primary);
  border-radius: 2px;
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  animation: scrollDown 2s infinite;
}

@keyframes scrollDown {
  0% { opacity: 0; transform: translate(-50%, 0); }
  30% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, 20px); }
}