/* ALMS Esport — delikatne animacje strony głównej (motion.js dodaje klasę .alms-motion).
   Bez JS albo przy „ogranicz ruch” w systemie strona jest statyczna. */

/* ---------- Pojawianie się przy przewijaniu ---------- */
.alms-motion [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition: opacity .7s ease, transform .8s cubic-bezier(.2, .75, .2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.alms-motion [data-reveal="left"] { transform: translate3d(-28px, 0, 0); }
.alms-motion [data-reveal].is-visible { opacity: 1; transform: none; }
/* Dopóki element wjeżdża, ma długie przejście z opóźnieniem; potem (data-settled) przejmują efekty hover. */
.alms-motion [data-reveal].is-visible:not([data-settled]) {
  transition: opacity .7s ease var(--reveal-delay, 0ms), transform .8s cubic-bezier(.2, .75, .2, 1) var(--reveal-delay, 0ms);
}

/* Hero: wejście od razu po załadowaniu (bez czekania na przewinięcie). */
@keyframes alms-rise { from { opacity: 0; transform: translate3d(0, 18px, 0); } to { opacity: 1; transform: none; } }
.alms-motion .alms-hero-copy > * { animation: alms-rise .8s cubic-bezier(.2, .75, .2, 1) both; }
.alms-motion .alms-hero-copy > :nth-child(2) { animation-delay: .08s; }
.alms-motion .alms-hero-copy > :nth-child(3) { animation-delay: .16s; }
.alms-motion .alms-hero-copy > :nth-child(4) { animation-delay: .24s; }
.alms-motion .alms-hero-copy > :nth-child(5) { animation-delay: .32s; }
@keyframes alms-card-in { from { opacity: 0; transform: perspective(900px) rotate(-10deg) scale(.92); } to { opacity: 1; } }
.alms-motion .alms-hero-art { animation: alms-card-in 1s .15s cubic-bezier(.2, .75, .2, 1) both; }

/* ---------- Żywe tło w nagłówku ---------- */
.alms-motion .alms-hero-v2::before {
  content: ''; position: absolute; inset: -30%; pointer-events: none;
  background:
    radial-gradient(38% 42% at 72% 38%, rgba(110, 193, 228, .22), transparent 70%),
    radial-gradient(30% 34% at 22% 78%, rgba(221, 182, 113, .14), transparent 70%),
    radial-gradient(26% 30% at 48% 12%, rgba(37, 129, 196, .20), transparent 70%);
  animation: alms-glow 22s ease-in-out infinite alternate;
}
@keyframes alms-glow {
  0% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(-4%, 3%, 0) rotate(6deg); }
  100% { transform: translate3d(3%, -2%, 0) rotate(-4deg); }
}
.alms-motion .alms-hero-panel { animation: alms-panel 16s ease-in-out infinite alternate; }
@keyframes alms-panel { from { transform: rotate(18deg); } to { transform: rotate(21deg) translate3d(-12px, 10px, 0); } }
.alms-motion .alms-chevron--big { animation: alms-float 9s ease-in-out infinite alternate; }
@keyframes alms-float { from { translate: 0 0; } to { translate: 0 -14px; } }

/* Karta z logo: lekkie przechylanie za kursorem + „oddychanie” wilka. */
.alms-motion .alms-hero-card {
  transform: perspective(900px) rotate(-6deg) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
  transition: transform .35s ease-out, box-shadow .35s ease-out;
  box-shadow: 0 24px 60px rgba(0, 10, 25, .45), 0 0 0 1px rgba(110, 193, 228, .08);
}
.alms-motion .alms-hero-card img { animation: alms-breathe 6s ease-in-out infinite; }
@keyframes alms-breathe {
  0%, 100% { transform: rotate(6deg) scale(1); filter: drop-shadow(0 0 0 rgba(110, 193, 228, 0)); }
  50% { transform: rotate(6deg) scale(1.035); filter: drop-shadow(0 0 22px rgba(110, 193, 228, .35)); }
}
/* Błysk na plakietce sezonu i przycisku „Dołącz” co kilka sekund. */
.alms-motion .alms-season-badge { overflow: hidden; }
.alms-motion .alms-hero-cta .alms-recruitment-link .wp-block-button__link { position: relative; overflow: hidden; }
.alms-motion .alms-season-badge::after, .alms-motion .alms-hero-cta .alms-recruitment-link .wp-block-button__link::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent);
  animation: alms-shine 7s ease-in-out infinite;
}
.alms-motion .alms-hero-cta .alms-recruitment-link .wp-block-button__link::after { animation-delay: 2.5s; }
@keyframes alms-shine { 0%, 78% { left: -60%; } 92%, 100% { left: 130%; } }

