// 404 + LEGAL pages (FR)
const { useState, useEffect } = React;
const { Link } = window;

function NotFound() {
  const [pos, setPos] = useState({ x: 50, y: 50 });
  useEffect(() => {
    const onMove = (e) => setPos({ x: (e.clientX / window.innerWidth) * 100, y: (e.clientY / window.innerHeight) * 100 });
    window.addEventListener("mousemove", onMove);
    return () => window.removeEventListener("mousemove", onMove);
  }, []);
  return (
    <main className="page-enter" style={{ minHeight: "100vh", display: "flex", flexDirection: "column" }}>
      <section style={{ flex: 1, padding: "140px 0 100px", position: "relative", overflow: "hidden" }}>
        <div className="page" style={{ position: "relative" }}>
          <div className="eyebrow">↳ Erreur · 404</div>
          <h1 className="serif" style={{
            fontSize: "clamp(96px, 18vw, 360px)", lineHeight: 0.86,
            letterSpacing: "-0.04em", marginTop: 28,
            transform: `translate(${(pos.x - 50) * 0.05}px, ${(pos.y - 50) * 0.05}px)`, transition: "transform .12s linear",
          }}>
            Page<br/>
            <span style={{ color: "var(--acid-deep)", fontStyle: "italic" }}>introuvable.</span><br/>
            <span style={{ color: "var(--ink)", opacity: 0.5 }}>— mais nous, on vous a retrouvé.</span>
          </h1>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 60, marginTop: 80, alignItems: "end" }}>
            <p className="body-lg" style={{ maxWidth: 540 }}>
              Nous restructurons ce site chaque trimestre. Parfois, une URL est retirée avant que nous ayons mis à jour le lien qui pointait dessus. Si vous êtes arrivé ici depuis une page du site, <Link to="/contact" className="ilink">prévenez-nous</Link> — nous corrigeons dans la semaine.
            </p>
            <div>
              <div className="lx-label" style={{ marginBottom: 14 }}>↳ Essayez plutôt l'une de ces pages</div>
              <ul style={{ listStyle: "none", display: "flex", flexDirection: "column", gap: 10 }}>
                {[
                  ["/", "Accueil"],
                  ["/work", "Réalisations"],
                  ["/services", "Nos pratiques"],
                  ["/platform", "La plateforme"],
                  ["/journal", "Le journal"],
                  ["/contact", "Contact"],
                ].map(([h, t]) => (
                  <li key={h}><Link to={h} className="ilink serif" style={{ fontSize: 22 }}>{t} →</Link></li>
                ))}
              </ul>
            </div>
          </div>
          {/* Coordinates ghost */}
          <div style={{ position: "absolute", right: 0, top: 60 }}>
            <div className="mono" style={{ color: "var(--muted)", textAlign: "right" }}>
              REQUEST · {window.location.hash}<br/>
              STATUS · 404 NOT FOUND<br/>
              X · {pos.x.toFixed(1)} · Y · {pos.y.toFixed(1)}<br/>
              ROUTED TO · /404
            </div>
          </div>
        </div>
      </section>
    </main>
  );
}

