script.js

/* Vimrella Health — product catalog & contact form */

const PRODUCTS = [
  {
    name: "Essential Multivitamin",
    use: "Daily micronutrient foundation with bioavailable forms — no megadoses, no mystery blends.",
    servings: "60 capsules",
    key: "15 actives, fully disclosed",
    price: "$24",
    sourcing: "Foundational SKU",
  },
  {
    name: "Magnesium Glycinate",
    use: "High-dose bisglycinate for sleep quality, muscle recovery, and daily calm.",
    servings: "90 capsules",
    key: "420 mg elemental",
    price: "$19",
    sourcing: "Clinical form",
  },
  {
    name: "Omega-3 Concentrate",
    use: "Fish oil in triglyceride form — 1,000 mg EPA/DHA per serving, third-party tested for oxidation.",
    servings: "60 softgels",
    key: "rTG form, IFOS-tested",
    price: "$28",
    sourcing: "MSC-certified",
  },
  {
    name: "Ashwagandha KSM-66®",
    use: "Clinical-dose adaptogen for stress balance and healthy cortisol response.",
    servings: "60 capsules",
    key: "600 mg KSM-66®",
    price: "$22",
    sourcing: "Patent-protected",
    flag: true,
  },
  {
    name: "Vitamin D3 + K2",
    use: "D3 with MK-7 K2 for calcium routing — immune and bone support in one capsule.",
    servings: "90 capsules",
    key: "5,000 IU D3 · 100 mcg K2",
    price: "$18",
    sourcing: "High-bioavailability",
  },
  {
    name: "Probiotic 30B",
    use: "Ten clinically-studied strains with 30 billion CFU, shelf-stable, delivery-guaranteed.",
    servings: "30 capsules",
    key: "30B CFU · 10 strains",
    price: "$32",
    sourcing: "Guaranteed CFU",
  },
  {
    name: "Collagen Peptides",
    use: "Hydrolyzed type I & III collagen for skin, hair, nails, and joint comfort.",
    servings: "30 servings",
    key: "10 g hydrolyzed",
    price: "$30",
    sourcing: "Grass-fed",
  },
  {
    name: "Daily Greens Powder",
    use: "Greens, prebiotic fiber, and adaptogens in one scoop — no chalk, no chewable tablet taste.",
    servings: "30 servings",
    key: "40+ whole-food actives",
    price: "$36",
    sourcing: "Cold-processed",
  },
];

function renderProducts() {
  const grid = document.getElementById("product-grid");
  grid.innerHTML = PRODUCTS.map(
    (p) => `
    <article class="product-card">
      <span class="product-chip${p.flag ? " flag" : ""}">${p.flag ? "Flagship" : "Core line"}</span>
      <h3 class="product-name">${p.name}</h3>
      <p class="product-use">${p.use}</p>
      <ul class="product-detail">
        <li><span>Servings</span>${p.servings}</li>
        <li><span>Dose</span>${p.key}</li>
      </ul>
      <div class="product-foot">
        <span class="product-price">${p.price}</span>
        <span class="product-sourcing">${p.sourcing}</span>
      </div>
    </article>`
  ).join("");
}

function initContactForm() {
  const form = document.getElementById("contact-form");
  const status = document.getElementById("form-status");

  form.addEventListener("submit", (event) => {
    event.preventDefault();

    const name = form.name.value.trim();
    const email = form.email.value.trim();
    const message = form.message.value.trim();

    if (!name || !email || !message) {
      show(status, "Please fill in name, email, and a short message.", "err");
      return;
    }
    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
      show(status, "That email address doesn't look right.", "err");
      return;
    }

    const subject = encodeURIComponent(`Supplier inquiry — ${form.role.value} — ${name}`);
    const body = encodeURIComponent(`${message}\n\nCompany: ${form.company.value.trim() || "n/a"}`);
    window.location.href = `mailto:partners@vimrella.com?subject=${subject}&body=${body}`;
    show(status, "Opening your mail client… if nothing happens, email partners@vimrella.com directly.", "ok");
  });
}

function show(element, text, kind) {
  element.textContent = text;
  element.hidden = false;
  element.className = "form-status " + kind;
}

document.addEventListener("DOMContentLoaded", () => {
  renderProducts();
  initContactForm();
});