/* 
 * KSL Animations & Micro-interactions
 * PT Kunci Segitigamas Logistik
 */

@keyframes pulseMarker {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(201, 162, 39, 0.7);
  }
  70% {
    transform: scale(1.15);
    box-shadow: 0 0 0 14px rgba(201, 162, 39, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(201, 162, 39, 0);
  }
}

@keyframes pulseBlue {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(74, 144, 217, 0.7);
  }
  70% {
    transform: scale(1.15);
    box-shadow: 0 0 0 14px rgba(74, 144, 217, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(74, 144, 217, 0);
  }
}

@keyframes floatAnim {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

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

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.anim-pulse {
  animation: pulseMarker 2s infinite ease-in-out;
}

.anim-pulse-blue {
  animation: pulseBlue 2s infinite ease-in-out;
}

.anim-float {
  animation: floatAnim 4s ease-in-out infinite;
}

.anim-fade-in {
  animation: fadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.transition-all {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.hover-lift {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 35px -10px rgba(26, 39, 68, 0.18);
}