<section class="main-section">
  <div class="container main-section__container">
    <div class="row">
      <div class="main-section__content col-8">
        <h2>Заголовок</h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
        <button class="btn">С чего начать?</button>
        <button class="btn">Отправить ТЗ</button>
      </div>
      <div class="main-section__img col-4">
        <img src="https://picsum.photos/253/256" alt="">
      </div>
    </div>
  </div>
</section>

$color-content: lightblue;
$color-img: lightgreen;

.main-section__container {
  position: relative;
  &::before, &::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(50vw - 50%);
  }
  &::before {
    right: 100%;
    background-color: $color-content;
  }
  &::after {
    left: 100%;
    background-color: $color-img;
  }
}

.main-section__content, .main-section__img {
  position: relative;
  outline: 1px dashed red;
  outline-offset: -2px;
  &::before {
    position: absolute;
    top: 10px;
    right: 10px;
  }
}

.main-section__content {
  background-color: $color-content;
  &::before {
    content: '.col-8';
  }
}

.main-section__img {
  background-color: $color-img;
  &::before {
    content: '.col-4';
  }
}



body {
  width: 100%;
  overflow-x: hidden;
}