/* ==========================================================================
   LyricBingo V2 — Motion & micro-interactions (Pro-compatible)
   Does NOT override colors — beatdesk-v2-pro.css is canonical.
   ========================================================================== */

/* Scroll reveal (pairs with beatdesk-motion.js) */
.lb-v2 .bd-motion-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.55s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.lb-v2 .bd-motion-reveal.is-visible {
  opacity: 1;
  transform: none;
}

.lb-v2 .v2-launch-section:nth-child(even) .bd-motion-reveal {
  transition-delay: 0.05s;
}

/* FAQ */
.lb-v2 .v2-faq details {
  transition: border-color 0.2s ease, background 0.2s ease;
}

.lb-v2 .v2-faq details[open] {
  background: var(--pro-accent-dim, rgba(30, 215, 96, 0.08)) !important;
}

.lb-v2 .v2-faq summary::after {
  content: "+";
  float: right;
  font-size: 1.25rem;
  color: var(--pro-accent, #1ed760);
  transition: transform 0.2s ease;
}

.lb-v2 .v2-faq details[open] summary::after {
  content: "−";
}

/* Quick shortcut cards */
.lb-v2 a.v2-quick-card {
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.lb-v2 a.v2-quick-card h3 {
  font-family: var(--v2-font);
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.2;
  margin: 12px 0 6px;
  letter-spacing: -0.02em;
}

.lb-v2 a.v2-quick-card:hover {
  transform: translateY(-3px);
  border-color: var(--pro-border-strong, rgba(255, 255, 255, 0.14)) !important;
}

.lb-v2 .v2-quick-arrow {
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--pro-border, rgba(255, 255, 255, 0.08));
  display: grid;
  place-items: center;
  font-size: 14px;
  color: var(--pro-muted, #b3b3b3);
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.lb-v2 a.v2-quick-card:hover .v2-quick-arrow {
  color: var(--pro-text, #fff);
  border-color: var(--pro-accent, #1ed760);
  background: var(--pro-accent-dim, rgba(30, 215, 96, 0.14));
}

/* Focus rings */
.lb-v2 a:focus-visible,
.lb-v2 button:focus-visible,
.lb-v2 input:focus-visible,
.lb-v2 select:focus-visible,
.lb-v2 summary:focus-visible {
  outline: 2px solid var(--pro-accent, #1ed760);
  outline-offset: 2px;
}

/* Venue QR pulse (display mode only) */
.v2-venue-stage .v2-qr-frame img {
  animation: v2EnhQrGlow 2.5s ease-in-out infinite;
}

@keyframes v2EnhQrGlow {
  0%, 100% {
    box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.08), 0 0 32px rgba(30, 215, 96, 0.25);
  }
  50% {
    box-shadow: 0 0 0 10px rgba(30, 215, 96, 0.12), 0 0 48px rgba(30, 215, 96, 0.35);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lb-v2 .bd-motion-reveal,
  .v2-venue-stage .v2-qr-frame img {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
