Solution to FEM's FAQ Accordion card

I'm not totally liking my solution. Why? Because I was using rather large negative margins. I tried looking at other ways, like transform: translate, but it wasn't as straightforward as I thought. I was able to use a little animation with the accordion. In summary, this challenge is so far the most unsatisfying I've done so far. It makes me rethink if I understood what I already know.

Other observations:

With .box in desktop mode, as the viewport gets smaller and smaller it gets clipped by the left side of the viewport. I tried adding a margin but it doesn't work. The woman-online-desktop.svg also does not resize at the same rate as bg-pattern-desktop.svg as the viewport is reduced.