.marcas-section{
  background:linear-gradient(180deg,#ffffff 0%,var(--gray-100) 100%);
  overflow:hidden;
}

.marcas-container{
  display:flex;
  flex-direction:column;
  gap:34px;
}

.marcas-header{
  text-align:center;
}

.marcas-header .section-label{
  justify-content:center;
}

.marcas-header .section-label::before{
  display:none;
}

.marcas-header .sub{
  margin:12px auto 0;
  max-width:620px;
}

.marcas-carousel{
  position:relative;
  width:100%;
}

.marcas-viewport{
  position:relative;
  overflow:hidden;
  width:100%;
  padding:14px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
}

.marcas-track{
  --marcas-duration:34s;
  display:flex;
  align-items:center;
  gap:clamp(22px,4vw,48px);
  width:max-content;
  will-change:transform;
}

.marcas-track.is-ready{
  animation:marcas-scroll var(--marcas-duration) linear infinite;
}

.marcas-carousel:hover .marcas-track.is-ready{
  animation-play-state:paused;
}

.marca-item{
  flex:0 0 auto;
  min-width:clamp(142px,15vw,190px);
  height:94px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 24px;
  border:1px solid var(--gray-200);
  border-radius:10px;
  background:rgba(255,255,255,.86);
  box-shadow:var(--shadow-sm);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.marca-item:hover{
  transform:translateY(-2px);
  border-color:rgba(34,167,79,.28);
  box-shadow:var(--shadow-md);
}

.marca-item img{
  display:block;
  width:auto;
  max-width:150px;
  height:clamp(40px,5vw,58px);
  object-fit:contain;
  opacity:.7;
  filter:saturate(.9);
  transition:opacity .22s ease,transform .22s ease,filter .22s ease;
}

.marca-item:hover img{
  opacity:1;
  filter:saturate(1);
  transform:scale(1.05);
}

@keyframes marcas-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(calc(-1 * var(--marcas-distance, 50%)))}
}

@media(max-width:768px){
  .marcas-container{
    gap:26px;
  }

  .marcas-viewport{
    overflow:hidden;
    padding:10px 0 16px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  }

  .marcas-track{
    gap:16px;
    padding:0 2px;
  }

  .marca-item{
    min-width:136px;
    height:86px;
    padding:16px 20px;
  }

  .marca-item img{
    max-width:126px;
    height:44px;
  }
}

@media(prefers-reduced-motion:reduce){
  .marcas-track.is-ready{
    animation:none;
  }

  .marca-item img{
    transition:none;
  }
}