.moving-logo {
    height: 100px;
    overflow: hidden;
    z-index: -1;
    top: -0.5rem;
}

.moving-logo svg path {
    animation: move-to 4s steps(10) infinite;
}

@keyframes move-to {
    from {
        transform: translateX(calc(max(-50vw, -600px) - var(--i) * 60px));
    }
    to {
        transform: translateX(calc(min(50vw, 600px) - var(--i) * 60px));
    }
}

@media screen and (min-width: 768px) {
    .moving-logo {
        top: 1rem;
    }
}