/* ============================================================
   PALMERBETT — Animations & scroll-reveal
   ============================================================ */

/* ---- Keyframes ------------------------------------------------------ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: none; }
}
@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.4); opacity: 0.55; }
}
@keyframes oddFlash {
  0%   { background: var(--success); color: var(--on-accent); }
  100% { background: var(--panel-3); }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes floaty {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-18px) rotate(2deg); }
}
@keyframes drift {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(24px, -16px); }
}
@keyframes shine {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes spinSlow { to { transform: rotate(360deg); } }
@keyframes ringPop {
  0%   { transform: scale(0.6); opacity: 0; }
  60%  { opacity: 0.5; }
  100% { transform: scale(1.8); opacity: 0; }
}

/* ---- Scroll reveal -------------------------------------------------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
  will-change: opacity, transform;
}
[data-reveal="left"]  { transform: translateX(-34px); }
[data-reveal="right"] { transform: translateX(34px); }
[data-reveal="zoom"]  { transform: scale(0.92); }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* Stagger children */
[data-reveal-group] > * {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
[data-reveal-group].is-visible > * { opacity: 1; transform: none; }
[data-reveal-group].is-visible > *:nth-child(1) { transition-delay: 0.05s; }
[data-reveal-group].is-visible > *:nth-child(2) { transition-delay: 0.12s; }
[data-reveal-group].is-visible > *:nth-child(3) { transition-delay: 0.19s; }
[data-reveal-group].is-visible > *:nth-child(4) { transition-delay: 0.26s; }
[data-reveal-group].is-visible > *:nth-child(5) { transition-delay: 0.33s; }
[data-reveal-group].is-visible > *:nth-child(6) { transition-delay: 0.40s; }

/* ---- Decorative ambient orbs --------------------------------------- */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  opacity: 0.55;
  pointer-events: none;
  z-index: 0;
}
.orb--violet { background: radial-gradient(circle, rgba(124, 77, 255, 0.9), transparent 70%); animation: drift 14s var(--ease-in-out) infinite; }
.orb--magenta { background: radial-gradient(circle, rgba(194, 75, 224, 0.7), transparent 70%); animation: drift 18s var(--ease-in-out) infinite reverse; }
.orb--gold { background: radial-gradient(circle, rgba(255, 200, 87, 0.5), transparent 70%); animation: floaty 12s var(--ease-in-out) infinite; }

/* ---- Shine sweep (on hover targets) -------------------------------- */
.shine { position: relative; overflow: hidden; }
.shine::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.22) 50%, transparent 70%);
  background-size: 200% 100%;
  transform: translateX(-100%);
  opacity: 0;
  transition: opacity var(--dur) var(--ease);
}
.shine:hover::after { opacity: 1; animation: shine 1.1s var(--ease) forwards; }

/* ---- Page transition overlay --------------------------------------- */
.page-transition {
  position: fixed; inset: 0;
  background: var(--bg-deep);
  z-index: var(--z-toast);
  transform: translateY(-100%);
  pointer-events: none;
}
.page-transition.is-active { animation: wipe 0.7s var(--ease-in-out) forwards; }
@keyframes wipe {
  0%   { transform: translateY(100%); }
  45%  { transform: translateY(0); }
  100% { transform: translateY(-100%); }
}

/* ---- Count ring (live dot etc.) ------------------------------------ */
.ring-pop { position: relative; }
.ring-pop::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  border: 2px solid var(--danger);
  animation: ringPop 1.8s var(--ease) infinite;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal-group] > * { opacity: 1 !important; transform: none !important; }
  .orb, .marquee__track, .spin-badge__ring, .glow-ring { animation: none !important; }
}
