/*
 * Onglets de texte (décision d'Alexandre, 22/09/2026 : « plus sobre ») : ni cadre ni aplat, des libellés posés sur un
 * filet fin, le nombre en gris, l'onglet choisi souligné de marine. Communs aux familles du catalogue (boutons,
 * aria-pressed), aux catégories des actualités et aux groupes de la recherche (liens, aria-current ; un groupe vide est
 * un span aria-disabled). Trop longs pour la largeur, ils passent à la ligne : aucun choix ne se cache hors de l'écran.
 */
.ong{display:flex;flex-wrap:wrap;gap:0 clamp(22px,3vw,44px);border-bottom:1px solid var(--line)}
.ong__o{position:relative;flex:0 0 auto;display:flex;align-items:baseline;gap:8px;min-height:52px;padding:0;background:none;
  border:0;color:var(--body);cursor:pointer;text-align:left;font-family:var(--ui);font-weight:600;font-size:.95rem;
  line-height:52px;white-space:nowrap;transition:color .14s}
.ong__o small{font-family:var(--ui);font-weight:600;font-size:.8rem;color:var(--mute);font-variant-numeric:tabular-nums}
.ong__o::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--navy);
  transform:scaleX(0);transform-origin:left;transition:transform .2s}
.ong__o:hover{color:var(--navy);text-decoration:none}
.ong__o[aria-pressed="true"],.ong__o[aria-current]{color:var(--navy)}
.ong__o[aria-pressed="true"] small,.ong__o[aria-current] small{color:var(--navy)}
.ong__o[aria-pressed="true"]::after,.ong__o[aria-current]::after{transform:scaleX(1)}
.ong__o[aria-disabled="true"]{color:#9DB6C6;cursor:default}
.ong__o[aria-disabled="true"] small{color:#B7C9D4}
.ong__o:focus-visible{outline-offset:4px}
/* Posés seuls au-dessus d'une liste (actualités, recherche) : un peu d'air avant les cartes */
.ong--liste{margin-bottom:clamp(26px,3vw,40px)}

@media (max-width:640px){
  .ong{column-gap:20px}
  .ong__o{min-height:44px;line-height:44px;font-size:.9rem}
}