CONTACT US

<!-- page.contact.liquid -->
<div class="contact-page">
<h1>Contact Us</h1>

<p>Have questions or need help? Fill out the form below, and we’ll get back to you as soon as possible.</p>

<div class="contact-form">
<form method="post" action="/contact#contact_form" id="contact_form" accept-charset="UTF-8" class="contact-form">
<input type="hidden" name="form_type" value="contact">
<input type="hidden" name="utf8" value="✓">

<!-- Name Field -->
<label for="contact_name">Your Name</label>
<input type="text" id="contact_name" name="contact[name]" placeholder="John Doe" required>

<!-- Email Field -->
<label for="contact_email">Your Email</label>
<input type="email" id="contact_email" name="contact[email]" placeholder="your.email@example.com" required>

<!-- Phone Number (Optional) -->
<label for="contact_phone">Phone Number</label>
<input type="tel" id="contact_phone" name="contact[phone]" placeholder="123-456-7890">

<!-- Message Field -->
<label for="contact_message">Message</label>
<textarea id="contact_message" name="contact[body]" rows="5" placeholder="Type your message here..." required></textarea>

<!-- Submit Button -->
<button type="submit" class="btn">Send Message</button>
</form>
</div>
</div>

<!-- Styling (Optional) -->
<style>
.contact-page {
max-width: 600px;
margin: 0 auto;
padding: 20px;
}
.contact-page h1 {
text-align: center;
}
.contact-form label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
.contact-form input,
.contact-form textarea {
width: 100%;
padding: 10px;
margin-bottom: 15px;
border: 1px solid #ddd;
border-radius: 5px;
}
.contact-form button {
display: block;
width: 100%;
padding: 10px;
background-color: #007acc;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
.contact-form button:hover {
background-color: #005a99;
}
</style>