Apply two different styles to Wiget Titles along with a decorative line

This will wrap a span around the first word and also the remaining words in the title. Adjust the class names as necessary:

add_filter('widget_title', 'yourprefix_custom_title');
function yourprefix_custom_title( $old_title ) {

  $title = explode( " ", $old_title, 2 );

  if ( isset( $title[0] ) && isset( $title[1] ) ) {
    $new_title = "<span class="first">$title[0]</span> <span class="second">$title[1]</span>";
  } else {
     return;
  }

  return $new_title;
}

UPDATE

The following CSS will apply a color to the first word and also a color to the remaining words in the title as well as add a decorative line after.

  .widget-title {
    position: relative;
    display: block;
    overflow: hidden;
  }
  .widget-title:after {
    content: "";
    position: absolute;
    top: 50%;
    border-bottom: 1px solid #333333;
    width: 100%;
    margin: 0 .8em;
  }
  .widget-title span.first {
    color: red;
  }
  .widget-title span.second {
    color: green;
  }