.res-full-width-cta {
  background: linear-gradient(45deg, var(--res3), var(--res4));
  .container {
    display: flex;
    gap: var(--spacing_small);
    justify-content: space-between;

    @media screen and (max-width: 767px) {
      flex-direction: column;
    }
    .cta-left {
      max-width: 600px;
      h2, p {
        color: #fff;
      }

      h2 {
        font-weight: 500;

      }
    }

    .cta-buttons {
      gap: var(--spacing_small);
      display: flex;
      .btn {
        height: fit-content;
        margin-top: auto;
        margin-bottom: 0;
        transition: 0.3s ease;
        &.filled {
          background: #fff;
          color: var(--res4);
          border: solid 2px #fff;
          &:hover {
            background: var(--res4);
            color: #fff;
          }
        }

        &.outline {
          color: #fff;
          border: solid 2px #fff;
          &:hover {
            background: #fff;
            color: var(--res4);
          }
        }
      }
    }
  }
}