<!-- ============ TOAST ============ -->
<div class="toast" id="toast">Added to cart</div>

<!-- ============ CART OVERLAY + DRAWER ============ -->
<div class="cart-overlay" id="cartOverlay" onclick="closeCart()"></div>
<aside class="cart-drawer" id="cartDrawer">
  <div class="cart-head">
    <h3>Your Cart</h3>
    <button onclick="closeCart()">✕</button>
  </div>
  <div class="cart-items" id="cartItems"></div>
  <div class="cart-foot">
    <div class="cart-subtotal"><span>Subtotal</span><span id="cartSubtotal">₹0</span></div>
    <button class="btn btn-gold btn-block" onclick="showToast('This is a demo store — checkout is not connected yet.')">Checkout</button>
  </div>
</aside>

<!-- ============ SEARCH OVERLAY ============ -->
<div class="search-overlay" id="searchOverlay">
  <div class="search-box">
    <button class="sclose" onclick="toggleSearch(false)">✕</button>
    <input type="text" id="searchInput" placeholder="Search formulas, concerns, ingredients..." oninput="runSearch(this.value)">
    <div class="search-results" id="searchResults"></div>
  </div>
</div>

<!-- ============ MOBILE DRAWER ============ -->
<div class="drawer" id="drawer">
  <div class="drawer-top"><button onclick="closeDrawer()">✕</button></div>
  <a href="#" onclick="go('home');closeDrawer();return false;">Home</a>
  <a href="#" onclick="go('shop');closeDrawer();return false;">Shop</a>
  <a href="#" onclick="go('wellness');closeDrawer();return false;">Wellness by Concern</a>
  <a href="#" onclick="go('about');closeDrawer();return false;">About Us</a>
  <a href="#" onclick="go('wholesaler');closeDrawer();return false;">Wholesaler</a>
  <a href="#" onclick="go('contact');closeDrawer();return false;">Contact Us</a>
  <div class="sub-label">Shop by concern</div>
  <div id="drawerConcerns" style="display:flex;flex-direction:column;"></div>
</div>

<!-- ============ TOP BAR ============ -->
<div class="topbar" id="topbar">
  <div class="topbar-track" id="topbarTrack"></div>
  <button class="close" onclick="document.getElementById('topbar').style.display='none'">✕</button>
</div>

<!-- ============ HEADER / MEGA NAV ============ -->
<header>
  <nav>
    <a href="#" class="brand" onclick="go('home');return false;">
      <svg width="38" height="38" viewBox="0 0 100 100" fill="none">
        <g stroke="#e6c268" stroke-width="2" fill="none">
          <path d="M50 12 C 40 30, 30 34, 22 30 C 26 42, 34 46, 44 44 C 38 56, 28 58, 18 52 C 24 66, 36 70, 48 64" />
          <path d="M50 12 C 60 30, 70 34, 78 30 C 74 42, 66 46, 56 44 C 62 56, 72 58, 82 52 C 76 66, 64 70, 52 64" />
        </g>
        <path d="M50 30 C 44 42, 42 52, 50 62 C 58 52, 56 42, 50 30 Z" fill="#e6c268"/>
        <path d="M40 78 L 60 78 L 50 88 Z" fill="#e6c268"/>
      </svg>
      <span class="logotext">Herbaldiets<small>Premium Wellness Solutions</small></span>
    </a>

    <div class="navlinks" id="navlinks">
      <div class="navitem"><a href="#" data-page="home" onclick="go('home');return false;">Home</a></div>

      <div class="navitem" id="concernsNavItem">
        <button onclick="toggleMega('concernsNavItem')">Concerns<span class="caret"></span></button>
        <div class="megapanel">
          <div class="mega-grid" id="megaConcerns"></div>
          <div class="mega-foot"><span>Not sure where to start?</span><a href="#" onclick="go('wellness');return false;">View All Concerns →</a></div>
        </div>
      </div>

      <div class="navitem" id="categoriesNavItem">
        <button onclick="toggleMega('categoriesNavItem')">Categories<span class="caret"></span></button>
        <div class="megapanel">
          <div class="mega-grid" id="megaCategories"></div>
          <div class="mega-foot"><span>25th Anniversary — Buy 1 Get 1</span><a href="#" onclick="go('shop');return false;">Shop All →</a></div>
        </div>
      </div>

      <div class="navitem"><a href="#" data-page="shop" onclick="go('shop');return false;">Shop</a></div>
      <div class="navitem"><a href="#" data-page="about" onclick="go('about');return false;">About Us</a></div>
      <div class="navitem"><a href="#" data-page="wholesaler" onclick="go('wholesaler');return false;">Wholesaler</a></div>
      <div class="navitem"><a href="#" data-page="contact" onclick="go('contact');return false;">Contact Us</a></div>
    </div>

    <div class="nav-icons">
      <button class="icon-btn" onclick="toggleSearch(true)" aria-label="Search">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><circle cx="11" cy="11" r="7"/><path d="M21 21 L16.5 16.5"/></svg>
      </button>
      <button class="icon-btn" onclick="showToast('Login is not connected in this demo store.')" aria-label="Account">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><circle cx="12" cy="8" r="3.5"/><path d="M4.5 20 C4.5 15.5 7.8 13 12 13 C16.2 13 19.5 15.5 19.5 20"/></svg>
      </button>
      <button class="icon-btn" onclick="openCart()" aria-label="Cart">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M6 8 L18 8 L17 20 L7 20 Z"/><path d="M9 8 C9 5 10 3 12 3 C14 3 15 5 15 8"/></svg>
        <span class="cart-count" id="cartCount">0</span>
      </button>
      <button class="hamburger" onclick="openDrawer()">☰</button>
    </div>
  </nav>
