.elementor-kit-506{--e-global-color-primary:#83B735;--e-global-color-secondary:#8ECB8B;--e-global-color-text:#505050;--e-global-color-accent:#83B735;--e-global-color-8d4e704:#ACFA3E;--e-global-color-048b57e:#4FD19D;--e-global-color-8c1987a:#81D742;--e-global-color-957898f:#3656A9;--e-global-color-892a692:#437EB1;--e-global-color-240ff67:#5F0ABE;--e-global-color-5f55205:#3F0086;--e-global-color-5a35018:#A95EFF;--e-global-typography-primary-font-family:"Urbanist";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Urbanist";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Urbanist";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Urbanist";--e-global-typography-accent-font-weight:600;background-color:var( --e-global-color-primary );font-family:"Urbanist", Sans-serif;}.elementor-kit-506 e-page-transition{background-color:#FFBC7D;}.elementor-kit-506 h1{font-family:"Urbanist", Sans-serif;}.elementor-kit-506 h2{color:var( --e-global-color-8d4e704 );font-family:"Urbanist", Sans-serif;}.elementor-kit-506 h3{font-family:"Urbanist", Sans-serif;font-weight:600;}.elementor-kit-506 h4{font-family:"Urbanist", Sans-serif;}.elementor-kit-506 h5{font-family:"Urbanist", Sans-serif;}.elementor-kit-506 h6{font-family:"Urbanist", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:100%;}.e-con{--container-max-width:100%;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.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:768px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Exemplo de CSS para animações mais específicas */

/* Efeito de zoom e brilho no hover do botão CTA final */
.final-cta-button {
    overflow: hidden; /* Garante que o pseudo-elemento não vaze */
    position: relative;
    transition: all 0.3s ease-in-out;
}
.final-cta-button:hover {
    transform: scale(1.05); /* Leve zoom */
    box-shadow: 0 0 30px rgba(243, 156, 18, 0.6); /* Brilho */
}
/* Efeito de "brilho" que passa no hover */
.final-cta-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.2);
    transform: skewX(-20deg);
    transition: all 0.7s ease;
}
.final-cta-button:hover::after {
    left: 100%;
}

/* Animação sutil de fade-in para a seção de benefícios */
.benefits-section .section-title {
    opacity: 0;
    transform: translateY(-20px);
    animation: fadeInSlideDown 0.8s ease-out forwards;
    animation-delay: 0.3s;
}
.benefits-section .benefit-card {
    opacity: 0;
    transform: scale(0.9);
    animation: fadeInZoom 0.6s ease-out forwards;
}
.benefits-section .benefit-card:nth-child(2) { animation-delay: 0.4s; }
.benefits-section .benefit-card:nth-child(3) { animation-delay: 0.6s; }

@keyframes fadeInSlideDown {
    to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInZoom {
    to { opacity: 1; transform: scale(1); }
}

/* Pequena borda animada no hover das abas */
.product-info-tabs .elementor-tab-title {
    position: relative;
}
.product-info-tabs .elementor-tab-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background-color: #27ae60;
    transition: width 0.3s ease-out;
}
.product-info-tabs .elementor-tab-title.elementor-active::after,
.product-info-tabs .elementor-tab-title:hover::after {
    width: 100%;
}

/* Estilo para a tabela nutricional (já no HTML, mas aqui se fosse no CSS) */
.nutritional-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-size: 15px;
}
.nutritional-table th, .nutritional-table td {
    border: 1px solid #e0e0e0;
    padding: 12px 15px;
    text-align: left;
}
.nutritional-table th {
    background-color: #f5f5f5;
    font-weight: bold;
    color: #333;
}
.nutritional-table tbody tr:nth-child(even) {
    background-color: #fcfcfc;
}/* End custom CSS */