/* SóGuia | Ícones animados da Home | 2026-11-07
   Isolado em #categorias.sg-home-icons-animated. Desligar no admin restaura
   o markup e os estilos anteriores sem modificar os SVGs originais.
   Ícones próprios já existentes no backup — nenhum arquivo copiado do Flaticon. */
#categorias.sg-home-icons-animated .original-category-icon > :is(img,svg){
  display:block;
  transform-origin:50% 56%;
  backface-visibility:hidden;
}
#categorias.sg-home-icons-animated .original-category{
  --sg-icon-interaction:sgHomeIconPop;
  --sg-icon-loop:sgHomeIconLoop;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="coins"]{
  --sg-icon-interaction:sgHomeIconCoins;
  --sg-icon-loop:sgHomeIconLoopTurn;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="rise"]{
  --sg-icon-interaction:sgHomeIconRise;
  --sg-icon-loop:sgHomeIconLoopRise;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="cloche"]{
  --sg-icon-interaction:sgHomeIconCloche;
  --sg-icon-loop:sgHomeIconLoopRise;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="pulse"]{
  --sg-icon-interaction:sgHomeIconPulse;
  --sg-icon-loop:sgHomeIconLoopPulse;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="bounce"]{
  --sg-icon-interaction:sgHomeIconBounce;
  --sg-icon-loop:sgHomeIconLoop;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="tilt"]{
  --sg-icon-interaction:sgHomeIconTilt;
  --sg-icon-loop:sgHomeIconLoopTurn;
}
#categorias.sg-home-icons-animated .original-category[data-sg-icon-motion="travel"]{
  --sg-icon-interaction:sgHomeIconTravel;
  --sg-icon-loop:sgHomeIconLoop;
}

/* Modo padrão: a página permanece estática até hover, foco do teclado ou toque. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  #categorias.sg-home-icons-mode-interacao .original-category:hover .original-category-icon > :is(img,svg),
  #categorias.sg-home-icons-mode-interacao .original-category:focus-visible .original-category-icon > :is(img,svg){
    animation:var(--sg-icon-interaction) .8s cubic-bezier(.18,.74,.24,1) both !important;
  }
}
@media(prefers-reduced-motion:no-preference){
  #categorias.sg-home-icons-mode-interacao .original-category.sg-icon-playing .original-category-icon > :is(img,svg){
    animation:var(--sg-icon-interaction) .8s cubic-bezier(.18,.74,.24,1) both !important;
  }
  /* Modo de entrada: apenas uma reprodução quando o card entrar na tela. */
  #categorias.sg-home-icons-mode-entrada .original-category.sg-icon-entered .original-category-icon > :is(img,svg){
    animation:var(--sg-icon-interaction) .8s cubic-bezier(.18,.74,.24,1) both !important;
  }
  /* Contínuo: movimentos pequenos e intervalos longos; pausados fora da tela. */
  #categorias.sg-home-icons-mode-continuo .original-category.sg-icon-visible .original-category-icon > :is(img,svg){
    animation:var(--sg-icon-loop) 4.25s ease-in-out infinite !important;
    animation-play-state:running !important;
  }
  #categorias.sg-home-icons-mode-continuo.sg-icons-background .original-category-icon > :is(img,svg){
    animation-play-state:paused !important;
  }
}
@keyframes sgHomeIconPop{
  0%,100%{transform:scale(1) rotate(0)}
  32%{transform:scale(1.12) rotate(-4deg)}
  60%{transform:scale(.98) rotate(3deg)}
  82%{transform:scale(1.04) rotate(-1deg)}
}
@keyframes sgHomeIconCoins{
  0%,100%{transform:translateY(0) rotate(0)}
  24%{transform:translateY(-5px) rotate(-9deg)}
  46%{transform:translateY(0) rotate(8deg)}
  70%{transform:translateY(-3px) rotate(-4deg)}
}
@keyframes sgHomeIconRise{
  0%,100%{transform:translateY(0) scaleY(1)}
  35%{transform:translateY(-5px) scaleY(1.06)}
  65%{transform:translateY(0) scaleY(.99)}
}
@keyframes sgHomeIconCloche{
  0%,100%{transform:translateY(0) rotate(0)}
  30%{transform:translateY(-5px) rotate(-6deg)}
  58%{transform:translateY(-3px) rotate(4deg)}
  80%{transform:translateY(-1px) rotate(-2deg)}
}
@keyframes sgHomeIconPulse{
  0%,100%{transform:scale(1)}
  28%{transform:scale(1.11)}
  52%{transform:scale(.97)}
  74%{transform:scale(1.07)}
}
@keyframes sgHomeIconBounce{
  0%,100%{transform:translateY(0) scale(1)}
  28%{transform:translateY(-6px) scale(1.05)}
  56%{transform:translateY(1px) scale(.98)}
  78%{transform:translateY(-2px) scale(1.02)}
}
@keyframes sgHomeIconTilt{
  0%,100%{transform:rotate(0)}
  30%{transform:rotate(-13deg)}
  58%{transform:rotate(10deg)}
  80%{transform:rotate(-4deg)}
}
@keyframes sgHomeIconTravel{
  0%,100%{transform:translateX(0)}
  35%{transform:translateX(5px) rotate(2deg)}
  65%{transform:translateX(-2px) rotate(-1deg)}
}
@keyframes sgHomeIconLoop{
  0%,78%,100%{transform:translateY(0)}
  88%{transform:translateY(-3px)}
  95%{transform:translateY(-1px)}
}
@keyframes sgHomeIconLoopTurn{
  0%,78%,100%{transform:rotate(0)}
  87%{transform:rotate(-5deg)}
  94%{transform:rotate(3deg)}
}
@keyframes sgHomeIconLoopRise{
  0%,78%,100%{transform:translateY(0)}
  88%{transform:translateY(-3px)}
  95%{transform:translateY(-1px)}
}
@keyframes sgHomeIconLoopPulse{
  0%,78%,100%{transform:scale(1)}
  88%{transform:scale(1.07)}
  95%{transform:scale(1.02)}
}
@media(prefers-reduced-motion:reduce){
  #categorias.sg-home-icons-animated .original-category-icon > :is(img,svg),
  #categorias.sg-home-icons-animated .original-category:hover .original-category-icon > :is(img,svg),
  #categorias.sg-home-icons-animated .original-category.selected .original-category-icon > :is(img,svg){
    animation:none !important;
    transform:none !important;
    transition:none !important;
  }
}