/* Logo balise (écrit à la main, non généré).
   Le point du « i » est une balise : une bouée un peu plus large que la tige,
   qui émet un signal à intervalle régulier. Toutes les mesures sont en em,
   le logo garde donc ses proportions de l'en-tête (23 px) au grand logo (520 px). */
.wm { --beacon: #7A6470; white-space: nowrap; }
/* En ligne (pas inline-block) : la position du point dépend de la police, pas de l'interligne. */
.wm-i { position: relative; }
.wm-dot {
  /* left : centre mesuré de la tige du ı (0,13 em depuis l'origine du glyphe),
     indépendant de l'interlettrage négatif. */
  --s: max(.145em, 5.5px); /* taille minimale pour rester lisible en petit */
  position: absolute; left: .13em; top: calc(.377em - var(--s));
  width: var(--s); height: var(--s); margin-left: calc(var(--s) / -2);
  border-radius: 50%; background: var(--beacon);
  transition: scale .45s cubic-bezier(.2, .9, .25, 1.2);
}
.wm-dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: max(1.2px, .014em) solid var(--beacon); opacity: 0; pointer-events: none;
}
/* Grand logo du pied de page : signal plus fin et plus lent, à l'échelle. */
footer > div[aria-hidden] .wm-dot::after { border-width: .0045em; }

/* Le logo cliquable de l'en-tête réagit au survol. */
a:hover .wm-dot { scale: 1.18; }

@media (prefers-reduced-motion: no-preference) {
  .wm-dot { animation: wm-bob 5s ease-in-out infinite; }
  .wm-dot::after { animation: wm-signal 3.6s cubic-bezier(.2, .6, .3, 1) infinite; }
  footer > div[aria-hidden] .wm-dot::after { animation-duration: 5.4s; }
}
/* Signal partagé avec la pastille du hero (motion.css). */
@keyframes wm-signal {
  0% { transform: scale(1); opacity: .6; }
  70%, 100% { transform: scale(2.7); opacity: 0; }
}
/* Léger balancement de bouée. */
@keyframes wm-bob {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -.022em; }
}
