.elementor-kit-5{--e-global-color-primary:#F2994A;--e-global-color-secondary:#1BAFBF;--e-global-color-text:#1B1B1B;--e-global-color-accent:#F5536B;--e-global-color-e89976c:#F5E6C8;--e-global-color-c146dc8:#A8E6CF;--e-global-color-b01bfda:#F5E6C81F;--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;color:var( --e-global-color-text );font-family:"Nunito", Sans-serif;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){margin-block-end: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;}}:root { --Naranja:#f2994a; --Azul:#1bafbf; --Negro:#1b1b1b; --Coral:#f5536b; --Arena:#f5e6c8; }
/* Start custom CSS */body::before {
    content: "";
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: -1;
    background-image: 
        radial-gradient(#dca462 2px, transparent .5px),
        radial-gradient(#fff5da 2.5px, transparent 2px),
        radial-gradient(#c88b48 2px, transparent 1px),
        radial-gradient(#ffffff 1px, transparent .5px);
    
    background-size: 
        24px 24px, 
        28px 28px, 
        48px 48px, 
        56px 56px;
        
    background-position: 
        0 0, 
        12px 14px, 
        8px 20px, 
        30px 10px;
        
    opacity: 0.09;
}

.tu-contenedor:hover {
  transform: translateY(-8px) rotateZ(-2deg) !important;
}

/* Prepara el botón para posicionar la onda relativa a él */
.boton-deco .elementor-button {
  position: relative !important;
  overflow: visible !important;
}

/* Pseudo-elemento con la onda SVG */
.boton-deco .elementor-button::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: -6px !important; /* Distancia respecto al borde inferior del botón */
  width: 100% !important;
  height: 14px !important;
  
  /* Extremos redondeados */
  border-radius: 7px !important;
  overflow: hidden !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  
  /* SVG de la onda */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 14" preserveAspectRatio="none"><path d="M0 7 Q 7.5 0.5, 15 7 T 30 7" fill="none" stroke="%23F5536B" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') !important;
  background-size: 30px 10px !important;
  background-repeat: repeat-x !important;
  
  /* Oculto por defecto */
  opacity: 0 !important;
  transform: translateY(2px);
  transition: opacity 0.25s ease, transform 0.25s ease !important;
  pointer-events: none; /* Evita que interfiera con el clic */
}

/* Estado Hover: visible y serpenteando */
.boton-deco .elementor-button:hover::after {
  opacity: 1 !important;
  transform: translateY(0) !important;
  animation: ondear-boton 1s linear infinite !important;
}

/* Animación fluida de la onda */
@keyframes ondear-boton {
  from {
    background-position-x: 0;
  }
  to {
    background-position-x: 30px;
  }
}


/* Bloqueo de interacción para el contenedor gris */
body .contenedor-showreel-bloqueado,
body .contenedor-showreel-bloqueado img {
    pointer-events: none !important;
    user-select: none !important;
    touch-action: none !important;
}

/* 1. Hace que el contenedor superior deje pasar todos los clics hacia lo que esté abajo */
body .contenedor-fantasma {
    pointer-events: none !important;
}

/* 2. Reactiva los clics solo si este contenedor superior tiene elementos interactivos propios (enlaces, botones, inputs) */
body .contenedor-fantasma a,
body .contenedor-fantasma button,
body .contenedor-fantasma input,
body .contenedor-fantasma .elementor-clickable {
    pointer-events: auto !important;
}/* End custom CSS */