Contact

{% comment %}

  Inspire Me Boutique — Contact Policy + Contact Form (Styled)

  Last updated: Aug 19, 2025

{% endcomment %}


<section class="imb-contact-policy" style="--imb-accent: {{ section.settings.accent_color }}; --imb-bg: {{ section.settings.bg_color }}; --imb-text: {{ section.settings.text_color }}; --imb-card: {{ section.settings.card_color }}; --imb-radius: {{ section.settings.radius }}px;">

  <div class="imb-container">

    {% if section.settings.show_heading %}

      <h1 class="imb-title">{{ section.settings.heading | escape }}</h1>

    {% endif %}

    <div class="imb-meta">

      <span><strong>Effective date:</strong> {{ section.settings.effective_date }}</span>

      <span><strong>Primary contact:</strong> <a href="mailto:{{ section.settings.primary_email }}">{{ section.settings.primary_email }}</a></span>

    </div>


    <div class="imb-grid">

      <!-- Policy -->

      <article class="imb-card">

        <h2>Contact Policy</h2>

        <h3>How to Reach Us</h3>

        <ul>

          <li><strong>Email (official):</strong> <a href="mailto:{{ section.settings.primary_email }}">{{ section.settings.primary_email }}</a></li>

          <li><strong>Social DMs:</strong> We welcome messages, but for order-specific help we’ll move you to email for verification.</li>

          <li><strong>Comments on posts:</strong> Not monitored for support.</li>

        </ul>


        <h3>What to Include in Your Message</h3>

        <ul>

          <li>Full name used on the order</li>

          <li>Order number (if available)</li>

          <li>Item(s), size, and color</li>

          <li>Photo link for any damaged/defective items</li>

          <li>Your preferred resolution (exchange, store credit, etc. per policy)</li>

        </ul>


        <h3>Response Times</h3>

        <p>We reply within <strong>24–48 business hours</strong> (Mon–Fri, Central Time). During launches, sales, or holidays, responses may take a little longer.</p>


        <h3>After-Hours & Weekends</h3>

        <p>Messages received after hours, weekends, or holidays will be answered the <strong>next business day</strong>.</p>


        <h3>Order Issues</h3>

        <ul>

          <li><strong>Damaged/defective/missing items:</strong> Report within <strong>48 hours of delivery</strong> with a photo link.</li>

          <li><strong>Returns/Exchanges:</strong> Please see our Return & Exchange Policy (store credit only). Start by emailing us.</li>

        </ul>


        <h3>Duplicate Messages</h3>

        <p>Please avoid sending the same request across multiple channels. One email thread ensures faster, documented support.</p>


        <h3>Privacy & Security</h3>

        <p>We will never request full payment details via DM or email. If a message seems suspicious, forward it to <a href="mailto:{{ section.settings.primary_email }}">{{ section.settings.primary_email }}</a>.</p>


        <h3>Professional Conduct</h3>

        <p>We promise respectful, kind communication and ask the same in return. Abusive or threatening language may result in restricted communication.</p>

      </article>


      <!-- Form -->

      <aside class="imb-card">

        <h2>{{ section.settings.form_heading }}</h2>


        {% form 'contact' %}

          {% if form.posted_successfully? %}

            <div class="imb-alert imb-success" role="status">

              {{ section.settings.success_message }}

            </div>

          {% endif %}


          {% if form.errors %}

            <div class="imb-alert imb-error" role="alert">

              <p><strong>There’s a problem:</strong></p>

              <ul>

                {% for field in form.errors %}

                  <li>{{ form.errors.messages[field] }}</li>

                {% endfor %}

              </ul>

            </div>

          {% endif %}


          <div class="imb-fields">

            <label for="ContactFormName">Name *</label>

            <input type="text" id="ContactFormName" name="contact[name]" required>


            <label for="ContactFormEmail">Email *</label>

            <input type="email" id="ContactFormEmail" name="contact[email]" required>


            {% if section.settings.show_phone %}

              <label for="ContactFormPhone">Phone</label>

              <input type="tel" id="ContactFormPhone" name="contact[phone]">

            {% endif %}


            {% if section.settings.show_order %}

              <label for="ContactFormOrder">Order Number</label>

              <input type="text" id="ContactFormOrder" name="contact[order_number]" placeholder="e.g., #1234">

            {% endif %}


            <label for="ContactFormPhoto">Photo link (optional)</label>

            <input type="url" id="ContactFormPhoto" name="contact[photo_link]" placeholder="https://...">


            <label for="ContactFormMessage">Message *</label>

            <textarea rows="6" id="ContactFormMessage" name="contact[body]" required></textarea>


            <p class="imb-privacy">

              By submitting, you agree we may use your contact details to support your order and reply to your message. For attachments, please email

              <a href="mailto:{{ section.settings.primary_email }}">{{ section.settings.primary_email }}</a>.

            </p>


            <button type="submit" class="imb-btn">{{ section.settings.button_label }}</button>

          </div>

        {% endform %}

      </aside>

    </div>

  </div>


  <style>

    .imb-contact-policy {

      background: var(--imb-bg);

      color: var(--imb-text);

      padding: clamp(24px, 4vw, 48px) 0;

    }

    .imb-container {

      width: min(1100px, 92%);

      margin: 0 auto;

    }

    .imb-title {

      font-size: clamp(28px, 2.4vw + 14px, 40px);

      line-height: 1.1;

      margin: 0 0 12px;

    }

    .imb-meta {

      display: flex; gap: 16px; flex-wrap: wrap;

      font-size: 14px; opacity: .85; margin-bottom: 20px;

    }

    .imb-grid {

      display: grid;

      grid-template-columns: 1.1fr .9fr;

      gap: clamp(16px, 2vw, 28px);

    }

    .imb-card {

      background: var(--imb-card);

      border: 1px solid color-mix(in oklab, var(--imb-text) 15%, transparent);

      border-radius: var(--imb-radius);

      padding: clamp(18px, 2vw, 28px);

      box-shadow: 0 1px 0 rgba(0,0,0,.06);

    }

    .imb-card h2 {

      margin-top: 0;

      font-size: clamp(20px, 1.6vw + 10px, 28px);

    }

    .imb-card h3 {

      margin-bottom: 6px; margin-top: 18px;

      font-size: clamp(16px, 1.2vw + 8px, 20px);

    }

    .imb-card ul { padding-left: 18px; margin: 8px 0 0; }

    .imb-card li { margin: 4px 0; }


    .imb-fields label {

      display: block; margin-top: 12px; font-weight: 600; font-size: 14px;

    }

    .imb-fields input,

    .imb-fields textarea {

      width: 100%;

      margin-top: 6px;

      border: 1px solid color-mix(in oklab, var(--imb-text) 22%, transparent);

      border-radius: calc(var(--imb-radius) - 2px);

      padding: 10px 12px;

      background: #fff;

      color: #111;

      font: inherit;

    }

    .imb-privacy { font-size: 12px; opacity: .8; margin-top: 10px; }

    .imb-btn {

      margin-top: 14px;

      display: inline-block;

      padding: 12px 16px;

      border-radius: calc(var(--imb-radius) - 2px);

      border: 1px solid var(--imb-accent);

      background: var(--imb-accent);

      color: #fff;

      font-weight: 700;

      cursor: pointer;

      transition: transform .06s ease, filter .2s ease;

    }

    .imb-btn:hover { filter: brightness(1.03); transform: translateY(-1px); }

    .imb-alert {

      border-radius: calc(var(--imb-radius) - 2px);

      padding: 12px 14px; margin-bottom: 14px; font-size: 14px;

    }

    .imb-success { background: #effaf1; border: 1px solid #cfe8d6; color: #1f6f3c; }

    .imb-error { background: #fff5f5; border: 1px solid #f3c2c2; color: #8f2020; }

    @media (max-width: 860px) {

      .imb-grid { grid-template-columns: 1fr; }

    }

  </style>

</section>


{% schema %}

{

  "name": "Inspire Me — Contact Policy",

  "settings": [

    { "type": "text", "id": "heading", "label": "Heading", "default": "Contact Us" },

    { "type": "checkbox", "id": "show_heading", "label": "Show heading", "default": true },

    { "type": "text", "id": "effective_date", "label": "Effective date", "default": "August 19, 2025" },

    { "type": "text", "id": "primary_email", "label": "Primary contact email", "default": "inspireme2025@yahoo.com" },


    { "type": "text", "id": "form_heading", "label": "Form heading", "default": "Send us a message" },

    { "type": "text", "id": "button_label", "label": "Submit button label", "default": "Send message" },

    { "type": "text", "id": "success_message", "label": "Success message", "default": "Thanks! We’ve received your message and will reply within 24–48 business hours (Mon–Fri, CT)." },


    { "type": "checkbox", "id": "show_phone", "label": "Show phone field", "default": false },

    { "type": "checkbox", "id": "show_order", "label": "Show order number field", "default": true },


    { "type": "color", "id": "accent_color", "label": "Accent color", "default": "#E35A76" },

    { "type": "color", "id": "bg_color", "label": "Background color", "default": "#FFF6F8" },

    { "type": "color", "id": "card_color", "label": "Card color", "default": "#FFFFFF" },

    { "type": "color", "id": "text_color", "label": "Text color", "default": "#2B2B2B" },

    { "type": "range", "id": "radius", "label": "Corner radius", "min": 0, "max": 20, "step": 1, "default": 10 }

  ],

  "presets": [

    { "name": "Contact Policy + Form" }

  ]

}

{% endschema %}

Contact form