/* effects/animation.css - animations & keyframes */

/* Fade in / slide up used by hero & on-load */
@keyframes fadeInUp {
    from { opacity:0; transform: translateY(30px); }
    to   { opacity:1; transform: translateY(0); }
  }
  
  /* particles float */
  @keyframes float {
    0%,100%{ transform: translateY(0) translateX(0); opacity:0; }
    10%{ opacity:1; }
    90%{ opacity:1; }
    100%{ transform: translateY(-100vh) translateX(100px); opacity:0; }
  }
  
  /* rotating border */
  @keyframes rotateBorder {
    0% { transform: translate(-50%,-50%) rotate(0deg); }
    100% { transform: translate(-50%,-50%) rotate(360deg); }
  }
  
  /* profile floating */
  @keyframes floatUpDown {
    0%,100% { transform: translate(-50%,-50%) translateY(0); }
    50% { transform: translate(-50%,-50%) translateY(-20px); }
  }
  
  /* icons floating around */
  @keyframes floatAround {
    0%,100% { transform: translate(0,0) scale(1); }
    25% { transform: translate(10px,-10px) scale(1.1); }
    50% { transform: translate(-5px,-15px) scale(0.9); }
    75% { transform: translate(-10px,5px) scale(1.05); }
  }
  
  /* modal / overlay animations */
  @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  @keyframes slideUp { from { transform: translateY(50px); opacity:0; } to { transform: translateY(0); opacity:1; } }
  
  /* small entrance helpers */
  .fade-in { animation: fadeIn .35s ease forwards; }
  .slide-up { animation: slideUp .35s ease forwards; }