.clipo-mobile-workflow {
  display: none;
}

@media (max-width: 768px) {
  .clipo-workflow {
    display: none !important;
  }

  .clipo-mobile-workflow {
    position: relative;
    display: block;
    width: 390px;
    height: 864px;
    overflow: hidden;
    box-sizing: border-box;
    color: var(--clipo-ink, #131313);
    background: var(--clipo-paper, #f7f7f6);
  }

  .clipo-mobile-workflow *,
  .clipo-mobile-workflow *::before,
  .clipo-mobile-workflow *::after {
    box-sizing: border-box;
    animation: none !important;
    transition: none !important;
  }

  .clipo-mobile-workflow__heading {
    position: absolute;
    inset: 0;
    margin: 0;
    font-family: var(--font-clipo-font-poster, "PhonkSansHeavy", Impact, sans-serif);
    font-size: 32px;
    font-weight: 400;
    line-height: .84;
    letter-spacing: -1.28px;
    text-transform: uppercase;
  }

  .clipo-mobile-workflow__heading:not(.is-clipo-push-ready) .clipo-mobile-workflow__heading-main,
  .clipo-mobile-workflow__heading:not(.is-clipo-push-ready) .clipo-mobile-workflow__heading-aside,
  .clipo-mobile-workflow__heading:not(.is-clipo-push-ready) .clipo-mobile-workflow__heading-creating {
    visibility: hidden;
  }

  .clipo-mobile-workflow__heading > span {
    position: absolute;
    display: block;
    margin: 0;
  }

  .clipo-mobile-workflow__heading-main {
    top: 120px;
    left: 77px;
    width: 297px;
    text-align: right;
  }

  .clipo-mobile-workflow__heading-main--collecting {
    top: 147px;
  }

  .clipo-mobile-workflow__heading-aside {
    top: 174px;
    left: 16px;
    width: 175px;
    color: var(--clipo-line, #cacac9);
  }

  .clipo-mobile-workflow__heading-creating {
    top: 174px;
    left: 77px;
    width: 297px;
    text-align: right;
  }

  .clipo-mobile-workflow__intro-copy {
    position: absolute;
    top: 281px;
    left: 16px;
    width: 236px;
    margin: 0;
    color: var(--clipo-muted, #858585);
    font-family: var(--font-clipo-font-display, "Ronzino", Arial, sans-serif);
    font-size: 17px;
    font-weight: 500;
    line-height: 1.03;
    letter-spacing: -.51px;
    text-indent: 61px;
  }

  .clipo-mobile-workflow__intro-copy.is-line-masked {
    text-indent: 0;
  }

  .clipo-mobile-workflow__measure-word {
    display: inline;
  }

  .clipo-mobile-workflow__copy-line-mask {
    display: block;
    width: 100%;
    height: 1.03em;
    overflow: visible;
  }

  .clipo-mobile-workflow__copy-line {
    display: block;
    width: max-content;
    max-width: none;
    padding-right: 1em;
    white-space: nowrap;
    will-change: clip-path;
  }

  .clipo-mobile-workflow__image-frame {
    position: absolute;
    margin: 0;
    border: .364px solid var(--clipo-blue, #2336f1);
    background: var(--clipo-canvas, #e0e0df);
  }

  .clipo-mobile-workflow__image-frame--main {
    top: 379px;
    left: 16px;
    width: 297px;
    height: 297px;
  }

  .clipo-mobile-workflow__image-frame img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
  }

  .clipo-mobile-workflow__caption {
    position: absolute;
    top: 688px;
    left: 16px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 297px;
    height: 52px;
    font-family: var(--font-clipo-font-display, "Ronzino", Arial, sans-serif);
    font-weight: 500;
  }

  .clipo-mobile-workflow__caption p,
  .clipo-mobile-workflow__caption h3 {
    margin: 0;
  }

  .clipo-mobile-workflow__caption-index {
    flex: 0 0 53px;
    width: 53px;
    color: var(--clipo-line, #cacac9);
    font-size: 14px;
    line-height: 1.25;
    letter-spacing: -.28px;
  }

  .clipo-mobile-workflow__caption-copy {
    display: flex;
    flex: 0 0 236px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 236px;
  }

  .clipo-mobile-workflow__caption-copy h3 {
    width: 100%;
    color: var(--clipo-ink, #131313);
    font-size: 32px;
    font-weight: 500;
    line-height: .94;
    letter-spacing: -1.28px;
  }

  .clipo-mobile-workflow__caption-copy p {
    width: 100%;
    color: var(--clipo-ink, #131313);
    font-size: 14px;
    line-height: 1.25;
    letter-spacing: -.28px;
  }
}