</header>

<!-- ============================================================ -->
<!-- PAGE: HOME -->
<!-- ============================================================ -->
<div class="page active" id="page-home">
  <div class="hero-slider" id="heroSlider"></div>
  <div class="marquee-strip"><div class="marquee-track" id="marqueeTrack"></div></div>

  <section class="wrap">
    <div class="section-head">
      <span class="eyebrow center">Not sure where to start?</span>
      <h2>Shop by wellness concern</h2>
      <p>Tap a concern to see the formulas built for it.</p>
    </div>
    <div class="tab-strip" id="homeConcernTabs"></div>
    <div class="carousel-wrap" style="margin-top:36px;">
      <div class="carousel-track" id="homeConcernResults"></div>
      <div class="carousel-nav"><button onclick="scrollCarousel('homeConcernResults',-1)">‹</button><button onclick="scrollCarousel('homeConcernResults',1)">›</button></div>
    </div>
  </section>

  <section class="bg-ivory-deep">
    <div class="wrap">
      <div class="section-head">
        <span class="eyebrow center">Loved by thousands</span>
        <h2>Our bestsellers</h2>
        <p>The formulas our community reaches for again and again — with our 25th anniversary Buy 1 Get 1 offer.</p>
      </div>
      <div class="carousel-wrap">
        <div class="carousel-track" id="bestsellerCarousel"></div>
        <div class="carousel-nav"><button onclick="scrollCarousel('bestsellerCarousel',-1)">‹</button><button onclick="scrollCarousel('bestsellerCarousel',1)">›</button></div>
      </div>
    </div>
  </section>

  <section>
    <div class="wrap">
      <div class="section-head">
        <span class="eyebrow center">Explore the range</span>
        <h2>Featured collections</h2>
      </div>
      <div class="banner-grid">
        <div class="promo-tile" onclick="go('shop')">
          <span class="ptag">New Premium Range</span>
          <h4>LivoLife Liver Tonic</h4>
          <a href="#">Shop Now →</a>
        </div>
        <div class="promo-tile" onclick="go('shop')">
          <span class="ptag">Best Seller</span>\n          <h4>Daily Dose Multivitamin</h4>
          <a href="#">Shop Now →</a>
        </div>
        <div class="promo-tile" onclick="go('wholesaler')">
          <span class="ptag">25th Anniversary</span>
          <h4>Become a Wholesaler</h4>
          <a href="#">Partner With Us →</a>
        </div>
      </div>
    </div>
  </section>

  <section class="bogo-banner">
    <div class="wrap">
      <span class="eyebrow center">25th anniversary offer</span>
      <h3>Buy One, Get One Free</h3>
      <p>To celebrate 25 years of natural healing, LivoLife and Daily Dose come home in pairs — one for you, one to share.</p>
      <a href="#" class="btn btn-gold" onclick="go('shop');return false;">Claim the Offer</a>
    </div>
  </section>

  <section class="wrap">
    <div class="section-head">
      <span class="eyebrow center">Care for every life</span>
      <h2>Shop by life stage</h2>
      <p>One family, one philosophy — Ayurvedic nourishment for what your body needs, at every age.</p>
    </div>
    <div class="stage-grid" id="stageGrid"></div>
  </section>

  <section class="bg-forest">
    <div class="wrap">
      <div class="section-head">
        <span class="eyebrow center">Pure · Natural · Potent</span>
        <h2>Why families choose Herbaldiets</h2>
      </div>
      <div class="value-row">
        <div class="value-item"><div class="seal" style="border-color:var(--gold-500);"><svg viewBox="0 0 24 24" fill="none" stroke="#e6c268" stroke-width="1.4"><path d="M12 2 L12 22 M4 8 C4 8 8 6 12 8 C16 6 20 8 20 8 M4 14 C4 14 8 12 12 14 C16 12 20 14 20 14"/></svg></div><h4>100% Natural</h4><p>Every formula is rooted in real Ayurvedic botanicals — no fillers, no shortcuts.</p></div>
        <div class="value-item"><div class="seal" style="border-color:var(--gold-500);"><svg viewBox="0 0 24 24" fill="none" stroke="#e6c268" stroke-width="1.4"><path d="M12 3 L20 7 V12 C20 17 16.5 20 12 21 C7.5 20 4 17 4 12 V7 Z"/></svg></div><h4>Liver &amp; Immunity First</h4><p>Formulated to protect the body's core systems before symptoms appear.</p></div>
        <div class="value-item"><div class="seal" style="border-color:var(--gold-500);"><svg viewBox="0 0 24 24" fill="none" stroke="#e6c268" stroke-width="1.4"><path d="M4 20 L4 12 L9 12 L9 20 M9 20 L9 6 L15 6 L15 20 M15 20 L15 10 L20 10 L20 20"/></svg></div><h4>25 Years of Expertise</h4><p>A quarter-century refining traditional recipes with scientific rigour.</p></div>
        <div class="value-item"><div class="seal" style="border-color:var(--gold-500);"><svg viewBox="0 0 24 24" fill="none" stroke="#e6c268" stroke-width="1.4"><path d="M12 21 C 7 17 3 13.5 3 9.2 C3 6.3 5.3 4 8.2 4 C 9.9 4 11.4 4.8 12 6.1 C 12.6 4.8 14.1 4 15.8 4 C 18.7 4 21 6.3 21 9.2 C 21 13.5 17 17 12 21 Z"/></svg></div><h4>Made For Every Age</h4><p>From prenatal care to senior joint support — one trusted house.</p></div>
      </div>
    </div>
  </section>

  <section class="bg-ivory-deep">
    <div class="wrap">
      <div class="section-head"><span class="eyebrow center">Real stories</span><h2>What our customers say</h2></div>
      <div class="testi-slider">
        <div class="testi-track" id="testiTrack"></div>
        <div class="testi-dots" id="testiDots"></div>
      </div>
    </div>
  </section>

  <section class="newsletter">
    <div class="wrap news-inner">
      <div><span class="eyebrow" style="color:var(--gold-500);">Stay rooted</span><h3>Get wellness notes &amp; early offers</h3></div>
      <form class="news-form" onsubmit="event.preventDefault();showToast('Subscribed — welcome to the Herbaldiets family.');this.reset();">
        <input type="email" placeholder="Your email address" required>
        <button type="submit">Subscribe</button>
      </form>
    </div>
  </section>
