CSS - How to create a rounded gradient border with gradient background

Question

I have a card that has a gradient as a background and border-radius, i wanna add a gradient border that respects that border radius. Things i've tried:

• border-image --> It didn't implement border-radius
• background-clip set to border-box and padding-box --> It only works when the card has a background of solid color

---

.selector {
  width: 31rem;
  height: 35rem;
  border-radius: 2.1875rem;
  border: 0.88px solid transparent;

/* Method One */
  border-image:  linear-gradient(
        -28.96deg,
        #fb37ff 0%,
        rgba(155, 111, 238, 0) 25.98%,
        rgba(123, 127, 234, 0) 60.91%,
        #1bb2de 100%
      ) 20;

/* Method Two */
  background: var(--gradient-2) padding-box,
    linear-gradient(
        -28.96deg,
        #fb37ff 0%,
        rgba(155, 111, 238, 0) 25.98%,
        rgba(123, 127, 234, 0) 60.91%,
        #1bb2de 100%
      )
      border-box;

}