/**
 * THETA scroll reveal — slide up from below
 * Driven by theta-reveal.js, which flips [data-theta-reveal="group"] to
 * .is-in once the group scrolls into view and staggers the items inside it.
 *
 * The stance block carries data-theta-no-clip, whose rules force
 * `opacity: 1 !important` to kill the framework's own mask reveal. The hidden
 * state below has to match that specificity and win on source order, which is
 * why it is written as a descendant of the group rather than on the item.
 */

[data-theta-reveal="item"] {
  transition:
    opacity 0.86s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.86s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--theta-reveal-delay, 0ms);
  will-change: opacity, transform;
}

[data-theta-reveal="group"]:not(.is-in) [data-theta-reveal="item"] {
  opacity: 0 !important;
  transform: translate3d(0, 2.6rem, 0);
}

/* the heading leads, so it travels a little further than the body copy */
[data-theta-reveal="group"]:not(.is-in) .tx_angleIntro_copyText {
  transform: translate3d(0, 4.4rem, 0);
}

.tx_angleIntro_copyText[data-theta-reveal="item"],
.tx_angleIntro_desc[data-theta-reveal="item"] {
  transition-duration: 1.05s, 1.05s;
}

/* once it has played, stop holding a compositor layer per line */
[data-theta-reveal="group"].is-settled [data-theta-reveal="item"] {
  will-change: auto;
  transition-delay: 0ms;
}

@media screen and (max-width: 47.938em) {
  [data-theta-reveal="group"]:not(.is-in) [data-theta-reveal="item"] {
    transform: translate3d(0, 1.8rem, 0);
  }

  [data-theta-reveal="group"]:not(.is-in) .tx_angleIntro_copyText {
    transform: translate3d(0, 2.8rem, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-theta-reveal="group"]:not(.is-in) [data-theta-reveal="item"],
  [data-theta-reveal="group"]:not(.is-in) .tx_angleIntro_copyText {
    opacity: 1 !important;
    transform: none;
  }

  [data-theta-reveal="item"] {
    transition: none;
  }
}