[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 1.1s cubic-bezier(0.2, 0.7, 0.2, 1),
    transform 1.1s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--rv-delay, 0ms);
  will-change: opacity, transform;
}
[data-reveal].in {
  opacity: 1;
  transform: translateY(0);
}

[data-reveal="fade"] {
  transform: none;
}
[data-reveal="fade"].in {
  transform: none;
}

[data-reveal="image"] {
  clip-path: inset(0 0 100% 0);
  opacity: 1;
  transform: none;
  transition: clip-path 1.4s cubic-bezier(0.65, 0.05, 0.36, 1);
}
[data-reveal="image"].in {
  clip-path: inset(0 0 0 0);
}

[data-reveal="left"] {
  transform: translateX(-32px);
  opacity: 0;
}
[data-reveal="left"].in {
  transform: translateX(0);
  opacity: 1;
}
[data-reveal="right"] {
  transform: translateX(32px);
  opacity: 0;
}
[data-reveal="right"].in {
  transform: translateX(0);
  opacity: 1;
}

[data-reveal="scale"] {
  transform: scale(0.92);
  opacity: 0;
  transition:
    opacity 1.2s cubic-bezier(0.2, 0.7, 0.2, 1),
    transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-reveal="scale"].in {
  transform: scale(1);
  opacity: 1;
}

[data-reveal="blur"] {
  filter: blur(14px);
  opacity: 0;
  transform: none;
  transition:
    filter 1.4s cubic-bezier(0.2, 0.7, 0.2, 1),
    opacity 1.4s cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-reveal="blur"].in {
  filter: blur(0);
  opacity: 1;
}

[data-reveal="mask"] {
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 0%, transparent 0%);
  mask-image: linear-gradient(90deg, #000 0%, #000 0%, transparent 0%);
  transform: none;
  opacity: 1;
  transition:
    -webkit-mask-image 1.4s cubic-bezier(0.65, 0.05, 0.36, 1),
    mask-image 1.4s cubic-bezier(0.65, 0.05, 0.36, 1);
}
[data-reveal="mask"].in {
  -webkit-mask-image: linear-gradient(
    90deg,
    #000 100%,
    #000 100%,
    transparent 100%
  );
  mask-image: linear-gradient(90deg, #000 100%, #000 100%, transparent 100%);
}

[data-reveal="float"] {
  opacity: 0;
  transform: translateY(48px) rotate(-1deg);
  transition:
    opacity 1.2s cubic-bezier(0.2, 0.7, 0.2, 1),
    transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-reveal="float"].in {
  opacity: 1;
  transform: translateY(0) rotate(0);
}

[data-reveal="line"] {
  transform: scaleX(0);
  transform-origin: left;
  opacity: 1;
  transition: transform 1.2s cubic-bezier(0.65, 0.05, 0.36, 1);
}
[data-reveal="line"].in {
  transform: scaleX(1);
}

[data-reveal-line] .rl-l {
  display: block;
  overflow: hidden;
  padding-bottom: 0.2em;
  margin-bottom: -0.2em;
}
[data-reveal-line] .rl-i {
  display: block;
  transform: translateY(110%);
  transition: transform 1.1s cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-reveal-line].in .rl-i {
  transform: translateY(0);
}
[data-reveal-line] .rl-l:nth-child(1) .rl-i {
  transition-delay: 40ms;
}
[data-reveal-line] .rl-l:nth-child(2) .rl-i {
  transition-delay: 160ms;
}
[data-reveal-line] .rl-l:nth-child(3) .rl-i {
  transition-delay: 280ms;
}
[data-reveal-line] .rl-l:nth-child(4) .rl-i {
  transition-delay: 400ms;
}

[data-counter] {
  font-variant-numeric: tabular-nums;
}

[data-reveal-text] .rv-w {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  line-height: inherit;
  padding-bottom: 0.2em;
  margin-bottom: -0.2em;
  padding-right: 0.08em;
  margin-right: -0.08em;
}
[data-reveal-text] .rv-i {
  display: inline-block;
  transform: translateY(110%);
  transition: transform 1s cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-reveal-text].in .rv-i {
  transform: translateY(0);
}
[data-reveal-text] .rv-w:nth-child(1) .rv-i {
  transition-delay: 20ms;
}
[data-reveal-text] .rv-w:nth-child(2) .rv-i {
  transition-delay: 60ms;
}
[data-reveal-text] .rv-w:nth-child(3) .rv-i {
  transition-delay: 100ms;
}
[data-reveal-text] .rv-w:nth-child(4) .rv-i {
  transition-delay: 140ms;
}
[data-reveal-text] .rv-w:nth-child(5) .rv-i {
  transition-delay: 180ms;
}
[data-reveal-text] .rv-w:nth-child(6) .rv-i {
  transition-delay: 220ms;
}
[data-reveal-text] .rv-w:nth-child(7) .rv-i {
  transition-delay: 260ms;
}
[data-reveal-text] .rv-w:nth-child(8) .rv-i {
  transition-delay: 300ms;
}
[data-reveal-text] .rv-w:nth-child(9) .rv-i {
  transition-delay: 340ms;
}
[data-reveal-text] .rv-w:nth-child(10) .rv-i {
  transition-delay: 380ms;
}
[data-reveal-text] .rv-w:nth-child(n + 11) .rv-i {
  transition-delay: 420ms;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-text] .rv-i {
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    clip-path: none !important;
  }
}
