/* Looping Logos - Animated logo carousel */

.dan-looping-logos[data-flickering="1"] {
  opacity: 0;
}

.dan-looping-logos__track {
  display: grid;
  width: 100%;
}

.dan-looping-logos__group {
  grid-area: 1 / 1;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  visibility: hidden;
  pointer-events: none;
}

.dan-looping-logos__group--visible,
.dan-looping-logos__group--exiting {
  visibility: visible;
}

.dan-looping-logos__group--visible {
  pointer-events: auto;
}

.dan-looping-logos__item {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transform: translateY(calc(var(--dan-ll-ty, 40) * 1px));
  filter: blur(calc(var(--dan-ll-blur, 5) * 1px));
  transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
              filter 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, opacity, filter;
}

.dan-looping-logos__group--visible .dan-looping-logos__item {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.dan-looping-logos__group--exiting .dan-looping-logos__item {
  opacity: 0;
  transform: translateY(calc(var(--dan-ll-ty, 40) * -1px));
  filter: blur(calc(var(--dan-ll-blur, 5) * 1px));
}

.dan-looping-logos__item img,
.dan-looping-logos__item svg {
  display: block;
  width: auto;
  height: var(--dan-ll-logo-h, 50px);
  object-fit: contain;
}
