.scroll-promotion {
  display: flex;
  width: 100%;
  align-items: center;
  position: relative;
  /* border-top: 1px solid rgba(255, 255, 255, 0.2); */
  background-color: rgba(var(--color-background), 1);
}

.scroll-promotion-container {
  display: flex;
  width: 100%;
  overflow: hidden;
  position: relative;
  background: transparent;
  /* padding: 12px 0; */
}
.scroll-promotion-container-scroller {
  display: flex;
  /* animation: scroll linear infinite; */
  /* 新增CSS变量控制时长 */
  animation-duration: var(--scroll-duration, 10s);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.scroll-promotion-container-scroller-content {
  white-space: nowrap;
  flex-shrink: 0;
  /* padding: 0 var(--column-gap, 16px); */
  margin: 0;
  display: flex;
  gap: var(--column-gap, 16px);
}
/* 关键修改：通过类控制动画而非行内样式 */
.scroll-promotion-container-scroller.animate {
  animation-name: var(--scroll-animation-name, scroll);
  animation-play-state: running;
}
.scroll-promotion-container:hover .scroll-promotion-container-scroller {
  animation-play-state: paused;
}

.scroll-promotion__image {
  width: var(--desktop-image-width, 50px);
  height: var(--desktop-image-height, 50px);
  border-radius: var(--border-radius, 0px);
  overflow: hidden;
}

.scroll-promotion__image picture {
  width: 100%;
  height: 100%;
}

.scroll-promotion__text {
  color: var(--text-color, #000);
  font-weight: var(--text-font-weight, 400);
}




/* @media (max-width: 1024px) {
  .scroll-promotion__image {
    width: var(--ipad-image-width, 50px);
    height: var(--ipad-image-height, 50px);
  }
} */

@media (max-width: 959px) {
  .scroll-promotion {
    flex-direction: column;
    border-top: none;
  }

  .scroll-promotion .scroll-promotion-top {
    width: 100%;
    justify-content: center;
    margin-right: 0px;
    flex-wrap: wrap;
  }

  .scroll-promotion-container {
    width: 100%;
  }

  .scroll-promotion__image {
    width: var(--mobile-image-width, 50px);
    height: var(--mobile-image-height, 50px);
  }
}