</div>

<!-- ============================================================ -->
<!-- PAGE: SHOP -->
<!-- ============================================================ -->
<div class="page" id="page-shop">
  <section class="page-hero" style="padding:56px 0 46px;">
    <div class="wrap"><span class="eyebrow center">The full range</span><h1>Shop all supplements</h1><p>Ayurvedic formulas for every concern and life stage — filter, sort, and find your fit.</p></div>
  </section>
  <section class="wrap" style="padding-top:50px;">
    <div class="pill-tabs" id="shopCategoryTabs" style="margin-bottom:34px;"></div>
    <div class="shop-layout">
      <aside class="filter-side">
        <div class="filter-group">
          <h5>Life Stage</h5>
          <label class="filter-opt"><input type="checkbox" onchange="toggleStageFilter('mother',this)"> Motherhood</label>
          <label class="filter-opt"><input type="checkbox" onchange="toggleStageFilter('kids',this)"> Growing Years</label>
          <label class="filter-opt"><input type="checkbox" onchange="toggleStageFilter('adult',this)"> Adult Vitality</label>
          <label class="filter-opt"><input type="checkbox" onchange="toggleStageFilter('senior',this)"> Golden Years</label>
        </div>
        <div class="filter-group">
          <h5>Offers</h5>
          <label class="filter-opt"><input type="checkbox" id="bogoFilter" onchange="applyShopFilters()"> Buy 1 Get 1 Free</label>
        </div>
        <div class="filter-group" style="border-bottom:none;">
          <h5>Price</h5>
          <label class="filter-opt"><input type="radio" name="priceRange" onchange="setPriceFilter('all')" checked> All Prices</label>
          <label class="filter-opt"><input type="radio" name="priceRange" onchange="setPriceFilter('under600')"> Under ₹600</label>
          <label class="filter-opt"><input type="radio" name="priceRange" onchange="setPriceFilter('600to800')"> ₹600 – ₹800</label>
          <label class="filter-opt"><input type="radio" name="priceRange" onchange="setPriceFilter('above800')"> Above ₹800</label>
        </div>
      </aside>
      <div>
        <div class="shop-toolbar">
          <span class="shop-count" id="shopCount"></span>
          <select id="sortSelect" onchange="applyShopFilters()">
            <option value="popular">Sort: Most Popular</option>
            <option value="priceLow">Price: Low to High</option>
            <option value="priceHigh">Price: High to Low</option>
          </select>
        </div>
        <div class="product-grid" id="shopGrid"></div>
      </div>
    </div>
  </section>
