diff --git a/public/tdf-downloads/Pancarte COULEURS(A4).png b/public/tdf-downloads/Pancarte COULEURS(A4).png
deleted file mode 100644
index b2d9a9ee..00000000
Binary files a/public/tdf-downloads/Pancarte COULEURS(A4).png and /dev/null differ
diff --git a/public/tdf-downloads/Pancarte.pdf b/public/tdf-downloads/Pancarte.pdf
new file mode 100644
index 00000000..0f50a112
Binary files /dev/null and b/public/tdf-downloads/Pancarte.pdf differ
diff --git a/resources/sass/fo/pages/page-tdf.scss b/resources/sass/fo/pages/page-tdf.scss
index c866d8ee..6213f6d6 100644
--- a/resources/sass/fo/pages/page-tdf.scss
+++ b/resources/sass/fo/pages/page-tdf.scss
@@ -3,11 +3,13 @@
         min-height: 80vh;
     }
 
-    .hero-bg {
-        background-image: url('/resources/assets/images/page-tdf/TDF-hero-bg.jpg');
-        background-position: center;
-        background-repeat: no-repeat;
-        background-size: cover;
+    @include media-breakpoint-up(md) {
+        .hero-bg {
+            background-image: url('/resources/assets/images/page-tdf/TDF-hero-bg.jpg');
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: cover;
+        }
     }
 
     .logo-tdf {
@@ -84,8 +86,21 @@
         }
     }
 
+    #le-gaulois-et-le-tour-de-france {
+        padding-top: 80px;
+
+        @include media-breakpoint-up(md) {
+            padding-top: 100px;
+        }
+    }
 
     #au-coeur-de-la-caravane {
+        padding-top: 80px;
+
+        @include media-breakpoint-up(md) {
+            padding-top: 100px;
+        }
+
         .anecdote-container {
             padding: 80px 0;
         }
diff --git a/resources/views/components/fo/page-tdf/au-coeur-de-la-caravane.blade.php b/resources/views/components/fo/page-tdf/au-coeur-de-la-caravane.blade.php
index 85e5173b..5505d208 100644
--- a/resources/views/components/fo/page-tdf/au-coeur-de-la-caravane.blade.php
+++ b/resources/views/components/fo/page-tdf/au-coeur-de-la-caravane.blade.php
@@ -4,40 +4,40 @@
             'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-soleil-jaune-météo.svg'),
             'picto_alt' => 'Pictogramme d\'un soleil pour les anecdoctes météo sur le Tour de France',
             'picto_title' => 'Pictogramme d\'un soleil',
-            'title' => 'La météo : La caravane par tous les temps !',
+            'title' => 'La caravane par tous les temps !',
             'content' =>
-                'Le 26 juillet 2019, lors de l\'étape entre Saint-Jean-de-Maurienne et Tignes, longue de 126,5 kms avec 156 coureurs au départ, un orage de grêle s\'invite à la fête. Les chars de la caravane parviennent à monter jusqu’à Tignes, mais l’orage apporte une trop grande quantité de grêle, entraînant une coulée de boue qui bloque la route et l’accès aux cyclistes. La décision de l’organisation est inéluctable : l’arrêt de l’étape qui restera dans l’histoire du Tour de France !',
+                'Le 26 juillet 2019, lors de l\'étape Saint-Jean-de-Maurienne et Tignes, les chars terminent leur parade quand un orage de grêle s\'invite et entraîne une coulée de boue qui bloque la route et l’accès aux cyclistes. L’organisation décide l\'arrêt de l’étape et marquera  l’histoire du Tour de France.',
         ],
         [
             'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-enfant-brun-famille.svg'),
             'picto_alt' => 'Pictogramme d\'une tête d\'enfant pour les liens de parenté au sein de l\'équipe des caravaniers',
             'picto_title' => 'Pictogramme d\'un enfant',
-            'title' => 'Famille : Le Père et le Fils, la transmission d’une passion !',
+            'title' => 'La transmission d’une passion entre Père & Fils !',
             'content' =>
