

#arcaweb-content .grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1rem;
}





        .gradient {
          background: linear-gradient(90deg, #542eff 0%, #238dce 100%);
        }

        @keyframes ki-explosion {
    0% {
      transform: scale(0.2);
      opacity: 0;
    }
    30% {
      transform: scale(1.4);
      opacity: 0.1;
    }
    50% {
      transform: scale(2);
      opacity: 0.4;
    }
    70% {
      transform: scale(2.0);
      opacity: 0.2;
    }
    100% {
      transform: scale(0.2);
      opacity: 0;
    }
  }

  .animate-ki-explosion {
    animation: ki-explosion 2s ease-in-out infinite;
  }
                @keyframes waveTop1 {
                        0%, 100% {
                            transform: translateY(-5px);
                        }
                        50% {
                            transform: translateY(10px); /* Sobe */
                        }
                        }

                        @keyframes waveTop2 {
                        0%, 100% {
                            transform: translateY(-5px);
                        }
                        50% {
                            transform: translateY(-20px); /* Desce */
                        }
                        }

                        @keyframes waveTop3 {
                        0%, 100% {
                            transform: translateY(10);
                        }
                        50% {
                            transform: translateY(150px); /* Sobe mais */
                        }
                        }

                        /* Selecionando e animando as ondas */
                        .wave-top .wave path:nth-child(1) {
                        animation: waveTop1 5s ease-in-out infinite;
                        }

                        .wave-top .wave path:nth-child(2) {
                        animation: waveTop2 5s ease-in-out infinite;
                        }

                        .wave-top .wave path:nth-child(3) {
                        animation: waveTop3 5s ease-in-out infinite;
                        }


                    @keyframes wave1 {
                    0%, 100% {
                        transform: translateY(0px);
                    }
                    50% {
                        transform: translateY(5px); /* Sobe */
                    }
                    }

                    @keyframes wave2 {
                    0%, 100% {
                        transform: translateY(0);
                    }
                    50% {
                        transform: translateY(-10px); /* Desce */
                    }
                    }

                    @keyframes wave3 {
                    0%, 100% {
                        transform: translateY(0px);
                    }
                    50% {
                        transform: translateY(50px); /* Sobe mais */
                    }
                    }

                    .relative svg path:nth-child(1) {
                    animation: wave1 5s ease-in-out infinite;
                    }

                    .relative svg path:nth-child(2) {
                    animation: wave2 5s ease-in-out infinite;
                    }

                    .relative svg path:nth-child(3) {
                    animation: wave3 5s ease-in-out infinite;
                    }
