/* Minimal, server-rendered customer row for the Maliyo homepage. */
.my-el-customers{
  padding:33px 0 76px;
  overflow:hidden;
}
.my-el-customers-head{
  align-items:center;
  text-align:center;
}
.my-el-customers-head h2{
  margin:8px 0 4px;
  color:#f0f7f3;
  font-size:28px;
  line-height:1.55;
}
.my-el-customers-head p{
  max-width:610px;
  margin:0 auto;
  color:#82948b;
  font-size:12px;
  line-height:2;
}
.my-el-customers-widget,
.my-el-customers-widget>.elementor-widget-container{
  width:100%;
}
.my-customers-shell{
  width:100%;
  margin-top:22px;
  position:relative;
}
.my-customers-viewport{
  width:100%;
  position:relative;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
}
.my-customers-track{
  width:max-content;
  display:flex;
  align-items:stretch;
  gap:18px;
  direction:ltr;
  will-change:transform;
}
.my-customers-set{
  display:flex;
  align-items:stretch;
  gap:18px;
  flex:0 0 auto;
}
.my-customer-card{
  box-sizing:border-box;
  width:226px;
  min-height:178px;
  padding:4px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  direction:rtl;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  color:inherit;
  text-align:center;
  text-decoration:none;
  box-shadow:none;
  transition:transform .22s ease;
}
.my-customer-card:hover,
.my-customer-card:focus-visible{
  border-color:transparent;
  background:transparent;
  box-shadow:none;
  outline:0;
  transform:translateY(-2px);
}
.my-customer-card:hover .my-customer-logo,
.my-customer-card:focus-visible .my-customer-logo{
  border-color:rgba(75,241,139,.2);
  box-shadow:0 11px 30px rgba(19,213,98,.1);
  transform:scale(1.025);
}
.my-customer-logo{
  box-sizing:border-box;
  width:87px;
  height:87px;
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 87px;
  overflow:hidden;
  border:1px solid rgba(75,241,139,.09);
  border-radius:50%;
  background:linear-gradient(145deg,rgba(75,241,139,.11),rgba(75,241,139,.035));
  color:var(--my-green);
  box-shadow:inset 0 1px rgba(255,255,255,.025);
  transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.my-customer-logo>span{
  font-size:27px;
  font-weight:800;
  line-height:1;
}
.my-customer-logo img{
  width:100%;
  height:100%;
  padding:1px;
  position:absolute;
  inset:0;
  border-radius:50%;
  background:rgba(247,250,248,.8);
  object-fit:contain;
}
.my-customer-logo.is-fallback img{display:none}
.my-customer-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.my-customer-copy small{
  color:var(--my-green);
  font-size:8px;
  line-height:1.5;
}
.my-customer-copy strong{
  max-width:100%;
  margin-top:2px;
  overflow:hidden;
  color:#eef6f1;
  font-size:12.5px;
  font-weight:760;
  line-height:1.75;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.my-customer-copy>span{
  margin-top:3px;
  color:#7e9187;
  font-size:9px;
  line-height:1.8;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.my-customers-shell.is-static .my-customers-track{
  width:100%;
  direction:rtl;
}
.my-customers-shell.is-static .my-customers-set{
  width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,226px));
  justify-content:center;
}
.my-customers-shell.is-carousel .my-customers-track{
  animation:my-customers-flow 38s linear infinite;
}
.my-customers-shell.is-carousel .my-customers-viewport:hover .my-customers-track,
.my-customers-shell.is-carousel .my-customers-viewport:focus-within .my-customers-track,
.my-customers-shell.is-carousel .my-customers-viewport:active .my-customers-track{
  animation-play-state:paused;
}
.my-customers-status{
  margin-top:24px;
  padding:18px;
  border:1px dashed rgba(75,241,139,.15);
  border-radius:18px;
  color:#7f9188;
  font-size:10px;
  text-align:center;
}
@keyframes my-customers-flow{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(calc(-50% - 9px),0,0)}
}

