/* Camadas de Glitch para Imagens */
.glitch-layer-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; /* Vão pegar o tamanho do .logo-svg clonado */
  height: 100%;
  opacity: 0; /* Controlado pela animação */
  pointer-events: none; /* Para não interferir com cliques */
  z-index: 10; /* Para garantir que fiquem sobre o logo original durante o glitch */
}

/* Efeito de cor para as camadas (usando filter) */
.glitch-layer-img--red-effect {
  /* Exemplo de filtro para tonalidade vermelha. Ajuste conforme o gosto! */
  filter: invert(100%) sepia(100%) saturate(5000%) hue-rotate(315deg) brightness(70%) contrast(150%);
}

.glitch-layer-img--blue-effect {
  /* Exemplo de filtro para tonalidade azul. Ajuste conforme o gosto! */
  filter: invert(100%) sepia(100%) saturate(5000%) hue-rotate(180deg) brightness(70%) contrast(150%);
}

/* Classes que disparam a animação de burst */
.glitch-layer-img--red-effect.glitch-anim-red-burst-trigger {
  animation: glitch-anim-red-burst 0.5s linear forwards; /* Duração 0.5s, executa uma vez */
}

.glitch-layer-img--blue-effect.glitch-anim-blue-burst-trigger {
  animation: glitch-anim-blue-burst 0.5s linear forwards; /* Duração 0.5s, executa uma vez */
}

/* Keyframes Adaptados (baseados nos seus, mas para um "burst" único de 0.5s) */
/* Estes keyframes controlam o movimento e o clip-path para o efeito visual */
@keyframes glitch-anim-red-burst {
  0% { left: 0; opacity: 0.7; clip-path: inset(15% 0 70% 0); }
  10% { left: 7px; opacity: 0.8; clip-path: inset(15% 0 70% 0); }
  20% { left: -5px; opacity: 0.7; clip-path: inset(80% 0 5% 0); }
  30% { left: 6px; opacity: 0.85; clip-path: inset(2% 0 90% 0); }
  40% { left: -7px; opacity: 0.6; clip-path: inset(65% 0 10% 0); }
  50% { left: 5px; opacity: 0.75; clip-path: inset(30% 0 55% 0); }
  60% { left: -6px; opacity: 0.8; clip-path: inset(90% 0 3% 0); }
  70% { left: 7px; opacity: 0.7; clip-path: inset(45% 0 40% 0); }
  80% { left: -5px; opacity: 0.8; clip-path: inset(10% 0 85% 0); }
  90% { left: 6px; opacity: 0.65; clip-path: inset(75% 0 5% 0); }
  100% { left: 0; opacity: 0; clip-path: inset(50% 0 50% 0); } /* Termina invisível */
}

@keyframes glitch-anim-blue-burst {
  0% { left: 0; opacity: 0.7; clip-path: inset(70% 0 15% 0); }
  10% { left: -7px; opacity: 0.8; clip-path: inset(70% 0 15% 0); }
  20% { left: 5px; opacity: 0.7; clip-path: inset(5% 0 80% 0); }
  30% { left: -6px; opacity: 0.85; clip-path: inset(90% 0 2% 0); }
  40% { left: 7px; opacity: 0.6; clip-path: inset(10% 0 65% 0); }
  50% { left: -5px; opacity: 0.75; clip-path: inset(55% 0 30% 0); }
  60% { left: 6px; opacity: 0.8; clip-path: inset(3% 0 90% 0); }
  70% { left: -7px; opacity: 0.7; clip-path: inset(40% 0 45% 0); }
  80% { left: 5px; opacity: 0.8; clip-path: inset(85% 0 10% 0); }
  90% { left: -6px; opacity: 0.65; clip-path: inset(5% 0 75% 0); }
  100% { left: 0; opacity: 0; clip-path: inset(50% 0 50% 0); } /* Termina invisível */
}