/* ═══════════════════════════════════════════════════
   Looping Logos — Animated logo carousel
   ═══════════════════════════════════════════════════ */

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

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

/* ── Group (stacked via grid) ─────────────────────── */

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

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

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

/* ── Item (logo wrapper) ──────────────────────────── */

.nb-looping-logos__item {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transform: translateY(calc(var(--nb-ll-ty, 40) * 1px));
  filter: blur(calc(var(--nb-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;
}

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

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

/* ── Image ────────────────────────────────────────── */

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