/* Base animation tokens */
:root{
  --ri-ease: cubic-bezier(.25,.1,.25,1);
  --ri-dur: 1000ms;            /* matches your Framer snippet */
  --ri-translate: 20%;         /* how far to rise up */
}

/* Initial state applied by JS */
.ri-anim-init,
.ri-anim-init [data-ri-word]{
  filter: blur(10px);
  transform: translateY(var(--ri-translate));
  opacity: 0;
}

/* Transition/visible state */
.ri-anim-visible,
.ri-anim-visible [data-ri-word]{
  filter: blur(0);
  transform: translateY(0);
  opacity: 1;
}

.heading,
.heading-2,
.subheading,
.section {
  /* default transition; word spans inherit this too */
  transition:
    filter var(--ri-dur) var(--ri-ease),
    transform var(--ri-dur) var(--ri-ease),
    opacity var(--ri-dur) var(--ri-ease);
}

/* Per-element (non-word-split) base delay if set in JS via --ri-delay */
.heading,
.heading-2,
.subheading,
.section {
  transition-delay: var(--ri-delay, 0ms);
}

/* Word-stagger: JS sets --ri-delay per word span */
.heading [data-ri-word],
.heading-2 [data-ri-word]{
  display: inline-block;
  transition:
    filter var(--ri-dur) var(--ri-ease),
    transform var(--ri-dur) var(--ri-ease),
    opacity var(--ri-dur) var(--ri-ease);
  transition-delay: var(--ri-delay, 0ms);
}

/* Accessibility */
@media (prefers-reduced-motion: reduce){
  .ri-anim-init,
  .ri-anim-init [data-ri-word],
  .ri-anim-visible,
  .ri-anim-visible [data-ri-word]{
    transition: none !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}