```

✨ feat(newsletter): Ajoute l'inscription et la désinscription à la newsletter
```

templates/base.twig

@@ -178,6 +178,17 @@
             {# SOCIAL & STRIPE #}
             <div class="space-y-6">
                 <h3 class="text-3xl font-black uppercase tracking-tighter italic border-b-4 border-gray-900 inline-block">{{ 'footer_follow_us_title'|trans }}</h3>
+                <div class="bg-white border-4 border-gray-900 p-4 shadow-[6px_6px_0px_rgba(0,0,0,1)]">
+                    <p class="text-xs font-black uppercase mb-2 tracking-widest">{{ 'newsletter.title'|trans }}</p>
+                    <form action="{{ path('app_newsletter') }}" method="POST" class="flex flex-col gap-2">
+                        <input required type="email" name="email" placeholder="email@e-cosplay.fr"
+                               class="border-2 border-gray-900 p-2 text-xs font-bold uppercase focus:bg-pink-100 outline-none">
+                        <button type="submit"
+                                class="bg-indigo-600 text-white border-2 border-gray-900 py-2 px-4 text-xs font-black uppercase hover:bg-black hover:shadow-none shadow-[2px_2px_0px_rgba(0,0,0,1)] transition-all active:translate-x-1 active:translate-y-1">
+                            {{ 'newsletter.subscribe'|trans }}
+                        </button>
+                    </form>
+                </div>
                 <div class="flex gap-4">
                     <a href="https://www.facebook.com/assocationecosplay" class="w-12 h-12 border-4 border-gray-900 flex items-center justify-center hover:bg-white transition-all"><i class="fab fa-facebook-f text-xl"></i></a>
                     <a href="https://www.instagram.com/asso_ecosplay/" class="w-12 h-12 border-4 border-gray-900 flex items-center justify-center hover:bg-white transition-all"><i class="fab fa-instagram text-xl"></i></a>

templates/mails/base.twig

@@ -22,7 +22,6 @@
         {# Section d'en-tête #}
         <mj-section background-color="#ffffff" padding-bottom="0px">
             <mj-column>
-                {# Logo mis à jour pour SARL SITECONSEIL #}
                 <mj-image src="{{ system.path }}{{ asset('assets/images/logo.jpg') }}" alt="Logo E-COSPLAY" align="center" width="150px" padding-bottom="20px"></mj-image>
             </mj-column>
         </mj-section>

templates/mails/newsletter-valiate.twig

@@ -0,0 +1,54 @@
+{% extends 'mails/base.twig' %}
+
+{% block subject %}
+    🚀 Valide ton inscription à la newsletter E-Cosplay !
+{% endblock %}
+
+{% block content %}
+    <mj-section background-color="#ffffff" padding-top="20px">
+        <mj-column width="100%">
+            {# Titre Impact #}
+            <mj-text font-size="28px" color="#1A1A1A" font-weight="900" align="center" font-style="italic" text-transform="uppercase">
+                Presque fini !
+            </mj-text>
+            <mj-divider border-color="#fabf04" border-width="4px" width="60px"></mj-divider>
+        </mj-column>
+    </mj-section>
+
+    <mj-section background-color="#ffffff" padding-top="0px">
+        <mj-column width="90%" border="3px solid #111827" background-color="#fbfbfb" padding="20px">
+            <mj-text font-size="16px" color="#111827" line-height="24px" align="center">
+                Merci de vouloir rejoindre la communauté <strong>E-Cosplay</strong> !
+            </mj-text>
+            <mj-text font-size="15px" color="#444444" line-height="22px" align="center">
+                Pour confirmer que c'est bien toi et commencer à recevoir nos actualités, évènements et projets, clique sur le bouton "BOMBE" ci-dessous :
+            </mj-text>
+
+            {# Bouton Action Brutaliste #}
+            <mj-button href="{{ datas.confirmationUrl }}" background-color="#4f46e5" color="#ffffff" font-size="18px" font-weight="900" border="3px solid #111827" inner-padding="15px 30px" border-radius="0px" text-transform="uppercase" padding-top="20px">
+                Confirmer mon inscription
+            </mj-button>
+
+            <mj-text font-size="12px" color="#ec4899" align="center" font-weight="bold" padding-top="15px">
+                Si tu n'es pas à l'origine de cette demande, ignore simplement cet email.
+            </mj-text>
+        </mj-column>
+    </mj-section>
+
+    <mj-section background-color="#ffffff" padding-top="20px">
+        <mj-column width="100%">
+            <mj-text font-size="13px" color="#888888" align="center" line-height="18px">
+                Si le bouton ne fonctionne pas, copie et colle ce lien dans ton navigateur :<br>
+                <a href="{{ datas.confirmationUrl }}" style="color: #4f46e5;">{{ datas.confirmationUrl }}</a>
+            </mj-text>
+        </mj-column>
+    </mj-section>
+
+    <mj-section padding-top="20px">
+        <mj-column width="100%">
+            <mj-text font-size="11px" color="#999999" align="center">
+                <a href="{{ datas.unsubscribeUrl }}" style="color: #999999;">Se désinscrire</a>
+            </mj-text>
+        </mj-column>
+    </mj-section>
+{% endblock %}

templates/newsletter.twig

@@ -0,0 +1,47 @@
+{% extends 'base.twig' %}
+
+{% block title %}{{'newsletter_confirme_register'|trans}}{% endblock %}
+{% block meta_description %}{{'newsletter_confirme_register'|trans}}{% endblock %}
+
+{% block canonical_url %}
+    <link rel="canonical" href="{{ url('app_newsletter') }}" />
+{% endblock %}
+
+{% block body %}
+    <div class="bg-white min-h-[70vh] flex items-center justify-center py-20">
+        <div class="container mx-auto px-6 max-w-2xl text-center">
+
+            {# --- CARTE DE CONFIRMATION STYLE NEUBRUTALISTE --- #}
+            <div class="bg-white border-8 border-gray-900 p-10 md:p-16 shadow-[20px_20px_0px_0px_rgba(79,70,229,1)] transform -rotate-1">
+
+                {# Icône Email #}
+                <div class="text-7xl mb-6 transform rotate-6 inline-block text-pink-500">
+                    <i class="fas fa-envelope-open-text"></i>
+                </div>
+
+                <h1 class="text-4xl md:text-6xl font-black uppercase italic mb-6 tracking-tighter leading-none text-gray-900">
+                    {{ 'newsletter.confirm_page.header'|trans }}
+                </h1>
+
+                <div class="w-24 h-4 bg-yellow-400 mx-auto mb-8 border-2 border-gray-900"></div>
+
+                <p class="text-xl md:text-2xl font-bold text-gray-800 mb-10 leading-relaxed uppercase">
+                    {{ 'newsletter.confirm_page.message'|trans }}
+                </p>
+
+                {# Info supplémentaire #}
+                <div class="bg-gray-100 p-4 border-4 border-gray-900 border-dashed mb-10">
+                    <p class="text-xs font-black uppercase tracking-widest text-gray-600">
+                        {{ 'newsletter.confirm_page.spam_hint'|trans }}
+                    </p>
+                </div>
+
+                {# Bouton retour #}
+                <a href="{{ path('app_home') }}" class="inline-block px-10 py-4 bg-indigo-600 text-white border-4 border-gray-900 font-black uppercase hover:bg-black transition-all shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] active:shadow-none active:translate-x-1 active:translate-y-1">
+                    {{ 'newsletter.confirm_page.back_home'|trans }}
+                </a>
+            </div>
+
+        </div>
+    </div>
+{% endblock %}

templates/newsletter_confirmed.twig

@@ -0,0 +1,49 @@
+{% extends 'base.twig' %}
+
+{% block title %}{{ 'newsletter.success.title'|trans|default('Inscription validée !') }}{% endblock %}
+
+{% block body %}
+    <div class="bg-white min-h-[70vh] flex items-center justify-center py-20 px-4">
+        <div class="container mx-auto max-w-2xl text-center">
+
+            {# --- CARTE DE SUCCÈS STYLE NEUBRUTALISTE --- #}
+            <div class="bg-white border-8 border-gray-900 p-10 md:p-16 shadow-[20px_20px_0px_0px_#fabf04] transform rotate-2">
+
+                {# Icône Succès #}
+                <div class="text-7xl mb-6 inline-block animate-bounce">
+                    🎉
+                </div>
+
+                <h1 class="text-4xl md:text-6xl font-black uppercase italic mb-6 tracking-tighter leading-none text-gray-900">
+                    {{ 'newsletter.success.header'|trans }}
+                </h1>
+
+                <div class="w-full h-2 bg-indigo-600 mb-8 border-2 border-gray-900"></div>
+
+                <p class="text-xl md:text-2xl font-bold text-gray-800 mb-10 leading-relaxed uppercase">
+                    {{ 'newsletter.success.message'|trans }}
+                </p>
+
+                {# Bloc Info Fun #}
+                <div class="bg-pink-500 text-white p-4 border-4 border-gray-900 shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] mb-10">
+                    <p class="text-sm font-black uppercase tracking-widest">
+                        {{ 'newsletter.success.hint'|trans }}
+                    </p>
+                </div>
+
+                {# Bouton Retour #}
+                <a href="{{ path('app_home') }}"
+                   class="inline-block px-10 py-4 bg-gray-900 text-white border-4 border-gray-900 font-black uppercase hover:bg-indigo-600 transition-all shadow-[6px_6px_0px_0px_#fabf04] active:shadow-none active:translate-x-1 active:translate-y-1">
+                    {{ 'newsletter.success.back_button'|trans }}
+                </a>
+            </div>
+
+            {# Déco de fond style comics #}
+            <div class="mt-12 flex justify-center gap-2 opacity-20">
+                <div class="w-4 h-4 bg-indigo-600 rounded-full"></div>
+                <div class="w-4 h-4 bg-pink-500 rounded-full"></div>
+                <div class="w-4 h-4 bg-yellow-400 rounded-full"></div>
+            </div>
+        </div>
+    </div>
+{% endblock %}

templates/newsletter_remove.twig

@@ -0,0 +1,44 @@
+{% extends 'base.twig' %}
+
+{% block title %}{{ 'newsletter.unsubscribe.title'|trans|default('Désinscription réussie') }}{% endblock %}
+
+{% block body %}
+    <div class="bg-white min-h-[70vh] flex items-center justify-center py-20 px-4">
+        <div class="container mx-auto max-w-2xl">
+
+            {# --- CARTE DE DÉSINSCRIPTION STYLE BRUTALISTE --- #}
+            <div class="bg-white border-8 border-gray-900 p-10 md:p-16 shadow-[20px_20px_0px_0px_rgba(236,72,153,1)] transform rotate-1">
+
+                {# Icône Bye Bye #}
+                <div class="text-7xl mb-6 transform -rotate-12 inline-block">
+                    👋
+                </div>
+
+                <h1 class="text-4xl md:text-5xl font-black uppercase italic mb-6 tracking-tighter leading-none text-gray-900">
+                    {{ 'newsletter.unsubscribe.header'|trans }}
+                </h1>
+
+                {# Ligne de séparation jaune #}
+                <div class="w-32 h-4 bg-yellow-400 mb-8 border-2 border-gray-900"></div>
+
+                <p class="text-xl md:text-2xl font-bold text-gray-800 mb-10 leading-relaxed uppercase">
+                    {{ 'newsletter.unsubscribe.message'|trans }}
+                </p>
+
+                {# Message de regret stylisé #}
+                <div class="bg-gray-100 p-6 border-4 border-gray-900 border-dashed mb-10">
+                    <p class="text-sm font-black uppercase tracking-widest text-gray-600">
+                        {{ 'newsletter.unsubscribe.footer'|trans }}
+                    </p>
+                </div>
+
+                {# Bouton retour avec effet de mouvement #}
+                <a href="{{ path('app_home') }}"
+                   class="inline-block px-10 py-4 bg-indigo-600 text-white border-4 border-gray-900 font-black uppercase hover:bg-black transition-all shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] active:shadow-none active:translate-x-1 active:translate-y-1">
+                    {{ 'newsletter.unsubscribe.back_button'|trans }}
+                </a>
+            </div>
+
+        </div>
+    </div>
+{% endblock %}

templates/txt-mails/newsletter-valiate.twig

@@ -0,0 +1,26 @@
+{% extends 'txt-mails/base.twig' %}
+
+{% block subject %}
+    🚀 Valide ton inscription à la newsletter E-Cosplay !
+{% endblock %}
+
+{% block content %}
+    PRESQUE FINI !
+    ==============
+
+    Merci de vouloir rejoindre la communauté E-Cosplay !
+
+    Pour confirmer que c'est bien toi et commencer à recevoir nos actualités,
+    événements et projets, merci de valider ton inscription en copiant
+    le lien suivant dans ton navigateur :
+
+    LIEN DE CONFIRMATION :
+    {{ datas.confirmationUrl }}
+
+    ----------------------------------------------------------
+    Si tu n'es pas à l'origine de cette demande,
+    ignore simplement cet email. Ton adresse ne sera pas conservée.
+    ----------------------------------------------------------
+    Pour ne plus recevoir d'invitations :
+    {{ datas.unsubscribeUrl }}
+{% endblock %}