{extends file="views/layout.tpl"}

{block name="title" append} - Mentions légales{/block}

{block name="h2"}Mentions légales{/block}
{block name="p"}Informations légales et politique de confidentialité{/block}

{block name="date_maj"}
	<p class="text-muted small mb-0">
		<i class="fas fa-calendar-alt me-2" aria-hidden="true"></i>
		Dernière mise à jour : <time datetime="2026-02-20">20 février 2026</time>
	</p>
{/block}

{block name="js_footer" append}
	<script>
	{literal}
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function (e) {
                e.preventDefault();
                const target = document.querySelector(this.getAttribute('href'));
                if (target) {
                    target.scrollIntoView({
                        behavior: 'smooth',
                        block: 'start'
                    });
                    target.focus();
                }
            });
        });
	{/literal}
    </script>
{/block}

{block name="content"}
<section aria-label="Mentions légales">
	<h2 class="visually-hidden">Mentions légales</h2>

	<div class="row g-5">
		<div class="col-md-12">

			<!-- Table des matières -->
			<nav class="table-of-contents" aria-labelledby="toc-heading">
				<h3 id="toc-heading" class="h5 mb-3">
					<i class="fas fa-list me-2" aria-hidden="true"></i>
					Sommaire
				</h3>
				<ul class="list-unstyled ms-3">
					<li class="mb-2"><a href="#editeur">1. Éditeur du site</a></li>
					<li class="mb-2"><a href="#hebergeur">2. Hébergement</a></li>
					<li class="mb-2"><a href="#propriete">3. Propriété intellectuelle</a></li>
					<li class="mb-2"><a href="#rgpd">4. Protection des données personnelles (RGPD)</a></li>
					<li class="mb-2"><a href="#cookies">5. Cookies</a></li>
					<li class="mb-2"><a href="#responsabilite">6. Limitation de responsabilité</a></li>
					<li class="mb-2"><a href="#liens">7. Liens hypertextes</a></li>
					<li class="mb-2"><a href="#droit">8. Droit applicable</a></li>
				</ul>
			</nav>

			<!-- Section 1 : Éditeur -->
			<section id="editeur" class="legal-section" aria-labelledby="editeur-heading">
				<h3 id="editeur-heading" class="h4">
					<i class="fas fa-building me-2 text-primary" aria-hidden="true"></i>
					1. Éditeur du site
				</h3>

				<p class="text-muted">
					FOLLIOW est un <strong>projet pédagogique</strong> réalisé dans le cadre d’un exercice de formation.					
				</p>

				<dl class="row">
					<dt class="col-sm-3">Nom du projet</dt>
					<dd class="col-sm-9">FOLLIOW</dd>

					<dt class="col-sm-3">Nature</dt>
					<dd class="col-sm-9">Projet scolaire / démonstration technique</dd>

					<dt class="col-sm-3">Établissement</dt>
					<dd class="col-sm-9">FOLLIOW</dd>

					<dt class="col-sm-3">Forme juridique</dt>
					<dd class="col-sm-9">Non applicable (projet pédagogique)</dd>

					<dt class="col-sm-3">Capital social</dt>
					<dd class="col-sm-9">Non applicable</dd>

					<dt class="col-sm-3">Adresse</dt>
					<dd class="col-sm-9">4 Rue du Rhin, 68000 Colmar</dd>

					<dt class="col-sm-3">Téléphone</dt>
					<dd class="col-sm-9">03 68 67 20 00</dd>

					<dt class="col-sm-3">Email</dt>
					<dd class="col-sm-9">
						<a href="mailto:projet.folliow@hotmail.com">projet.folliow@hotmail.com</a>
					</dd>

					<dt class="col-sm-3">Directeur de publication</dt>
					<dd class="col-sm-9">L’équipe du projet FOLLIOW</dd>

					<dt class="col-sm-3">SIRET</dt>
					<dd class="col-sm-9">Non applicable (projet scolaire)</dd>
				</dl>
			</section>

			<!-- Section 2 : Hébergeur -->
			<section id="hebergeur" class="legal-section" aria-labelledby="hebergeur-heading">
				<h3 id="hebergeur-heading" class="h4">
					<i class="fas fa-server me-2 text-primary" aria-hidden="true"></i>
					2. Hébergement
				</h3>

				<p>Le site est hébergé sur une infrastructure pédagogique mise à disposition pour le projet :</p>

				<dl class="row">
					<dt class="col-sm-3">Hébergeur</dt>
					<dd class="col-sm-9">OVH<dd>

					<dt class="col-sm-3">Domaine / accès</dt>
					<dd class="col-sm-9">php.boulayoune.com</dd>

					<dt class="col-sm-3">Adresse</dt>
					<dd class="col-sm-9">4 Rue du Rhin, 68000 Colmar</dd>

					<dt class="col-sm-3">Téléphone</dt>
					<dd class="col-sm-9">03 68 67 20 00</dd>
				</dl>
			</section>

			<!-- Section 3 : Propriété intellectuelle -->
			<section id="propriete" class="legal-section" aria-labelledby="propriete-heading">
				<h3 id="propriete-heading" class="h4">
					<i class="fas fa-copyright me-2 text-primary" aria-hidden="true"></i>
					3. Propriété intellectuelle
				</h3>
				<p>
					Sauf mention contraire, l’ensemble des contenus présents sur FOLLIOW (textes, visuels, logo, éléments d’interface)
					est utilisé dans le cadre du projet et reste la propriété de leurs auteurs respectifs.
				</p>
				<p>
					Toute reproduction ou réutilisation à des fins commerciales est interdite sans autorisation préalable.
				</p>
				<p>
					Les éventuels contenus tiers (images, icônes, bibliothèques) restent soumis à leurs licences d’origine.
				</p>
			</section>

			<!-- Section 4 : RGPD -->
			<section id="rgpd" class="legal-section" aria-labelledby="rgpd-heading">
				<h3 id="rgpd-heading" class="h4">
					<i class="fas fa-shield-alt me-2 text-primary" aria-hidden="true"></i>
					4. Protection des données personnelles (RGPD)
				</h3>

				<h4 class="h5 mt-4">4.1 Responsable du traitement</h4>
				<p>
					Le responsable du traitement est l’équipe du projet FOLLIOW (projet pédagogique).
				</p>

				<h4 class="h5 mt-4">4.2 Données collectées</h4>
				<p>Selon l’utilisation du site, les données pouvant être collectées sont :</p>
				<ul>
					<li>Nom / Prenom <li>
					<li>Pseudo </li>					
					<li>Adresse email (inscription, connexion, partage de projet par email)</li>
					<li>Contenus déposés par l’utilisateur (projets, descriptions, images)</li>
					<li>Données techniques minimales (logs de sécurité, adresse IP) à des fins de protection et de diagnostic</li>
				</ul>

				<h4 class="h5 mt-4">4.3 Finalités du traitement</h4>
				<ul>
					<li>Création et gestion de compte</li>
					<li>Publication et affichage de projets</li>
					<li>Partage d’un projet par email à la demande de l’utilisateur</li>
					<li>Sécurisation du site et prévention des abus</li>
				</ul>

				<h4 class="h5 mt-4">4.4 Durée de conservation</h4>
				<p>
					Dans le cadre de ce projet pédagogique, les données sont conservées pendant la durée du projet et des évaluations,
					puis supprimées ou anonymisées, sauf obligation légale contraire.
				</p>

				<h4 class="h5 mt-4">4.5 Vos droits</h4>
				<p>Conformément au RGPD, vous disposez de droits d’accès, de rectification, d’effacement et d’opposition.</p>
				<p>
					Pour exercer ces droits, contactez-nous à :
					<a href="mailto:projet.folliow@hotmail.com">projet.folliow@hotmail.com</a>
				</p>
				<p>
					Vous pouvez également introduire une réclamation auprès de la CNIL
					(<a href="https://www.cnil.fr" target="_blank" rel="noopener">www.cnil.fr</a>).
				</p>
			</section>

			<!-- Section 5 : Cookies -->
			<section id="cookies" class="legal-section" aria-labelledby="cookies-heading">
				<h3 id="cookies-heading" class="h4">
					<i class="fas fa-cookie-bite me-2 text-primary" aria-hidden="true"></i>
					5. Cookies
				</h3>

				<p>
					FOLLIOW peut utiliser des cookies <strong>strictement nécessaires</strong> au fonctionnement du site
					(ex : session de connexion). Aucun cookie publicitaire n’est utilisé.
				</p>

				<h4 class="h5 mt-4">5.1 Qu’est-ce qu’un cookie ?</h4>
				<p>
					Un cookie est un petit fichier texte déposé sur votre appareil lors de la visite d’un site.
					Il permet notamment de conserver une session ou des préférences.
				</p>

				<h4 class="h5 mt-4">5.2 Types de cookies utilisés</h4>
				<ul>
					<li><strong>Cookies techniques</strong> : indispensables (session, sécurité)</li>
					<li><strong>Cookies de préférence</strong> : éventuels (langue, affichage) si implémentés</li>
				</ul>

				<h4 class="h5 mt-4">5.3 Gestion des cookies</h4>
				<p>
					Vous pouvez configurer votre navigateur pour refuser les cookies. Certaines fonctionnalités du site
					peuvent alors ne pas fonctionner correctement.
				</p>
			</section>

			<!-- Section 6 : Limitation de responsabilité -->
			<section id="responsabilite" class="legal-section" aria-labelledby="responsabilite-heading">
				<h3 id="responsabilite-heading" class="h4">
					<i class="fas fa-exclamation-triangle me-2 text-primary" aria-hidden="true"></i>
					6. Limitation de responsabilité
				</h3>
				<p>
					Les informations présentées sur FOLLIOW sont fournies à titre démonstratif dans le cadre d’un projet pédagogique.
					L’équipe s’efforce de maintenir le site accessible, sans garantie d’absence d’erreurs ou d’interruptions.
				</p>
				<p>
					L’équipe FOLLIOW ne pourra être tenue responsable des dommages directs ou indirects résultant de l’utilisation du site,
					notamment en cas d’indisponibilité ou de perte de données.
				</p>
			</section>

			<!-- Section 7 : Liens hypertextes -->
			<section id="liens" class="legal-section" aria-labelledby="liens-heading">
				<h3 id="liens-heading" class="h4">
					<i class="fas fa-link me-2 text-primary" aria-hidden="true"></i>
					7. Liens hypertextes
				</h3>
				<p>
					Le site peut contenir des liens vers des sites tiers. FOLLIOW n’exerce aucun contrôle sur ces sites et décline toute
					responsabilité quant à leur contenu ou leur disponibilité.
				</p>
			</section>

			<!-- Section 8 : Droit applicable -->
			<section id="droit" class="legal-section" aria-labelledby="droit-heading">
				<h3 id="droit-heading" class="h4">
					<i class="fas fa-gavel me-2 text-primary" aria-hidden="true"></i>
					8. Droit applicable et juridiction compétente
				</h3>
				<p>
					Les présentes mentions légales sont régies par le droit français. En cas de litige, et à défaut d’accord amiable,
					les tribunaux français seront seuls compétents.
				</p>
			</section>

			<!-- Contact -->
			<section class="mt-5 p-4 bg-light rounded" aria-labelledby="contact-legal">
				<h3 id="contact-legal" class="h4 mb-3">
					<i class="fas fa-envelope me-2 text-primary" aria-hidden="true"></i>
					Questions ou réclamations
				</h3>
				<p>
					Pour toute question concernant ces mentions légales ou pour exercer vos droits, vous pouvez nous contacter :
				</p>
				<ul class="list-unstyled">
					<li class="mb-2">
						<i class="fas fa-envelope me-2" aria-hidden="true"></i>
						Par email : <a href="mailto:projet.folliow@hotmail.com">projet.folliow@hotmail.com</a>
					</li>
					
				</ul>
			</section>

		</div>
	</div>
</section>
{/block}
