.elementor-kit-67{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-4433f6ca:#4054B2;--e-global-color-45efd5e8:#23A455;--e-global-color-1eab01e3:#000;--e-global-color-6f812e32:#FFF;--e-global-color-2664520:#3D3D3D;--e-global-color-7c48366:#A7A7A7;--e-global-color-e7919d7:#FBFBFB;--e-global-typography-primary-font-family:"Arial";--e-global-typography-secondary-font-family:"Arial";--e-global-typography-text-font-family:"Tahoma";--e-global-typography-accent-font-family:"Tahoma";}.elementor-kit-67 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1600px;}.e-con{--container-max-width:1600px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================
   CONFIGURAÇÃO DA CAIXA (O CONTAINER)
   ========================================= */
.categoria-destaque {
    /* Garante que o brilho fique preso dentro da caixa (não vaze para fora) */
    position: relative;
    overflow: hidden;
    
    /* Transforma a seta do mouse em "mãozinha" para indicar clique */
    cursor: pointer;
    
    /* Garante que a caixa fique na camada correta */
    z-index: 1;
}

/* =========================================
   O EFEITO DE LUZ (O BRILHO)
   ========================================= */
.categoria-destaque::after {
    content: "";
    
    /* Posicionamento absoluto para flutuar sobre o conteúdo */
    position: absolute;
    top: 0;
    left: -150%; /* Começa escondido fora da tela à esquerda */
    width: 100%;
    height: 100%;
    
    /* O Gradiente: Transparente -> Branco (80%) -> Transparente */
    background: linear-gradient(
        to right, 
        rgba(255,255,255,0) 0%, 
        rgba(255,255,255,0.8) 50%, 
        rgba(255,255,255,0) 100%
    );
    
    /* Inclina a faixa de luz em 25 graus para ficar mais estiloso */
    transform: skewX(-25deg);
    
    /* A MÁGICA DO TEMPO:
       6s = Tempo total do ciclo (para caber as 4 caixas)
       infinite = Repete para sempre */
    animation: brilho-tv 6s infinite;
    
    /* Importante: Deixa o clique "passar" pelo brilho e atingir o botão/link abaixo */
    pointer-events: none;
}

/* =========================================
   SINCRONIZAÇÃO (A FILA INDIANA)
   Define quando cada caixa começa a brilhar
   ========================================= */

/* A 1ª caixa não precisa de delay, ela é o "Líder" (segundo 0) */

/* A 2ª Caixa espera 1.5 segundos para começar */
.delay-1::after {
    animation-delay: 1.5s;
}

/* A 3ª Caixa espera 3.0 segundos para começar */
.delay-2::after {
    animation-delay: 2.5s;
}

/* A 4ª Caixa espera 4.5 segundos para começar */
.delay-3::after {
    animation-delay: 3.5s;
}

/* =========================================
   A ANIMAÇÃO (O MOVIMENTO)
   ========================================= */
@keyframes brilho-tv {
    /* Começa fora da tela na esquerda */
    0% { 
        left: -150%; 
    }
    
    /* Passa rápido pela caixa (dura aprox. 1.2 segundos visível) */
    20% { 
        left: 150%; 
    }
    
    /* Fica "invisível" à direita esperando o ciclo de 6s terminar para recomeçar */
    100% { 
        left: 150%; 
    }
}/* End custom CSS */