.progress-steps {
  display: flex;
  font-size: 1.3rem;
  justify-content: space-between;
  list-style-type: none;
  margin: 0;
  padding: 0;

  @include tablet {
    min-width: 360px;
  }

  > li {
    &.completed,
    &.completed-first {
      font-weight: 500;
    }

    &.current,
    &.current-first {
      color: $color-accent;
      font-weight: 600;

      &::before {
        content: "➝";
        margin-right: .5rem;
      }
    }
  }

  a {
    text-decoration: none;

    &:hover {
      text-decoration: underline;
    }
  }
}