/* Palette Klairgo : source unique des couleurs des gabarits. Les scripts gardent leurs hex
   (lib.mix calcule sur des valeurs, pas sur des var()) ; les attributs SVG aussi (stop-color
   n'accepte pas var()). Les teintes -ink sont les versions lisibles en texte (>= 4,5:1 sur --paper ; --mint-ink aussi sur --sand). */
:root{
  --paper:#FBFAF7; --sand:#F3F1EA; --sand-2:#ECEAE1;
  --ink:#1F2A3D; --ink-soft:#5B6678;
  --line:#D9D6CB; --line-soft:#E6E3D8; --line-3:#E4E1D4; --field-line:#8C8878;
  --sky:#8FC0D9; --mint:#79C2AC; --olive:#A7AC8E; --coral:#F48F78;
  --coral-ink:#B4442C; --olive-ink:#6F7654; --mint-ink:#377864;
  --bio:#4254C4; --bio-pale:#DCE0F5; /* teinte KlairBio (comparatif) ; content.*.js garde son hex pour lib.mix */
}
/* Grammaire du mouvement (audit motion, 2026-09-27) : source unique des durées, courbes, distances et
   décalages des gabarits. Quatre paliers — micro (survol, enfoncement), UI (menu, pop-up), contenu
   (entrées de section, textes) et cinématique (tracés, caméra) — et cinq courbes, chacune avec un rôle.
   « Rien ne pop, tout émerge » (spec §5) : seul --ease-pose dépasse sa cible, réservé aux atterrissages.
   Les sorties durent 0,7 × l'entrée, en --ease-in. Les valeurs en dur des gabarits y migrent au fil des lots. */
:root{
  --t-micro:180ms; --t-ui:320ms; --t-content:600ms; --t-cine:1200ms;
  --ease-out:cubic-bezier(.22,1,.36,1);      /* émerger : entrées de contenu, cascades */
  --ease-out-ui:cubic-bezier(.16,1,.3,1);    /* répondre : interface, textes masqués */
  --ease-in-out:cubic-bezier(.65,0,.35,1);   /* tracer : tracés, balayages, caméra */
  --ease-in:cubic-bezier(.55,0,1,.45);       /* sortir */
  --ease-pose:cubic-bezier(.34,1.56,.64,1);  /* se poser : atterrissage d'icône */
  --d-micro:8px; --d-content:24px; --d-cine:48px;
  --stagger-word:50ms; --stagger-letter:90ms; --stagger-item:120ms; --stagger-line:150ms;
  --shadow-1:0 1px 2px rgba(31,42,61,.05),0 8px 24px rgba(31,42,61,.06);
  --shadow-2:0 2px 6px rgba(31,42,61,.06),0 22px 52px rgba(31,42,61,.12);
  --shadow-3:0 30px 80px rgba(31,42,61,.18);
}
/* Sortie de page (lot 14, lib.pageExit) : le contenu descend de 12 px et s'efface, 280 ms, pendant que le fil file
   vers le bas de l'écran ; la nav reste, elle sera sur la page suivante. Le dessin du fil — ses pictos (`data-halves`),
   sur l'accueil et la page application — reste en place : effacés avec le texte, ils laissaient des trous dans le fil.
   On efface donc les plus grands sous-arbres qui n'en contiennent pas. Navigateurs sans :has() : tout le contenu. */
html[data-leaving] main>:not(:has(svg[data-halves]),svg[data-halves]),
html[data-leaving] main :has(svg[data-halves])>:not(:has(svg[data-halves]),svg[data-halves]){opacity:0!important;transform:translateY(12px)!important;transition:opacity 280ms var(--ease-in),transform 280ms var(--ease-in)!important}
@supports not selector(:has(a)){html[data-leaving] main{opacity:0;transform:translateY(12px);transition:opacity 280ms var(--ease-in),transform 280ms var(--ease-in)}}
::selection{background:var(--sky);color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
/* Lien d'évitement (audit 2026-10-13) : hors écran jusqu'au focus clavier, puis posé au-dessus de la nav. */
[data-skip]{position:fixed;left:16px;top:-80px;z-index:100;padding:12px 18px;border-radius:12px;background:var(--ink);color:var(--paper);font-weight:600;text-decoration:none;transition:top var(--t-micro) var(--ease-out-ui)}
[data-skip]:focus-visible{top:12px;outline-color:var(--ink)}
a[data-skip]:hover{color:var(--paper)}  /* sinon a:hover des gabarits (--coral-ink) sur fond encre : 2,6:1 */
/* Klaircheck (2026-10-15) : 5e entrée de menu, en français seulement. Entre 1040 et 1199 px, les numéros de la nav
   cèdent la place (la nav débordait de 36 px à 1040) ; les autres langues gardent leurs 4 entrées numérotées. */
@media (max-width:1199px){html[lang="fr"] [data-nav-num]{display:none}}