.hero__container {
  overflow: hidden;
}

@media (max-width: 767px) {
  .hero__container {
    &.top-left__cut,
    &.bottom-right__cut,
    &.top-right__cut,
    &.bottom-left__cut {
      clip-path: unset;

      .hero__red-cut {
        background-color: transparent;
      }
    }
  }
}

.watermark.watermark__hero {
  left: calc(-1 * var(--gutter));
  z-index: 0;
}

.hero__content {
  transform: translateY(175%);
  transition: .75s ease-out;

  &.is-visible {
    transform: translateY(0);
  }
}