<section class="contact-us" style="max-width: 720px; margin: 0 auto; padding: 24px;">

  <h1 style="margin: 0 0 8px;">Contact Vizoovet</h1>

  <p style="margin: 0 0 18px;">

    Send us a message and we’ll get back to you as soon as possible.

  </p>

  <form action="/contact.php" method="post" accept-charset="utf-8">

    <input type="hidden" name="action" value="send" />

    <div style="display:grid; grid-template-columns: 1fr 1fr; gap: 12px;">

      <div>

        <label for="contact_name" style="display:block; margin: 0 0 6px;">Full name *</label>

        <input id="contact_name" name="name" type="text" required

               style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;">

      </div>

      <div>

        <label for="contact_email" style="display:block; margin: 0 0 6px;">Email *</label>

        <input id="contact_email" name="email" type="email" required

               style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;">

      </div>

    </div>

    <div style="margin-top:12px;">

      <label for="contact_phone" style="display:block; margin: 0 0 6px;">Phone</label>

      <input id="contact_phone" name="phone" type="tel"

             placeholder="(555) 555-5555"

             style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;">

    </div>

    <div style="margin-top:12px;">

      <label for="contact_company" style="display:block; margin: 0 0 6px;">Clinic / Company</label>

      <input id="contact_company" name="company" type="text"

             placeholder="Clinic name (optional)"

             style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;">

    </div>

    <div style="margin-top:12px;">

      <label for="contact_subject" style="display:block; margin: 0 0 6px;">Subject *</label>

      <input id="contact_subject" name="subject" type="text" required

             placeholder="Order, product question, wholesale, etc."

             style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;">

    </div>

    <div style="margin-top:12px;">

      <label for="contact_message" style="display:block; margin: 0 0 6px;">Message *</label>

      <textarea id="contact_message" name="comment" rows="7" required

                style="width:100%; padding:10px; border:1px solid #ccc; border-radius:8px;"></textarea>

    </div>

    <!-- Simple spam trap (bots often fill it; humans won't see it) -->

    <div style="position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;">

      <label for="contact_website">Website</label>

      <input id="contact_website" name="website" type="text" tabindex="-1" autocomplete="off">

    </div>

    <div style="margin-top:16px;">

      <button type="submit"

              style="padding:12px 18px; border:0; border-radius:10px; cursor:pointer;">

        Send message

      </button>

    </div>

    <p style="margin-top:14px; font-size: 0.95em; opacity: 0.85;">

      Prefer email? Write to us at <a href="mailto:support@vizoovet.us">support@vizoovet.us</a>.

    </p>

  </form>

</section>