Overlap

<div class="left"></div>
<div class="right"></div>
<style>
  body {
    background: #09042a;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  div {
    width: 150px;
    height: 150px;
    border-radius: 50%;
  }

  .left {
    position: relative;
    left: 25px;
    z-index: 1;
    background: radial-gradient(circle at 118% 50%, #09042a 40%, #7b3f61 40%);
  }
  .right {
    background: #e78481;
    position: relative;
    left: -25px;
  }
</style>