/* Accueil : animation autour de l'emblème Alchimie En Action (embleme.js).
   Roue du zodiaque centrée sur l'emblème, qui tourne lentement, et poussières d'or. */
/* Emblème : roue du zodiaque derrière (elle tourne lentement) et poussières d'or.
   L'emblème lui-même reste fixe : il ne grossit ni ne rétrécit. */
.embleme-anime .hero-content { position: relative; z-index: 1; }
.embleme-anime .gold-dust { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.embleme-anime .zodiac-wheel {
  /* E = taille de l'emblème (même règle que le thème).
     Cercle doré de l'image, mesuré au pixel : centre à 49,69 % de la largeur et 40,77 % de la hauteur, rayon 31,39 %.
     La roue est centrée exactement sur ce cercle ; son anneau intérieur (38 % de la roue) le longe à 2 % près. */
  --E: min(500px, 84vw); --W: calc(var(--E) * 0.843);
  position: absolute; z-index: 2; pointer-events: none;
  width: var(--W); aspect-ratio: 1;
  left: calc(50% - var(--E) * 0.0031); top: calc(var(--E) * 0.4077);
  translate: -50% -50%;
  animation: embleme-wheel-in 2.2s var(--ease) both;
}
.embleme-anime .zodiac-wheel svg { width: 100%; height: 100%; overflow: visible; animation: lumiere-turn 160s linear infinite; }
.embleme-anime .zodiac-wheel circle { fill: none; stroke: var(--gold-soft); stroke-width: 1; opacity: .7; }
.embleme-anime .zodiac-wheel .ticks line { stroke: var(--gold-soft); stroke-width: 1; opacity: .8; }
.embleme-anime .zodiac-wheel .glyphs text { fill: var(--gold); font-size: 20px; text-anchor: middle; dominant-baseline: central; font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", sans-serif; opacity: .75; }
@keyframes embleme-wheel-in { from { opacity: 0; scale: .8; rotate: -40deg; } to { opacity: 1; scale: 1; rotate: 0deg; } }
@media (prefers-reduced-motion: reduce) {
  .embleme-anime .zodiac-wheel, .embleme-anime .zodiac-wheel svg { animation: none; }
}