shop ecommerce organic natural wellness green elegant
Shop Organic
Warm, earthy organic products shop with category showcase, featured products, brand values, and newsletter signup.
elegant Responsive Vanilla JS
Live Preview
Sections
navbarherocategoriesfeatured-productsvaluestestimonialsnewsletterfooter
Patterns used
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Terra Botanica — Organic Wellness, Rooted in Nature</title>
<meta name="description" content="Premium organic skincare, herbal teas, and natural supplements. Sustainably sourced, beautifully crafted, delivered to your door." />
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
sage: { 50: '#f4f7f4', 100: '#e6ede6', 200: '#cddcce', 300: '#a8c3aa', 400: '#7da67f', 500: '#6b8f71', 600: '#4e7054', 700: '#3f5a43', 800: '#354a38', 900: '#2c3d2f' },
cream: { 50: '#fefdfb', 100: '#fdf9f0', 200: '#faf3e3', 300: '#f5e8cc' },
terracotta: { 100: '#f5e1d0', 200: '#ebc8a8', 400: '#c4835a', 500: '#b06d3f' },
sand: { 100: '#f5eee4', 200: '#ebe0cf', 400: '#c9b48f' },
olive: { 100: '#eef1e5', 200: '#dbe3cd', 400: '#96a572' },
},
fontFamily: {
serif: ['"Georgia"', '"Times New Roman"', 'serif'],
}
}
}
}
</script>
<link rel="stylesheet" href="https://webspire.de/webspire-tokens.css">
<link rel="stylesheet" href="https://webspire.de/webspire-components.css">
<style>
html { scroll-behavior: smooth; }
body { font-family: 'Georgia', 'Times New Roman', serif; }
/* Brand tokens — Terra Botanica (warm sage/organic palette) */
:root {
--ws-color-primary: #4e7054;
--ws-color-primary-hover: #3f5a43;
--ws-color-primary-soft: #e6ede6;
--ws-color-surface: #fefdfb;
--ws-color-surface-alt: #fdf9f0;
--ws-color-surface-muted: #faf3e3;
--ws-color-text: #1c2b1e;
--ws-color-text-soft: #44403c;
--ws-color-text-muted: #78716c;
--ws-color-border: #cddcce;
--ws-color-accent: #b06d3f;
--ws-color-accent-hover: #c4835a;
}
/* interactions/hover-lift */
.hover-lift {
--lift-distance: -4px;
--lift-shadow: 0 8px 24px oklch(0 0 0 / 0.12);
--lift-duration: 0.25s;
transition:
transform var(--lift-duration) cubic-bezier(0.16, 1, 0.3, 1),
box-shadow var(--lift-duration) cubic-bezier(0.16, 1, 0.3, 1);
}
.hover-lift:hover {
transform: translateY(var(--lift-distance));
box-shadow: var(--lift-shadow);
}
@media (prefers-reduced-motion: reduce) {
.hover-lift { transition: none; }
}
</style>
</head>
<body class="bg-cream-50 text-stone-800 antialiased">
<!-- Navbar -->
<nav class="ws-navbar sticky top-0 z-50 bg-cream-50/90 backdrop-blur-md border-b border-sage-100" aria-label="Main navigation">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-between h-16">
<a href="#" class="flex items-center gap-2 text-xl font-bold text-sage-700" aria-label="Terra Botanica home">
<span class="text-2xl" aria-hidden="true">🌿</span>
<span class="tracking-wide">Terra Botanica</span>
</a>
<div class="hidden md:flex items-center gap-8 text-sm font-medium text-stone-600">
<a href="#categories" class="hover:text-sage-600 transition-colors">Shop</a>
<a href="#featured" class="hover:text-sage-600 transition-colors">Bestsellers</a>
<a href="#values" class="hover:text-sage-600 transition-colors">Our Values</a>
<a href="#testimonials" class="hover:text-sage-600 transition-colors">Reviews</a>
</div>
<div class="hidden md:flex items-center gap-4">
<a href="#" class="text-sm font-medium text-stone-600 hover:text-sage-600 transition-colors">Account</a>
<a href="#" class="text-sm font-semibold px-5 py-2 rounded-full bg-sage-600 text-white hover:bg-sage-700 transition-colors">Cart (0)</a>
</div>
<button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg hover:bg-sage-50" aria-label="Toggle menu" aria-expanded="false">
<svg class="w-6 h-6 text-stone-700" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" d="M4 6h16M4 12h16M4 18h16"/></svg>
</button>
</div>
<div id="mobile-menu" class="hidden md:hidden border-t border-sage-100 bg-cream-50 px-4 pb-4 pt-2 space-y-2">
<a href="#categories" class="block py-2 text-sm font-medium text-stone-600 hover:text-sage-600">Shop</a>
<a href="#featured" class="block py-2 text-sm font-medium text-stone-600 hover:text-sage-600">Bestsellers</a>
<a href="#values" class="block py-2 text-sm font-medium text-stone-600 hover:text-sage-600">Our Values</a>
<a href="#testimonials" class="block py-2 text-sm font-medium text-stone-600 hover:text-sage-600">Reviews</a>
<div class="pt-2 flex flex-col gap-2">
<a href="#" class="text-sm font-medium text-stone-600 text-center py-2">Account</a>
<a href="#" class="text-sm font-semibold px-4 py-2 rounded-full bg-sage-600 text-white text-center">Cart (0)</a>
</div>
</div>
</nav>
<!-- Hero -->
<section class="ws-hero relative overflow-hidden bg-sage-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24 sm:py-32 lg:py-40">
<div class="max-w-3xl mx-auto text-center">
<p class="text-sage-600 text-sm font-semibold tracking-widest uppercase mb-4">Rooted in Nature</p>
<h1 class="text-4xl sm:text-5xl lg:text-6xl font-bold text-stone-900 leading-tight mb-6">
Pure Ingredients,<br />Honest Wellness
</h1>
<p class="text-lg sm:text-xl text-stone-600 leading-relaxed mb-10 max-w-2xl mx-auto">
Carefully sourced botanicals and organic formulations crafted for those who believe what goes on your body matters as much as what goes in it.
</p>
<div class="flex flex-col sm:flex-row items-center justify-center gap-4">
<a href="#categories" class="px-8 py-3.5 rounded-full bg-sage-600 text-white font-semibold hover:bg-sage-700 transition-colors shadow-sm text-base">
Explore the Collection
</a>
<a href="#values" class="px-8 py-3.5 rounded-full border-2 border-sage-300 text-sage-700 font-semibold hover:bg-sage-100 transition-colors text-base">
Our Story
</a>
</div>
</div>
</div>
<!-- Decorative bottom wave -->
<div class="absolute bottom-0 left-0 right-0">
<svg viewBox="0 0 1440 60" fill="none" class="w-full" aria-hidden="true">
<path d="M0 60V20C240 50 480 0 720 20C960 40 1200 10 1440 30V60H0Z" fill="#fefdfb"/>
</svg>
</div>
</section>
<!-- Categories -->
<section id="categories" class="ws-gallery py-20 sm:py-28 bg-cream-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-14">
<p class="text-sage-600 text-sm font-semibold tracking-widest uppercase mb-3">Curated Collections</p>
<h2 class="text-3xl sm:text-4xl font-bold text-stone-900">Shop by Category</h2>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
<!-- Skincare -->
<a href="#" class="group block rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-52 bg-sage-200 flex items-center justify-center">
<span class="text-5xl opacity-60 group-hover:scale-110 transition-transform" aria-hidden="true">🧴</span>
</div>
<div class="bg-white p-5">
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Skincare</h3>
<p class="text-sm text-stone-500 mt-1">Serums, oils, and cleansers from nature's apothecary</p>
</div>
</a>
<!-- Supplements -->
<a href="#" class="group block rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-52 bg-terracotta-100 flex items-center justify-center">
<span class="text-5xl opacity-60 group-hover:scale-110 transition-transform" aria-hidden="true">🌱</span>
</div>
<div class="bg-white p-5">
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Supplements</h3>
<p class="text-sm text-stone-500 mt-1">Adaptogens, vitamins, and plant-based nutrition</p>
</div>
</a>
<!-- Teas -->
<a href="#" class="group block rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-52 bg-sand-200 flex items-center justify-center">
<span class="text-5xl opacity-60 group-hover:scale-110 transition-transform" aria-hidden="true">🍵</span>
</div>
<div class="bg-white p-5">
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Herbal Teas</h3>
<p class="text-sm text-stone-500 mt-1">Hand-blended loose-leaf teas for ritual and rest</p>
</div>
</a>
<!-- Essentials -->
<a href="#" class="group block rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-52 bg-olive-200 flex items-center justify-center">
<span class="text-5xl opacity-60 group-hover:scale-110 transition-transform" aria-hidden="true">🪴</span>
</div>
<div class="bg-white p-5">
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Essentials</h3>
<p class="text-sm text-stone-500 mt-1">Everyday organic basics for home and body</p>
</div>
</a>
</div>
</div>
</section>
<!-- Featured Products -->
<section id="featured" class="ws-product-card py-20 sm:py-28 bg-cream-100">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-14">
<p class="text-sage-600 text-sm font-semibold tracking-widest uppercase mb-3">Most Loved</p>
<h2 class="text-3xl sm:text-4xl font-bold text-stone-900">Featured Products</h2>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
<!-- Product 1 -->
<article class="group bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-64 bg-sage-100 flex items-center justify-center relative">
<span class="text-6xl opacity-40" aria-hidden="true">🌸</span>
<span class="absolute top-4 left-4 bg-sage-600 text-white text-xs font-semibold px-3 py-1 rounded-full">Bestseller</span>
</div>
<div class="p-5">
<p class="text-xs text-sage-600 font-semibold uppercase tracking-wide mb-1">Skincare</p>
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Lavender Face Serum</h3>
<p class="text-sm text-stone-500 mt-1 mb-4">Cold-pressed lavender and jojoba. Calms, hydrates, restores.</p>
<div class="flex items-center justify-between">
<span class="text-xl font-bold text-stone-900">€34</span>
<button class="px-4 py-2 rounded-full bg-sage-600 text-white text-sm font-semibold hover:bg-sage-700 transition-colors">Add to Cart</button>
</div>
</div>
</article>
<!-- Product 2 -->
<article class="group bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-64 bg-olive-100 flex items-center justify-center">
<span class="text-6xl opacity-40" aria-hidden="true">🍃</span>
</div>
<div class="p-5">
<p class="text-xs text-sage-600 font-semibold uppercase tracking-wide mb-1">Supplements</p>
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Matcha Powder</h3>
<p class="text-sm text-stone-500 mt-1 mb-4">Ceremonial-grade matcha from Uji, Japan. Stone-ground, vibrant.</p>
<div class="flex items-center justify-between">
<span class="text-xl font-bold text-stone-900">€28</span>
<button class="px-4 py-2 rounded-full bg-sage-600 text-white text-sm font-semibold hover:bg-sage-700 transition-colors">Add to Cart</button>
</div>
</div>
</article>
<!-- Product 3 -->
<article class="group bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-64 bg-terracotta-100 flex items-center justify-center relative">
<span class="text-6xl opacity-40" aria-hidden="true">🌹</span>
<span class="absolute top-4 left-4 bg-terracotta-500 text-white text-xs font-semibold px-3 py-1 rounded-full">New</span>
</div>
<div class="p-5">
<p class="text-xs text-sage-600 font-semibold uppercase tracking-wide mb-1">Skincare</p>
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Rose Hip Oil</h3>
<p class="text-sm text-stone-500 mt-1 mb-4">Wild-harvested rosehip. Rich in Vitamin C and essential fatty acids.</p>
<div class="flex items-center justify-between">
<span class="text-xl font-bold text-stone-900">€42</span>
<button class="px-4 py-2 rounded-full bg-sage-600 text-white text-sm font-semibold hover:bg-sage-700 transition-colors">Add to Cart</button>
</div>
</div>
</article>
<!-- Product 4 -->
<article class="group bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow">
<div class="h-64 bg-sand-100 flex items-center justify-center">
<span class="text-6xl opacity-40" aria-hidden="true">🌼</span>
</div>
<div class="p-5">
<p class="text-xs text-sage-600 font-semibold uppercase tracking-wide mb-1">Herbal Teas</p>
<h3 class="text-lg font-bold text-stone-900 group-hover:text-sage-700 transition-colors">Chamomile Tea Blend</h3>
<p class="text-sm text-stone-500 mt-1 mb-4">Chamomile, lemon balm, and passionflower. Your evening ritual.</p>
<div class="flex items-center justify-between">
<span class="text-xl font-bold text-stone-900">€18</span>
<button class="px-4 py-2 rounded-full bg-sage-600 text-white text-sm font-semibold hover:bg-sage-700 transition-colors">Add to Cart</button>
</div>
</div>
</article>
</div>
</div>
</section>
<!-- Our Values -->
<section id="values" class="py-20 sm:py-28 bg-cream-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-14">
<p class="text-sage-600 text-sm font-semibold tracking-widest uppercase mb-3">What We Stand For</p>
<h2 class="text-3xl sm:text-4xl font-bold text-stone-900">Our Values</h2>
<p class="text-stone-600 mt-4 max-w-2xl mx-auto text-lg">Every product we carry reflects a commitment to people, planet, and purity. No exceptions.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 lg:gap-12">
<div class="text-center bg-white rounded-2xl p-8 shadow-sm">
<div class="w-16 h-16 bg-sage-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<span class="text-3xl" aria-hidden="true">🌿</span>
</div>
<h3 class="text-xl font-bold text-stone-900 mb-3">Certified Organic</h3>
<p class="text-stone-600 leading-relaxed">Every ingredient is certified organic or wildcrafted. No synthetics, no fillers, no compromise. We publish full ingredient provenance for every product.</p>
</div>
<div class="text-center bg-white rounded-2xl p-8 shadow-sm">
<div class="w-16 h-16 bg-sage-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<span class="text-3xl" aria-hidden="true">🌍</span>
</div>
<h3 class="text-xl font-bold text-stone-900 mb-3">Sustainable Packaging</h3>
<p class="text-stone-600 leading-relaxed">Amber glass, compostable labels, recycled cardboard. We have eliminated single-use plastic from our entire supply chain since day one.</p>
</div>
<div class="text-center bg-white rounded-2xl p-8 shadow-sm">
<div class="w-16 h-16 bg-sage-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<span class="text-3xl" aria-hidden="true">🤝</span>
</div>
<h3 class="text-xl font-bold text-stone-900 mb-3">Fair Trade Partners</h3>
<p class="text-stone-600 leading-relaxed">We work directly with small-scale farmers and cooperatives. Fair wages, long-term relationships, and transparent pricing are not optional — they are foundational.</p>
</div>
</div>
</div>
</section>
<!-- Testimonials -->
<section id="testimonials" class="ws-testimonials py-20 sm:py-28 bg-sage-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-14">
<p class="text-sage-600 text-sm font-semibold tracking-widest uppercase mb-3">Kind Words</p>
<h2 class="text-3xl sm:text-4xl font-bold text-stone-900">What Our Customers Say</h2>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
<blockquote class="bg-white rounded-2xl p-8 shadow-sm">
<div class="flex gap-1 mb-4" aria-label="5 out of 5 stars">
<span class="text-amber-400 text-lg" aria-hidden="true">★★★★★</span>
</div>
<p class="text-stone-700 leading-relaxed text-lg italic mb-6">"The Lavender Face Serum has completely transformed my evening routine. My skin feels calmer, looks brighter, and I love knowing every ingredient is pure. Terra Botanica is the real thing."</p>
<footer class="flex items-center gap-3">
<div class="w-10 h-10 rounded-full bg-sage-200 flex items-center justify-center text-sage-700 font-bold text-sm" aria-hidden="true">SL</div>
<div>
<p class="font-semibold text-stone-900 text-sm">Sophie Lindström</p>
<p class="text-stone-500 text-xs">Customer since 2024</p>
</div>
</footer>
</blockquote>
<blockquote class="bg-white rounded-2xl p-8 shadow-sm">
<div class="flex gap-1 mb-4" aria-label="5 out of 5 stars">
<span class="text-amber-400 text-lg" aria-hidden="true">★★★★★</span>
</div>
<p class="text-stone-700 leading-relaxed text-lg italic mb-6">"I have tried dozens of matcha powders, and this is by far the most vibrant and smooth. The packaging is beautiful, too — glass jar, no plastic. This is how shopping should feel."</p>
<footer class="flex items-center gap-3">
<div class="w-10 h-10 rounded-full bg-terracotta-100 flex items-center justify-center text-terracotta-500 font-bold text-sm" aria-hidden="true">MK</div>
<div>
<p class="font-semibold text-stone-900 text-sm">Marco Kowalski</p>
<p class="text-stone-500 text-xs">Customer since 2025</p>
</div>
</footer>
</blockquote>
</div>
</div>
</section>
<!-- Newsletter -->
<section id="newsletter" class="ws-newsletter py-20 sm:py-28 bg-cream-50">
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<div class="bg-white rounded-2xl p-10 sm:p-14 shadow-sm border border-sage-100">
<span class="text-4xl mb-4 block" aria-hidden="true">🌾</span>
<h2 class="text-2xl sm:text-3xl font-bold text-stone-900 mb-3">Stay Rooted</h2>
<p class="text-stone-600 mb-8 text-lg max-w-lg mx-auto">Seasonal product drops, wellness guides, and behind-the-scenes stories from our partner farms. No spam, ever.</p>
<form class="flex flex-col sm:flex-row gap-3 max-w-md mx-auto" aria-label="Newsletter signup">
<label for="newsletter-email" class="sr-only">Email address</label>
<input
id="newsletter-email"
type="email"
placeholder="your@email.com"
required
class="flex-1 px-5 py-3 rounded-full border border-sage-200 bg-cream-50 text-stone-800 placeholder:text-stone-400 focus:outline-none focus:ring-2 focus:ring-sage-400 focus:border-transparent text-sm"
/>
<button type="submit" class="px-7 py-3 rounded-full bg-sage-600 text-white font-semibold hover:bg-sage-700 transition-colors text-sm whitespace-nowrap">
Subscribe
</button>
</form>
<p class="text-xs text-stone-400 mt-4">Unsubscribe anytime. We respect your inbox.</p>
</div>
</div>
</section>
<!-- Footer -->
<footer class="ws-footer bg-sage-900 text-sage-200 py-16" role="contentinfo">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10 mb-12">
<div>
<a href="#" class="flex items-center gap-2 text-xl font-bold text-white mb-4" aria-label="Terra Botanica home">
<span aria-hidden="true">🌿</span>
Terra Botanica
</a>
<p class="text-sage-300 text-sm leading-relaxed">Premium organic wellness rooted in transparency, sustainability, and the simple power of plants.</p>
</div>
<nav aria-label="Shop links">
<h4 class="text-white font-semibold mb-4 text-sm uppercase tracking-wide">Shop</h4>
<ul class="space-y-2 text-sm">
<li><a href="#" class="hover:text-white transition-colors">Skincare</a></li>
<li><a href="#" class="hover:text-white transition-colors">Supplements</a></li>
<li><a href="#" class="hover:text-white transition-colors">Herbal Teas</a></li>
<li><a href="#" class="hover:text-white transition-colors">Essentials</a></li>
</ul>
</nav>
<nav aria-label="Company links">
<h4 class="text-white font-semibold mb-4 text-sm uppercase tracking-wide">Company</h4>
<ul class="space-y-2 text-sm">
<li><a href="#" class="hover:text-white transition-colors">Our Story</a></li>
<li><a href="#" class="hover:text-white transition-colors">Sustainability</a></li>
<li><a href="#" class="hover:text-white transition-colors">Partner Farms</a></li>
<li><a href="#" class="hover:text-white transition-colors">Careers</a></li>
</ul>
</nav>
<nav aria-label="Support links">
<h4 class="text-white font-semibold mb-4 text-sm uppercase tracking-wide">Support</h4>
<ul class="space-y-2 text-sm">
<li><a href="#" class="hover:text-white transition-colors">Shipping & Returns</a></li>
<li><a href="#" class="hover:text-white transition-colors">FAQ</a></li>
<li><a href="#" class="hover:text-white transition-colors">Contact Us</a></li>
<li><a href="#" class="hover:text-white transition-colors">Privacy Policy</a></li>
</ul>
</nav>
</div>
<div class="border-t border-sage-700 pt-8 flex flex-col sm:flex-row items-center justify-between gap-4">
<p class="text-sage-400 text-sm">© 2026 Terra Botanica. All rights reserved.</p>
<div class="flex items-center gap-6">
<a href="#" class="text-sage-400 hover:text-white transition-colors text-sm" aria-label="Terra Botanica on Instagram">Instagram</a>
<a href="#" class="text-sage-400 hover:text-white transition-colors text-sm" aria-label="Terra Botanica on Pinterest">Pinterest</a>
<a href="#" class="text-sage-400 hover:text-white transition-colors text-sm" aria-label="Terra Botanica on TikTok">TikTok</a>
</div>
</div>
</div>
</footer>
<!-- Mobile Menu Script -->
<script>
const btn = document.getElementById('mobile-menu-btn');
const menu = document.getElementById('mobile-menu');
btn.addEventListener('click', () => {
const expanded = btn.getAttribute('aria-expanded') === 'true';
btn.setAttribute('aria-expanded', String(!expanded));
menu.classList.toggle('hidden');
});
// Close mobile menu when a link is clicked
menu.querySelectorAll('a').forEach(link => {
link.addEventListener('click', () => {
menu.classList.add('hidden');
btn.setAttribute('aria-expanded', 'false');
});
});
</script>
</body>
</html>
Organic wellness shop with a warm, earthy design language. Sage green accents and cream backgrounds create a natural, trustworthy shopping experience.