diff --git a/app/lots/page.tsx b/app/lots/page.tsx
index 0c35914..2427190 100644
--- a/app/lots/page.tsx
+++ b/app/lots/page.tsx
@@ -1,5 +1,6 @@
 import type { Metadata } from "next";
 import Link from "next/link";
+import Image from "next/image";
 
 export const metadata: Metadata = {
   title: "Lots à gagner - Thé Tip Top",
@@ -31,8 +32,14 @@ export default function LotsPage() {
             <div className="bg-gradient-to-r from-[#d4a574] to-[#c4956a] rounded-2xl p-8 shadow-2xl border-2 border-[#e5e4dc]">
               <div className="flex flex-col md:flex-row items-center gap-6">
                 <div className="flex-shrink-0">
-                  <div className="w-32 h-32 bg-white rounded-lg flex items-center justify-center text-6xl shadow-md">
-                    🏆
+                  <div className="w-32 h-32 bg-white rounded-lg flex items-center justify-center p-3 shadow-md">
+                    <Image
+                      src="/images/lots/grand-prix.png"
+                      alt="Grand prix"
+                      width={128}
+                      height={128}
+                      className="w-full h-full object-contain object-center"
+                    />
                   </div>
                 </div>
                 <div className="flex-1 text-center md:text-left">
@@ -45,8 +52,8 @@ export default function LotsPage() {
                   <p className="text-white/90 mb-3">
                     Le grand prix du tirage final : une année complète de thé premium livré chez vous
                   </p>
-                  <div className="text-2xl font-bold text-white">
-                    Valeur : 360€ <span className="text-sm text-white/80 font-normal">Tirage sous contrôle d'huissier</span>
+                  <div className="text-sm text-white/80">
+                    Tirage sous contrôle d'huissier
                   </div>
                 </div>
               </div>
@@ -62,9 +69,15 @@ export default function LotsPage() {
             <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
 
               {/* Prize 1 - Infuseur */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc]">
-                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center">
-                  <div className="text-8xl">🍵</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/infuseur.png"
+                    alt="Infuseur à thé premium"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574]/20 to-[#c4956a]/20 text-[#c4956a] text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -74,21 +87,19 @@ export default function LotsPage() {
                   <p className="text-[#8a8a7a] text-sm mb-4">
                     Un infuseur en acier inoxydable de haute qualité pour ressortir les arômes de vos thés en vrac
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">15€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
               {/* Prize 2 - Thé détox */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc]">
-                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center">
-                  <div className="text-8xl">📦</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/the-detox.png"
+                    alt="Boîte 100g thé détox"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574]/20 to-[#c4956a]/20 text-[#c4956a] text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -98,21 +109,19 @@ export default function LotsPage() {
                   <p className="text-[#8a8a7a] text-sm mb-4">
                     Mélange détox aux plantes bio : menthe, citronnelle, fenouil et gingembre
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">25€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
               {/* Prize 3 - Thé signature */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc]">
-                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center">
-                  <div className="text-8xl">🌿</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/the-signature.png"
+                    alt="Boîte 100g thé signature"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574]/20 to-[#c4956a]/20 text-[#c4956a] text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -122,21 +131,19 @@ export default function LotsPage() {
                   <p className="text-[#8a8a7a] text-sm mb-4">
                     Notre mélange signature exclusif : Earl Grey aux agrumes et pétales de fleurs
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">35€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
               {/* Prize 4 - Coffret 39€ */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc]">
-                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center">
-                  <div className="text-8xl">🎁</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/coffret-39.png"
+                    alt="Coffret découverte 39€"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574]/20 to-[#c4956a]/20 text-[#c4956a] text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -146,21 +153,19 @@ export default function LotsPage() {
                   <p className="text-[#8a8a7a] text-sm mb-4">
                     Sélection de nos 3 thés premium dans un élégant coffret cadeau
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">39€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
               {/* Prize 5 - Coffret 69€ */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc]">
-                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center">
-                  <div className="text-8xl">🎁</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border border-[#e5e4dc] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/coffret-69.jpg"
+                    alt="Coffret prestige 69€"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574]/20 to-[#c4956a]/20 text-[#c4956a] text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -170,21 +175,19 @@ export default function LotsPage() {
                   <p className="text-[#8a8a7a] text-sm mb-4">
                     Collection premium : 5 thés d'exception avec accessoires dans un coffret luxe
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">69€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
               {/* Prize 6 - Tirage Final */}
-              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border-2 border-[#d4a574]">
-                <div className="aspect-square bg-gradient-to-br from-[#d4a574]/10 to-[#c4956a]/10 flex items-center justify-center">
-                  <div className="text-8xl">🏆</div>
+              <div className="bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow overflow-hidden border-2 border-[#d4a574] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#d4a574]/10 to-[#c4956a]/10 flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/grand-prix.png"
+                    alt="Grand prix - 1 an de thé"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-gradient-to-r from-[#d4a574] to-[#c4956a] text-white text-sm font-bold px-3 py-1 rounded-full mb-3 shadow-md">
@@ -192,16 +195,8 @@ export default function LotsPage() {
                   </div>
                   <h3 className="text-xl font-bold text-[#5a5a4e] mb-2">Tirage Final</h3>
                   <p className="text-[#8a8a7a] text-sm mb-4">
-                    Valeur 360€ - Livraison mensuelle pendant 12 mois
+                    Livraison mensuelle pendant 12 mois
                   </p>
-                  <div className="flex items-center justify-between">
-                    <div className="text-2xl font-bold text-[#d4a574]">360€</div>
-                    <button className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors">
-                      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                      </svg>
-                    </button>
-                  </div>
                 </div>
               </div>
 
diff --git a/app/page.tsx b/app/page.tsx
index 7c33741..05b3c75 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -209,11 +209,17 @@ export default function HomePage() {
               Découvrez nos magnifiques prix, des accessoires premium aux coffrets exclusifs
             </p>
 
-            <div className="grid md:grid-cols-2 lg:grid-cols-5 gap-6">
+            <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
               {/* Prize 1 */}
-              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100">
-                <div className="aspect-square bg-gradient-to-br from-amber-50 to-orange-50 flex items-center justify-center p-8">
-                  <div className="text-7xl">🍵</div>
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100 h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/infuseur.png"
+                    alt="Infuseur à thé premium"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-red-100 text-red-600 text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -221,15 +227,21 @@ export default function HomePage() {
                   </div>
                   <h3 className="text-xl font-bold text-gray-900 mb-2">Infuseur à thé premium</h3>
                   <p className="text-gray-600 text-sm">
-                    Un infuseur élégant pour vos thés en vrac
+                    Un infuseur en acier inoxydable de haute qualité pour ressortir les arômes de vos thés en vrac
                   </p>
                 </div>
               </div>
 
               {/* Prize 2 */}
-              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100">
-                <div className="aspect-square bg-gradient-to-br from-green-50 to-emerald-50 flex items-center justify-center p-8">
-                  <div className="text-7xl">📦</div>
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100 h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/the-detox.png"
+                    alt="Boîte 100g thé détox"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-orange-100 text-orange-600 text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -243,9 +255,15 @@ export default function HomePage() {
               </div>
 
               {/* Prize 3 */}
-              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100">
-                <div className="aspect-square bg-gradient-to-br from-blue-50 to-cyan-50 flex items-center justify-center p-8">
-                  <div className="text-7xl">🌿</div>
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100 h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/the-signature.png"
+                    alt="Boîte 100g thé signature"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-green-100 text-green-600 text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -259,9 +277,15 @@ export default function HomePage() {
               </div>
 
               {/* Prize 4 */}
-              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100">
-                <div className="aspect-square bg-gradient-to-br from-purple-50 to-pink-50 flex items-center justify-center p-8">
-                  <div className="text-7xl">🎁</div>
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100 h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/coffret-39.png"
+                    alt="Coffret découverte 39€"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-purple-100 text-purple-600 text-sm font-bold px-3 py-1 rounded-full mb-3">
@@ -275,20 +299,48 @@ export default function HomePage() {
               </div>
 
               {/* Prize 5 */}
-              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border-2 border-[#f59e0b]">
-                <div className="aspect-square bg-gradient-to-br from-yellow-50 to-amber-50 flex items-center justify-center p-8">
-                  <div className="text-7xl">🏆</div>
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border border-gray-100 h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#faf9f5] to-[#f5f5f0] flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/coffret-69.jpg"
+                    alt="Coffret prestige 69€"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
                 </div>
                 <div className="p-6">
                   <div className="inline-block bg-yellow-100 text-yellow-700 text-sm font-bold px-3 py-1 rounded-full mb-3">
                     4%
                   </div>
-                  <h3 className="text-xl font-bold text-gray-900 mb-2">Coffret découverte 69€</h3>
+                  <h3 className="text-xl font-bold text-gray-900 mb-2">Coffret prestige 69€</h3>
                   <p className="text-gray-600 text-sm">
                     Une expérience complète
                   </p>
                 </div>
               </div>
+
+              {/* Prize 6 - Tirage Final */}
+              <div className="bg-white rounded-xl shadow-lg overflow-hidden hover:shadow-2xl transition-shadow border-2 border-[#d4a574] h-full flex flex-col">
+                <div className="aspect-square bg-gradient-to-br from-[#d4a574]/10 to-[#c4956a]/10 flex items-center justify-center p-2">
+                  <Image
+                    src="/images/lots/grand-prix.png"
+                    alt="Grand prix - 1 an de thé"
+                    width={400}
+                    height={400}
+                    className="w-full h-full object-contain object-center"
+                  />
+                </div>
+                <div className="p-6">
+                  <div className="inline-block bg-gradient-to-r from-[#d4a574] to-[#c4956a] text-white text-sm font-bold px-3 py-1 rounded-full mb-3 shadow-md">
+                    1 an de THÉ
+                  </div>
+                  <h3 className="text-xl font-bold text-gray-900 mb-2">Tirage Final</h3>
+                  <p className="text-gray-600 text-sm">
+                    Livraison mensuelle pendant 12 mois
+                  </p>
+                </div>
+              </div>
             </div>
 
             <div className="text-center mt-12">
diff --git a/components/AboutContest.tsx b/components/AboutContest.tsx
index ada911e..8c4c941 100644
--- a/components/AboutContest.tsx
+++ b/components/AboutContest.tsx
@@ -69,38 +69,15 @@ export default function AboutContest({
             {/* Image */}
             <div className="order-1 md:order-2">
               <div className="relative rounded-2xl overflow-hidden shadow-2xl">
-                {/* Fallback avec illustration CSS si l'image n'existe pas */}
-                <div className="aspect-[4/3] bg-gradient-to-br from-[#1a4d2e] via-[#2d5a3d] to-[#1a4d2e] relative">
-                  {/* Motif décoratif */}
-                  <div className="absolute inset-0 opacity-20">
-                    <div className="absolute inset-0" style={{
-                      backgroundImage: 'url("data:image/svg+xml,%3Csvg width=\'60\' height=\'60\' viewBox=\'0 0 60 60\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cg fill=\'none\' fill-rule=\'evenodd\'%3E%3Cg fill=\'%23ffffff\' fill-opacity=\'0.3\'%3E%3Cpath d=\'M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z\'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")',
-                    }}></div>
-                  </div>
-
-                  {/* Icône de thé */}
-                  <div className="absolute inset-0 flex items-center justify-center">
-                    <div className="text-9xl opacity-40">🍵</div>
-                  </div>
-
-                  {/* Badges décoratifs */}
-                  <div className="absolute top-4 right-4 bg-[#f59e0b] text-white px-4 py-2 rounded-full font-bold shadow-lg">
-                    10 ans
-                  </div>
-                  <div className="absolute bottom-4 left-4 bg-white/90 backdrop-blur-sm text-[#1a4d2e] px-4 py-2 rounded-full font-bold shadow-lg">
-                    Premium Bio
-                  </div>
+                <div className="aspect-square relative">
+                  <Image
+                    src="/images/lots/acceuil.png"
+                    alt="Jeu Concours Thé Tip Top - Boutique Premium à Nice"
+                    width={800}
+                    height={800}
+                    className="w-full h-full object-cover"
+                  />
                 </div>
-
-                {/* Note: Vous pouvez remplacer le div ci-dessus par une vraie image :
-                <Image
-                  src={imageUrl}
-                  alt="Collection de thés Thé Tip Top"
-                  width={600}
-                  height={450}
-                  className="w-full h-full object-cover"
-                />
-                */}
               </div>
             </div>
           </div>
diff --git a/components/Footer.tsx b/components/Footer.tsx
index 8a6b5f5..8403080 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -1,13 +1,43 @@
 'use client';
 
+import { useState } from 'react';
 import Link from 'next/link';
 import Logo from './Logo';
 import { ROUTES } from '@/utils/constants';
 import { useAuth } from '@/contexts/AuthContext';
+import { newsletterService } from '@/services/newsletter.service';
 
 export default function Footer() {
   const currentYear = new Date().getFullYear();
   const { isAuthenticated } = useAuth();
+  const [email, setEmail] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+  const [message, setMessage] = useState<{ type: 'success' | 'error'; text: string } | null>(null);
+
+  const handleNewsletterSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+
+    if (!email) {
+      setMessage({ type: 'error', text: 'Veuillez entrer votre email' });
+      return;
+    }
+
+    setIsLoading(true);
+    setMessage(null);
+
+    try {
+      const response = await newsletterService.subscribe({ email });
+      setMessage({ type: 'success', text: response.message || 'Inscription réussie !' });
+      setEmail('');
+    } catch (error: any) {
+      setMessage({
+        type: 'error',
+        text: error.message || 'Une erreur est survenue. Veuillez réessayer.'
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
 
   return (
     <footer className="bg-gradient-to-br from-[#f5f5f0] via-[#faf9f5] to-[#f5f5f0] text-[#5a5a4e] border-t-2 border-[#e5e4dc]">
@@ -47,7 +77,7 @@ export default function Footer() {
                 </svg>
               </a>
               <a
-                href="https://pinterest.com"
+                href="https://www.pinterest.com/The_Tip_Top_/"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-[#8a8a7a] hover:text-[#d4a574] transition-colors"
@@ -140,28 +170,42 @@ export default function Footer() {
             </ul>
           </div>
 
-          {/* Contact */}
+          {/* Newsletter */}
           <div>
-            <h3 className="text-lg font-semibold text-[#d4a574] mb-4">CONTACT</h3>
-            <ul className="space-y-3 text-sm text-[#8a8a7a]">
-              <li className="flex items-start gap-2">
-                <span className="mt-1">📍</span>
-                <span>
-                  18 Avenue Thiers
-                  <br />
-                  06000 Nice, France
-                </span>
-              </li>
-              <li className="flex items-center gap-2">
-                <span>📞</span>
-                <a
-                  href="tel:+33123456789"
-                  className="hover:text-[#d4a574] transition-colors"
+            <h3 className="text-lg font-semibold text-[#d4a574] mb-4">NEWSLETTER</h3>
+            <p className="text-sm text-[#8a8a7a] mb-4">
+              Inscrivez-vous pour recevoir nos offres exclusives et nouveautés !
+            </p>
+            <form onSubmit={handleNewsletterSubmit} className="space-y-3">
+              <div>
+                <input
+                  type="email"
+                  value={email}
+                  onChange={(e) => setEmail(e.target.value)}
+                  placeholder="Votre email"
+                  className="w-full px-4 py-2 text-sm border border-[#e5e4dc] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#d4a574] focus:border-transparent bg-white text-[#5a5a4e] placeholder-[#a0a098]"
+                  disabled={isLoading}
+                />
+              </div>
+              <button
+                type="submit"
+                disabled={isLoading}
+                className="w-full px-4 py-2 text-sm font-medium text-white bg-[#d4a574] rounded-lg hover:bg-[#c49563] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+              >
+                {isLoading ? 'Inscription...' : "S'inscrire"}
+              </button>
+              {message && (
+                <p
+                  className={`text-xs ${
+                    message.type === 'success' ? 'text-green-600' : 'text-red-600'
+                  }`}
                 >
-                  01 23 45 67 89
-                </a>
-              </li>
-              <li className="flex items-center gap-2">
+                  {message.text}
+                </p>
+              )}
+            </form>
+            <div className="mt-4 pt-4 border-t border-[#e5e4dc]">
+              <p className="text-xs text-[#8a8a7a] flex items-center gap-1">
                 <span>✉️</span>
                 <a
                   href="mailto:contact@thetiptop.fr"
@@ -169,12 +213,17 @@ export default function Footer() {
                 >
                   contact@thetiptop.fr
                 </a>
-              </li>
-              <li className="flex items-center gap-2">
-                <span>🕐</span>
-                <span>Lun - Sam: 9h - 19h</span>
-              </li>
-            </ul>
+              </p>
+              <p className="text-xs text-[#8a8a7a] mt-1 flex items-center gap-1">
+                <span>📞</span>
+                <a
+                  href="tel:+33123456789"
+                  className="hover:text-[#d4a574] transition-colors"
+                >
+                  01 23 45 67 89
+                </a>
+              </p>
+            </div>
           </div>
         </div>
       </div>