/* Text reveal — scroll-in motion for text. js/text-reveal.js tags modules automatically
   (rules in its header; the first section/hero is always skipped):
     .rw-reveal  headings: each line rises out from behind a mask
     .rw-rise    anything else (eyebrow, body, button): fades and slides up
   Opt a module, row or section out with the CSS class rw-no-reveal.
   Hidden states only apply once js/text-reveal.js adds .rw-motion to <html>, so
   text stays visible if the script is delayed (WP Rocket) or reduced motion is on.
   Elements that enter together are staggered by the script (--rw-delay).
   Manual classes go on the module wrapper, never on a .btn-* link itself:
   .rw-rise's transition would replace the button's hover motion. */

/* ── Timing ── */
:root {
  --rw-ease: cubic-bezier(.22, 1, .36, 1);
  --rw-rise-dist: 1.5rem;        /* 24px */
  --rw-rise-dur: 0.7s;
  --rw-line-dur: 0.9s;
  --rw-line-stagger: 0.12s;      /* between lines of one heading */
  --rw-stagger: 0.1s;            /* between elements entering together (read by the JS) */
}

/* ── Rise — fade + slide up ── */
.rw-motion .rw-rise {
  opacity: 0;
  transform: translateY(var(--rw-rise-dist));
  transition: opacity var(--rw-rise-dur) var(--rw-ease), transform var(--rw-rise-dur) var(--rw-ease);
  transition-delay: var(--rw-delay, 0s);
}
.rw-motion .rw-rise.is-in { opacity: 1; transform: none; }

/* ── Line reveal — the script wraps each heading line in .rw-ln > span ── */
.rw-ln {
  display: block;
  overflow: hidden;
  padding-bottom: 0.08em;        /* room for descenders inside the mask */
  margin-bottom: -0.08em;
}
.rw-ln > span { display: block; }
.rw-motion .rw-reveal:not(.is-in) .rw-ln > span { transform: translateY(105%); }
.rw-motion .rw-reveal .rw-ln > span {
  transition: transform var(--rw-line-dur) var(--rw-ease);
  transition-delay: calc(var(--rw-delay, 0s) + var(--l, 0) * var(--rw-line-stagger));
}

/* ── Screen readers read the original heading text, not the split lines ── */
.rw-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
