/* Hero Marquee Columns — бесконечные колонки изображений */

.hero-marquee {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-marquee__columns {
  position: absolute;
  inset: 0;
  display: grid;
  gap: 16px;
  padding: 16px;
  z-index: 0;
}

.hero-marquee[data-columns="2"] .hero-marquee__columns { grid-template-columns: repeat(2, 1fr); }
.hero-marquee[data-columns="3"] .hero-marquee__columns { grid-template-columns: repeat(3, 1fr); }
.hero-marquee[data-columns="4"] .hero-marquee__columns { grid-template-columns: repeat(4, 1fr); }
.hero-marquee[data-columns="5"] .hero-marquee__columns { grid-template-columns: repeat(5, 1fr); }

/* Mobile: форсируем 2 колонки если задано ≥ 3 */
@media (max-width: 767px) {
  .hero-marquee[data-columns="3"] .hero-marquee__columns,
  .hero-marquee[data-columns="4"] .hero-marquee__columns,
  .hero-marquee[data-columns="5"] .hero-marquee__columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .hero-marquee[data-columns="3"] .hero-marquee__col:nth-child(n+3),
  .hero-marquee[data-columns="4"] .hero-marquee__col:nth-child(n+3),
  .hero-marquee[data-columns="5"] .hero-marquee__col:nth-child(n+3) {
    display: none;
  }
}

.hero-marquee__col {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  height: 100%;
}

.hero-marquee__track {
  display: flex;
  flex-direction: column;
  gap: 16px;
  will-change: transform;
  animation-name: hero-marquee-up;
  animation-duration: var(--marquee-duration, 40s);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-play-state: running;
}

/* Скорости */
.hero-marquee[data-speed="slow"]   .hero-marquee__track { --marquee-duration: 60s; }
.hero-marquee[data-speed="normal"] .hero-marquee__track { --marquee-duration: 40s; }
.hero-marquee[data-speed="fast"]   .hero-marquee__track { --marquee-duration: 25s; }

/* Направления */
.hero-marquee[data-direction="all_up"]   .hero-marquee__track { animation-name: hero-marquee-up; }
.hero-marquee[data-direction="all_down"] .hero-marquee__track { animation-name: hero-marquee-down; }

/* Чередующееся — нечётные вверх, чётные вниз */
.hero-marquee[data-direction="alternating"] .hero-marquee__col:nth-child(odd)  .hero-marquee__track {
  animation-name: hero-marquee-up;
}
.hero-marquee[data-direction="alternating"] .hero-marquee__col:nth-child(even) .hero-marquee__track {
  animation-name: hero-marquee-down;
}

@keyframes hero-marquee-up {
  from { transform: translateY(0); }
  to   { transform: translateY(-50%); }
}

@keyframes hero-marquee-down {
  from { transform: translateY(-50%); }
  to   { transform: translateY(0); }
}

.hero-marquee__tile {
  flex: 0 0 auto;
  border-radius: 16px;
  overflow: hidden;
}

.hero-marquee__img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* Overlay — тёмное затемнение для читаемости */
.hero-marquee__overlay {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 5;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 40%, rgba(0, 0, 0, 0.85) 60%, rgba(0, 0, 0, 0) 100%);
}

.hero-marquee[data-overlay-height="strip"] .hero-marquee__overlay { height: 30%; }
.hero-marquee[data-overlay-height="band"]  .hero-marquee__overlay { height: 60%; }
.hero-marquee[data-overlay-height="full"]  .hero-marquee__overlay { height: 100%; }

.hero-marquee[data-overlay-position="top"]    .hero-marquee__overlay { top: 0; }
.hero-marquee[data-overlay-position="center"] .hero-marquee__overlay { top: 50%; transform: translateY(-50%); }
.hero-marquee[data-overlay-position="bottom"] .hero-marquee__overlay { bottom: 0; }

.hero-marquee__content {
  position: relative;
  z-index: 10;
}

/* Hover pause */
.hero-marquee[data-pause-on-hover="1"]:hover .hero-marquee__track {
  animation-play-state: paused;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hero-marquee__track {
    animation-play-state: paused !important;
  }
}