How can I show a document preview alongside a form in a responsive way?

My registration form requires the user to input Information A and Information B , which are printed on documents only they have access to.

Since I have to make the form responsive for all kinds of devices, being ultra-widescreen displays or smartphones, I want my preview to jump underneath my form. Also, I want my preview card always be the same height as my form card.

But the main problem is how to present the document preview. The preview is just an image that is being swapped out, depending on the input the user has currently focused. Information A is printed at the top of the document, and Information B is printed near the bottom. Now, on wider screens, the cards get wider as well. I have to either scale the image or crop it. Neither is really an option, since scaling makes it to small to be readable, and cropping cuts off Information B.

I did see the question "How to best show a document preview".

Question: What would be a good way to style a responsive preview of these documents?