/* Тёмный премиум-блок с красной линией и рандомным переливом */
.block-redline {
  --grad-duration: 12s;
  --grad-delay: 0s;
  --glow-duration: 8s;
  --glow-delay: 0s;

  position: relative;
  background: linear-gradient(135deg, #0F172A, #1E293B, #0A0F1E);
  background-size: 400% 400%;
  animation: gradientFlow var(--grad-duration) ease-in-out infinite;
  animation-delay: var(--grad-delay);

  color: #E5E7EB;
  border: 1px solid #1F2937;
  border-radius: 20px;
  overflow: hidden;

}

/* Красная линия сверху */
.block-redline::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  height: 3px; width: 100%;
  background: linear-gradient(90deg, #DD1139, #F43F5E, #B80E2F);
  box-shadow: 0 0 15px rgba(244,63,94,.8), 0 0 30px rgba(221,17,57,.4);
  pointer-events: none;
}

/* Мягкие облака-подсветки */
.block-redline::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 22% 28%, rgba(255, 50, 120, .10), transparent 70%),
    radial-gradient(circle at 78% 72%, rgba(0, 200, 255, .10), transparent 70%);
  mix-blend-mode: screen;
  animation: glowPulse var(--glow-duration) ease-in-out infinite alternate;
  animation-delay: var(--glow-delay);
  pointer-events: none;
}

/* Анимации */
@keyframes gradientFlow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes glowPulse {
  from { opacity: .25; transform: scale(1); }
  to   { opacity: .7;  transform: scale(1.08); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .block-redline,
  .block-redline::after {
    animation: none !important;
  }
}
