/*!
 * text-animate.css — companion styles for text-animate.js
 * Nothing here hides text unless [data-ta-ready] has already been added
 * by the script, so pages degrade gracefully with JS off.
 */

[data-ta-ready] {
  --ta-duration: 700ms;
  --ta-stagger: 40ms;
  --ta-easing: cubic-bezier(.22, 1, .36, 1);
}

.ta-mask {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  /* line-height: 1.05em; */
}

.ta-unit {
  display: inline-block;
  will-change: transform, opacity, filter;
  transition:
    opacity var(--ta-duration) var(--ta-easing),
    transform var(--ta-duration) var(--ta-easing),
    filter var(--ta-duration) var(--ta-easing);
  transition-delay: calc(var(--ta-i) * var(--ta-stagger));
}

/* ---------- initial (hidden) states, per effect ---------- */
.ta-effect-fade      { opacity: 0; }
.ta-effect-fade-up   { opacity: 0; transform: translateY(0.6em); }
.ta-effect-fade-down { opacity: 0; transform: translateY(-0.6em); }
.ta-effect-blur      { opacity: 0; filter: blur(12px); }
.ta-effect-fade-blur { opacity: 0; filter: blur(10px); transform: translateY(0.4em); }
.ta-effect-slide-up  { transform: translateY(110%); }
.ta-effect-scale     { opacity: 0; transform: scale(0.6); }

/* ---------- revealed state ---------- */
[data-ta-ready].is-visible .ta-unit {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

/* ---------- reduced motion: show instantly, no animation ---------- */
[data-ta-reduced] .ta-unit {
  transition: none !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .ta-unit {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}