.elementor-289 .elementor-element.elementor-element-4477c28{--display:flex;--min-height:400px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-289 .elementor-element.elementor-element-4477c28:not(.elementor-motion-effects-element-type-background), .elementor-289 .elementor-element.elementor-element-4477c28 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-289 .elementor-element.elementor-element-8ea7b75{text-align:center;}.elementor-289 .elementor-element.elementor-element-8ea7b75 .elementor-heading-title{font-family:"gotham", Sans-serif;font-size:36px;font-weight:600;text-transform:uppercase;color:var( --e-global-color-ff3d361 );}@media(max-width:1024px){.elementor-289 .elementor-element.elementor-element-8ea7b75 .elementor-heading-title{font-size:29px;}}@media(max-width:767px){.elementor-289 .elementor-element.elementor-element-4477c28{--min-height:340px;}.elementor-289 .elementor-element.elementor-element-8ea7b75 .elementor-heading-title{font-size:24px;}}/* Start custom CSS for heading, class: .elementor-element-8ea7b75 */.titulo1 {
    opacity: 0;
    transition: all 0.5s ease;
    z-index: 2;
}

/* Mantém o hover no desktop */
.seu-container:hover .titulo1 {
    opacity: 1;
}

/* Classe que será adicionada quando estiver no centro */
.seu-container.in-center .titulo1 {
    opacity: 1;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4477c28 */.seu-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #061938; /* Cor e opacidade da sobreposição */
  opacity: 0; /* Invisível inicialmente */
  transition: opacity 0.3s ease-in-out; /* Suavidade na transição */
  z-index: 1;
}

.seu-container:hover::before {
  opacity: 0.5; /* Mostra a sobreposição */
}

/* Efeito de centro APENAS no mobile */
@media (max-width: 768px) {
    .seu-container.in-center::before {
        opacity: 0.5;
    }
    
    .seu-container.in-center .titulo1 {
        opacity: 1;
    }
}/* End custom CSS */