.cta-container {
  position: relative;

  &.bg-primary-darker {
    background-color: transparent;
  }

  &:after {
    background-image: linear-gradient(15deg, #1e368d 0%, #1943dc 100%);
    content: "";
    width: 100vw;
    transform: translateX(-50%);
    left: 50%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    top: 0;
    right: 0;
    z-index: -2;
  }

  &:before {
    content: "";
    width: 100vw;
    transform: translateX(-50%);
    left: 50%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    opacity: 0.8;
    top: 0;
    right: 0;
    background-image: url(../../images/decoration/pattern-transparent.png);
    background-size: 200px;
    background-repeat: repeat;
    background-position: center right;
    z-index: -1;
  }

  .btn-primary {
    background-color: #5d91e5;
    position: relative;
    z-index: 2;
  }
}

@media (min-width: 992px) {
  .field--name-f-shrd-cta-ref {
    position: relative;
    &:after {
      background-image: url(../../images/decoration/decoration-logo-mcs-bg-cta-banner.png);
    }
  }
  .cta-container {
    p,
    a {
      position: relative;
      z-index: 2;
    }
  }
}