/* ============================================================
   VICTORY GLOW — 650×480
   Мягкие дышащие пятна света. Чистый фон-слой: блок кладётся
   ПОД контент кейсов. Фон прозрачный, границ нет.
   Исходник: animation/victory-glow.html (там же — комментарии
   по геометрии). Скоуп — .victory-glow.
   ============================================================ */
.victory-glow{
  position:relative;
  width:650px; height:480px;
  background:transparent;
  border:0;
  overflow:hidden;
  pointer-events:none;      /* не перехватывает клики по кейсам */

  /* края растворяются — прямоугольник не читается */
  -webkit-mask-image:radial-gradient(100% 100% at 50% 50%,#000 46%,rgba(0,0,0,.65) 74%,transparent 97%);
          mask-image:radial-gradient(100% 100% at 50% 50%,#000 46%,rgba(0,0,0,.65) 74%,transparent 97%);
}

/* --- пятна света ---
   Геометрия просчитана так, чтобы (центр ± радиус × max scale ± max сдвиг)
   не выходили за 650×480. Менять размер/позицию — только парой с keyframes. */
.victory-glow__blob{
  position:absolute;
  border-radius:50%;
  filter:blur(56px);
  will-change:transform,opacity;
}

/* 1. крупное голубое — смысловой центр композиции */
.victory-glow__blob--1{
  width:340px; height:340px; left:80px; top:45px;
  background:radial-gradient(circle at 50% 50%,
    #E3F1FF 0%, rgba(227,241,255,.55) 45%, rgba(227,241,255,0) 72%);
  opacity:.95;
  animation:victory-glow-drift1 21s ease-in-out infinite alternate;
}

/* 2. белое ядро — «свет в конце туннеля» */
.victory-glow__blob--2{
  width:300px; height:300px; left:270px; top:80px;
  background:radial-gradient(circle at 50% 50%,
    #FFFFFF 0%, rgba(255,255,255,.7) 40%, rgba(255,255,255,0) 70%);
  opacity:.9;
  animation:victory-glow-drift2 17s ease-in-out infinite alternate;
}

/* 3. серо-голубое — глубина и вес снизу */
.victory-glow__blob--3{
  width:330px; height:330px; left:135px; top:131px;
  background:radial-gradient(circle at 50% 50%,
    rgba(188,195,208,.75) 0%, rgba(188,195,208,.3) 48%, rgba(188,195,208,0) 74%);
  opacity:.75;
  animation:victory-glow-drift3 25s ease-in-out infinite alternate;
}

/* 4. синий акцент — самый сдержанный, работает как подпись */
.victory-glow__blob--4{
  width:240px; height:240px; left:330px; top:40px;
  background:radial-gradient(circle at 50% 50%,
    rgba(6,91,169,.28) 0%, rgba(6,91,169,.11) 45%, rgba(6,91,169,0) 70%);
  opacity:.8;
  animation:victory-glow-drift4 29s ease-in-out infinite alternate;
}

@keyframes victory-glow-drift1{
  0%  {transform:translate(0,0)        scale(1)}
  50% {transform:translate(46px,28px)  scale(1.09)}
  100%{transform:translate(18px,62px)  scale(.96)}
}
@keyframes victory-glow-drift2{
  0%  {transform:translate(0,0)         scale(1)}
  50% {transform:translate(-52px,34px)  scale(1.12)}
  100%{transform:translate(-24px,-30px) scale(.94)}
}
@keyframes victory-glow-drift3{
  0%  {transform:translate(0,0)         scale(1.04)}
  50% {transform:translate(40px,-38px)  scale(.93)}
  100%{transform:translate(-36px,-14px) scale(1.08)}
}
@keyframes victory-glow-drift4{
  0%  {transform:translate(0,0)         scale(.96)}
  50% {transform:translate(-40px,46px)  scale(1.1)}
  100%{transform:translate(26px,20px)   scale(1)}
}

/* 5. медленный shimmer — благородный блик поверх пятен */
.victory-glow__shimmer{
  position:absolute; top:-30%; left:-60%;
  width:55%; height:160%;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.42) 48%,
    rgba(255,255,255,0) 100%);
  filter:blur(26px);
  /* гасим верх и низ полосы, иначе она обрубается о край кадра */
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 76%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 24%,#000 76%,transparent 100%);
  transform:rotate(14deg);
  animation:victory-glow-sweep 15s cubic-bezier(.5,0,.5,1) infinite;
}
@keyframes victory-glow-sweep{
  0%,12%  {transform:translateX(0)     rotate(14deg)}
  88%,100%{transform:translateX(320%)  rotate(14deg)}
}

/* пауза, когда блок вне экрана */
.victory-glow.is-paused .victory-glow__blob,
.victory-glow.is-paused .victory-glow__shimmer{animation-play-state:paused}

@media (prefers-reduced-motion:reduce){
  .victory-glow__blob,
  .victory-glow__shimmer{animation:none}
  .victory-glow__shimmer{opacity:.3; transform:translateX(150%) rotate(14deg)}
}
