Base Apparel Coming Soon page with Grid

I got this as far as I could take it, but then had to stop before I went mad. Here's where I need help and guidance:

• Layout: the sneaky part from the design examples is how the layout changed from desktop to mobile. Since the location of the hero image changes in the flow, I went with grid-template-areas but didn't work out perfectly. For some reason it also left white space on the right of my mobile view that I couldn't get rid of.
• Submit button: Trying to position it inside the input field. I used positioning, but when the resposive layout changes, sometimes it would be off by a few pixels and no longer fit neatly into the input bar.
• Background image: Couldn't seem to control it the way I wanted to and match the example. The example seems more transparent and covers more of the page. I tried cover obviously, but that made it too huge so you couldn't see the whole design. This is probably impacted by my choice of Grid layout as mentioned above.
• Workflow: I started with mobile-first, then tried to convert it to desktop, but it was a nightmare getting the content layout correct. So then I re-did my existing code to adjust for desktop-first and then go to mobile, since desktop was more complex. That almost worked better, except for the extra white space at the right edge of my mobile view that I could not get rid of.

And probably a few more things, but those are the major issues I experienced, so I welcome any and all comments. I plan to come back and rework this again sometime, but I wanted to submit it now as my best effort at the moment, until I can learn how to improve it.