/* ==========================================================================
   ANIMATIONS & KEYFRAMES — Ultra Premium Portfolio
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. REVEAL & ENTRANCE KEYFRAMES
   -------------------------------------------------------------------------- */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

@keyframes scaleUp {
  from {
    opacity: 0;
    transform: scale(0.92);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* --------------------------------------------------------------------------
   2. FLOATING ELEMENTS
   -------------------------------------------------------------------------- */
@keyframes floatSlow {
  0%, 100% { transform: translateY(0px) rotate(0deg);  }
  50%       { transform: translateY(-12px) rotate(2deg); }
}

@keyframes floatReverse {
  0%, 100% { transform: translateY(0px) rotate(0deg);   }
  50%       { transform: translateY(12px) rotate(-2deg); }
}

/* --------------------------------------------------------------------------
   3. TESTIMONIALS / MARQUEE
   -------------------------------------------------------------------------- */
@keyframes marqueeScroll {
  0%   { transform: translateX(0);    }
  100% { transform: translateX(-50%); }
}

/* --------------------------------------------------------------------------
   4. TYPING CARET BLINK
   -------------------------------------------------------------------------- */
@keyframes caretBlink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* --------------------------------------------------------------------------
   5. AVAILABILITY DOT PING
   -------------------------------------------------------------------------- */
@keyframes pingDot {
  0%       { transform: scale(1); opacity: 0.8; }
  75%, 100%{ transform: scale(2.4); opacity: 0;  }
}

/* --------------------------------------------------------------------------
   6. SCROLL INDICATOR BOUNCE
   -------------------------------------------------------------------------- */
@keyframes scrollBounce {
  0%, 100% { transform: translateY(0);   }
  50%       { transform: translateY(6px); }
}

/* --------------------------------------------------------------------------
   7. UTILITY CLASSES
   -------------------------------------------------------------------------- */
.animate-float {
  animation: floatSlow 6s ease-in-out infinite;
}

.animate-float-reverse {
  animation: floatReverse 7s ease-in-out infinite;
}

.typing-caret {
  display: inline-block;
  width: 3px;
  height: 1.15em;
  background-color: #ffffff;
  margin-left: 4px;
  vertical-align: middle;
  animation: caretBlink 0.85s ease-in-out infinite;
}

.scroll-icon {
  animation: scrollBounce 2s ease-in-out infinite;
}

/* --------------------------------------------------------------------------
   8. PREFERS-REDUCED-MOTION OVERRIDES
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  .animate-float,
  .animate-float-reverse,
  .scroll-icon,
  .typing-caret {
    animation: none !important;
  }

  .testimonials-track {
    animation: none !important;
  }

  .typing-caret {
    opacity: 1;
  }
}