.c-cta {
  text-align: center;
}

.c-cta__description {
  max-width: 1000px;
  margin: 10px auto;
}

.c-cta__usp {
  margin-top: 32px;
  text-align: center;
  font-size: 14px;
  line-height: 1.71428571;
}

.c-cta__actions {
  margin-top: 50px;
}

.c-cta__actions--flex {
  @include mq(950) {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.c-cta__button {

  @include mq(550) {
    & + & {
      margin: 10px;
    }
  }

  @include mq($max: 550) {
    & + & {
      margin-top: 10px;
    }
  }


  @include mq(800) {
    .c-button__text {
      white-space: nowrap;
    }
  }

}

/**
 * Modifier for displaying the CTA horizontally
 * (only when viewport is wide enough)
 */

.c-cta--bar {
  @include mq(800) {
    & .c-cta__main {
      @include flex(center);
    }

    & .c-cta__content {
      flex-basis: percentage(6 / 12);
      text-align: left;

      // Make sure text is left aligned, even when element inside is centered
      & > * {
        text-align: left !important;
      }
    }

    & .c-cta__actions {
      @include flex(flex-end);
      flex-basis: percentage(6 / 12);
      margin: 0 0 0 10px;
    }

    & .c-cta__button {
      margin: 0 0 0 10px;
      //margin-left: 10px;
    }
  }

  @include mq(1024) {
    & .c-cta__content {
      flex-basis: percentage(7 / 12);
    }
    & .c-cta__actions {
      flex-basis: percentage(5 / 12);
    }
  }
}