</div>

<!-- ============================================================ -->
<!-- PAGE: WELLNESS BY CONCERN -->
<!-- ============================================================ -->
<div class="page" id="page-wellness">
  <section class="page-hero" style="padding:56px 0 46px;">
    <div class="wrap"><span class="eyebrow center">Guided wellness</span><h1>Shop by concern</h1><p>Choose what you're addressing today — matched to the formulas built for it.</p></div>
  </section>
  <section class="wrap" style="padding-top:50px;">
    <div class="pill-tabs" id="wellnessTabs" style="justify-content:center;margin-bottom:40px;"></div>
    <div class="section-head left" id="wellnessHead"></div>
    <div class="product-grid" id="wellnessGrid"></div>
  </section>
</div>

<!-- ============================================================ -->
<!-- PAGE: ABOUT US -->
<!-- ============================================================ -->
<div class="page" id="page-about">
  <section class="page-hero">
    <div class="wrap"><span class="eyebrow center">Our story</span><h1>Twenty-five years of trust, care &amp; transformation</h1><p>Herbaldiets began with a simple belief: Ayurveda, practiced with discipline and formulated with modern care, can support a person from their very first breath to their last decade.</p></div>
  </section>
  <section class="wrap">
    <div class="split">
      <div>
        <span class="eyebrow">Since 2000</span>\n        <h2 style="font-size:32px;margin:14px 0 16px;">A legacy of healing, a future of wellness</h2>
        <p style="color:#4a4a44;margin-bottom:14px;">For the past 25 years, Herbaldiets has been committed to natural healing and holistic wellness. What started as a small Ayurvedic practice has grown into a trusted name across thousands of households — without ever compromising on purity.</p>
        <p style="color:#4a4a44;">From mother's womb to old age, we care for every life, naturally.</p>
      </div>
      <div class="visual-frame">
        <div class="seal"><svg viewBox="0 0 100 100" fill="none"><g stroke="#e6c268" stroke-width="1.6" fill="none"><path d="M50 14 C 41 30, 32 34, 25 30 C 28 41, 35 45, 43 43 C 38 54, 29 56, 20 51 C 25 63, 36 67, 47 61" /><path d="M50 14 C 59 30, 68 34, 75 30 C 72 41, 65 45, 57 43 C 62 54, 71 56, 80 51 C 75 63, 64 67, 53 61" /></g><path d="M50 32 C 45 42, 43 50, 50 58 C 57 50, 55 42, 50 32 Z" fill="#e6c268"/></svg></div>
      </div>
    </div>
  </section>
  <section class="bg-forest">
    <div class="wrap">
      <div class="section-head"><span class="eyebrow center">Milestones</span><h2>25 years in motion</h2></div>
      <div class="timeline">
        <div class="tl-item"><b>2000</b><p>Herbaldiets founded as a small-batch Ayurvedic pharmacy.</p></div>
        <div class="tl-item"><b>2009</b><p>Expanded into daily-wellness formulas for working adults.</p></div>
        <div class="tl-item"><b>2017</b><p>Launched dedicated care lines for mothers and children.</p></div>
        <div class="tl-item"><b>2026</b><p>Celebrating 25 years with our new Premium Range and this store.</p></div>
      </div>
    </div>
  </section>
  <section class="wrap">
    <div class="section-head"><span class="eyebrow center">What we stand for</span><h2>Pure. Natural. Potent.</h2></div>
    <div class="value-row">
      <div class="value-item"><div class="seal" style="border-color:var(--gold-600);"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M12 2 L12 22 M4 8 C4 8 8 6 12 8 C16 6 20 8 20 8"/></svg></div><h4 style="color:var(--ink-900);">Ayurvedic Expertise</h4><p style="color:#5c5c54;">Formulated with practitioners who've spent decades in classical Ayurveda.</p></div>
      <div class="value-item"><div class="seal" style="border-color:var(--gold-600);"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M9 3 L9 9 L4 18 A2 2 0 0 0 6 21 L18 21 A2 2 0 0 0 20 18 L15 9 L15 3 M9 3 L15 3"/></svg></div><h4 style="color:var(--ink-900);">Scientifically Formulated</h4><p style="color:#5c5c54;">Traditional botanicals validated through modern quality testing.</p></div>
      <div class="value-item"><div class="seal" style="border-color:var(--gold-600);"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M4 12 L9 17 L20 5"/></svg></div><h4 style="color:var(--ink-900);">Trusted by Thousands</h4><p style="color:#5c5c54;">A quarter-century of repeat households across India.</p></div>
      <div class="value-item"><div class="seal" style="border-color:var(--gold-600);"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M12 21 C 7 17 3 13.5 3 9.2 C3 6.3 5.3 4 8.2 4 C 9.9 4 11.4 4.8 12 6.1 C 12.6 4.8 14.1 4 15.8 4 C 18.7 4 21 6.3 21 9.2 C 21 13.5 17 17 12 21 Z"/></svg></div><h4 style="color:var(--ink-900);">Made With Care</h4><p style="color:#5c5c54;">Sugar-free, vegan-friendly, suitable for every age.</p></div>
    </div>
  </section>
  <section class="bg-ivory-deep">
    <div class="wrap" style="text-align:center;">
      <h2 style="font-size:28px;margin-bottom:14px;">Have questions about our formulas?</h2>
      <p style="color:#4a4a44;margin-bottom:24px;">Our wellness team is happy to help you find the right fit.</p>
      <a href="#" class="btn btn-outline-dark" onclick="go('contact');return false;">Talk to Us</a>
    </div>
  </section>
