/* Hovers du runtime d'origine (evidences-ds.js) : injectés comme classes
   utilitaires "scpN" à l'exécution, MAIS leur numérotation n'a aucun sens
   fixe — scp0 veut dire "couleur" sur une page et "scale image" sur une
   autre (vérifié sur 3 pages distinctes). Ce qui est en revanche stable
   partout : la propriété CSS déjà déclarée dans la transition inline de
   chaque élément concerné. On cible donc par ce biais plutôt que par le
   nom de classe, qui est ignoré ici. */
a:hover img[style*="transition: transform"],
button:hover img[style*="transition: transform"] {
  transform: scale(1.02) !important;
}
a:hover [style*="transition: background-color"],
button:hover [style*="transition: background-color"] {
  background-color: rgb(226, 226, 226) !important;
}
a:hover span[style*="color: rgb(0, 0, 0)"],
button:hover span[style*="color: rgb(0, 0, 0)"] {
  color: rgb(227, 40, 19) !important;
}
/* Titre de carte (archives Expositions/Actus) et CTA "Lire l'actu →" :
   souvent pas de color inline propre (hérite du noir de la carte <a>),
   repérés par leur seule transition dédiée — marqueur fiable du design
   system, vérifié en direct sur 3 occurrences (titre expo, titre actu,
   CTA actu). */
a:hover h3[style*="transition: color 120ms"],
a:hover span[style*="transition: color 120ms"] {
  color: rgb(227, 40, 19) !important;
}
/* Flèches ← → de défilement (carrousel d'accueil, carrousels d'œuvres
   par artiste sur les pages exposition) : signature complète du bouton
   (taille de police/line-height/cursor/couleur), vérifiée en direct sur
   l'accueil, sans wrapper carte. */
button[style*="font-size: 18px"][style*="line-height: 1"][style*="cursor: pointer"][style*="color: rgb(0, 0, 0)"]:hover {
  color: rgb(227, 40, 19) !important;
}
/* Liens/boutons "label" autonomes, sans wrapper carte (chips d'ancrage
   artistes et liens YouTube des pages exposition, onglet d'édition non
   sélectionné, "← Tous les artistes" d'une fiche photographe) : repérés
   par leur propre typographie de label (Open Sans 11px, 0.11em,
   majuscules) + noir, qu'ils portent directement sur eux-mêmes — jamais
   le cas des <a> enveloppant une carte entière (titre/image/texte), qui
   n'ont que du layout flex sur eux, jamais cette typo. Vérifié en direct
   sur Cavalcades (chips + lien YouTube) et une fiche photographe. */
a[style*="letter-spacing: 0.11em"][style*="text-transform: uppercase"][style*="color: rgb(0, 0, 0)"]:hover,
button[style*="letter-spacing: 0.11em"][style*="text-transform: uppercase"][style*="color: rgb(0, 0, 0)"]:hover {
  color: rgb(227, 40, 19) !important;
}
/* Fiche photographe : ligne "Exposé dans" et nav "Artiste précédent/
   suivant" — c'est le <a> entier (pas un enfant isolé) qui change de
   couleur ; signatures exactes, uniques à ce template. */
a[style*="border-bottom: 1px solid rgb(235, 235, 235)"][style*="padding: 14px 0px"][style*="color: rgb(0, 0, 0)"]:hover,
a[style*="flex: 1 1 200px"][style*="color: rgb(0, 0, 0)"]:hover {
  color: rgb(227, 40, 19) !important;
}
/* Lien CTA déjà rouge (ex. "Contactez-nous pour imaginer votre projet →") :
   fonce au survol plutôt que de changer de couleur. Pas de transition
   déclarée sur cet élément dans la source, donc ciblé par sa combinaison
   gras+rouge, propre à ce type de lien. */
a[style*="font-weight: 700"][style*="color: rgb(227, 40, 19)"]:hover {
  color: rgb(183, 31, 14) !important;
}

/* Deuxième famille de composants (boutons, ArrowLink, cartes "fondateurs"),
   présente sur TOUTES les pages (confirmé par grep sur la maquette source),
   qui utilise des transitions basées sur des variables de design token
   (var(--duration-slow/base/fast)) au lieu de valeurs littérales. Même
   logique de ciblage par propriété de transition déjà déclarée, jamais
   par nom de classe. "text-decoration: none" sert de repère de "zone
   survolable" car présent aussi bien sur les vrais <a> que sur les
   cartes stylées comme des liens.
   Valeurs vérifiées en forçant mouseenter/mouseover sur la maquette
   statique (localhost, _maquette-v2) et en lisant le style recalculé.
   Correction du 2026-11-12 : les cartes "fondateurs" (page Association)
   sont en réalité de vrais <a href="#"> sur la maquette React en direct
   (clients.bl-nk.fr) — l'export statique _maquette-v2 les avait aplaties
   en <div>, ce qui masquait le curseur main au survol (l'animation scale
   ci-dessous fonctionnait déjà, ciblée par transition et non par tag). */
[style*="text-decoration: none"]:hover [style*="transition: transform var(--duration-slow)"] {
  transform: scale(1.02) !important;
}
[style*="text-decoration: none"][style*="color: var(--text-primary)"] {
  cursor: pointer;
}
[style*="text-decoration: none"]:hover [style*="transition: transform var(--duration-base)"] {
  transform: translateX(3px) !important;
}
[style*="text-decoration: none"]:hover [style*="transition: color var(--duration-fast)"][style*="color: var(--ev-black)"] {
  color: var(--ev-red) !important;
}
a[style*="color: var(--ev-white)"][style*="transition: color var(--duration-fast)"][style*="opacity: 1;"]:hover {
  opacity: 0.7 !important;
}
a[style*="color: var(--ev-black)"][style*="transition: color var(--duration-fast)"][style*="opacity: 1;"]:hover {
  color: var(--ev-red) !important;
}

/* Boutons (variant Button du design system) : background/color/border
   basculent au survol. Repérés par leur transition sur les 3 propriétés
   à la fois (background-color, color, border-color), jamais par classe. */
[style*="transition: background-color var(--duration-base)"][style*="background: var(--ev-red);"]:hover {
  background: var(--ev-red-dark) !important;
}
[style*="transition: background-color var(--duration-base)"][style*="border-color: var(--ev-black)"][style*="background: transparent"]:hover {
  background: var(--ev-black) !important;
  color: var(--ev-white) !important;
}
[style*="transition: background-color var(--duration-base)"][style*="border-color: var(--ev-white)"][style*="background: transparent"]:hover {
  background: var(--ev-white) !important;
  color: var(--ev-black) !important;
}
