.elementor-kit-28{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;--e-global-typography-469037b-font-family:"Poppins";--e-global-typography-469037b-font-size:12px;--e-global-typography-469037b-font-weight:600;--e-global-typography-469037b-text-transform:uppercase;--e-global-typography-469037b-letter-spacing:2.5px;background-image:url("https://lalaleiko.com/wp-content/uploads/2025/10/cielo-scaled.webp");background-position:top center;background-repeat:no-repeat;background-size:cover;}.elementor-kit-28 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.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 *//* Fondo blanco: bordes redondeados y sombra */
.e-n-tabs-heading {
  border-radius: 36px;
  border: 3px solid #ffffff;
  background: #fff;
  box-shadow: 0 2px 16px rgba(0,0,0,0.08);
  padding: 1px;
  overflow: hidden;
}

/* Estilos base para todas las caras */
.tab-face {
  transition: all 0.22s ease;
  opacity: 0.55;
}

/* Animación y opacidad para la cara activa: ROTACIÓN */
.e-n-tab-title[aria-selected="true"] .tab-face {
  opacity: 1;
  animation: tabFaceRotate 1.2s infinite;
}

/* Hover en caras NO activas */
.e-n-tab-title[aria-selected="false"] .tab-face:hover {
  opacity: 1;
  animation: tabFaceHover 0.35s forwards;
  cursor: pointer;
}

/* Animación breve al hacer hover */
@keyframes tabFaceHover {
  0%   { transform: scale(1) translateX(0);}
  50%  { transform: scale(1.13) translateX(-10px);}
  100% { transform: scale(1.05) translateX(0);}
}

/* Animación rotativa para la cara activa */
@keyframes tabFaceRotate {
  0%   { transform: rotate(-12deg);}
  50%  { transform: rotate(12deg);}
  100% { transform: rotate(-12deg);}
}/* End custom CSS */