/* =========================================================
   Royallions — motion
   Used deliberately: one orchestrated hero entrance, section
   headers reveal once on scroll, cards respond to hover only.
   ========================================================= */

@keyframes rl-fade-up {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes rl-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes rl-drift {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(-18px, 22px); }
}
@keyframes rl-shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes rl-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@keyframes rl-wa-pulse {
  0%, 100% { box-shadow: 0 14px 34px -10px rgba(37,211,102,0.65), 0 0 0 0 rgba(37,211,102,0.45); }
  50% { box-shadow: 0 14px 34px -10px rgba(37,211,102,0.65), 0 0 0 10px rgba(37,211,102,0); }
}

/* Scroll reveal — applied selectively (hero copy, section heads, CTA) */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.8s var(--rl-ease), transform 0.8s var(--rl-ease); }
.reveal.in-view { opacity: 1; transform: translateY(0); }

.reveal-stagger > * { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--rl-ease), transform 0.7s var(--rl-ease); }
.reveal-stagger.in-view > *:nth-child(1) { transition-delay: 0.05s; }
.reveal-stagger.in-view > *:nth-child(2) { transition-delay: 0.13s; }
.reveal-stagger.in-view > *:nth-child(3) { transition-delay: 0.21s; }
.reveal-stagger.in-view > *:nth-child(4) { transition-delay: 0.29s; }
.reveal-stagger.in-view > *:nth-child(5) { transition-delay: 0.37s; }
.reveal-stagger.in-view > *:nth-child(6) { transition-delay: 0.45s; }
.reveal-stagger.in-view > *:nth-child(7) { transition-delay: 0.53s; }
.reveal-stagger.in-view > *:nth-child(8) { transition-delay: 0.61s; }
.reveal-stagger.in-view > * { opacity: 1; transform: translateY(0); }

/* Hero load sequence (runs once on page load, not scroll-tied) */
.rl-hero-kicker, .rl-hero h1, .rl-hero-lede, .rl-hero-actions, .rl-hero-proof {
  opacity: 0; animation: rl-fade-up 0.9s var(--rl-ease) forwards;
}
.rl-hero-kicker { animation-delay: 0.05s; }
.rl-hero h1 { animation-delay: 0.16s; }
.rl-hero-lede { animation-delay: 0.3s; }
.rl-hero-actions { animation-delay: 0.42s; }
.rl-hero-proof { animation-delay: 0.52s; }
.rl-stat-panel { opacity: 0; animation: rl-fade-up 1s var(--rl-ease) forwards; animation-delay: 0.35s; }

.rl-hero::before { animation: rl-drift 14s ease-in-out infinite; }
.rl-hero::after { animation: rl-drift 18s ease-in-out infinite reverse; }

@media (prefers-reduced-motion: reduce) {
  .rl-hero-kicker, .rl-hero h1, .rl-hero-lede, .rl-hero-actions, .rl-hero-proof, .rl-stat-panel {
    opacity: 1; animation: none;
  }
  .reveal, .reveal-stagger > * { opacity: 1; transform: none; }
  .rl-hero::before, .rl-hero::after { animation: none; }
  .rl-marquee-track { animation: none; }
  .rl-whatsapp-float { animation: none; }
  .rl-illustrated-card:hover .rl-illustration, .rl-svc-hero-art .rl-illustration:hover { transform: none; }
}