Fix Contact Form success message display and position shift on desktop

[mariana-caldas]

What do we need to build or fix?

When trying to send a message through our form under the contact page on the desktop, the success message (or any message) is not displayed, and the form shifts position, moving to the left. The messages are only displayed on mobile.

Technical details

After researching the console, I noticed that an unset position in a media query causes the issue. This issue was observed during testing on a MAC using the Chrome browser. We need to ensure the message appears on both desktop and mobile without causing the form to move on the desktop.

https://github.com/user-attachments/assets/bfc1e79e-4fb6-4f3f-8c6b-77abdf4257ae

Approach suggestions

• Review and adjust the media queries to set the appropriate position for the messages.
• Ensure the form's position remains static when the success message is displayed on the desktop.
• Test the changes on both desktop and mobile to confirm the issue is resolved.

Deadline

Please keep in mind that once you assign this task to yourself, you'll need to complete it in 10 days.

Acceptance criteria

• Test the section and components in various screen sizes using the Inspect tool.
• Verify that the new changes added to the components do not affect other instances.
• Test the feature in multiple browsers, such as Chrome, Firefox, Edge, and Safari (MAC).
• If there are any build problems when submitting your PR, run yarn build locally to solve the issues and commit the changes.
• Update the CHANGELOG.md file.