.lines-loader {
  display: flex;
  align-items: center;
  gap: 10px;
}

.line {
  width: 10px;
  height: 70px;
  background-color: #ffffff;
  animation: bounce 1.5s infinite ease-in-out;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Box shadow added */
}

/* Create staggered bouncing effect */
.line:nth-child(2) {
  animation-delay: 0.3s;
}

.line:nth-child(3) {
  animation-delay: 0.6s;
}

.line:nth-child(5) {
  animation-delay: 1.2s;
}

/* Bounce Keyframes */
@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}