ludikevent_crm/templates/revervation/legal.twig

{% extends 'revervation/base.twig' %}

{% block title %}Mentions Légales | Ludik Event - Transparence & Cadre Légal{% endblock %}
{% block description %}Consultez les mentions légales de Ludik Event : informations sur l'éditeur, l'hébergement du site et la protection de vos données personnelles.{% endblock %}

{% block breadcrumb_json %}
    ,{
    "@type": "ListItem",
    "position": 1,
    "name": "Mentions Légal",
    "item": "{{ url('reservation_mentions-legal') }}"
    }
{% endblock %}
{% block body %}
    <div class="py-16 px-4 sm:px-6 lg:px-8 bg-gray-50/50">
        <div class="max-w-6xl mx-auto space-y-10">

            {# --- EN-TÊTE PRINCIPAL --- #}
            <div class="bg-white border-2 border-gray-100 p-12 rounded-[2.5rem] text-center shadow-xl shadow-gray-200/50 relative overflow-hidden">
                <div class="absolute -top-10 -right-10 w-40 h-40 bg-blue-50 rounded-full blur-3xl"></div>
                <h1 class="text-4xl md:text-6xl font-black text-gray-900 uppercase tracking-tighter italic relative z-10">
                    Mentions <span class="text-blue-600">Légales</span>
                </h1>
                {# Correction : text-gray-500 -> text-gray-600 #}
                <p class="mt-4 text-gray-600 font-bold uppercase tracking-widest text-xs relative z-10">Informations obligatoires & Protection des données</p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-12 gap-8">

                {# 1. Informations Légales #}
                <div class="md:col-span-12 lg:col-span-7 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40 group hover:border-blue-200 transition-all duration-300">
                    <div class="flex items-center gap-4 mb-8">
                        <div class="w-14 h-14 rounded-2xl bg-blue-600 text-white flex items-center justify-center font-black text-xl shadow-lg shadow-blue-200 transition-transform group-hover:scale-110">ID</div>
                        <h2 class="text-2xl font-black uppercase tracking-tight text-gray-900">Informations Légales</h2>
                    </div>

                    {# Correction : text-gray-600 -> text-gray-700 #}
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-8 text-sm font-medium text-gray-700">
                        <div class="space-y-4">
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Nom de la Société</span><strong class="text-gray-900 text-lg">SEGARD LILIAN - LUDIKEVENT</strong></p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Adresse</span>6, rue du Château 02800 DANIZY</p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Tél.</span><span class="text-gray-900 font-bold">06 14 17 24 47</span></p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Capital social</span>Entrepreneur individuel</p>
                        </div>
                        <div class="space-y-4">
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">SIRET</span>93048840800012</p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">RCS</span>930488408</p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">TVA Intracommunautaire</span>FR12930488408</p>
                            <p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Responsable publication</span>SEGARD Lilian</p>
                        </div>
                    </div>
                    <div class="mt-10 pt-8 border-t border-gray-100 flex flex-wrap gap-4">
                        {# Correction : text-blue-600 -> text-blue-700 #}
                        <a href="mailto:lilian@ludikevent.fr" class="bg-blue-50 text-blue-700 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">lilian@ludikevent.fr</a>
                        <a href="mailto:guillaume@ludikevent.fr" class="bg-blue-50 text-blue-700 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">guillaume@ludikevent.fr</a>
                    </div>
                </div>

                {# 2. Description des services - CORRECTION : bg-amber-600 pour contraste blanc #}
                <div class="md:col-span-12 lg:col-span-5 bg-amber-600 p-10 rounded-[2.5rem] shadow-xl shadow-amber-200/50 text-white relative overflow-hidden group">
                    <div class="relative z-10 h-full flex flex-col">
                        <h2 class="text-2xl font-black uppercase tracking-tight mb-6">Description des services fournis</h2>
                        <div class="space-y-4 text-sm font-medium leading-relaxed">
                            <p>Le site {{ app.request.host }} a pour objet de proposer des prestations de location de structures gonflables, de jeux d’extérieurs, de Barnum et de tous matériels.</p>
                            <p>Le propriétaire du site s’efforce de fournir sur le site {{ app.request.host }} des informations aussi précises que possible. Toutefois, il ne pourra être tenue responsable des omissions, des inexactitudes et des carences dans la mise à jour, qu’elles soient de son fait ou du fait des tiers partenaires qui lui fournissent ces informations.</p>
                            <p>Toutes les informations proposées sur le site {{ app.request.host }} sont données à titre indicatif, sont non exhaustives, et sont susceptibles d’évoluer. Elles sont données sous réserve de modifications ayant été apportées depuis leur mise en ligne.</p>
                        </div>
                    </div>
                    <div class="absolute -bottom-10 -right-10 w-40 h-40 bg-white/10 rounded-full blur-2xl group-hover:scale-150 transition-transform duration-700"></div>
                </div>

                {# 3. Propriété intellectuelle #}
                <div class="md:col-span-12 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40">
                    <div class="flex flex-col md:flex-row gap-8">
                        <div class="flex-shrink-0 w-20 h-20 bg-gray-900 text-white rounded-[1.8rem] flex items-center justify-center font-black text-3xl">©</div>
                        <div class="space-y-4">
                            <h2 class="text-2xl font-black uppercase tracking-tight text-gray-900">Propriété intellectuelle et contrefaçons</h2>
                            {# Correction : text-gray-500 -> text-gray-700 #}
                            <div class="text-sm text-gray-700 font-medium leading-relaxed space-y-4">
                                <p>Le propriétaire du site est propriétaire des droits de propriété intellectuelle ou détient les droits d’usage sur tous les éléments accessibles sur le site, notamment les textes, images, graphismes, logo, icônes, sons, logiciels…</p>
                                <p>Toute reproduction, représentation, modification, publication, adaptation totale ou partielle des éléments du site, quel que soit le moyen ou le procédé utilisé, est interdite, sauf autorisation écrite préalable par le propriétaire du site et les ayants droits.</p>
                                <p>Toute exploitation non autorisée du site ou de l’un quelconque de ces éléments qu’il contient sera considérée comme constitutive d’une contrefaçon et poursuivie conformément aux dispositions des articles L.335-2 et suivants du Code de Propriété Intellectuelle.</p>
                            </div>
                        </div>
                    </div>
                </div>

                {# 4. Liens & Cookies #}
                <div class="md:col-span-12 lg:col-span-6 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40">
                    <h2 class="text-2xl font-black uppercase tracking-tight text-gray-900 mb-6">Liens hypertextes et cookies</h2>
                    {# Correction : text-gray-500 -> text-gray-700 #}
                    <div class="text-sm text-gray-700 font-medium space-y-4 leading-relaxed">
                        <p>Le site {{ app.request.host }} contient un certain nombre de liens hypertextes vers d’autres sites (partenaires, informations …) mis en place avec l’autorisation du propriétaire du site. Cependant, le propriétaire du site n’a pas la possibilité de vérifier le contenu des sites ainsi visités et déclinons donc toute responsabilité de ce fait quant aux risques éventuels de contenus illicites.</p>
                        <div class="p-6 bg-blue-50/50 rounded-3xl border-2 border-blue-100 space-y-4 mt-4 text-justify">
                            <p>L’utilisateur est informé que lors de ses visites sur le site {{ app.request.host }}, un ou des cookies sont susceptible de s’installer automatiquement sur son ordinateur. Les données ainsi obtenues visent à faciliter la navigation ultérieure sur le site, et ont également vocation à permettre diverses mesures de fréquentation.</p>
                            {# Correction : text-blue-800 -> text-blue-900 #}
                            <p class="font-bold text-blue-900 italic text-xs">Le paramétrage du logiciel de navigation permet d’informer de la présence de cookie et éventuellement, de refuser. Le refus d’installation d’un cookie peut entraîner l’impossibilité d’accéder à certains services.</p>
                        </div>
                    </div>
                </div>

                {# 5. Protection des données personnelles - CORRECTION : bg-blue-700 pour contraste blanc #}
                <div class="md:col-span-12 lg:col-span-6 bg-blue-700 p-10 rounded-[2.5rem] shadow-xl shadow-blue-200 text-white relative">
                    <h2 class="text-2xl font-black uppercase tracking-tight mb-6 italic text-blue-100">Données personnelles</h2>
                    <div class="text-sm font-medium leading-relaxed space-y-4">
                        <p>Le propriétaire du site ne collecte des informations personnelles relatives à l’utilisateur que pour le besoin de certains services proposés par le site {{ app.request.host }}. L’utilisateur fournit ces informations en toute connaissance de cause, notamment lorsqu’il procède par lui-même à leur saisie lors d’une prise de contact par formulaire ou demande de devis.</p>
                        {# Correction : bg-white/10 -> bg-black/20 pour lisibilité texte #}
                        <div class="bg-black/20 p-6 rounded-3xl space-y-3">
                            <p class="italic">Conformément aux textes en vigueur, tout utilisateur dispose d’un droit d’accès, de rectification, de suppression et d’opposition. Pour l’exercer, adressez votre demande par email : <span class="font-bold underline">lilian@ludikevent.fr</span>.</p>
                        </div>
                        <p>Aucune information personnelle de l’utilisateur du site {{ app.request.host }} n’est publiée à l’insu de l’utilisateur, échangée, transférée, cédée ou vendue sur un support quelconque à des tiers.</p>
                    </div>
                </div>

                {# 6. Textes de loi & Lexique #}
                <div class="md:col-span-12 lg:col-span-8 bg-slate-100 border-2 border-slate-200 p-10 rounded-[2.5rem] text-slate-700">
                    {# Correction : text-blue-600 -> text-blue-700 #}
                    <h2 class="text-xl font-black uppercase text-blue-700 mb-6 tracking-tight">Textes de loi applicables</h2>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
                        <ul class="text-[11px] font-bold space-y-3 uppercase tracking-wider">
                            <li>▪ Loi n° 78-17 du 6 janvier 1978</li>
                            <li>▪ Loi n° 2004-801 du 6 août 2004</li>
                            <li>▪ L’article L. 226-13 du Code pénal</li>
                            <li>▪ Loi n° 2004-575 du 21 juin 2004 (LCEN)</li>
                            <li>▪ Règlement Général sur la Protection des Données (RGPD)</li>
                        </ul>
                        <div class="bg-white/50 p-6 rounded-3xl">
                            {# Correction : text-slate-400 -> text-slate-600 #}
                            <p class="text-[10px] uppercase font-black text-slate-600 mb-2 tracking-widest">Lexique</p>
                            <p class="text-xs"><strong>Utilisateur :</strong> Internaute utilisant le site.</p>
                            <p class="text-xs mt-1"><strong>Informations personnelles :</strong> Permettent l’identification des personnes physiques (Art. 4 Loi 78-17).</p>
                        </div>
                    </div>
                </div>

                {# 7. Juridiction #}
                <div class="md:col-span-12 lg:col-span-4 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40 flex flex-col justify-center text-center">
                    {# Correction : text-gray-400 -> text-gray-600 #}
                    <h2 class="text-xs font-black uppercase tracking-widest text-gray-600 mb-4">Droit & Juridiction</h2>
                    <p class="text-sm font-black text-gray-900 leading-relaxed italic mb-4">
                        Tout litige en relation avec l’utilisation du site {{ app.request.host }} est soumis au droit français.
                    </p>
                    {# Correction : text-gray-500 -> text-gray-600 #}
                    <p class="text-xs font-bold text-gray-600 uppercase tracking-tighter">Attribution exclusive de juridiction :<br>
                        {# Correction : text-blue-600 -> text-blue-700 #}
                        <span class="text-2xl text-blue-700 font-black block mt-2">Saint-Quentin</span>
                    </p>
                </div>

            </div>

            <div class="text-center pt-8">
                {# Correction : text-gray-300 -> text-gray-500 #}
                <p class="text-[10px] font-black uppercase tracking-[0.5em] text-gray-500">© {{ "now"|date("Y") }} {{ app.request.host|upper }} • LUDIKEVENT</p>
            </div>
        </div>
    </div>
{% endblock %}