// Privacy.jsx — politique de confidentialité, on ivory background
const PRIVACY_UPDATED = "17 octobre 2026";
const PRIVACY_EMAIL = "contact@agencejmd.com";
const PRIVACY_ADDRESS = "agence JMD, 9 rue Gasparin, 69002 Lyon, France";

const PRIVACY_SECTIONS = [
  {
    title: "Le cadre",
    body: [
      "Cette politique couvre le site agencejmd.com, les échanges par email et par téléphone, la prospection commerciale et la relation avec nos clients et partenaires.",
      "Elle s'appuie sur le Règlement général sur la protection des données (RGPD, règlement UE 2016/679) et sur la loi Informatique et Libertés du 6 janvier 1978 modifiée.",
      "Elle dit quelles données nous collectons, pourquoi, avec qui elles circulent, combien de temps nous les gardons, et ce que vous pouvez exiger.",
    ],
  },
  {
    title: "Responsable du traitement",
    body: [
      "agence JMD, représentée par sa fondatrice et directrice de création, Jeanne Mejean.",
      "L'agence n'est pas tenue de désigner un délégué à la protection des données. Toute question vous met donc en contact direct avec la responsable.",
    ],
    table: {
      cols: ["", ""],
      rows: [
        ["Adresse", "9 rue Gasparin, 69002 Lyon, France"],
        ["Email", PRIVACY_EMAIL],
        ["Téléphone", "07 88 18 25 63"],
      ],
    },
  },
  {
    title: "Données collectées",
    body: [
      "Nous collectons le strict nécessaire à chaque usage. Aucune donnée sensible (santé, opinions politiques ou religieuses, orientation sexuelle) n'est demandée ni traitée.",
    ],
    table: {
      cols: ["Contexte", "Données", "Origine"],
      rows: [
        ["Formulaire de contact", "Nom, prénom, email, téléphone, entreprise, fonction, message", "Vous"],
        ["Inscription à la Reading room", "Adresse email", "Vous"],
        ["Échanges par email et téléphone", "Identité, coordonnées, contenu des échanges, pièces jointes", "Vous"],
        ["Prospection B2B", "Nom, prénom, fonction, entreprise, email professionnel, profil professionnel public, réactions à nos emails (ouverture, clic, réponse)", "Sources publiques (LinkedIn, sites d'entreprise) et bases de données B2B"],
        ["Clients et partenaires", "Coordonnées, données contractuelles et de facturation, contenus et accès confiés pour la mission", "Vous, dans le cadre du contrat"],
        ["Visite du site", "Adresse IP, type d'appareil et de navigateur, pages demandées", "Collecte technique automatique par l'hébergeur"],
      ],
    },
  },
  {
    title: "Finalités et bases légales",
    body: [
      "Chaque traitement repose sur l'une des bases prévues à l'article 6 du RGPD.",
    ],
    table: {
      cols: ["Finalité", "Base légale"],
      rows: [
        ["Répondre aux demandes de contact et de devis", "Mesures précontractuelles (art. 6.1.b)"],
        ["Conduire les missions, gérer le contrat et la facturation", "Exécution du contrat (art. 6.1.b) et obligations comptables (art. 6.1.c)"],
        ["Prospecter des professionnels, contactés au titre de leur fonction", "Intérêt légitime (art. 6.1.f), avec un droit d'opposition à tout moment"],
        ["Envoyer la Reading room et les actualités de l'agence", "Consentement (art. 6.1.a), retirable à tout moment"],
        ["Assurer la sécurité du site", "Intérêt légitime (art. 6.1.f)"],
        ["Traiter les demandes d'exercice de droits et les litiges", "Obligation légale (art. 6.1.c) et intérêt légitime (art. 6.1.f)"],
      ],
    },
  },
  {
    title: "Destinataires et sous-traitants",
    body: [
      "Vos données sont accessibles à l'agence et aux collaborateurs ou indépendants qu'elle habilite, dans la limite de leur mission. Elles ne sont jamais vendues ni cédées à des fins commerciales.",
      "Certains prestataires techniques les traitent pour notre compte et sur nos instructions, en qualité de sous-traitants (article 28 du RGPD).",
    ],
    table: {
      cols: ["Usage", "Prestataire", "Localisation"],
      rows: [
        ["Hébergement du site", "Vercel", "États-Unis"],
        ["Réception du formulaire de contact", "Formspree", "États-Unis"],
        ["Messagerie, agenda, documents", "Google", "Union européenne et États-Unis"],
        ["Prospection par email", "lemlist", "France"],
        ["Gestion de projet", "Notion", "États-Unis"],
        ["Programmation des publications", "Metricool", "Espagne"],
      ],
    },
    after: [
      "Tout transfert hors de l'Union européenne est encadré par une décision d'adéquation de la Commission européenne (notamment le Data Privacy Framework pour les prestataires américains certifiés) ou par ses clauses contractuelles types.",
      "Vos données peuvent aussi être communiquées aux autorités administratives ou judiciaires lorsque la loi l'impose.",
    ],
  },
  {
    title: "Durées de conservation",
    body: [
      "Une donnée est gardée le temps de son usage, puis supprimée ou archivée selon les recommandations de la CNIL.",
    ],
    table: {
      cols: ["Données", "Durée"],
      rows: [
        ["Demandes de contact sans suite", "3 ans après le dernier échange"],
        ["Prospects B2B", "3 ans après le dernier contact. Suppression immédiate en cas d'opposition"],
        ["Clients et contrats", "Durée de la relation, puis 5 ans d'archivage (prescription civile)"],
        ["Factures et pièces comptables", "10 ans (obligation légale)"],
        ["Abonnés à la Reading room", "Jusqu'au désabonnement, ou 3 ans après le dernier contact"],
        ["Journaux techniques", "1 an au plus"],
        ["Demandes d'exercice de droits", "6 ans. 1 an pour un éventuel justificatif d'identité"],
      ],
    },
  },
  {
    title: "Cookies",
    body: [
      "Le site ne dépose aucun cookie publicitaire et n'utilise aucun outil de mesure d'audience. C'est pourquoi aucun bandeau ne vous est présenté.",
      "Si cela change, cette page sera mise à jour avant la mise en place, et votre consentement sera demandé pour tout traceur qui l'exige. Vous pouvez à tout moment bloquer ou supprimer les cookies depuis votre navigateur.",
    ],
  },
  {
    title: "Vos droits",
    body: [
      "Les articles 15 à 22 du RGPD et la loi Informatique et Libertés vous donnent les droits suivants.",
    ],
    table: {
      cols: ["Droit", "Ce qu'il permet"],
      rows: [
        ["Accès", "Savoir si vos données sont traitées et en obtenir une copie"],
        ["Rectification", "Corriger une donnée inexacte ou incomplète"],
        ["Effacement", "Obtenir la suppression de vos données, dans les limites prévues par la loi"],
        ["Limitation", "Geler temporairement un traitement"],
        ["Opposition", "Refuser un traitement fondé sur l'intérêt légitime, dont la prospection, sans avoir à vous justifier"],
        ["Portabilité", "Recevoir les données que vous avez fournies dans un format structuré et lisible par machine"],
        ["Retrait du consentement", "À tout moment, sans effet sur les traitements passés"],
        ["Directives post mortem", "Décider du sort de vos données après votre décès"],
      ],
    },
    after: [
      `Pour les exercer, écrivez à ${PRIVACY_EMAIL} ou par courrier à ${PRIVACY_ADDRESS}. Chaque email de prospection contient aussi un lien de désinscription.`,
      "Nous répondons sous un mois, délai prolongeable de deux mois pour une demande complexe. En cas de doute raisonnable sur votre identité, un justificatif peut être demandé.",
      "Si vous estimez que vos droits ne sont pas respectés, vous pouvez saisir la CNIL : cnil.fr, 3 place de Fontenoy, TSA 80715, 75334 Paris Cedex 07.",
    ],
  },
  {
    title: "Sécurité",
    body: [
      "Accès limité aux seules personnes habilitées. Double authentification sur les outils de travail. Échanges chiffrés (HTTPS). Prestataires choisis pour leurs garanties RGPD.",
      "En cas de violation de données présentant un risque pour vos droits, la CNIL est notifiée sous 72 heures. Si le risque est élevé, vous êtes prévenu directement.",
    ],
  },
  {
    title: "Mises à jour",
    body: [
      "Cette politique évolue avec nos outils, nos traitements et la réglementation. La date de la version en vigueur figure en haut de page. Un changement substantiel vous est signalé par email ou sur le site.",
      `Une question sur cette politique ou sur vos données : ${PRIVACY_EMAIL}.`,
    ],
  },
];