/* ---------- Efekty po najechaniu ---------- */
@media (hover: hover) and (pointer: fine) {
  .alms-motion .alms-game,
  .alms-motion .alms-card,
  .alms-motion .alms-coach,
  .alms-motion .alms-latest-card,
  .alms-motion .alms-teaser-item,
  .alms-motion .alms-front .alms-calendar--compact .alms-event {
    transition: transform .25s ease, box-shadow .25s ease, opacity .7s ease;
  }
  .alms-motion .alms-game:hover,
  .alms-motion .alms-latest-card:hover {
    transform: translate3d(0, -6px, 0);
    box-shadow: 0 18px 40px rgba(0, 10, 25, .45), inset 0 0 0 1px rgba(221, 182, 113, .55);
  }
  .alms-motion .alms-game::before { transition: height .25s ease, box-shadow .25s ease; }
  .alms-motion .alms-game:hover::before { height: 10px; box-shadow: 0 0 18px var(--game); }
  .alms-motion .alms-game h3 { transition: letter-spacing .25s ease; }
  .alms-motion .alms-game:hover h3 { letter-spacing: .02em; }
  .alms-motion .alms-card:hover,
  .alms-motion .alms-coach:hover { box-shadow: 0 14px 34px rgba(0, 10, 25, .35), inset 0 0 0 1px rgba(221, 182, 113, .35); }
  .alms-motion .alms-teaser-item:hover,
  .alms-motion .alms-front .alms-calendar--compact .alms-event:hover {
    transform: translate3d(4px, 0, 0);
    box-shadow: inset 0 0 0 1px rgba(221, 182, 113, .5);
  }
  .alms-motion .alms-latest-image img { transition: transform .5s ease; }
  .alms-motion .alms-latest-card:hover .alms-latest-image img { transform: scale(1.05); }
}

/* ---------- Akcenty esportowe ---------- */
.alms-next {
  display: inline-flex; align-items: center; gap: 7px; width: fit-content; margin-top: 6px;
  padding: 4px 9px; border-radius: 4px; background: rgba(221, 182, 113, .16); color: var(--alms-gold);
  font-family: var(--alms-display); font-size: 12px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; max-width: 100%; line-height: 1.3;
}
.alms-next--live { background: rgba(255, 92, 110, .18); color: #FF8A98; }
.alms-next i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.alms-motion .alms-next i { animation: alms-pulse 1.6s ease-out infinite; }
@keyframes alms-pulse {
  0% { box-shadow: 0 0 0 0 currentColor; }
  70%, 100% { box-shadow: 0 0 0 7px transparent; }
}
.alms-motion .alms-stats dt { font-variant-numeric: tabular-nums; }
.alms-motion .alms-kicker::after {
  content: ''; display: block; width: 0; height: 2px; margin-top: 8px; background: currentColor; opacity: .6;
  transition: width .9s .2s cubic-bezier(.2, .75, .2, 1);
}
.alms-motion .is-visible .alms-kicker::after, .alms-motion .alms-hero-copy .alms-kicker::after { width: 36px; }

@media (prefers-reduced-motion: reduce) {
  .alms-motion *, .alms-motion *::before, .alms-motion *::after { animation: none !important; transition: none !important; }
  .alms-motion [data-reveal] { opacity: 1; transform: none; }
}