-                'Grand habitué de la plus grande course cycliste du monde avec plus de 10 tours à son actif, Jean-Marie a transmis sa passion à son fils. Fusionnels dans la vie, Léo assure : « Sur le Tour, nous sommes collègues, mais il y a toujours cette fierté personnelle de partager ces moments ensemble sur les routes de France. ». De quoi se forger déjà une belle complicité !',
-        ],
-        [
-            'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-sirène-pompier-rouge.svg'),
-            'picto_alt' => 'Pictogramme d\'une sirène d\'alarme pour les anecdoctes insolites pendant le Tour de France',
-            'picto_title' => 'Pictorgramme d\'une alarme',
-            'title' => 'Histoire de poulet',
-            'content' =>
-                'Avec un sens de l’humour aguerri, Cocotte rencontre une sympathique collègue au détour d’un passage dans un village sur les routes du Tour de France. On adore regarder la vidéo <a href="https://www.youtube.com/watch?v=reI-Z8UE3lM" target="_blank">‘Salut collègue’</a> !',
+                'Avec plus de 10 tours de France à son actif, Jean-Marie a transmis sa passion à son fils. Léo assure : « Sur le Tour, nous sommes collègues, mais il y a toujours cette fierté personnelle de partager ces moments ensemble sur les routes de France. ».',
         ],
         [
             'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-poulet-policier-bleu.svg'),
             'picto_alt' => 'Pictogramme d\'un poulet policier pour les histoires poulets-policiers pendants le Tour de France',
             'picto_title' => 'Pictogramme d\'un poulet policier',
-            'title' => 'Insolite, un pompier en tant que chauffeur d’un char cocotte Le Gaulois',
+            'title' => 'Histoire de poulet',
             'content' =>
-                'Nicolas, pompier engagé, a rencontré l’équipe de la caravane Le Gaulois lors d’une intervention de secours pour une jeune caravanière Le Gaulois. Depuis, Nicolas, rebaptisé Pimpon, fait partie de l’équipe Le Gaulois, sillonnant les routes de France à bord d’une des mythiques Cocottes. On aime les histoires qui finissent bien !',
+                'Avec un sens de l’humour aguerri, Cocotte rencontre <a href="https://www.youtube.com/watch?v=reI-Z8UE3lM" target="_blank">un sympathique collègue</a> au détour d’un passage dans un village sur les routes du Tour de France.',
+        ],
+        [
+            'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-sirène-pompier-rouge.svg'),
+            'picto_alt' => 'Pictogramme d\'une sirène d\'alarme pour les anecdoctes insolites pendant le Tour de France',
+            'picto_title' => 'Pictorgramme d\'une alarme',
+            'title' => 'Un pompier en tant que chauffeur d’un char Le Gaulois !',
+            'content' =>
+                'Nicolas, pompier engagé, a procédé à une intervention de secours pour une jeune caravanière Le Gaulois. Depuis, Nicolas, rebaptisé Pimpon Le Gaulois, sillonne toujours les routes de France à bord d\'un char Cocotte.',
         ],
     ];
 @endphp
-<section class="py-5" id="au-coeur-de-la-caravane">
-    <h2 class="fw-bold text-uppercase mb-5 text-center">Au cœur de la caravane Le Gaulois</h2>
+<section id="au-coeur-de-la-caravane">
+    <h2 class="fw-bold text-uppercase mb-md-5 mb-0 text-center">Au cœur de la caravane Le Gaulois</h2>
     <div class="position-relative line-border-large">
-        <div class="position-absolute left-100 w-100 start-0 z-0">
+        <div class="position-absolute left-100 w-100 d-none d-md-block start-0 z-0">
             <img class="img-fluid w-100 h-auto" src="{{ Vite::asset('resources/assets/images/page-tdf/caravane/TDF2033-caravaniers.png') }}"
                 title="Equipe des caravaniers Le Gaulois" alt="Ensemble de l'équipe des caravaniers Le Gaulois devant l'Arc de Triomphe" />
         </div>
@@ -53,10 +53,10 @@
                                     <div class="col-3 d-flex flex-column justify-content-center">
                                         <img class="w-50 mx-auto mb-2" src="{{ $a['picto_url'] }}" title="{{ $a['picto_title'] }}"
                                             alt="{{ $a['picto_alt'] }}">
