HTML form POST to Google Sheet when two forms are present instead of one

Below I have my HTML code that includes two forms, they are both the same except for the name field that only does what it is intended to do when a form is before it (doesn’t matter if it’s displayable or not).

    <div class="contact-right">
        <form class="contact-form" style="display: none;">
            <input id="form-name" name="Name" type="text" placeholder="Your Name" required>
            <input id="form-email" name="Email" type="email" placeholder="Your Email" required>
            <textarea id="form-message" name="Message" type="text" placeholder="Your Message"></textarea>
            <button id="send-button" type="submit">Send</button>
        </form>
        <form name="submit-to-google-sheet" class="contact-form">
            <input id="form-name" name="Name" type="text" placeholder="Your Name" required>
            <input id="form-email" name="Email" type="email" placeholder="Your Email" required>
            <textarea id="form-message" name="Message" type="text" placeholder="Your Message"></textarea>
            <button id="send-button" type="submit">Send</button>
        </form>
    </div>
</section>
<div class="footer">
    <p>Stuff Here</p>
</div>

<script>
    const scriptURL = '<SCRIPT URL>'
    const form = document.forms['submit-to-google-sheet']
  
    form.addEventListener('submit', e => {
      e.preventDefault()
      fetch(scriptURL, { method: 'POST', body: new FormData(form)})
        .then(response => console.log('Success!', response))
        .catch(error => console.error('Error!', error.message))
    })
  </script>

** I used to protect the URL I was using

The intended use is to have a single form that gets the text elements of the form inputs and stores it on a Google Sheet (followed: https://github.com/jamiewilson/form-to-google-sheets). I’ve tried so many angles and it always seems to be that the form with the submit-to-google-sheet doesn’t run if it’s the only form.