</div>

<!-- ============================================================ -->
<!-- PAGE: CONTACT US -->
<!-- ============================================================ -->
<div class="page" id="page-contact">
  <section class="page-hero" style="padding:56px 0 46px;">
    <div class="wrap"><span class="eyebrow center">We'd love to hear from you</span><h1>Contact Herbaldiets</h1><p>Questions about a formula, an order, or a partnership — reach out and our team will respond within one business day.</p></div>
  </section>
  <section class="wrap" style="padding-top:50px;">
    <div class="contact-grid">
      <div>
        <div class="info-block"><div class="seal"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M3 8 L12 14 L21 8 M4 5 L20 5 A1 1 0 0 1 21 6 L21 18 A1 1 0 0 1 20 19 L4 19 A1 1 0 0 1 3 18 L3 6 A1 1 0 0 1 4 5 Z"/></svg></div><div><h4>Email Us</h4><p>care@herbaldiets.in<br>wholesale@herbaldiets.in</p></div></div>
        <div class="info-block"><div class="seal"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M4 5 C4 14 10 20 19 20 L19 16.5 L15 15 L13 17 C10.5 15.5 8.5 13.5 7 11 L9 9 L7.5 5 Z"/></svg></div><div><h4>Call / WhatsApp</h4><p>+91 98765 43210<br>Mon–Sat, 9:30am – 6:30pm IST</p></div></div>
        <div class="info-block"><div class="seal"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M12 21 C 8 16 5 12.4 5 8.6 A7 7 0 0 1 19 8.6 C 19 12.4 16 16 12 21 Z M12 11 A2.4 2.4 0 1 0 12 6.2 A2.4 2.4 0 0 0 12 11 Z"/></svg></div><div><h4>Registered Office</h4><p>Herbaldiets Premium Wellness Solutions<br>Industrial Area, Ludhiana, Punjab, India</p></div></div>
        <div class="info-block"><div class="seal"><svg viewBox="0 0 24 24" fill="none" stroke="#b4902f" stroke-width="1.4"><path d="M12 8 L12 12 L15 14 M12 2 A10 10 0 1 0 12.01 2 Z"/></svg></div><div><h4>Order Support</h4><p>Track, return, or exchange within 7 days of delivery.</p></div></div>
      </div>
      <form class="card-form" onsubmit="event.preventDefault();showToast('Message sent — we will get back to you within 24 hours.');this.reset();">
        <div class="form-row"><div class="field"><label>Full Name</label><input type=\"text\" required></div><div class="field"><label>Phone Number</label><input type=\"tel\" required></div></div>
        <div class="form-row"><div class="field full"><label>Email Address</label><input type=\"email\" required></div></div>
        <div class="form-row"><div class="field full"><label>What's this about?</label><select><option>Product Question</option><option>Order Support</option><option>Wholesale Enquiry</option><option>Feedback</option></select></div></div>
        <div class="form-row"><div class="field full"><label>Message</label><textarea rows="5" required></textarea></div></div>
        <button type="submit" class="btn btn-gold btn-block">Send Message</button>
      </form>
    </div>
  </section>
