.module.pixeld-logo-carousel{
     box-shadow: inset 0 10px 36px -10px rgba(0,0,0,.5);
    overflow:hidden;

  
  .logo-carousel-wrapper{
   max-width:1296px;
    margin:0 auto;
    padding:96px 20px;
  }
  
  .heading{
    
    color: #5F6062;
    text-align: center;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
    
    h3{
      color: #271D42;
      text-align: center;
      font-family: Stag;
      font-size: 30px;
      font-style: normal;
      font-weight: 700;
      line-height: 36px; /* 120% */
    }
    
  }
  
  .logo-carousel{
      margin-top:50px;
      /* display: grid; 8?
      grid-template-columns: repeat(6, 1fr);
      gap: 10px; /* Optional: space between grid items */
    
    .item-logo{
      
      text-align:center;
      
    }
  }
}


.logo-viewport {
  overflow: hidden;
  padding: 40px 0;
  display: flex;
}

.logo-track {
  display: flex;
  width: max-content; /* Ensures the track is as wide as all logos combined */
  animation: marquee 30s linear infinite;
}

.item-logo {
  flex: 0 0 auto;
  padding: 0 40px; /* Space between logos */
}

.item-logo img {
  height: 50px; /* Set your logo height */
  width: auto;
  display: block;
}

/* The Animation */
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* Move half the distance of the doubled track */
}

/* Optional: Pause on hover */
.logo-viewport:hover .logo-track {
  animation-play-state: paused;
}