Responsive Coming Soon Page With Active Form Validation Using JS

I used grid-template-areas to lay out the <header>, <main> and the <div> with the background-image.

I reused my own script for the form validation. I added a success message when the email is valid and an alert() for when the email is submitted.

I also gave the <main> and <header> a maximum width and justified both to center on the grid. I know that it makes the spacing slightly different from the design, but it ensures that the margins are appropriately sized across all screen widths.