Do I need to duplicate the block for adaptability?

Question

css

Hello. When building for responsive devices, I very often resort to duplicating blocks (but I try to avoid them if possible). And so, in the next such block, I nevertheless decided to ask if there is an opportunity to avoid duplication?
Example: here is a ticket creation form. In the desktop, on the left there is a form (with a button and a description for it), on the right is a ticket preview. In a mobile phone - first there is a part of the form + a preview of the ticket + a button with a description.
If we exclude "crutches", such as placing the button absolute at the bottom, or inserting a preview between the button and the form + placing it absolute on the right, what is the best thing to do with the button and the description below it in this case - duplicate it in two places, and display one of them only on desktop and the other only on mob?
Thank you!

Answer 1

You think logically, and:
1. Flex-shamanism
2. Grid-shamanism
3. Moving an element using JS
4. Yes, crutches are already coming here

Answer 2

display:flex;
flex-direction: column-reverse;
Will solve all your questions. Or order with display: flex