// LEGAL
function Legal({ kind = "privacy" }) {
  const docs = {
    privacy: {
      title: "Confidentialité",
      sub: "Ce que nous collectons, ce que nous en faisons, ce que nous ne ferons jamais.",
      sections: [
        ["La version courte", "Nous collectons le strict minimum nécessaire pour faire fonctionner notre activité : vos e-mails lorsque vous nous écrivez, vos données de compte lorsque vous utilisez la plateforme, des statistiques anonymes sur ce site. Nous ne vendons jamais rien. Nous n'utilisons pas de traqueurs publicitaires. Nous n'enrichissons pas votre e-mail avec des données tierces. Cette page est la version longue de ce paragraphe."],
        ["Données collectées", "Sur clyvonna.com : statistiques de pages vues anonymes (Plausible auto-hébergé). Sur app.clyvonna.com : e-mail, nom, société, coordonnées de facturation, données importées via vos intégrations, et télémétrie opérationnelle (logs, rapports d'erreurs) pour maintenir le produit en état de marche."],
        ["Finalités du traitement", "Exécuter le contrat (fournir le service SaaS et les prestations d'agence). Vous envoyer des e-mails transactionnels liés au produit (désactivables). Vous envoyer notre newsletter (uniquement sur demande explicite). Mener trimestriellement une recherche client par e-mail auprès d'un petit échantillon, avec votre consentement."],
        ["Base légale (Art. 6 RGPD)", "Exécution du contrat (a. 6.1.b) pour la fourniture du service. Consentement (a. 6.1.a) pour la newsletter et la recherche client. Intérêt légitime (a. 6.1.f) pour la sécurité, la lutte contre la fraude et la télémétrie opérationnelle. Obligation légale (a. 6.1.c) pour la conservation des pièces comptables."],
        ["Durées de conservation", "Données de compte : pendant toute la durée du contrat, puis supprimées sous 30 jours après résiliation. Pièces de facturation : 10 ans (obligation comptable US/FR). Logs techniques : 12 mois maximum. E-mails prospects sans achat : 3 ans à compter du dernier contact actif."],
        ["Vos droits", "Vous disposez d'un droit d'accès, de rectification, d'effacement, d'opposition, de portabilité et de limitation du traitement de vos données personnelles. Vous pouvez exercer ces droits en écrivant à contact@clyvonna.com ; nous répondons sous 30 jours maximum."],
        ["Sous-traitants", "Stripe, Inc. (paiements, US — DPF certifié). Amazon Web Services (hébergement, régions us-east-1 et eu-west-1 — DPF certifié). Postmark / AWS SES (e-mails transactionnels). Plausible Analytics (statistiques anonymes auto-hébergées, UE). Chaque sous-traitant est lié par un Data Processing Agreement (DPA)."],
        ["Transferts hors UE", "Certaines données peuvent être transférées vers les États-Unis (CLYVONNA LLC, AWS US, Stripe). Ces transferts sont encadrés par : (i) le EU-US Data Privacy Framework (DPF) auquel adhèrent Stripe et AWS, et/ou (ii) les Clauses Contractuelles Types (CCT) de la Commission européenne du 4 juin 2021."],
        ["Hébergement et sécurité", "Hébergement par défaut sur AWS us-east-1. Option de résidence UE (Frankfurt + Dublin) disponible sur demande contractuelle. Chiffrement au repos (AES-256) et en transit (TLS 1.3). Conformité SOC 2 Type II depuis 2023."],
        ["Suppression de vos données", "Écrivez à contact@clyvonna.com. Nous exportons l'intégralité de vos données et les supprimons sous 14 jours. Aucun formulaire à remplir."],
        ["Réclamation auprès de la CNIL", "Si vous estimez que vos droits ne sont pas respectés, vous pouvez introduire une réclamation auprès de la Commission Nationale de l'Informatique et des Libertés (CNIL) : 3 Place de Fontenoy, 75007 Paris, ou via cnil.fr."],
        ["Contact DPO", "Notre point de contact pour toute question relative à la protection des données : contact@clyvonna.com. Réponse humaine garantie sous 5 jours ouvrés."],
      ],
    },
    terms: {
      title: "Conditions générales",
      sub: "Ce que vous acceptez en utilisant Clyvonna.",
      sections: [
        ["Définitions", "« Clyvonna » désigne CLYVONNA LLC, société immatriculée dans l'État de l'Iowa (États-Unis), dont le siège est situé 5249 North Park Place NE, place 5945, Cedar Rapids, IA 52402, USA. « Service » désigne la plateforme SaaS accessible sur app.clyvonna.com ainsi que les prestations d'agence associées. « Client » désigne toute personne physique ou morale ayant souscrit au Service. « Utilisateur » désigne toute personne accédant au Service."],
        ["Acceptation", "L'utilisation du Service implique l'acceptation pleine et entière des présentes Conditions générales. Si vous n'acceptez pas ces conditions, n'utilisez pas le Service. Pour les Clients professionnels (B2B), l'acceptation vaut signature électronique au sens du droit applicable."],
        ["Description du Service", "Clyvonna fournit (i) une plateforme SaaS hébergée et (ii) des prestations de studio marketing (stratégie, design, production de contenu). Le niveau de disponibilité visé est de 99,9 % ; le taux réel est publié dans notre trust report (lien en pied de page)."],
        ["Souscription et facturation", "Le Service est facturé selon le plan choisi (mensuel ou annuel), prélevé par Stripe. Les prix sont indiqués hors taxes ; la TVA applicable est ajoutée au moment du paiement selon le pays de facturation. Tout retard de paiement supérieur à 15 jours peut entraîner la suspension du Service après mise en demeure restée infructueuse."],
        ["Résiliation", "Chaque partie peut résilier le contrat avec un préavis de 30 jours. Nous remboursons la part non utilisée d'une période prépayée selon les modalités prévues dans la Politique de remboursement."],
        ["Renvois", "Les présentes Conditions sont complétées par : la Politique de remboursement (/legal/refund), la Politique d'usage acceptable (/legal/aup), la Politique de confidentialité (/legal/privacy) et la Politique de cookies (/legal/cookies). Ces documents font partie intégrante du contrat."],
        ["Propriété intellectuelle", "Le Client conserve la pleine propriété de ses données et de ses contenus. Clyvonna conserve la pleine propriété de la plateforme, du code source, des marques, designs, et de toute amélioration générique apportée au Service. Une licence d'usage non exclusive, non transférable, est concédée au Client pendant la durée du contrat."],
        ["Données du Client", "Le Client est et reste propriétaire de ses données. Clyvonna agit en tant que sous-traitant au sens du RGPD pour le traitement de ces données. En cas de résiliation, l'export complet est fourni et la suppression intervient sous 30 jours."],
        ["Limitation de responsabilité", "Dans toute la mesure permise par le droit applicable, la responsabilité totale cumulée de Clyvonna est plafonnée aux sommes effectivement payées par le Client au cours des 12 derniers mois précédant le fait générateur. Clyvonna ne saurait être tenue responsable des dommages indirects (perte d'exploitation, perte de chance, perte de données imputable au Client). Cette limitation ne s'applique pas en cas de faute lourde, dol, ou atteinte à la vie ou à l'intégrité physique."],
        ["Indemnisation", "Le Client s'engage à indemniser Clyvonna de toute réclamation tierce résultant d'une utilisation du Service en violation des présentes Conditions ou de la Politique d'usage acceptable, notamment en cas de contenu illicite mis en ligne par le Client."],
        ["Force majeure", "Aucune partie n'est responsable d'un manquement résultant d'un cas de force majeure au sens de l'article 1218 du Code civil français ou de la jurisprudence applicable dans l'Iowa."],
        ["Droit applicable", "Pour les Clients professionnels (B2B), les présentes Conditions sont régies par le droit de l'État de l'Iowa, États-Unis. Pour les Clients consommateurs résidant en France ou dans l'Union européenne, les dispositions impératives du droit français de la consommation (notamment Code de la consommation) et du RGPD demeurent applicables."],
        ["Juridiction", "Pour les litiges B2B, compétence exclusive des tribunaux de Cedar Rapids, Iowa (USA). Pour les Clients consommateurs français, le consommateur peut saisir, au choix, la juridiction de son domicile en France conformément à l'article R. 631-3 du Code de la consommation."],
        ["Modifications", "Clyvonna peut modifier les présentes Conditions. Toute modification substantielle est notifiée par e-mail au moins 30 jours avant son entrée en vigueur. La poursuite de l'utilisation du Service vaut acceptation des nouvelles Conditions."],
      ],
    },
    cookies: {
      title: "Politique de cookies",
      sub: "Nous utilisons le strict minimum de cookies nécessaires.",
      sections: [
        ["Sur clyvonna.com", "Nous n'utilisons aucun cookie tiers à des fins publicitaires ou de tracking. Un seul cookie première partie est déposé : `__clv_consent` pour mémoriser que vous avez fermé le bandeau cookies. Pas de pixel Facebook. Pas de Google Analytics. Pas de remarketing."],
        ["Sur app.clyvonna.com", "Cookies de session (`__clv_session`) pour vous maintenir connecté. Cookie CSRF (`__clv_csrf`) à des fins de sécurité. Cookie de préférences (`__clv_prefs`) pour vos paramètres d'interface. Tous première partie. Tous strictement nécessaires au fonctionnement du Service."],
        ["Aucun cookie publicitaire sans consentement", "Conformément à l'article 82 de la loi Informatique et Libertés et aux recommandations de la CNIL, aucun cookie non strictement nécessaire n'est déposé sans votre consentement préalable, libre, éclairé et univoque. Comme nous n'utilisons aucun cookie publicitaire ou de tracking tiers, aucun consentement n'est requis pour les cookies listés ci-dessus."],
        ["Durée de conservation", "Cookies de session : durée de la session navigateur. Cookie CSRF : 24 heures. Cookie de préférences : 12 mois. Cookie de consentement bandeau : 6 mois."],
        ["Comment refuser ou supprimer", "Vous pouvez configurer votre navigateur (Chrome, Firefox, Safari, Edge) pour bloquer ou supprimer les cookies. Le blocage des cookies strictement nécessaires peut empêcher le bon fonctionnement du Service."],
        ["Pourquoi nous procédons ainsi", "Le produit lui-même nous fournit plus qu'assez de données opérationnelles. L'écosystème publicitaire du web n'est pas pour nous. Nous ne sommes pas rémunérés par des audiences similaires."],
      ],
    },
    refund: {
      title: "Politique de remboursement",
      sub: "Annulation, remboursement, délais — sans manœuvre de rétention.",
      sections: [
        ["Garantie satisfait ou remboursé — 14 jours", "Pour toute première souscription à un abonnement SaaS Clyvonna, vous disposez d'un délai de 14 jours calendaires à compter de la date du paiement initial pour demander un remboursement intégral, sans avoir à justifier votre décision. Cette garantie ne s'applique qu'à la première souscription d'un compte donné."],
        ["Droit de rétractation (consommateurs UE/FR)", "Si vous êtes consommateur résidant dans l'Union européenne, vous bénéficiez en outre du droit de rétractation prévu par les articles L.221-18 et suivants du Code de la consommation, pendant 14 jours calendaires à compter de la souscription. Pour les services numériques exécutés immédiatement, vous renoncez expressément à ce droit en acceptant le démarrage immédiat du Service ; vous conservez néanmoins la garantie commerciale de 14 jours ci-dessus."],
        ["Comment demander un remboursement", "Envoyez un e-mail à contact@clyvonna.com depuis l'adresse associée à votre compte, en précisant : (i) le nom du compte, (ii) la date de souscription, (iii) la raison (facultative). Aucun formulaire complexe, aucune enquête de sortie, aucune tentative de rétention agressive."],
        ["Délai de traitement", "Une fois la demande validée, le remboursement est initié sous 5 jours ouvrés. Le crédit apparaît sur votre moyen de paiement selon les délais propres à votre établissement bancaire ou à Stripe (généralement 3 à 10 jours ouvrés supplémentaires)."],
        ["Au-delà de 14 jours — abonnements", "Passé le délai de 14 jours, les abonnements ne sont pas remboursés au prorata. Vous pouvez à tout moment résilier votre abonnement depuis votre espace client ; la résiliation prend effet à la fin de la période de facturation en cours, sans renouvellement ultérieur. Aucun frais supplémentaire."],
        ["Annulation d'un plan annuel", "Pour les plans annuels, en cas de résiliation après les 14 premiers jours, aucun remboursement prorata n'est dû, sauf accord commercial écrit ou défaillance grave et persistante du Service imputable à Clyvonna."],
        ["Exclusions de remboursement", "Sont exclus du remboursement : (i) les frais de traitement de paiement Stripe non récupérables, (ii) les prestations d'agence déjà réalisées (livrables remis), (iii) les abonnements résiliés après le 14e jour, (iv) les comptes suspendus pour violation de la Politique d'usage acceptable, (v) les achats effectués via un revendeur tiers (à voir avec ledit revendeur)."],
        ["Litiges et chargebacks", "Avant d'initier un chargeback auprès de votre banque ou de Stripe, nous vous invitons à nous contacter à contact@clyvonna.com. La très grande majorité des litiges se résolvent sous 48 heures. Un chargeback abusif (litige déclenché alors que le remboursement a déjà été initié ou que la cause invoquée est manifestement fausse) peut entraîner la facturation des frais Stripe associés au Client."],
        ["Droit applicable", "La présente Politique de remboursement est régie par le droit de l'État de l'Iowa, sans préjudice des dispositions impératives plus protectrices du droit français de la consommation applicables aux consommateurs résidant en France."],
        ["Contact", "Toute question : contact@clyvonna.com — réponse humaine sous 5 jours ouvrés."],
      ],
    },
    aup: {
      title: "Politique d'usage acceptable",
      sub: "Les usages strictement interdits sur la plateforme Clyvonna.",
      sections: [
        ["Principe général", "Clyvonna est un studio marketing et une plateforme SaaS destinés à des usages professionnels légitimes. Tout usage qui violerait la loi applicable, les politiques de nos partenaires de paiement (Stripe), ou les standards éthiques minimum est strictement interdit et entraînera la suspension immédiate du compte."],
        ["Activités strictement interdites", "Sont notamment interdits l'utilisation du Service en lien direct ou indirect avec : (1) Contenu pour adultes, pornographie, services d'escorte ; (2) Jeux d'argent, paris sportifs en ligne, casinos non agréés ; (3) Opérations exclusivement cryptographiques (échange, ICO, mining-as-a-service, NFT spéculatifs) ; (4) Drogues, substances contrôlées, CBD/THC sans licence valide dans la juridiction du Client ; (5) Marketing multi-niveaux (MLM), schémas pyramidaux, programmes « get-rich-quick » ; (6) Armes à feu, munitions, explosifs, armes de chasse vendues à distance ; (7) Tabac, vapoteuses, e-liquides ; (8) Produits pharmaceutiques sur ordonnance ; (9) Contrefaçon, marques détournées, biens volés ; (10) Services d'écriture académique frauduleuse, faux diplômes ; (11) Bureaux de débitage, sociétés-écrans, services de constitution d'identités fictives ; (12) Activités sanctionnées (OFAC, ONU, UE)."],
        ["Comportements abusifs", "Sont également interdits : envoi de spam, phishing, malware, scraping massif, contournement des limites techniques, ingénierie inverse de la plateforme, partage non autorisé de comptes, revente du Service sans accord écrit, harcèlement d'autres utilisateurs ou de notre équipe."],
        ["Signaux surveillés", "Nous monitorons en continu, dans le respect du RGPD : taux de plaintes (spam reports), taux de chargebacks, motifs de litiges Stripe, signalements externes (autorités, ayants droit), variations anormales de volume, patterns de fraude connus. Aucun contenu privé n'est lu manuellement sauf nécessité légale ou enquête de sécurité documentée."],
        ["Sanctions graduées", "(1) Avertissement écrit avec délai de mise en conformité (généralement 7 jours). (2) Suspension temporaire du compte si la violation persiste ou si elle est jugée grave. (3) Résiliation immédiate du contrat sans remboursement et conservation des logs à des fins probatoires en cas de violation manifeste, illégale, ou de récidive. Les cas les plus graves (illégalité avérée, sanctions internationales, fraude) entraînent une résiliation immédiate sans avertissement préalable et un signalement aux autorités compétentes."],
        ["Coopération avec les autorités", "Sur demande légalement contraignante (réquisition judiciaire, demande d'autorité de protection des données), Clyvonna coopère avec les autorités américaines et européennes compétentes. Le Client est informé sauf interdiction légale (gag order)."],
        ["Signalement d'un abus", "Pour signaler un usage abusif de la plateforme par un tiers (spam, contenu illégal, fraude), écrivez à contact@clyvonna.com avec l'objet « ABUSE REPORT ». Nous accusons réception sous 24 heures ouvrées et instruisons sous 5 jours ouvrés."],
        ["Mise à jour de la liste", "La liste des activités interdites est susceptible d'évoluer en fonction des politiques de Stripe, des évolutions législatives et des risques émergents. Toute mise à jour matérielle est notifiée par e-mail aux Clients actifs."],
      ],
    },
    mentions: {
      title: "Mentions légales",
      sub: "Informations légales relatives à l'éditeur du site et au responsable de publication.",
      sections: [
        ["Éditeur du site", "Raison sociale : CLYVONNA LLC\nForme juridique : Limited Liability Company (LLC)\nÉtat d'immatriculation : Iowa, États-Unis d'Amérique\nAdresse principale : 5249 North Park Place NE, place 5945, Cedar Rapids, IA 52402, USA\nEIN (Employer Identification Number) : [À COMPLÉTER]\nIowa Business Registration / Filing Number : [À COMPLÉTER]\nGérant / Managing Member : [À COMPLÉTER — nom du gérant]\nE-mail : contact@clyvonna.com\nTéléphone : +1 (949) 575-8179"],
        ["Directeur de la publication", "Le directeur de la publication du présent site est : [À COMPLÉTER — nom du directeur de la publication]. Pour toute question éditoriale : contact@clyvonna.com."],
        ["Hébergement", "Le site est hébergé par Amazon Web Services, Inc. (AWS) — 410 Terry Avenue North, Seattle, WA 98109-5210, USA. Régions disponibles : US-East (us-east-1) par défaut et UE (eu-central-1 / eu-west-1) sur demande. AWS est certifié EU-US Data Privacy Framework (DPF)."],
        ["Propriété intellectuelle", "L'ensemble des éléments composant le site clyvonna.com (textes, graphismes, logos, icônes, images, sons, logiciels, marques, code source) est la propriété exclusive de CLYVONNA LLC ou de ses partenaires, et est protégé par les législations française, américaine et internationale relatives au droit d'auteur et à la propriété intellectuelle. Toute reproduction, représentation, modification, publication, transmission, dénaturation, totale ou partielle, est strictement interdite sans autorisation écrite préalable. La marque « Clyvonna » et son logo sont des marques déposées ou en cours de dépôt."],
        ["Données personnelles", "Le traitement des données personnelles est régi par notre Politique de confidentialité, accessible sur /legal/privacy. Conformément au Règlement (UE) 2016/679 (RGPD) et à la loi Informatique et Libertés modifiée, vous disposez de droits d'accès, de rectification, d'effacement, d'opposition, de portabilité et de limitation. Contact : contact@clyvonna.com."],
        ["Cookies", "Voir notre Politique de cookies sur /legal/cookies. Aucun cookie publicitaire ou de tracking tiers n'est déposé sans votre consentement préalable."],
        ["Médiation de la consommation", "Conformément à l'article L.616-1 du Code de la consommation français, et bien que CLYVONNA LLC soit une société américaine, nous informons les consommateurs résidant dans l'Union européenne qu'ils peuvent recourir gratuitement à la plateforme européenne de Règlement en Ligne des Litiges (RLL) accessible à l'adresse : https://ec.europa.eu/consumers/odr. Cette plateforme permet de soumettre un litige de consommation à un organisme de médiation agréé."],
        ["Droit applicable et juridiction", "Le présent site et les Conditions générales associées sont régis par le droit de l'État de l'Iowa (USA) pour les relations B2B. Les dispositions impératives du droit français de la consommation et du RGPD restent applicables aux consommateurs résidant en France ou dans l'Union européenne. Pour les litiges B2B, compétence exclusive des tribunaux de Cedar Rapids, Iowa. Pour les litiges impliquant un consommateur français, la juridiction du domicile du consommateur peut être saisie."],
        ["Crédits", "Conception, design et développement : équipe interne Clyvonna. Typographie : licences commerciales en règle. Photographies et illustrations : production interne ou licences valides."],
        ["Contact", "Pour toute question relative aux présentes mentions légales : contact@clyvonna.com — réponse humaine sous 5 jours ouvrés."],
      ],
    },
  };
  const d = docs[kind] || docs.privacy;
  const tabs = [
    ["privacy", "Confidentialité"],
    ["terms", "Conditions"],
    ["cookies", "Cookies"],
    ["refund", "Remboursement"],
    ["aup", "Usage acceptable"],
    ["mentions", "Mentions légales"],
  ];
  return (
    <main className="page-enter">
      <section style={{ paddingTop: 180, paddingBottom: 80 }}>
        <div className="page" style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 60, alignItems: "end" }}>
          <div>
            <div className="flex gap-3 items-center" style={{ marginBottom: 24, flexWrap: "wrap" }}>
              {tabs.map(([k, l]) => (
                <Link key={k} to={k === "mentions" ? "/legal/mentions-legales" : `/legal/${k}`} className="pill" style={{ background: k === kind ? "var(--ink)" : "transparent", color: k === kind ? "var(--cream)" : "var(--ink-2)", borderColor: k === kind ? "var(--ink)" : "var(--rule)" }}>{l}</Link>
              ))}
            </div>
            <h1 className="serif" style={{ fontSize: "clamp(64px, 8vw, 168px)", lineHeight: 0.92, letterSpacing: "-0.025em" }}>
              {d.title}<em style={{ color: "var(--acid-deep)" }}>—</em>
            </h1>
          </div>
          <div>
            <p className="body-lg" style={{ maxWidth: 480 }}>{d.sub}</p>
            <div className="mono" style={{ marginTop: 18, color: "var(--muted)" }}>↳ Dernière mise à jour · 18 mai 2026 · v.8.0</div>
          </div>
        </div>
      </section>

      <section style={{ padding: "40px 0 140px" }}>
        <div className="page" style={{ display: "grid", gridTemplateColumns: "260px 1fr", gap: 80 }}>
          <aside style={{ position: "sticky", top: 120, alignSelf: "start" }}>
            <div className="lx-label" style={{ marginBottom: 16 }}>↳ Sommaire</div>
            <ul style={{ listStyle: "none", display: "flex", flexDirection: "column", gap: 10 }}>
              {d.sections.map(([h], i) => (
                <li key={i} className="mono" style={{ color: i === 0 ? "var(--ink)" : "var(--muted)" }}>{String(i+1).padStart(2,"0")} · {h}</li>
              ))}
            </ul>
          </aside>
          <div>
            {d.sections.map(([h, p], i) => (
              <div key={i} style={{ padding: "40px 0", borderTop: "1px solid var(--rule)" }}>
                <div className="mono" style={{ color: "var(--muted)", marginBottom: 12 }}>{String(i+1).padStart(2,"0")}</div>
                <h2 className="serif" style={{ fontSize: 40, lineHeight: 1.05, letterSpacing: "-0.01em", marginBottom: 16 }}>{h}</h2>
                <p className="body-lg" style={{ maxWidth: 760, whiteSpace: "pre-line" }}>{p}</p>
              </div>
            ))}
            <div style={{ marginTop: 40, padding: 32, background: "var(--cream-2)", borderLeft: "3px solid var(--acid)" }}>
              <div className="lx-label" style={{ marginBottom: 12 }}>↳ Une question sur cette politique ?</div>
              <p className="body-lg">
                Parlez à un humain : <a className="ilink" href="mailto:contact@clyvonna.com">contact@clyvonna.com</a>. Nous ne vous renverrons pas vers un système de tickets.
              </p>
            </div>
          </div>
        </div>
      </section>
    </main>
  );
}

window.NotFound = NotFound;
window.Legal = Legal;