/* Mobile */
@keyframes reveal {

  0% {
    transform: translateY(0.25rem);
    opacity: 0.7;
  }

  25% {
    opacity: 1;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes revealButton {

  0% {
    transform: translateY(0.25rem);
  }
}
@media (max-width: 781.999px) {

  .wp-site-blocks > main .reveal:not(.wp-block-cimcorp-anchor-links, .wp-block-cimcorp-anchor-link),
  .wp-site-blocks > .layout-part .reveal,
  .wp-site-blocks > footer.reveal,
  .wp-site-blocks > footer .reveal {
    animation-fill-mode: both;
    animation-timing-function: ease-out;
    animation-timeline: view();
    animation-range: entry 0.5rem entry 12.5rem;
    will-change: transform, opacity, filter;

    &:not(.wp-block-button) {
      animation-name: reveal;
    }

    &.wp-block-button {
      animation-name: revealButton;
    }
  }
  @media (prefers-reduced-motion: reduce) {

    .wp-site-blocks > main .reveal,
    .wp-site-blocks > .layout-part .reveal,
    .wp-site-blocks > footer.reveal,
    .wp-site-blocks > footer .reveal {
      animation: none;
      transform: none;
      opacity: 1;
      filter: none;
    }
  }
}

/* Desktop */
@media (min-width: 782px) {

  .wp-site-blocks > main .reveal,
  .wp-site-blocks > .layout-part.reveal,
  .wp-site-blocks > .layout-part .reveal,
  .wp-site-blocks > footer.reveal {
    transition:
      opacity 600ms cubic-bezier(0.22,1,0.36,1),
      transform 600ms cubic-bezier(0.22,1,0.36,1),
      filter 600ms cubic-bezier(0.22,1,0.36,1);
    transition-delay: var(--delay, 0ms);
    will-change: opacity, transform, filter;

    &:not(.revealed):not(.wp-block-accordion-item) {
      opacity: 0;
      transform: translateY(0.625rem);
    }
  }
  @media (prefers-reduced-motion: reduce) {

    .wp-site-blocks > main .reveal,
    .wp-site-blocks > .layout-part.reveal,
    .wp-site-blocks > .layout-part .reveal,
    .wp-site-blocks > footer.reveal {
      transition: none;
      transform: none;
      filter: none;

      &:not(.revealed):not(.wp-block-accordion-item) {
        opacity: 1;
        transition: none;
        transform: none;
        filter: none;
      }
    }
  }
}

/* Desktop: Featured image reveal mask */

/* Featured image clip reveal */
@media (min-width: 782px) {

  .wp-site-blocks > main .wp-block-post-featured-image.reveal:not(.has-no-reveal-effect),
  .wp-site-blocks > main .wp-block-media-text:not(.has-background) .wp-block-media-text__media.reveal:not(.has-no-reveal-effect),
  .wp-site-blocks > main .wp-block-image.reveal:not(.size-thumbnail,.size-medium):not(.has-no-reveal-effect) {
    overflow: hidden;

    transition:
      opacity 600ms cubic-bezier(0.22,1,0.36,1),
      transform 600ms cubic-bezier(0.22,1,0.36,1),
      filter 600ms cubic-bezier(0.22,1,0.36,1),
      clip-path 900ms cubic-bezier(0.22,1,0.36,1);

    transition-delay:
      var(--delay, 0ms),
      var(--delay, 0ms),
      var(--delay, 0ms),
      calc(
        var(--delay, 0ms) + 100ms
      );

    &:not(.revealed) {
      clip-path: inset(min(10%, 1.0rem) 0 0 0);
    }

    &.revealed {
      clip-path: inset(0 0 0 0);
    }
  }
}
