Split sign-in panel

<section class="cmp-sign-in">
  <div class="cmp-sign-in__benefit">
    <p>Waypoint workspace</p>
    <h2>Pick up exactly where the team left off.</h2>
    <ul>
      <li>One current release view</li>
      <li>Private team workspaces</li>
      <li>Exportable project history</li>
    </ul>
  </div>
  <form action="#signed-in">
    <header>
      <p>Welcome back</p>
      <h1>Sign in to Waypoint</h1>
    </header>
    <label for="cmp-signin-email">Email address</label
    ><input id="cmp-signin-email" type="email" name="email" autocomplete="email" required />
    <div class="cmp-sign-in__password-label">
      <label for="cmp-signin-password">Password</label><a href="#recover">Forgot password?</a>
    </div>
    <input
      id="cmp-signin-password"
      type="password"
      name="password"
      autocomplete="current-password"
      required
    /><label class="cmp-sign-in__remember"
      ><input type="checkbox" name="remember" /> Keep me signed in</label
    ><button type="submit">Sign in securely</button>
    <p>New to Waypoint? <a href="#create">Create an account</a></p>
  </form>
</section>