.elementor-972 .elementor-element.elementor-element-60f7f336{--display:flex;--min-height:100vh;--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;}.elementor-972 .elementor-element.elementor-element-4e6e5c68{--display:flex;--min-height:70vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-around;--align-items:center;}.elementor-972 .elementor-element.elementor-element-59dfe0db{width:var( --container-widget-width, 40% );max-width:40%;--container-widget-width:40%;--container-widget-flex-grow:0;text-align:center;font-size:22px;color:#FFFFFF;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:2.7rem;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-2.7rem;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-972 .elementor-element.elementor-element-31698c80 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-972 .elementor-element.elementor-element-31698c80 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-972 .elementor-element.elementor-element-31698c80 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-type-html{padding-bottom:0px;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group .elementor-field{color:#FFFAFA;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#1919197A;border-color:#FFFFFF;border-radius:16px 16px 16px 16px;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group .elementor-select-wrapper select{background-color:#1919197A;border-color:#FFFFFF;border-radius:16px 16px 16px 16px;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-field-group .elementor-select-wrapper::before{color:#FFFFFF;}.elementor-972 .elementor-element.elementor-element-31698c80 .e-form__buttons__wrapper__button-next{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-button[type="submit"]{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-message.elementor-message-success{color:#FFFFFF;}.elementor-972 .elementor-element.elementor-element-31698c80 .elementor-message.elementor-message-danger{color:#FF0000;}.elementor-972 .elementor-element.elementor-element-31698c80{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}body.elementor-page-972:not(.elementor-motion-effects-element-type-background), body.elementor-page-972 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://diegonarvaez.co/wp-content/uploads/2025/11/backgroundCosmos.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-972 .elementor-element.elementor-element-4e6e5c68{--content-width:80%;}}@media(min-width:1025px){body.elementor-page-972:not(.elementor-motion-effects-element-type-background), body.elementor-page-972 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}@media(max-width:1024px){.elementor-972 .elementor-element.elementor-element-4e6e5c68{--min-height:80vh;--justify-content:space-around;}.elementor-972 .elementor-element.elementor-element-59dfe0db{--container-widget-width:90%;--container-widget-flex-grow:0;width:var( --container-widget-width, 90% );max-width:90%;}}@media(max-width:767px){.elementor-972 .elementor-element.elementor-element-60f7f336{--min-height:120vh;--padding-top:16%;--padding-bottom:16%;--padding-left:0%;--padding-right:0%;}.elementor-972 .elementor-element.elementor-element-63befe4d{text-align:center;}.elementor-972 .elementor-element.elementor-element-59dfe0db{font-size:18px;}}/* Start custom CSS for form, class: .elementor-element-31698c80 *//* --- INICIO CSS PLASMA (VERSIÓN FORMULARIO Y BOTONES) --- */

/* 1. Selectores Inteligentes 
   a.plasma-fx-form = Enlaces manuales
   button.plasma-fx-form = Botones HTML manuales
   .plasma-fx-form .elementor-button = Botones dentro de widgets (Formularios o Botones Pro)
*/
a.plasma-fx-form,
button.plasma-fx-form,
.plasma-fx-form .elementor-button {
    position: relative;
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    
    /* Estilos base */
    background: transparent !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-family: sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    
    /* Estructura */
    border: none !important;
    border-radius: 26px;
    padding: 15px 40px; 
    overflow: hidden;
    z-index: 1;
    transition: all 0.3s ease;
    cursor: pointer;
}

/* FIX PARA FORMULARIOS: Que ocupe el 100% si es un form */
.elementor-widget-form.plasma-fx-form .elementor-button {
    width: 100%; 
    display: flex;
}

/* 2. El Rayo de Luz (::before) */
a.plasma-fx-form::before,
button.plasma-fx-form::before,
.plasma-fx-form .elementor-button::before {
    content: '';
    position: absolute;
    width: 200%;
    height: 500%;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    
    background: conic-gradient(
        transparent 20%, 
        #00ffff 45%,
        transparent 50%, 
        transparent 70%,
        #a855f7 95%,
        transparent 100%
    );
    
    animation: rotate-border 4s linear infinite;
    z-index: -2;
}

/* 3. El Fondo Negro con Puntos (::after) */
a.plasma-fx-form::after,
button.plasma-fx-form::after,
.plasma-fx-form .elementor-button::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 24px;
    background: #000;
    
    background-image: radial-gradient(rgba(255,255,255,0.2) 1px, transparent 1px);
    background-size: 6px 6px;
    
    z-index: -1;
    transition: all 0.3s ease;
}

/* 4. Animación de Giro */
@keyframes rotate-border {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* --- EFECTOS HOVER --- */

a.plasma-fx-form:hover,
button.plasma-fx-form:hover,
.plasma-fx-form .elementor-button:hover {
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.6);
    transform: translateY(-2px);
    color: #fff !important;
}

/* Acelerar rotación y cambiar a blanco el núcleo */
a.plasma-fx-form:hover::before,
button.plasma-fx-form:hover::before,
.plasma-fx-form .elementor-button:hover::before {
    animation: rotate-border 1.5s linear infinite; 
    background: conic-gradient(
        transparent 20%, 
        #ffffff 45%,
        transparent 50%, 
        transparent 70%,
        #00ffff 95%, 
        transparent 100%
    );
}

/* Fondo interno más claro */
a.plasma-fx-form:hover::after,
button.plasma-fx-form:hover::after,
.plasma-fx-form .elementor-button:hover::after {
    background: rgba(0, 10, 20, 0.95);
    background-image: radial-gradient(rgba(0, 255, 255, 0.4) 1px, transparent 1px);
}


/* --- ESTILOS PARA LOS CAMPOS DEL FORMULARIO (Inputs) --- */

/* 1. Estado Normal (Tecnológico / Espacial) */
.plasma-fx-form .elementor-field-group .elementor-field {
    background-color: rgba(0, 0, 0, 0.7) !important; /* Fondo oscuro semitransparente */
    border: 1px solid rgba(255, 255, 255, 0.3) !important; /* Borde fino estilo cristal */
    color: #ffffff !important; /* Texto blanco al escribir */
    
    /* Glow Blanco Sutil (Estado de reposo) */
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.05); 
    
    border-radius: 12px; /* Bordes suaves modernos */
    backdrop-filter: blur(5px); /* Efecto vidrio (blur del fondo) */
    transition: all 0.3s ease; /* Transición suave */
}

/* Color del texto de ayuda (Placeholder) */
.plasma-fx-form .elementor-field-group .elementor-field::placeholder {
    color: rgba(255, 255, 255, 0.8); /* Gris claro */
    font-size: 16px;
    letter-spacing: 1px;
}

/* 2. Estado Activo / Focus (Cuando escribes) -> Color #A150FF */
.plasma-fx-form .elementor-field-group .elementor-field:focus {
    /* El borde cambia al color deseado */
    border-color: #A150FF !important; 
    
    /* Glow Intenso Morado */
    box-shadow: 0 0 20px rgba(161, 80, 255, 0.4), /* Brillo externo */
                inset 0 0 15px rgba(161, 80, 255, 0.1); /* Brillo interno */
    
    /* El fondo se tiñe ligeramente de morado */
    background-color: rgba(161, 80, 255, 0.05) !important; 
    outline: none; /* Quitamos la línea azul fea del navegador */
}

/* Opcional: Ocultar los Labels (Nombre, Email) para que se vea más limpio */
.plasma-fx-form .elementor-field-group label {
    display: none; 
}/* End custom CSS */