/* ── REVEAL ── */
.reveal { opacity: 0; transform: translateY(24px); transition: all 0.7s cubic-bezier(0.4,0,0.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ── STAGGER GRID ── */
.stagger > * { opacity: 0; transform: translateY(20px); transition: all 0.5s cubic-bezier(0.4,0,0.2,1); }
.stagger.visible > * { opacity: 1; transform: translateY(0); }
.stagger.visible > *:nth-child(1) { transition-delay: 0.03s; }
.stagger.visible > *:nth-child(2) { transition-delay: 0.06s; }
.stagger.visible > *:nth-child(3) { transition-delay: 0.09s; }
.stagger.visible > *:nth-child(4) { transition-delay: 0.12s; }
.stagger.visible > *:nth-child(5) { transition-delay: 0.15s; }
.stagger.visible > *:nth-child(6) { transition-delay: 0.18s; }

/* ── ARCANA STAGGER ── */
.arcana-card { opacity: 0; transform: translateY(20px); transition: all 0.5s cubic-bezier(0.4,0,0.2,1); }
.arcana-card.visible { opacity: 1; transform: translateY(0); }
.arcana-card.visible:nth-child(1) { transition-delay: 0.04s; }
.arcana-card.visible:nth-child(2) { transition-delay: 0.08s; }
.arcana-card.visible:nth-child(3) { transition-delay: 0.12s; }
.arcana-card.visible:nth-child(4) { transition-delay: 0.16s; }
.arcana-card.visible:nth-child(5) { transition-delay: 0.2s; }
.arcana-card.visible:nth-child(6) { transition-delay: 0.24s; }

/* ── HOVER LIFT ── */
.hover-up { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.hover-up:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,0.2); }

/* ── ENTRANCE KEYS ── */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

/* ── ACCESSIBILITY ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .arcana-card { opacity: 1; transform: none; }
  .stagger > * { opacity: 1; transform: none; }
  #stars-canvas { display: none; }
}