/* ============================================
   ANIMATIONS
   ============================================ */
@keyframes fadeIn    { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp  { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeInDown{ from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideInLeft { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes slideInRight{ from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes scaleIn   { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: scale(1); } }
@keyframes pulse     { 0%,100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes float     { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes spin      { to { transform: rotate(360deg); } }
@keyframes shimmer   { from { background-position: -200% 0; } to { background-position: 200% 0; } }

/* Scroll-reveal base */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-left  { transform: translateX(-28px); }
.reveal-right { transform: translateX(28px); }
.reveal-left.visible, .reveal-right.visible { transform: translateX(0); opacity: 1; }

.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }

/* Floating animation */
.float-anim { animation: float 4s ease-in-out infinite; }

/* Ripple */
.btn-ripple { position: relative; overflow: hidden; }
.btn-ripple::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(255,255,255,.2);
  transform: scale(0);
  border-radius: inherit;
  transition: transform .4s ease;
}
.btn-ripple:active::after { transform: scale(2); opacity: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ── Global focus-visible ring (keyboard nav) ── */
:focus { outline: none; }
:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}
a:focus-visible,
button:focus-visible,
[role="tab"]:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 3px;
  border-radius: var(--radius-md);
}