-                                        <div class="fw-bold text-uppercase fs-6 text-center">{{ $a['title'] }}</div>
                                     </div>
                                     <div class="col-9">
-                                        <p class="f-bakerie-rough fs-4 fw-normal">"{!! $a['content'] !!}"</p>
+                                        <div class="fw-bold text-uppercase fs-6 text-start">{{ $a['title'] }}</div>
+                                        <p class="f-bakerie-rough fs-4 fw-normal">{!! $a['content'] !!}</p>
                                     </div>
                                 </div>
                             @endforeach
diff --git a/resources/views/components/fo/page-tdf/char-slider.blade.php b/resources/views/components/fo/page-tdf/char-slider.blade.php
index 08f66b1d..9dd0eac8 100644
--- a/resources/views/components/fo/page-tdf/char-slider.blade.php
+++ b/resources/views/components/fo/page-tdf/char-slider.blade.php
@@ -104,12 +104,12 @@
                         @endforeach
                     </div>
                 </div>
-                <button class="swiper-button swiper-button-prev-custom swiper-chars-button-prev rounded-circle z-1 border-0 bg-white">
-                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
+                <button class="swiper-button swiper-button-prev-custom swiper-chars-button-prev rounded-circle z-1 bg-secondary border-0">
+                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
                         title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
                 </button>
-                <button class="swiper-button swiper-button-next-custom swiper-chars-button-next rounded-circle z-1 border-0 bg-white">
-                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
+                <button class="swiper-button swiper-button-next-custom swiper-chars-button-next rounded-circle z-1 bg-secondary border-0">
+                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
                         title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
                 </button>
             </div>
diff --git a/resources/views/components/fo/page-tdf/game.blade.php b/resources/views/components/fo/page-tdf/game.blade.php
index 8088c2b2..4103f6ff 100644
--- a/resources/views/components/fo/page-tdf/game.blade.php
+++ b/resources/views/components/fo/page-tdf/game.blade.php
@@ -10,7 +10,10 @@
                     </div>
                     <div class="w-100 rounded-3 line-border-medium position-relative z-1 bg-white p-5 shadow">
                         <h3 class="fw-bold text-uppercase mb-2">Jouez et tentez de gagner !</h3>
-                        <p class="mb-3">Participez à notre jeu concours du <b>Tour de France 2025</b> avec Le Gaulois.</p>
+                        <p class="mb-3">Participez à notre <a class="text-decoration-underline"
+                                href="https://www.legauloistourdefrance.fr/reglement" target="_blank"><strong>jeu 100% gagnant
+                                </strong></a> Le Gaulois pendant le
+                            Tour de France 2025.</p>
                         <a class="btn btn-danger text-uppercase mb-4" href="https://www.legauloistourdefrance.fr" target="_blank">Je tente
                             ma chance
                             !</a>
@@ -20,30 +23,27 @@
                                     src="{{ Vite::asset('resources/assets/images/page-tdf/TV-home-cinéma.png') }}"
                                     title="5 Ensembles TV-Home cinéma à gagner"
                                     alt="Ensemble TV-Home cinéma à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
-                                <div>5</div>
-                                <div class="fw-bold">Ensembles TV + Home Cinema</div>
+                                <div class="fw-bold text-uppercase">Ensembles TV + Home Cinema</div>
                             </div>
                             <div class="col-4">
                                 <img class="images-100-percent mb-1"
                                     src="{{ Vite::asset('resources/assets/images/page-tdf/Casque-audios-oreilles-libres.png') }}"
                                     title="40 Casques audios oreilles libres à gagner"
                                     alt="Casques audios oreilles libres à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
-                                <div>30</div>
-                                <div class="fw-bold">Casque audio oreilles libres</div>
+                                <div class="fw-bold text-uppercase">Casque audio oreilles libres</div>
                             </div>
                             <div class="col-4">
                                 <img class="images-100-percent mb-1"
                                     src="{{ Vite::asset('resources/assets/images/page-tdf/Bons-d-achat.png') }}"
                                     title="Milliers de bons d'achats à gagner"
                                     alt=" Bons de réduction à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
