/* =========================================================
   Видео-фон первого экрана
   Видео лежит под контентом, приглушено и затемнено, чтобы
   текст и панель оставались читаемыми. Работает в обеих темах.
   ========================================================= */

.hero { position: relative; overflow: hidden; }

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero__bg-video {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%) scale(1.06);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  object-fit: cover;
  filter: saturate(1.05) contrast(1.03);
  /* видео светлое — на тёмном фоне приглушаем и смешиваем обычным способом */
  opacity: .40;
  mix-blend-mode: luminosity;
}

/* затемнение: слева плотнее — там текст, справа видео видно сильнее */
.hero__bg::after {
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(100deg,
      rgba(8, 13, 23, .94) 0%,
      rgba(8, 13, 23, .84) 32%,
      rgba(8, 13, 23, .58) 62%,
      rgba(8, 13, 23, .28) 100%),
    radial-gradient(90% 120% at 88% 12%, rgba(255, 106, 31, .18), transparent 62%);
}

/* контент hero — поверх видео */
.hero > .container,
.hero > .ticker { position: relative; z-index: 2; }

/* --- светлая пурпурная тема --- */
[data-theme="light"] .hero__bg-video {
  opacity: .48;
  mix-blend-mode: multiply;
  filter: saturate(1.02) contrast(1.05) brightness(1.04);
}
[data-theme="light"] .hero__bg::after {
  background:
    linear-gradient(100deg,
      rgba(255, 255, 255, .90) 0%,
      rgba(250, 248, 255, .76) 32%,
      rgba(250, 248, 255, .50) 64%,
      rgba(250, 248, 255, .24) 100%),
    radial-gradient(90% 120% at 88% 12%, rgba(168, 85, 247, .18), transparent 62%);
}

/* --- мобильные: экономим трафик, показываем только постер --- */
@media (max-width: 760px) {
  .hero__bg-video { display: none; }
  .hero__bg::after {
    background:
      linear-gradient(180deg, rgba(8, 13, 23, .93) 0%, rgba(8, 13, 23, .8) 60%, rgba(8, 13, 23, .92) 100%),
      radial-gradient(90% 90% at 80% 0%, rgba(255, 106, 31, .18), transparent 60%);
  }
  [data-theme="light"] .hero__bg::after {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, .95) 0%, rgba(250, 248, 255, .85) 60%, rgba(255, 255, 255, .94) 100%),
      radial-gradient(90% 90% at 80% 0%, rgba(168, 85, 247, .16), transparent 60%);
  }
}

/* --- уважаем «меньше движения»: вместо видео остаётся постер --- */
@media (prefers-reduced-motion: reduce) {
  .hero__bg-video { display: none; }
}

@media print {
  .hero__bg { display: none; }
}
