html {
  scroll-behavior: smooth;
}

@keyframes slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.scroll-logo {
  overflow-x: hidden;
  white-space: nowrap;
  cursor: pointer;
  position: relative;
}

.scroll-logo:hover .scroll-logo-slide,
.scroll-logo:hover .scroll-logo-slide-right {
  animation-play-state: paused;
}

.scroll-logo-slide,
.scroll-logo-slide-right {
  display: flex;
  align-items: center;
  gap: 40px;
}

.scroll-logo-slide {
  animation: slide 25s linear infinite;
}