html[data-theme="light"] .my-el-customers-head h2{color:#143522}
html[data-theme="light"] .my-el-customers-head p{color:#62766b}
html[data-theme="light"] .my-customer-card{
  border-color:transparent;
  background:transparent;
  box-shadow:none;
}
html[data-theme="light"] .my-customer-card:hover,
html[data-theme="light"] .my-customer-card:focus-visible{
  border-color:transparent;
  background:transparent;
  box-shadow:none;
}
html[data-theme="light"] .my-customer-copy strong{color:#173723}
html[data-theme="light"] .my-customer-copy>span{color:#64776d}
html[data-theme="light"] .my-customer-logo{
  border-color:rgba(13,189,85,.1);
  background:linear-gradient(145deg,rgba(13,189,85,.1),rgba(13,189,85,.025));
}

@media(max-width:760px){
  .my-el-customers{
    width:100%;
    padding:27px 0 62px;
  }
  .my-el-customers-head{
    width:calc(100% - 28px);
    margin-inline:auto;
  }
  .my-el-customers-head h2{
    font-size:24px;
  }
  .my-el-customers-head p{
    max-width:340px;
    font-size:11px;
  }
  .my-customers-shell{
    margin-top:18px;
    direction:ltr;
  }
  .my-customers-viewport{
    box-sizing:border-box;
    display:block;
    margin-inline:auto;
    padding-inline:calc((100% - 188px)/2);
    direction:ltr;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);
  }
  .my-customers-track{
    min-width:100%;
    margin-inline:auto;
    direction:ltr;
  }
  .my-customers-set{
    justify-content:center;
    direction:ltr;
  }
  .my-customer-card{
    width:188px;
    flex:0 0 188px;
    min-height:166px;
    padding:4px 8px;
    align-items:center;
    gap:7px;
    direction:rtl;
    border-radius:0;
    text-align:center;
  }
  .my-customer-logo{
    width:78px;
    height:78px;
    flex-basis:78px;
    align-self:center;
    margin-inline:auto;
    object-position:center;
  }
  .my-customer-logo img{
    margin:auto;
    object-position:50% 50%;
  }
  .my-customer-copy{
    width:100%;
    align-items:center;
    text-align:center;
  }
  .my-customers-shell.is-static .my-customer-card,
  .my-customers-shell.is-carousel .my-customer-card{
    align-items:center;
  }
  .my-customers-shell.is-static .my-customer-logo,
  .my-customers-shell.is-carousel .my-customer-logo{
    margin-right:auto;
    margin-left:auto;
  }
  .my-customer-logo>span{font-size:24px}
  .my-customer-copy small{font-size:8px}
  .my-customer-copy strong{font-size:12px}
  .my-customer-copy>span{font-size:8.7px}
  .my-customers-shell.is-static .my-customers-viewport{
    padding:0 14px 5px;
    overflow-x:auto;
    scroll-padding-inline:calc((100% - 188px)/2);
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-mask-image:none;
    mask-image:none;
  }
  .my-customers-shell.is-static .my-customers-viewport::-webkit-scrollbar{display:none}
  .my-customers-shell.is-static .my-customers-track{
    width:max-content;
    min-width:100%;
    justify-content:center;
    direction:ltr;
  }
  .my-customers-shell.is-static .my-customers-set{
    width:auto;
    margin-inline:auto;
    display:flex;
    justify-content:center;
    direction:ltr;
  }
  .my-customers-shell.is-static .my-customer-card{scroll-snap-align:center}
  .my-customers-shell.is-carousel .my-customers-viewport{
    direction:ltr;
  }
  .my-customers-shell.is-carousel .my-customers-track{
    min-width:100%;
    margin:0;
    justify-content:flex-start;
    direction:ltr;
    transform-origin:left center;
    animation-duration:31s;
  }
  .my-customers-shell.is-carousel .my-customers-set{
    min-width:0;
    justify-content:flex-start;
    direction:ltr;
  }
}

@media(prefers-reduced-motion:reduce){
  .my-customers-shell.is-carousel .my-customers-track{
    animation:none;
    transform:none;
  }
  .my-customers-shell.is-carousel .my-customers-set[aria-hidden="true"]{display:none}
  .my-customers-shell.is-carousel .my-customers-viewport{
    padding-bottom:5px;
    overflow-x:auto;
    scrollbar-width:thin;
  }
}
