/* Brand logo slider - transform based (stable in Flatsome) */
.brand-slider{
  --gap: 34px;
  --cols: 4;
  position:relative;
  width:100%;
  background:#fff;
  padding:18px 48px;
  box-sizing:border-box;
}

.brand-viewport{ overflow:hidden; }

.brand-track{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:var(--gap);
  padding:10px 0;
  will-change:transform;
  transform:translate3d(0,0,0);
}

.brand-item{
  flex:0 0 calc((100% - (var(--gap) * (var(--cols) - 1))) / var(--cols));
  height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  min-width:0;
}

.brand-item img{
  max-height:112px;
  max-width:100%;
  width:auto;
  height:auto;
  display:block;
  object-fit:contain;
}

.brand-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:36px;
  height:36px;
  border:0;
  background:transparent;
  cursor:pointer;
  color:#333;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:.85;
  padding:0;
  z-index:2;
}
.brand-arrow:hover{ opacity:1; }
.brand-arrow.left{ left:6px; }
.brand-arrow.right{ right:6px; }
.brand-arrow svg{ width:24px; height:24px; display:block; }

@media (max-width: 849px){
  .brand-slider{ --cols: 2; --gap: 18px; padding:14px 40px; }
  .brand-item{ height:100px; }
  .brand-item img{ max-height:92px; }
}
