/* =========================================================================
   Poto — animation TADAAA (apparition, one-shot)                module autonome
   -------------------------------------------------------------------------
   Pose cible   : poto-3-reveal.svg (la pose reste DROITE en statique : la joie
                  penchée vient de l'animation).
   Déclencheur  : classe racine  .poto-anim-tadaaa  sur <svg class="poto">
                  (ou un ancêtre). Pour rejouer : retirer puis reposer la
                  classe (ou remplacer le nœud).
   Durées       : one-shot 500 ms, scale .90 → 1.06 → 1 avec rotation 2,5°,
                  courbe ease-out-back ; puis respiration 3,5 s en boucle
                  (démarre après le one-shot).
   Calques      : l'élément porteur de la classe (posture), #poto (respiration).
   ========================================================================= */

.poto-anim-tadaaa { display: block; overflow: visible; transform-origin: 50% 86%; }

@keyframes poto-tadaaa-pop { 0%   { transform: scale(.90) rotate(0deg); }
                             55%  { transform: scale(1.06) rotate(2.5deg); }
                             100% { transform: scale(1)   rotate(0deg); } }
@keyframes poto-tadaaa-respire {
  0%, 100% { transform: scaleY(1)    scaleX(1); }
  50%      { transform: scaleY(.985) scaleX(1.004); }
}

.poto-anim-tadaaa { animation: poto-tadaaa-pop .5s cubic-bezier(.34, 1.56, .64, 1) both; }
.poto-anim-tadaaa #poto { transform-origin: 60px 103px;
                          animation: poto-tadaaa-respire 3.5s ease-in-out infinite .5s; }

/* --- accessibilité : tout s'arrête (la pose finale est la pose statique) -- */
@media (prefers-reduced-motion: reduce) {
  .poto-anim-tadaaa, .poto-anim-tadaaa * { animation: none !important; transition: none !important; }
}