-                                <div>Des milliers</div>
-                                <div class="fw-bold">Bons d'achats</div>
+                                <div class="fw-bold text-uppercase">Bons d'achats</div>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
-            <div class="col-12 col-md-6 d-flex position-relative" id="come-section">
+            <div class="col-12 col-md-6 d-flex flex-column position-relative" id="come-section">
                 <div class="ms-md-5 position-relative z-2 bg-white shadow" id="come">
                     <div class="d-flex align-items-center mb-2">
                         <div class="point-exclamation me-3">
@@ -54,13 +54,14 @@
                     </div>
                     <p class="mb-2"><b>Télécharger notre pancarte et retrouver nous sur la route&nbsp;du tour de France !</b></p>
                     <p class="mb-3">Le Tour de France est un rendez-vous immanquable qui marque le début de la pause estivale. Venez
-                        nous rejoindre au bord des routes avec votre pancarte Cocotte Le Gaulois ! Lorsque l’animateur du char
+                        nous rejoindre au bord des routes avec votre <strong>pancarte Cocotte Le Gaulois !</strong> Lorsque l’animateur du
+                        char
                         d’ouverture de la caravane, Arthur, et ses acolytes caravaniers et caravanières vous repèrent, ils vous
                         enverront des petits cadeaux.</p>
                     <p><strong>Petit conseil :</strong> En agitant fièrement votre pancarte, vous augmenterez vos chances de recevoir
                         des cadeaux !</p>
                     <div class="d-flex flex-wrap gap-3">
-                        <a class="btn btn-dark" href="{{ asset('tdf-downloads/Pancarte COULEURS(A4).png') }}" download>
+                        <a class="btn btn-dark" href="{{ asset('tdf-downloads/Pancarte.pdf') }}" download>
                             <i class="fa-solid fa-arrow-down"></i>
                             <span>Télécharger la pancarte</span>
                         </a>
@@ -70,15 +71,20 @@
                         </a>
                     </div>
                 </div>
-                <div class="img-1-wrapper line-border-small position-absolute z-1 bg-white p-2">
-                    <div class="line-border-small d-none d-md-block">
-                        <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char.jpg') }}" alt="Tour parcours">
+                <div class="ms-md-5 mt-4">
+                    <small>Crédit photo - ASO Aurélien Vialatte</small>
+                </div>
+                <div class="d-none d-md-block img-1-wrapper line-border-small position-absolute z-1 bg-white p-2">
+                    <div class="line-border-small">
+                        <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char.jpg') }}"
+                            title="Caravane Le Gaulois au mileu des supporters du Tour de France" alt="Chars de la caravane Le Gaulois">
                     </div>
                 </div>
-                <div class="img-2-wrapper line-border-small position-absolute z-1 bg-white p-2">
-                    <div class="line-border-small d-none d-md-block">
+                <div class="d-none d-md-block img-2-wrapper line-border-small position-absolute z-1 bg-white p-2">
+                    <div class="line-border-small">
                         <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char-cuisson-express.jpg') }}"
-                            alt="Tour parcours">
+                            title="Char cocotte Cuisson Express traversant un pont lors d'une étape du Tour de France"
+                            alt="Char Cuisson Express Le Gaulois">
                     </div>
                 </div>
             </div>
diff --git a/resources/views/components/fo/page-tdf/hero.blade.php b/resources/views/components/fo/page-tdf/hero.blade.php
index de09def0..c8a984bb 100644
--- a/resources/views/components/fo/page-tdf/hero.blade.php
+++ b/resources/views/components/fo/page-tdf/hero.blade.php
@@ -7,18 +7,24 @@
                 <div class="d-flex justify-content-between align-items-center mb-1">
                     <h1 class="fw-bold text-uppercase fs-1">Le Gaulois en selle pour le tour de
                         France</h1>
-                    <div class="d-flex align-items-center logo-tdf gap-2">
+                    <div class="d-flex align-items-center logo-tdf mt-md-0 mt-5 gap-2">
                         <img src="{{ Vite::asset('resources/assets/images/page-tdf/logo-gaulois-tdf.jpg') }}"
                             title="Logo volaille officielle de Le Gaulois et le Tour de France"
                             alt="Logo volaille officielle de Le Gaulois et le Tour de France">
                     </div>
                 </div>
