File size: 9,578 Bytes
2b3fcb7 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 | <!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>À Propos - SILA-Group</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
</head>
<body class="font-sans bg-gray-50">
<!-- Navigation -->
<nav class="bg-white shadow-md sticky top-0 z-50">
<div class="container mx-auto px-6 py-3 flex justify-between items-center">
<div class="flex items-center space-x-2">
<img src="logo.png" alt="SILA-Group Logo" class="h-12">
<span class="text-xl font-bold text-red-600">SILA-GROUP</span>
</div>
<div class="hidden md:flex space-x-8">
<a href="index.html" class="text-gray-600 hover:text-red-600">Accueil</a>
<a href="produits.html" class="text-gray-600 hover:text-red-600">Nos Produits</a>
<a href="apropos.html" class="text-red-600 font-medium">À Propos</a>
<a href="contact.html" class="text-gray-600 hover:text-red-600">Contact</a>
</div>
<button class="md:hidden focus:outline-none">
<i data-feather="menu"></i>
</button>
</div>
</nav>
<!-- About Hero -->
<section class="bg-red-600 text-white py-20">
<div class="container mx-auto px-6 text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-6">Notre Histoire</h1>
<p class="text-xl max-w-2xl mx-auto">Pionniers dans la transformation de piment au Togo depuis 2017</p>
</div>
</section>
<!-- About Content -->
<section class="py-16 bg-white">
<div class="container mx-auto px-6">
<div class="flex flex-col md:flex-row items-center gap-12 mb-16">
<div class="md:w-1/2" data-aos="fade-right">
<img src="http://static.photos/food/640x360/15" alt="Notre usine" class="rounded-lg shadow-lg w-full">
</div>
<div class="md:w-1/2" data-aos="fade-left">
<h2 class="text-3xl font-bold mb-6 text-gray-800">Qui sommes-nous ?</h2>
<p class="text-gray-600 mb-4">
Fondée en 2017 à Lomé, SILA-Group est la première entreprise spécialisée dans la transformation des piments en purée au Togo. Notre mission est de valoriser les produits agricoles locaux tout en offrant aux consommateurs des produits de qualité, pratiques et savoureux.
</p>
<p class="text-gray-600">
Située dans le quartier Djidjolé, Rue 101 AFG, notre unité de transformation respecte les normes d'hygiène les plus strictes pour vous offrir des purées de piment 100% naturelles.
</p>
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center gap-12">
<div class="md:w-1/2" data-aos="fade-left">
<img src="http://static.photos/food/640x360/16" alt="Process de production" class="rounded-lg shadow-lg w-full">
</div>
<div class="md:w-1/2" data-aos="fade-right">
<h2 class="text-3xl font-bold mb-6 text-gray-800">Notre Processus</h2>
<p class="text-gray-600 mb-4">
Nous sélectionnons rigoureusement les meilleurs piments auprès des producteurs locaux. Après récolte, les piments sont soigneusement lavés, triés et transformés dans notre unité de production.
</p>
<ul class="space-y-3 text-gray-600">
<li class="flex items-start">
<i data-feather="check" class="text-green-500 mr-2 mt-1"></i>
<span>Tri manuel des piments pour éliminer les impuretés</span>
</li>
<li class="flex items-start">
<i data-feather="check" class="text-green-500 mr-2 mt-1"></i>
<span>Lavage à l'eau potable</span>
</li>
<li class="flex items-start">
<i data-feather="check" class="text-green-500 mr-2 mt-1"></i>
<span>Transformation dans des conditions d'hygiène optimales</span>
</li>
<li class="flex items-start">
<i data-feather="check" class="text-green-500 mr-2 mt-1"></i>
<span>Conditionnement sous vide pour une meilleure conservation</span>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Values Section -->
<section class="py-16 bg-gray-100">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-16 text-gray-800">Nos Valeurs</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up">
<div class="text-red-500 mb-4">
<i data-feather="star" class="w-10 h-10"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Qualité</h3>
<p class="text-gray-600">Nous nous engageons à offrir des produits de la plus haute qualité, fabriqués avec des ingrédients naturels et frais.</p>
</div>
<div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up" data-aos-delay="200">
<div class="text-red-500 mb-4">
<i data-feather="users" class="w-10 h-10"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Communauté</h3>
<p class="text-gray-600">Nous travaillons en étroite collaboration avec les producteurs locaux pour soutenir l'agriculture togolaise.</p>
</div>
<div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up" data-aos-delay="400">
<div class="text-red-500 mb-4">
<i data-feather="heart" class="w-10 h-10"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Authenticité</h3>
<p class="text-gray-600">Nos produits conservent le goût authentique du piment togolais, sans additifs ni conservateurs artificiels.</p>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-16 bg-red-600 text-white">
<div class="container mx-auto px-6 text-center">
<h2 class="text-3xl font-bold mb-6">Découvrez la différence SILA-Group</h2>
<p class="text-xl mb-8 max-w-2xl mx-auto">Commandez dès maintenant et goûtez à l'authenticité de nos purées de piment</p>
<a href="contact.html" class="inline-block bg-white hover:bg-gray-100 text-red-600 px-8 py-3 rounded-lg font-medium transition duration-300">
Nous Contacter
</a>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-800 text-white py-12">
<div class="container mx-auto px-6">
<div class="grid md:grid-cols-3 gap-8">
<div>
<div class="flex items-center space-x-2 mb-4">
<img src="logo.png" alt="SILA-Group Logo" class="h-10">
<span class="text-xl font-bold">SILA-GROUP</span>
</div>
<p class="text-gray-400">Leader en transformation de piment au Togo depuis 2017.</p>
</div>
<div>
<h3 class="text-lg font-bold mb-4">Adresse</h3>
<ul class="space-y-2 text-gray-400">
<li class="flex items-start">
<i data-feather="map-pin" class="mr-2 mt-1 w-4 h-4"></i>
<span>Djidjolé, Rue 101 AFG, Lomé - Togo</span>
</li>
</ul>
</div>
<div>
<h3 class="text-lg font-bold mb-4">Suivez-nous</h3>
<div class="flex space-x-4">
<a href="#" class="text-gray-400 hover:text-white">
<i data-feather="facebook" class="w-6 h-6"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white">
<i data-feather="instagram" class="w-6 h-6"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white">
<i data-feather="twitter" class="w-6 h-6"></i>
</a>
</div>
</div>
</div>
<div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
<p>© 2023 SILA-Group. Tous droits réservés.</p>
</div>
</div>
</footer>
<script>
AOS.init();
feather.replace();
</script>
</body>
</html>
|