/* Landing page motion. Content only starts hidden under html.rs-motion,
   which landing_motion.js sets when the user has not asked for reduced motion. */

/* ── Hero entrance ── */
.rs-motion .hero-content > * {
  animation: rs-fade-up .8s ease-out backwards;
}
.rs-motion .hero-content > :nth-child(1) { animation-delay: .1s; }
.rs-motion .hero-content > :nth-child(2) { animation-delay: .25s; }
.rs-motion .hero-content > :nth-child(3) { animation-delay: .4s; }
@keyframes rs-fade-up {
  from { opacity: 0; transform: translateY(16px); }
}

/* ── Scroll reveal ── */
.rs-motion [data-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .7s ease-out, transform .7s ease-out;
  transition-delay: var(--rs-delay, 0s);
}
.rs-motion [data-reveal].is-visible { opacity: 1; transform: none; }

/* ── Hover ── */
.about-card:hover, .service-card:hover { transform: translateY(-4px); }
.about-card-more i { transition: transform .2s ease; }
.about-card:hover .about-card-more i,
.service-card:hover .about-card-more i { transform: translateX(3px); }

/* ── Demo chart bars grow in ── */
.rs-motion .demo-bar {
  transform: scaleY(0); transform-origin: 50% 100%;
  transition: transform .9s ease-out;
}
.rs-motion .demo-chart.is-visible .demo-bar { transform: scaleY(1); }