Ebilchuk/undefined
0
1<!DOCTYPE html>2<html lang="en">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>About Us - Purple Pastures</title>7 <link rel="icon" type="image/x-icon" href="/static/favicon.ico">8 <script src="https://cdn.tailwindcss.com"></script>9 <script src="https://unpkg.com/feather-icons"></script>10</head>11<body class="bg-light-purple">12 <!-- Navigation -->13 <nav class="bg-farm-purple shadow-lg">14 <div class="max-w-6xl mx-auto px-4">15 <div class="flex justify-between">16 <div class="flex space-x-7">17 <div>18 <a href="index.html" class="flex items-center py-4 px-2">19 <span class="font-semibold text-white text-3xl">Purple Pastures</span>20 </a>21 </div>22 </div>23 <div class="hidden md:flex items-center space-x-1">24 <a href="index.html" class="py-4 px-2 text-white font-semibold hover:text-sun-yellow border-b-4 border-farm-purple hover:border-sun-yellow">Home</a>25 <a href="products.html" class="py-4 px-2 text-white font-semibold hover:text-sun-yellow border-b-4 border-farm-purple hover:border-sun-yellow">Products</a>26 <a href="cart.html" class="py-4 px-2 text-white font-semibold hover:text-sun-yellow border-b-4 border-farm-purple hover:border-sun-yellow">Cart</a>27 <a href="about.html" class="py-4 px-2 text-sun-yellow font-semibold border-b-4 border-sun-yellow">About</a>28 <a href="contact.html" class="py-4 px-2 text-white font-semibold hover:text-sun-yellow border-b-4 border-farm-purple hover:border-sun-yellow">Contact</a>29 </div>30 <div class="md:hidden flex items-center">31 <button class="outline-none mobile-menu-button">32 <i data-feather="menu" class="text-white"></i>33 </button>34 </div>35 </div>36 </div>37 </nav>38 39 <!-- About Section -->40 <section class="py-16">41 <div class="container mx-auto px-6">42 <div class="text-center mb-12">43 <h1 class="text-4xl font-bold text-farm-purple mb-4">Our Story</h1>44 <p class="text-xl text-gray-600 max-w-2xl mx-auto">From humble beginnings to purple pastures</p>45 </div>46 47 <div class="flex flex-col md:flex-row items-center gap-12 mb-16">48 <div class="md:w-1/2">49 <img src="http://static.photos/agriculture/640x360/20" alt="Our Farm" class="rounded-lg shadow-xl w-full">50 </div>51 <div class="md:w-1/2">52 <h2 class="text-3xl font-bold text-farm-purple mb-6">Rooted in Tradition</h2>53 <p class="text-gray-600 mb-4">Purple Pastures began in 2012 as a small family farm specializing in heirloom purple vegetables. What started as a passion project growing unique purple varieties of common crops quickly blossomed into a thriving agricultural business.</p>54 <p class="text-gray-600 mb-6">Today, we operate on 50 acres of certified organic land, supplying restaurants, farmers markets, and home cooks with our distinctive purple-hued produce and other farm-fresh goods.</p>55 <div class="flex items-center">56 <i data-feather="award" class="text-farm-purple mr-2"></i>57 <span class="font-medium">Certified Organic since 2014</span>58 </div>59 </div>60 </div>61 62 <div class="flex flex-col md:flex-row-reverse items-center gap-12 mb-16">63 <div class="md:w-1/2">64 <img src="http://static.photos/agriculture/640x360/21" alt="Our Team" class="rounded-lg shadow-xl w-full">65 </div>66 <div class="md:w-1/2">67 <h2 class="text-3xl font-bold text-farm-purple mb-6">Our Philosophy</h2>68 <p class="text-gray-600 mb-4">At Purple Pastures, we believe in sustainable farming practices that nourish both people and the planet. Our crops are grown without synthetic pesticides or fertilizers, using traditional methods that respect nature's balance.</p>69 <p class="text-gray-600 mb-6">We're committed to biodiversity, growing dozens of heirloom varieties that you won't find in conventional supermarkets. From deep purple carrots to violet potatoes, we celebrate nature's colorful bounty.</p>70 <div class="flex items-center">71 <i data-feather="heart" class="text-farm-purple mr-2"></i>72 <span class="font-medium">Family-owned and operated</span>73 </div>74 </div>75 </div>76 77 <div class="bg-white rounded-lg shadow-lg p-8 max-w-4xl mx-auto">78 <h2 class="text-3xl font-bold text-center text-farm-purple mb-8">Meet the Farmers</h2>79 <div class="grid grid-cols-1 md:grid-cols-3 gap-8">80 <div class="text-center">81 <img src="http://static.photos/people/200x200/20" alt="Farmer Chuk" class="w-32 h-32 rounded-full mx-auto mb-4">82 <h3 class="text-xl font-bold text-farm-purple">Chuk Thompson</h3>83 <p class="text-gray-600">Founder & Head Farmer</p>84 </div>85 <div class="text-center">86 <img src="http://static.photos/people/200x200/21" alt="Farmer Maria" class="w-32 h-32 rounded-full mx-auto mb-4">87 <h3 class="text-xl font-bold text-farm-purple">Maria Thompson</h3>88 <p class="text-gray-600">Operations & Marketing</p>89 </div>90 <div class="text-center">91 <img src="http://static.photos/people/200x200/22" alt="Farmhand" class="w-32 h-32 rounded-full mx-auto mb-4">92 <h3 class="text-xl font-bold text-farm-purple">Our Team</h3>93 <p class="text-gray-600">Dedicated farmhands and staff</p>94 </div>95 </div>96 </div>97 </div>98 </section>99 100 <script>feather.replace();</script>101</body>102</html>