const Privacy = () => {
  const fontFamily = '"Helvetica Neue", Helvetica, Arial, sans-serif';
  const label = { fontSize: 12, letterSpacing: ".22em", textTransform: "uppercase", opacity: .55, fontWeight: 700 };
  const para = { fontSize: 18, lineHeight: 1.6, margin: "0 0 18px", maxWidth: 760 };
  const cell = { padding: "16px 24px 16px 0", verticalAlign: "top", borderBottom: "1px solid rgba(10,10,10,.14)", fontSize: 16, lineHeight: 1.5, textAlign: "left" };

  return (
    <main style={{ fontFamily, color: "#0A0A0A", background: "#EDE8D8", paddingTop: 76 }}>
      <section style={{ padding: "160px 56px 80px" }}>
        <div style={{ maxWidth: 1600, margin: "0 auto" }}>
          <div style={{ ...label, marginBottom: 28 }}>Version du {PRIVACY_UPDATED}</div>
          <h1 style={{ fontSize: "clamp(56px, 7vw, 120px)", lineHeight: .95, letterSpacing: "-0.025em", fontWeight: 700, margin: 0 }}>
            Politique de <i>confidentialité.</i>
          </h1>
          <p style={{ fontSize: "clamp(22px, 1.8vw, 28px)", lineHeight: 1.4, fontStyle: "italic", maxWidth: 760, margin: "40px 0 0" }}>
            Vos données servent à vous répondre, à travailler avec vous, à vous écrire si vous l'avez demandé. Rien d'autre.
          </p>
        </div>
      </section>

      <section className="privacy-body" style={{ padding: "0 56px 180px" }}>
        <div style={{ maxWidth: 1600, margin: "0 auto" }}>
          {PRIVACY_SECTIONS.map((s, i) => (
            <div key={s.title} className="privacy-row" style={{
              display: "grid", gridTemplateColumns: "minmax(200px, 1fr) 2.4fr", gap: 56,
              padding: "56px 0", borderTop: "1px solid rgba(10,10,10,.2)",
            }}>
              <div>
                <div style={{ ...label, marginBottom: 12 }}>{String(i + 1).padStart(2, "0")}</div>
                <h2 style={{ fontSize: 28, lineHeight: 1.15, fontWeight: 700, letterSpacing: "-0.005em", margin: 0 }}>{s.title}</h2>
              </div>
              <div>
                {s.body.map((p, j) => <p key={j} style={para}>{p}</p>)}
                {s.table && (
                  <div style={{ overflowX: "auto", margin: "12px 0 24px" }}>
                    <table style={{ width: "100%", borderCollapse: "collapse", borderTop: "1px solid rgba(10,10,10,.14)" }}>
                      {s.table.cols.some(Boolean) && (
                        <thead>
                          <tr>{s.table.cols.map((c, k) => <th key={k} style={{ ...cell, ...label, fontSize: 11 }}>{c}</th>)}</tr>
                        </thead>
                      )}
                      <tbody>
                        {s.table.rows.map((r, k) => (
                          <tr key={k}>
                            {r.map((v, m) => <td key={m} style={{ ...cell, fontWeight: m === 0 ? 700 : 400 }}>{v}</td>)}
                          </tr>
                        ))}
                      </tbody>
                    </table>
                  </div>
                )}
                {(s.after || []).map((p, j) => <p key={j} style={para}>{p}</p>)}
              </div>
            </div>
          ))}
        </div>
      </section>
    </main>
  );
};
window.Privacy = Privacy;