</div>

<!-- ============================================================ -->
<!-- PAGE: WHOLESALER -->
<!-- ============================================================ -->
<div class="page" id="page-wholesaler">
  <section class="page-hero" style="padding:56px 0 46px;">
    <div class="wrap"><span class="eyebrow center">Partner with us</span><h1>Become a Herbaldiets wholesaler</h1><p>Join a 25-year-old Ayurvedic brand with a growing distributor network across pharmacies, clinics, and wellness retailers.</p></div>
  </section>
  <section class="wrap" style="padding-top:50px;">
    <div class="section-head"><span class="eyebrow center">Why partner with Herbaldiets</span><h2>Built for retail &amp; distribution growth</h2></div>
    <div class="perk-row">
      <div class="perk-card"><b class="num">01</b><h4>Tiered Bulk Pricing</h4><p>Volume-based margins across our full catalogue, reviewed quarterly.</p></div>
      <div class="perk-card"><b class="num">02</b><h4>Marketing Support</h4><p>Shelf-ready packaging, POS material, and co-branded launch campaigns.</p></div>
      <div class="perk-card"><b class="num">03</b><h4>Reliable Fulfilment</h4><p>Consistent batch quality and dependable lead times, 25 years running.</p></div>
    </div>
  </section>
  <section class="bg-forest">
    <div class="wrap two-col-text">
      <div><span class="eyebrow" style="color:var(--gold-500);">Requirements</span><h3 style="color:var(--gold-200);font-size:24px;margin:12px 0 14px;">Who we partner with</h3><p style="color:rgba(250,246,236,0.68);">Registered pharmacies, wellness stores &amp; clinics, and regional distributors with existing health-retail networks. Minimum opening order applies, reviewed per region.</p></div>
      <div><span class="eyebrow" style="color:var(--gold-500);">Process</span><h3 style="color:var(--gold-200);font-size:24px;margin:12px 0 14px;">How it works</h3><p style="color:rgba(250,246,236,0.68);">Submit the enquiry form → our partnerships team verifies your business → a regional manager shares pricing &amp; onboarding within 3 business days.</p></div>
    </div>
  </section>
  <section class="wrap">
    <div class="section-head"><span class="eyebrow center">Get started</span><h2>Distributor enquiry</h2></div>
    <form class="card-form" style="max-width:760px;margin:0 auto;" onsubmit="event.preventDefault();showToast('Enquiry received — our partnerships team will contact you within 3 business days.');this.reset();">
      <div class="form-row"><div class="field"><label>Business / Firm Name</label><input type=\"text\" required></div><div class="field"><label>Contact Person</label><input type=\"text\" required></div></div>
      <div class="form-row"><div class="field"><label>Phone Number</label><input type=\"tel\" required></div><div class="field"><label>Email Address</label><input type=\"email\" required></div></div>
      <div class="form-row"><div class="field"><label>City / Region</label><input type=\"text\" required></div><div class="field"><label>Business Type</label><select><option>Pharmacy</option><option>Wellness / Health Store</option><option>Clinic / Practitioner</option><option>Regional Distributor</option></select></div></div>
      <div class="form-row"><div class="field full"><label>Expected Monthly Order Volume</label><input type=\"text\" placeholder=\"e.g. 200 units / month\"></div></div>
      <button type="submit" class="btn btn-gold btn-block">Submit Enquiry</button>
    </form>
  </section>
