.text-2cols {
  position: relative;
  margin: 75px 0;
  padding: 0 $half-gutter;

  @include sm {
    margin: 50px 0;
    padding: 0 $gutter-mobile;
  }

  &__wrapper {
    max-width: #{$header-content-width-large + $half-gutter * 2};
    margin: auto;
  }

  &__row {
    display: flex;

    @include sm {
      display: block;
    }
  }

  &__col1 {
    width: 50%;
    padding: 0 $half-gutter;

    @include sm {
      width: 100%;
      padding: 0;
    }

    h2.heading1 {
      margin-top: 0;
      margin-bottom: 0 !important;
    }
  }

  &__col2 {
    width: 50%;
    padding: 0 $half-gutter;

    @include sm {
      width: 100%;
      padding: 0;
      margin-top: 24px;
    }

    & > *:first-child {
      margin-top: 0;
    }

    & > *:last-child {
      margin-bottom: 0;
    }
  }

  &__cta {
    padding: 0 $half-gutter;

    a {
      padding: 0 24px;
      margin-top: 24px;
    }

    @include sm {
      text-align: center;
      padding: 0;

      a {
        width: 100%;
        margin-left: 0;
        max-width: 320px;
        margin-top: 40px;
      }
    }
  }
}