/* =========================
   CONTAINER
========================= */
.magic-marquee {
  overflow: hidden;

  width: 100%;

  position: relative;
}

/* =========================
   TRACK
========================= */
.magic-track {
  display: flex;

  width: max-content;

  gap: 100px;

  animation: magicScroll 40s linear infinite;
}

/* =========================
   LINKS
========================= */
.magic-track a {
  display: block;

  flex-shrink: 0;
}

/* =========================
   IMAGES
========================= */
.magic-marquee .magic-track img {
  height: 120px !important;

  width: auto !important;

  max-width: 180px !important;

  object-fit: contain;

  border-radius: 12px;

  flex-shrink: 0;

  display: block;

  user-select: none;

  -webkit-user-drag: none;

  transition:
    transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.25s ease;
}

/* =========================
   HOVER EFFECT
========================= */
.magic-track a:hover img {
  transform: scale(1.05);
}