/* HeatSync — logo 3b « Le ventilateur »
   Forme : symbole.png (utilisé comme masque). Couleur : dégradé chaleur animé.
   Rotation lente en CSS sur .hs-logo-spin ; site.js peut continuer d'appliquer
   sa rotation au défilement sur l'élément parent (.marque-symbole / .heros-vortex). */

@keyframes hs-logo-tourne { to { transform: rotate(360deg); } }
@keyframes hs-logo-coule  { to { background-position: 200% 50%; } }

.hs-logo { display: inline-block; width: 46px; height: 46px; flex: none; }
.hs-logo-spin { display: block; width: 100%; height: 100%; animation: hs-logo-tourne 9s linear infinite; }
.hs-logo-degrade {
  display: block; width: 100%; height: 100%;
  background: linear-gradient(100deg, #DC0A1C, #F2541B, #F5B300, #F2541B, #DC0A1C);
  background-size: 200% 100%;
  animation: hs-logo-coule 3s linear infinite;
  -webkit-mask: url("../img/symbole.png") center / contain no-repeat;
          mask: url("../img/symbole.png") center / contain no-repeat;
}

@media (prefers-reduced-motion: reduce) {
  .hs-logo-spin, .hs-logo-degrade { animation: none; }
}