/* ==========================================================================
   ProjeTeam — Mascotes (animação do personagem)
   Keyframes globais + parâmetros por instância via custom props inline.
   ========================================================================== */
.mascote{display:block;width:132px;height:132px;max-width:100%;overflow:visible}
.mascote [class^="m-"]{transform-box:fill-box;transform-origin:center}

/* IDLE — flutuar (corpo) + contrapeso no gadget + piscar */
@keyframes m-bob   {0%,100%{transform:translateY(0)}   50%{transform:translateY(-5px)}}
@keyframes m-bobp  {0%,100%{transform:translateY(0)}   50%{transform:translateY(4px)}}
@keyframes m-blink {0%,92%,100%{transform:scaleY(1)}   96%{transform:scaleY(.14)}}
.mascote .m-float{animation:m-bob 4s ease-in-out infinite;animation-delay:var(--bob-delay,0s)}
.mascote .m-eyes {animation:m-blink 6s ease-in-out infinite;animation-delay:var(--blink-delay,0s)}

/* Aura (revela no hover do contexto) */
.mascote .m-aura{opacity:0;transition:opacity .35s ease}
.mascote{transition:transform .35s cubic-bezier(.2,.7,.2,1)}

/* HOVER — reação (perk-up + aura + aceno + pop do gadget) */
@keyframes m-wave{0%,100%{transform:rotate(0)}25%{transform:rotate(15deg)}70%{transform:rotate(-9deg)}}
@keyframes m-pop {0%{transform:scale(1)}45%{transform:scale(1.2) rotate(8deg)}100%{transform:scale(1)}}

.mascote:hover .m-aura,
.eco-card:hover .m-aura,
.hero-flag-wrap:hover .m-aura,
.feature-row:hover .m-aura,
.thanks:hover .m-aura{opacity:.32}

.eco-card:hover .mascote,
.hero-flag-wrap:hover .mascote,
.mascote:hover{transform:translateY(-5px) scale(1.04)}

.mascote:hover .m-arms,
.eco-card:hover .m-arms,
.hero-flag-wrap:hover .m-arms,
.feature-row:hover .m-arms{animation:m-wave .6s ease}

.mascote:hover .m-prop,
.eco-card:hover .m-prop,
.hero-flag-wrap:hover .m-prop,
.feature-row:hover .m-prop{animation:m-pop .55s ease}

/* Movimento reduzido: estático (o seletor * global já zera; aqui reforça) */
@media (prefers-reduced-motion:reduce){
  .mascote *{animation:none !important}
  .mascote,.eco-card:hover .mascote,.hero-flag-wrap:hover .mascote,.mascote:hover{transform:none}
}