-                <p class="w-md-75 mb-3">Le Gaulois est sponsor du Tour de France depuis 2015. Un événement populaire qui s’adresse à
-                    tous
-                    les
-                    Français.<br>Un moment convivial, fun et chaleureux que les Français apprécient devant leur télévision et sur le
-                    bord
-                    des routes de la course. Un événement au <b>bon vivre à la française</b>.</p>
+                <p class="w-md-75 mb-3">
+                    Depuis 2015, Le Gaulois est fier d’être <strong>la volaille officielle du Tour de France</strong>. Un évènement
+                    populaire marquant le début de la pause estivale qui s’adresse à tous les Français, un rendez-vous immanquable pour des
+                    milliers de passionnés aux bords des routes ou devant leur télévision. <strong>La convivialité, le partage et la bonne
+                        humeur</strong>
+                    sont au rendez-vous et c’est ce <strong>bon vivre à la française</strong> que la caravane Le Gaulois véhicule en
+                    sillonnant les routes de
+                    France chaque année. Des milliers de cadeaux sont distribués pour ravir les petits comme les plus grands. La
+                    participation à cet évènement est également l’occasion de réaffirmer auprès du public, <strong>l’engagement sur
+                        l’origine 100%
+                        française des volailles Le Gaulois !</strong>
+                </p>
                 <div class="d-flex justify-content-center flex-wrap gap-3">
                     <a class="btn btn-tertiary" href="#le-gaulois-et-le-tour-de-france">Le Gaulois et le Tour de France</a>
                     <a class="btn btn-tertiary" href="#au-coeur-de-la-caravane">Au cœur de la caravane le Gaulois</a>
diff --git a/resources/views/components/fo/page-tdf/ten-years.blade.php b/resources/views/components/fo/page-tdf/ten-years.blade.php
index 519bc2d7..f701578f 100644
--- a/resources/views/components/fo/page-tdf/ten-years.blade.php
+++ b/resources/views/components/fo/page-tdf/ten-years.blade.php
@@ -1,9 +1,10 @@
-<section class="bg-light py-5" id="le-gaulois-et-le-tour-de-france">
+<section class="bg-light pb-5" id="le-gaulois-et-le-tour-de-france">
     <div class="container">
         <h2 class="fw-bold text-uppercase mb-5 text-center">Le Gaulois et le Tour de France</h2>
         <div class="row align-items-center">
             <div class="col-md-6">
-                <h3 class="fw-bold mb-4">Le Gaulois et le Tour : <span class="text-danger">10 années de complicité avec le public</span>
+                <h3 class="fw-bold mb-4">Le Gaulois et le Tour : Plus de 10 années <span class="text-danger"> de complicité avec le
+                        public</span>
                 </h3>
                 <p class="fs-5"><strong>Les chars « Cocottes » sont devenus emblématiques de la caravane du Tour de France.</strong>
                     <strong>Dix-huit
@@ -28,8 +29,8 @@
                 </p>
             </div>
             <div class="col-md-6 text-center">
-                <div class="line-border-medium position-relative bg-white p-2">
-                    <div class="position-relative d-inline-block line-border-medium w-100 ten-year-video-height">
+                <div class="position-relative bg-white p-2 shadow">
+                    <div class="ratio ratio-16x9 position-relative d-inline-block line-border-small w-100">
                         @if (\App\Rules\IsValidYoutubeId::validates('hY0WPbkf4Ow'))
                             <div class="video-inlaid h-100" type="youtube"
                                 href="https://www.youtube.com/embed/hY0WPbkf4Ow?autoplay=0&loop=1">
