/* JS fallback will override this class when needed */
    .js-fallback::before {
      animation: none !important;
      transform: rotate(var(--rotation, 0deg));
    }.bg-rotator {
      position: relative;
      overflow: hidden;
      background-image: none;
    }

    .bg-rotator::before {
      content: "";
      position: absolute;
      inset: -20%;
      background-image: url('https://pekana.neleto.dev/files/user-upload/assets/logos/blume_hell.svg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: 75vw;
      z-index: 0;
      will-change: transform;
      
      /* Primary: CSS scroll-driven (preferred when supported) */
     animation: rotate-bg linear forwards;
  animation-timeline: scroll(root);   /* sometimes fixes attachment issues */
  animation-range: 0% 1200%;        /* Slower/more subtle – tune: 400% faster, 1000%+ slower */
    
    }

    @media (min-width: 768px) {
      .bg-rotator::before {
        background-size: 75vh;
      }
    }

    @keyframes rotate-bg {
      to {
        transform: rotate(360deg);
      }
    }

    /* JS fallback will override this class when needed */
    .js-fallback::before {
      animation: none !important;
      transform: rotate(var(--rotation, 0deg));
    }