/* LuckyPari Champions Cup — minimal CSS layer.
   Бренд-токены живут в Tailwind config. Здесь только то, что Tailwind не выразит:
   parallax-фон страницы, radial gold-glow hero и keyframe-дыхание golden ring у 1-го призового места. */

/* Полноэкранный фон: мобайл — portrait (кубки снизу по бокам),
   десктоп — landscape (кубки слева/справа, чистый тёмный центр под текст).
   Parallax (fixed) только на десктопе — iOS Safari не поддерживает корректно. */
body {
  background-image: url('assets/images/hero-bg-mobile.webp');
  background-attachment: scroll;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}

@media (min-width: 768px) {
  body {
    background-image: url('assets/images/hero-bg-desktop.webp');
    background-attachment: fixed;
    background-position: center center;
  }
}

/* Hero: золотой radial-glow поверх parallax-фона.
   Убрали непрозрачный #0A0A0A — фон теперь на body. */
.bg-gradient-radial-gold {
  background: radial-gradient(circle at 50% 0%, rgba(255, 212, 42, 0.22) 0%, transparent 60%);
}

/* Glow-дыхание для 1-го призового места.
   Inset ring дублируется внутри keyframe, иначе ring-2 (тоже box-shadow) пропадал бы при анимации. */
@keyframes glow-breath {
  0%, 100% {
    box-shadow:
      0 0 60px -12px rgba(255, 212, 42, 0.55),
      inset 0 0 0 2px #FFD42A;
  }
  50% {
    box-shadow:
      0 0 80px -8px rgba(255, 212, 42, 0.80),
      inset 0 0 0 2px #FFD42A;
  }
}
.animate-glow-breath {
  animation: glow-breath 3s ease-in-out infinite;
}

/* PDF-режим: headless Chrome неустойчиво рендерит bg-clip-text gradient в multi-line
   заголовке. В ?pdf=1 заменяем градиент на сплошной gold. */
html[data-pdf-ready="1"] h1.brand-gradient {
  background: none !important;
  -webkit-background-clip: initial !important;
          background-clip: initial !important;
  -webkit-text-fill-color: #FFD42A !important;
  color: #FFD42A !important;
}

/* prefers-reduced-motion: точечно отключаем motion-сильные эффекты.
   transition-colors / opacity не трогаем — они не вызывают motion sickness. */
@media (prefers-reduced-motion: reduce) {
  .animate-glow-breath {
    animation: none;
    /* Статичный glow + ring сохраняем, чтобы 1-е место оставалось визуально выделено. */
    box-shadow:
      0 0 60px -12px rgba(255, 212, 42, 0.55),
      inset 0 0 0 2px #FFD42A;
  }
  .hover\:scale-105:hover { transform: none !important; }
  .active\:scale-\[0\.98\]:active { transform: none !important; }
}