/* ============================================================================
   SAWAKONEKT — feuille des PAGES LÉGALES (cgu · mentions-légales · confidentialité)

   POURQUOI CE FICHIER EXISTE
   Ces trois pages chargeaient Tailwind depuis `cdn.tailwindcss.com`. Deux raisons
   de le retirer, et la seconde est la plus gênante :

   ① SOUVERAINETÉ — §9.2. Les polices ont été rapatriées ; le CDN restait, et
      c'était la dernière requête vers un tiers de ces pages. Un visiteur qui lit
      la politique de confidentialité voyait son adresse IP partir chez un tiers
      PENDANT sa lecture. Ce n'est pas un traceur au sens strict, mais c'est très
      exactement la page où l'ironie coûte cher.

   ② `cdn.tailwindcss.com` N'EST PAS UN OUTIL DE PRODUCTION. C'est le compilateur
      JIT exécuté DANS le navigateur : il lit le DOM, génère la CSS à la volée,
      et la page reste non stylée jusqu'à ce qu'il ait fini. Sur une 4G
      sénégalaise, la première chose que voit le lecteur est du texte brut.

   CE QUE CETTE FEUILLE CONTIENT — ET RIEN D'AUTRE
   Les 57 classes utilitaires RÉELLEMENT employées par les trois pages, relevées
   par extraction sur les fichiers eux-mêmes, pas recopiées d'une documentation.
   Ajouter une classe non employée serait rouvrir en petit le problème qu'on ferme :
   du poids pour une capacité que personne n'utilise.

   ⚠ SI VOUS AJOUTEZ UNE CLASSE TAILWIND À CES PAGES, ELLE NE RENDRA PAS.
   Il n'y a plus de compilateur : cette feuille est la seule source. C'est le prix
   assumé de ne plus dépendre d'un tiers — et il est faible sur trois pages
   juridiques qui bougent une fois par an. Le contrôle `tests/…tiers-zero…`
   refusera de toute façon le retour du CDN.
   ============================================================================ */

:root{
  --safou:#FF6B35; --teal:#0A9396; --sable:#FEFBF6; --gold:#F4A261;
  /* L'ENCRE n'est pas le REMPLISSAGE. --safou est une couleur de remplissage :
     posee en TEXTE elle est SOUS LE SEUIL sur le sable comme sur le blanc.
     Constate sur les trois pages legales ; recomputable a la porte du domaine.
     --encre-safou conserve la teinte (16,0 deg -> 16,2) et franchit le seuil sur
     les deux fonds. Meme valeur que dans app.css — une seule derivation pour tout
     le dossier, pas une par feuille.
     AUCUN RATIO N'EST INSCRIT DANS CETTE FEUILLE (ordre du Regent, 2026-08-26) :
     un nombre en commentaire survit au hex qu'il decrit, la porte ne peut pas se
     perimer. `node tools/sonde/…_domaine-encres_v1-0.mjs --kit app.css`. */
  /* UNE VALEUR POUR UN NOM. --encre-safou a fourché à QUATRE endroits : app.css et
   index.html à #AE3C12, legal.css et partners.css à #CF3700 — chacun ayant copié
   la valeur en vigueur à l'heure où il branchait. Personne n'a eu tort : chacun a
   mesuré sa moitié, et les deux moitiés étaient justes. C'est pour ça que la
   fourche ne se voit qu'en relevant TOUS les fichiers d'un coup.
   #CF3700 passait SOUS LE SEUIL sur le lavis teal et sur le lavis safou de la landing :
   sous le seuil, indétectable à l'œil. #AE3C12 tient sur tout le domaine du kit. */
  --encre-safou:#AE3C12;
  --gris-200:#E5E7EB; --gris-500:#6B7280; --gris-600:#4B5563;
  --gris-700:#374151; --gris-800:#1F2937; --gris-900:#111827;
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--gris-800);
     background:var(--sable);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
img,svg{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px;border-radius:4px}

