/* ─── Keyframe Animations ───────────────────────────────────────────────── */

@keyframes oparcoPulse {
  0%   { box-shadow: 0 0 0 0 currentColor; opacity: 1; }
  70%  { box-shadow: 0 0 0 8px transparent; opacity: 0.5; }
  100% { box-shadow: 0 0 0 0 transparent; opacity: 1; }
}

@keyframes oparcoFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes oparcoLift {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
  to   { opacity: 1; transform: none; }
}

/* Logo animations (scoped inside SVG via <style> in logo.jsx, referenced here for reference) */
@keyframes oparcoLogoMark {
  0%   { opacity: 0; transform: scale(0.9); }
  60%  { opacity: 1; }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes oparcoLogoWord {
  0%   { opacity: 0; transform: translateY(2px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Hero animation spin (used inside hero-animation.jsx) */
@keyframes oparcoHeroSpin {
  to { transform: rotate(360deg); }
}

/* ─── Animation utility classes ─────────────────────────────────────────── */
.anim-fade {
  animation: oparcoFade 0.2s ease;
}

.anim-lift {
  animation: oparcoLift 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}