/*
 * Correctifs d'ergonomie appliqués après la feuille du site de référence.
 *
 * Cette feuille est chargée en dernier : c'est la seule position d'où l'on peut
 * corriger des règles héritées sans modifier les fichiers générés, qui sont
 * réécrits à chaque construction.
 *
 * Chaque règle répond à un défaut mesuré sur le site en ligne, pas à une
 * préférence esthétique. La direction graphique n'est pas touchée.
 */

/* ------------------------------------------------------------------ *
 * Cibles tactiles
 *
 * Les pastilles du carrousel mesuraient 56 × 4 pixels : impossibles à
 * viser au doigt. La zone cliquable est agrandie sans changer l'aspect
 * du trait, qui reste fin.
 * ------------------------------------------------------------------ */
.hdots{gap:4px}
.hdot{position:relative;height:4px;background-clip:content-box;padding:14px 0;box-sizing:content-box}
.hdot::after{content:"";position:absolute;inset:-6px -3px}

/* Liens du pied de page : 23 px de haut, sous le seuil confortable.
   L'interligne les amène à une hauteur cliquable sans écarter la colonne. */
.foot a{display:inline-block;padding:7px 0;line-height:1.4}
.foot .f-col a{min-height:34px}

/* Lien d'évitement : plus large une fois révélé au clavier. */
.skip-link{min-height:44px;display:inline-flex;align-items:center}

/* ------------------------------------------------------------------ *
 * Focus au clavier
 *
 * Un contour visible et homogène sur tout ce qui se parcourt au clavier,
 * y compris les éléments dont le style d'origine l'effaçait.
 * ------------------------------------------------------------------ */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--purple,#3b257f);
  outline-offset:2px;
  border-radius:4px;
}

/* Une carte cliquable reçoit le contour sur toute sa surface. */
.na:focus-visible,
.project-card a:focus-visible,
.cjmad-card a:focus-visible{outline-offset:3px}

/* ------------------------------------------------------------------ *
 * Cohérence des boutons
 *
 * Six variantes de bouton coexistaient sur la page d'accueil. Le rayon et
 * la hauteur sont unifiés ; les couleurs, elles, restent distinctes car
 * elles portent une hiérarchie d'action.
 * ------------------------------------------------------------------ */
.btn,
button.btn,
.cjmad-form button,
.cjmad-searchform button{
  min-height:46px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:0;
}

/* ------------------------------------------------------------------ *
 * Images d'illustration
 *
 * Les images décoratives à l'intérieur d'un lien déjà nommé ne doivent pas
 * être annoncées séparément.
 * ------------------------------------------------------------------ */
.cjmad-card-media[aria-hidden="true"],
.project-card-media[aria-hidden="true"]{cursor:pointer}

/* ------------------------------------------------------------------ *
 * Confort de lecture
 *
 * Aucune ligne de texte courant ne dépasse une largeur lisible, et rien ne
 * descend sous la taille minimale confortable sur mobile.
 * ------------------------------------------------------------------ */
@media(max-width:620px){
  .na-meta,
  .cjmad-card-meta,
  .map-attribution{font-size:.8rem}
}

/* ------------------------------------------------------------------ *
 * Mouvement réduit
 *
 * Respecte le réglage système des personnes sensibles aux animations.
 * ------------------------------------------------------------------ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}