diff --git a/resources/views/components/fo/page-tdf/testimonials.blade.php b/resources/views/components/fo/page-tdf/testimonials.blade.php
index ecc2cf3e..0c13fbca 100644
--- a/resources/views/components/fo/page-tdf/testimonials.blade.php
+++ b/resources/views/components/fo/page-tdf/testimonials.blade.php
@@ -7,7 +7,7 @@
             'anecdote' =>
                 'Nous cherchions un cri de guerre pour se motiver pour les étapes. Après avoir trouvé celui-ci, je ne sais pas pourquoi j’ai conclu par un cri de coq ! Résultat : celui est resté jusqu\'à la fin du tour et même plus, il est passé au JT 19/20 sur France 3 Rhône-Alpes Auvergne',
             'adventure' =>
-                'Cette année, je l’avoue, ce fût le meilleur de tous, grâce une équipe hyper soudée, bosseuse et jamais fatiguée.',
+                'Cette année 2023, je l’avoue, ce fût le meilleur de tous, grâce une équipe hyper soudée, bosseuse et jamais fatiguée.',
             'img_url' => Vite::asset(
                 'resources/assets/images/page-tdf/testimonials/Nicolas-Joly-caravanier-Le-Gaulois-Etienne-Coudret.jpg',
             ),
@@ -48,7 +48,7 @@
         ],
         [
             'name' => 'Justine',
-            'alias' => 'Ca percute !',
+            'alias' => 'Ça percute !',
             'sign' => 'La floflo de Florence Foresti',
             'anecdote' => "
             Comme scène marquante, je dirais le nombre de spectateurs sur la route nous regardant comme des « stars ». Je n'ai pas de scène drôle en particulier dans ma tête, mais tous les soirs au « cul du camion » comme nous le disons, un debrief avec rigolade et humour avec toute l’équipe est organisé.",
@@ -67,7 +67,7 @@
         <h2 class="fw-bold text-uppercase mb-5 text-center">Les témoignages des caravaniers</h2>
         <div class="d-flex justify-content-center mb-5 flex-wrap gap-4" id="swiper-anecdote-tdf-badges">
             @foreach ($slides as $index => $slide)
-                <button class="btn text-uppercase fs-5 fw-medium px-4 py-1 text-black shadow-none" data-slide-index="{{ $index }}">
+                <button class="btn text-uppercase fs-5 fw-medium text-secondary px-4 py-1 shadow-none" data-slide-index="{{ $index }}">
                     {{ $slide['name'] }}
                 </button>
             @endforeach
@@ -107,20 +107,28 @@
                                     </div>
                                 </div>
                                 <div class="rounded-3 position-relative line-border-large bg-white p-5">
-                                    <div>Le conseil de <b>{{ $slide['name'] }}</b><br />{{ $slide['advice'] }}</div>
+                                    <div>
+                                        <p class="text-uppercase">
+                                            <strong>Le conseil de <span class="mb-0 bg-black px-3 py-1 text-white">
+                                                    {{ $slide['name'] }}</span></strong>
+                                            <br />
+                                            <br />
+                                        </p>
+                                        {{ $slide['advice'] }}
+                                    </div>
                                 </div>
                             </div>
                         @endforeach
                     </div>
                 </div>
                 <button
-                    class="swiper-button swiper-button-prev-custom swiper-anecdote-tdf-button-prev rounded-circle z-1 border-0 bg-white">
-                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
+                    class="swiper-button swiper-button-prev-custom swiper-anecdote-tdf-button-prev rounded-circle z-1 bg-secondary border-0">
+                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
                         title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
                 </button>
                 <button
-                    class="swiper-button swiper-button-next-custom swiper-anecdote-tdf-button-next rounded-circle z-1 border-0 bg-white">
-                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
+                    class="swiper-button swiper-button-next-custom swiper-anecdote-tdf-button-next rounded-circle z-1 bg-secondary border-0">
+                    <img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
                         title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
                 </button>
             </div>
@@ -148,10 +156,10 @@
                 function updateActiveBadge(activeIndex) {
                     badgeButtons.forEach((button, index) => {
                         if (index === activeIndex) {
-                            button.classList.remove('text-black');
+                            button.classList.remove('text-secondary');
                             button.classList.add('btn-primary', 'text-white');
                         } else {
-                            button.classList.add('text-black');
+                            button.classList.add('text-secondary');
                             button.classList.remove('btn-primary', 'text-white');
                         }
                     });