ajout des page RGPD
This commit is contained in:
SarTron-NorthBlue
278
app/rgpd/page.tsx
Normal file
278
app/rgpd/page.tsx
Normal file
@@ -0,0 +1,278 @@
|
||||
'use client'
|
||||
|
||||
import { motion } from 'framer-motion'
|
||||
import { Shield, CheckCircle, FileCheck, AlertCircle } from 'lucide-react'
|
||||
import BackgroundAnimations from '@/components/BackgroundAnimations'
|
||||
|
||||
export default function RGPD() {
|
||||
return (
|
||||
<section className="section-padding bg-security-dark relative overflow-hidden min-h-screen pt-32">
|
||||
<BackgroundAnimations variant="gradient" />
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="max-w-4xl mx-auto"
|
||||
>
|
||||
{/* Header */}
|
||||
<div className="text-center mb-12">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.8 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
transition={{ delay: 0.2 }}
|
||||
className="inline-flex items-center justify-center w-20 h-20 bg-security-accent/10 border border-security-accent/30 rounded-2xl mb-6"
|
||||
>
|
||||
<FileCheck className="w-10 h-10 text-security-accent" />
|
||||
</motion.div>
|
||||
<h1 className="text-5xl md:text-6xl font-black mb-6 text-white">
|
||||
Conformité <span className="gradient-text">RGPD</span>
|
||||
</h1>
|
||||
<p className="text-xl text-gray-400">
|
||||
Notre engagement en matière de protection des données personnelles
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className="card-dark p-8 md:p-10 rounded-3xl space-y-8">
|
||||
<section>
|
||||
<p className="text-gray-300 leading-relaxed mb-6">
|
||||
NorthBlue, exploitant le site runlock.re, s'engage à respecter le Règlement Général sur la Protection des Données (RGPD)
|
||||
entré en vigueur le 25 mai 2018. Cette page détaille nos pratiques et notre conformité à cette réglementation.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<CheckCircle className="w-6 h-6 text-security-accent" />
|
||||
<span>1. Responsable du traitement</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed space-y-2">
|
||||
<p><strong className="text-white">Responsable :</strong> NorthBlue</p>
|
||||
<p><strong className="text-white">Email :</strong> <a href="mailto:contact@runlock.re" className="text-security-accent hover:underline">contact@runlock.re</a></p>
|
||||
<p><strong className="text-white">Téléphone :</strong> <a href="tel:0693511558" className="text-security-accent hover:underline">0693 51 15 58</a></p>
|
||||
<p><strong className="text-white">Localisation :</strong> La Réunion (974)</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<Shield className="w-6 h-6 text-security-accent" />
|
||||
<span>2. Données collectées et finalités</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed space-y-3">
|
||||
<p>Nous collectons et traitons les données suivantes :</p>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2">Données de contact</h3>
|
||||
<ul className="list-disc list-inside ml-4 space-y-1 text-sm">
|
||||
<li>Nom et prénom</li>
|
||||
<li>Adresse email</li>
|
||||
<li>Numéro de téléphone (optionnel)</li>
|
||||
<li>Nom de l'entreprise (optionnel)</li>
|
||||
</ul>
|
||||
<p className="text-sm mt-2 text-gray-400">
|
||||
<strong>Finalité :</strong> Répondre à vos demandes et vous contacter concernant nos services
|
||||
</p>
|
||||
<p className="text-sm text-gray-400">
|
||||
<strong>Base légale :</strong> Consentement et intérêt légitime
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2">Données de navigation</h3>
|
||||
<ul className="list-disc list-inside ml-4 space-y-1 text-sm">
|
||||
<li>Adresse IP (anonymisée)</li>
|
||||
<li>Cookies techniques</li>
|
||||
<li>Données de connexion</li>
|
||||
</ul>
|
||||
<p className="text-sm mt-2 text-gray-400">
|
||||
<strong>Finalité :</strong> Assurer le bon fonctionnement du site et améliorer l'expérience utilisateur
|
||||
</p>
|
||||
<p className="text-sm text-gray-400">
|
||||
<strong>Base légale :</strong> Intérêt légitime
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<Shield className="w-6 h-6 text-security-accent" />
|
||||
<span>3. Durée de conservation</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed space-y-2">
|
||||
<p>Les données personnelles sont conservées pour les durées suivantes :</p>
|
||||
<ul className="list-disc list-inside ml-4 space-y-1">
|
||||
<li><strong className="text-white">Données de contact :</strong> 3 ans à compter du dernier contact</li>
|
||||
<li><strong className="text-white">Données de navigation :</strong> 13 mois maximum</li>
|
||||
<li><strong className="text-white">Données liées aux cookies :</strong> 13 mois maximum</li>
|
||||
</ul>
|
||||
<p className="mt-2">
|
||||
Au-delà de ces durées, les données sont supprimées ou anonymisées.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<CheckCircle className="w-6 h-6 text-security-accent" />
|
||||
<span>4. Vos droits RGPD</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed space-y-3">
|
||||
<p>Conformément au RGPD, vous disposez des droits suivants :</p>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit d'accès</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez obtenir une copie de vos données personnelles que nous détenons.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit de rectification</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez corriger vos données inexactes ou incomplètes.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit à l'effacement</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez demander la suppression de vos données personnelles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit d'opposition</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez vous opposer au traitement de vos données.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit à la portabilité</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez récupérer vos données dans un format structuré.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-card p-4 rounded-xl border border-security-border">
|
||||
<h3 className="text-white font-semibold mb-2 flex items-center space-x-2">
|
||||
<CheckCircle className="w-5 h-5 text-security-accent" />
|
||||
<span>Droit de limitation</span>
|
||||
</h3>
|
||||
<p className="text-sm text-gray-400">
|
||||
Vous pouvez demander la limitation du traitement de vos données.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-security-accent/10 border border-security-accent/30 p-4 rounded-xl mt-4">
|
||||
<p className="text-sm text-gray-300">
|
||||
<strong className="text-white">Pour exercer vos droits :</strong> Envoyez une demande à
|
||||
<a href="mailto:contact@runlock.re" className="text-security-accent hover:underline ml-1">contact@runlock.re</a>.
|
||||
Nous vous répondrons dans un délai d'un mois maximum.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<Shield className="w-6 h-6 text-security-accent" />
|
||||
<span>5. Transfert de données</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed">
|
||||
<p>
|
||||
Vos données personnelles sont stockées et traitées au sein de l'Union Européenne.
|
||||
Nous ne transférons pas vos données vers des pays tiers en dehors de l'UE sans garanties appropriées.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<AlertCircle className="w-6 h-6 text-security-accent" />
|
||||
<span>6. Réclamation</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed">
|
||||
<p>
|
||||
Si vous estimez que le traitement de vos données personnelles constitue une violation du RGPD,
|
||||
vous avez le droit d'introduire une réclamation auprès de la Commission Nationale de l'Informatique
|
||||
et des Libertés (CNIL) :
|
||||
</p>
|
||||
<ul className="list-disc list-inside mt-2 space-y-1 ml-4">
|
||||
<li>CNIL - 3 Place de Fontenoy - TSA 80715 - 75334 Paris Cedex 07</li>
|
||||
<li>Téléphone : 01 53 73 22 22</li>
|
||||
<li>Site web : <a href="https://www.cnil.fr" target="_blank" rel="noopener noreferrer" className="text-security-accent hover:underline">www.cnil.fr</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<Shield className="w-6 h-6 text-security-accent" />
|
||||
<span>7. Sécurité des données</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed space-y-2">
|
||||
<p>
|
||||
NorthBlue met en œuvre des mesures techniques et organisationnelles appropriées pour protéger
|
||||
vos données personnelles contre la perte, l'utilisation abusive, l'accès non autorisé,
|
||||
la divulgation, l'altération ou la destruction.
|
||||
</p>
|
||||
<p>
|
||||
Ces mesures incluent notamment :
|
||||
</p>
|
||||
<ul className="list-disc list-inside ml-4 space-y-1">
|
||||
<li>Chiffrement des données sensibles</li>
|
||||
<li>Accès restreint aux données personnelles</li>
|
||||
<li>Sauvegardes régulières</li>
|
||||
<li>Formation du personnel aux bonnes pratiques de sécurité</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 className="text-2xl font-bold text-white mb-4 flex items-center space-x-2">
|
||||
<Shield className="w-6 h-6 text-security-accent" />
|
||||
<span>8. Contact</span>
|
||||
</h2>
|
||||
<div className="text-gray-300 leading-relaxed">
|
||||
<p>
|
||||
Pour toute question concernant le traitement de vos données personnelles ou pour exercer vos droits RGPD,
|
||||
contactez-nous :
|
||||
</p>
|
||||
<ul className="list-disc list-inside mt-2 space-y-1 ml-4">
|
||||
<li>Par email : <a href="mailto:contact@runlock.re" className="text-security-accent hover:underline">contact@runlock.re</a></li>
|
||||
<li>Par téléphone : <a href="tel:0693511558" className="text-security-accent hover:underline">0693 51 15 58</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div className="pt-6 border-t border-security-border text-sm text-gray-400">
|
||||
<p>Dernière mise à jour : {new Date().toLocaleDateString('fr-FR', { year: 'numeric', month: 'long', day: 'numeric' })}</p>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user