/* ── disposition ─────────────────────────────────────────────────────────── */
.flex{display:flex}
.inline-flex{display:inline-flex}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}
.gap-1{gap:.25rem}
.gap-2{gap:.5rem}
.gap-4{gap:1rem}
.gap-x-6{column-gap:1.5rem}
.gap-y-2{row-gap:.5rem}
.mx-auto{margin-left:auto;margin-right:auto}
.sticky{position:sticky}
.top-0{top:0}
.z-50{z-index:50}

/* ── espacements ─────────────────────────────────────────────────────────── */
.px-4{padding-left:1rem;padding-right:1rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.pt-8{padding-top:2rem}
.mb-0{margin-bottom:0}
.mb-4{margin-bottom:1rem}
.mb-10{margin-bottom:2.5rem}
.mt-3{margin-top:.75rem}
.mt-12{margin-top:3rem}

/* ── dimensions ──────────────────────────────────────────────────────────── */
.w-9{width:2.25rem}
.h-9{height:2.25rem}
.h-16{height:4rem}
.max-w-3xl{max-width:48rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}

/* ── typographie ─────────────────────────────────────────────────────────── */
.font-display{font-family:'Space Grotesk','Inter',system-ui,sans-serif}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-4xl{font-size:2.25rem;line-height:1.15}
.leading-relaxed{line-height:1.625}
.tracking-widest{letter-spacing:.1em}
.uppercase{text-transform:uppercase}

/* ── couleurs ────────────────────────────────────────────────────────────── */
.text-white{color:#fff}
.text-safou{color:var(--encre-safou)}   /* ENCRE, pas remplissage — le remplissage reste --safou (.from-safou, .bg-safou) */
.text-gray-500{color:var(--gris-500)}
.text-gray-600{color:var(--gris-600)}
.text-gray-700{color:var(--gris-700)}
.text-gray-800{color:var(--gris-800)}
.text-gray-900{color:var(--gris-900)}
.bg-white{background-color:#fff}
.hover\:text-safou:hover{color:var(--encre-safou)}

/* ── bordures, arrondis, dégradé ─────────────────────────────────────────── */
.border-t{border-top-width:1px;border-top-style:solid}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border-gray-200{border-color:var(--gris-200)}
.border-white\/40{border-color:rgba(255,255,255,.4)}
.rounded-lg{border-radius:.5rem}
/* Le seul dégradé de ces pages : la pastille du logo. `from-` et `to-` n'ont de
   sens qu'avec `bg-gradient-to-br` — les trois vont ensemble ou pas du tout. */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--grad-de),var(--grad-vers))}
.from-safou{--grad-de:var(--safou)}
/* La tuile « S » du mot-marque : blanc sur degrade safou->or. SOUS le
   seuil et DELIBEREMENT conserve — WCAG 1.4.3 exempte les logotypes et les noms
   de marque. L'exemption est DECLAREE ici, dans la regle qui cause l'ecart, et
   la sonde la compte a part avec son motif : une ligne rouge permanente sur un
   cas legitime s'apprend a etre ignoree, et le vrai defaut d'a cote avec elle. */
.w-9.h-9{--wcag-exempt:logotype}
.to-gold{--grad-vers:var(--gold)}

/* ── responsive : les points d'arrêt réellement employés ─────────────────── */
@media (min-width:640px){ .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem} }
@media (min-width:768px){
  .md\:flex-row{flex-direction:row}
  .md\:py-20{padding-top:5rem;padding-bottom:5rem}
  .md\:text-5xl{font-size:3rem;line-height:1.1}
}
@media (min-width:1024px){ .lg\:px-8{padding-left:2rem;padding-right:2rem} }

@media (prefers-reduced-motion:reduce){ *{animation:none!important;transition:none!important} }

/* Cibles tactiles des pages légales — mesuré au rendu (390×844) : les liens de
   la barre et du pied peignent 20 px de haut. Plancher de 44 px sur la boîte.
   Les liens EN LIGNE dans la prose (.prose-legal p a) sont volontairement
   exclus : WCAG 2.5.8 les exempte, et les grossir casserait le paragraphe. */
nav a{display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px}
footer ul{gap:0}
footer ul a{display:inline-flex; align-items:center; min-height:44px; min-width:44px}