</div>

<!-- ============================================================ -->
<!-- QUICK VIEW MODAL -->
<!-- ============================================================ -->
<div class="modal-overlay" id="qvOverlay" onclick="if(event.target===this)closeQuickView()">
  <div class="qv-modal" id="qvModal"></div>
</div>

<!-- ============================================================ -->
<!-- FOOTER -->
<!-- ============================================================ -->
<footer style="background:var(--ink-900);color:rgba(250,246,236,0.7);padding:64px 0 26px;">
  <div class="wrap">
    <div style="display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:46px;margin-bottom:44px;" class="foot-grid">
      <div>
        <div class="brand" style="color:var(--gold-200);">
          <svg width="32" height="32" viewBox="0 0 100 100" fill="none"><g stroke="#e6c268" stroke-width="2" fill="none"><path d="M50 12 C 40 30, 30 34, 22 30 C 26 42, 34 46, 44 44 C 38 56, 28 58, 18 52 C 24 66, 36 70, 48 64" /><path d="M50 12 C 60 30, 70 34, 78 30 C 74 42, 66 46, 56 44 C 62 56, 72 58, 82 52 C 76 66, 64 70, 52 64" /></g><path d="M50 30 C 44 42, 42 52, 50 62 C 58 52, 56 42, 50 30 Z" fill="#e6c268"/></svg>
          <span class="logotext">Herbaldiets</span>
        </div>
        <p style="font-size:13px;color:rgba(250,246,236,0.6);margin:14px 0 18px;max-width:270px;">Ayurvedic Premium Wellness Solutions — caring for every life stage, naturally, for 25 years.</p>
      </div>
      <div>
        <h5 style="font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-500);margin-bottom:16px;">Navigate</h5>
        <a href="#" onclick="go('home');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Home</a>
        <a href="#" onclick="go('shop');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Shop</a>
        <a href="#" onclick="go('wellness');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Wellness by Concern</a>
        <a href="#" onclick="go('about');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">About Us</a>
      </div>
      <div>
        <h5 style="font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-500);margin-bottom:16px;">Company</h5>
        <a href="#" onclick="go('wholesaler');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Become a Wholesaler</a>
        <a href="#" onclick="go('contact');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Contact Us</a>
        <a href="#" onclick="go('contact');return false;" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Track Order</a>
      </div>
      <div>
        <h5 style="font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-500);margin-bottom:16px;">Get in Touch</h5>
        <a href="#" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">care@herbaldiets.in</a>
        <a href="#" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">+91 98765 43210</a>
        <a href="#" style="display:block;font-size:13px;margin-bottom:9px;color:rgba(250,246,236,0.68);">Ludhiana, Punjab, India</a>
      </div>
    </div>
    <div style="border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:11.5px;color:rgba(250,246,236,0.45);">
      <span>© 2026 Herbaldiets Premium Wellness Solutions. All rights reserved.</span>
      <span>Pure · Natural · Potent — since 2000</span>
    </div>
  </div>
</footer>
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="https://herbaldietsindia.com/wp-sitemap-index.xsl" ?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-posts-post-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-posts-page-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-posts-product-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-taxonomies-category-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-taxonomies-product_brand-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-taxonomies-product_cat-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-taxonomies-product_tag-1.xml</loc></sitemap><sitemap><loc>https://herbaldietsindia.com/wp-sitemap-users-1.xml</loc></sitemap></sitemapindex>
