.page {
    background-image: url('../images/inner-content-bg.png');
    background-repeat: repeat;

    &__content {
        width: 75%;
        padding: 0 30px 70px 0;

        background-image: url('../images/inner-content-bg.png');
    }

    &__sidebar {
        width: 25%;
    }

.sidebar {
    padding-top: 130px;
    background-color: #fff;
    position: relative;

    &::after {
        content: '';
        position: absolute;
        z-index: 1;
        left: 0;
        top: 0;
        display: block;
        width: 100vw;
        height: 100%;
        background-color: #fff;
    }

    &__container {
        z-index: 10;
        position: relative;
        padding-left: 50px;
    }
}

.purple-block {
    position: relative;
    color: #fff;

    &__container {
        z-index: 20;
        position: relative;
    }

    &::after {
        content: '';
        display: block;
        width: 100vw;
        height: 100%;
        z-index: 1;
        position: absolute;
        top: 0;
        right: -30px;
        background-image: url('../images/purple-bg.png');
    }
}

<div class="page">
      <div class="page__container page__container--inner container">
           <div class="page__content">
                 <div class="purple-block"></div>
           </div>
           <aside class="page__sidebar sidebar">
                 <div class="sidebar__container"></div>
           </aside>
      </div>
</div>