/* Víctor SEO WEB Widgets 2.0 · vs2-formulario.css
   El widget Formulario de Elementor Pro con la clase «vs2-form», con el aspecto de la maqueta de web/ (.vs-form,
   .vs-field, .vs-check). Escrito para el HTML de Pro. El contenedor de la plantilla lleva «vs-card vs-form» e id
   «formulario»; los textos del diseño (título, ayudas, nota, aviso legal) son campos HTML con sus clases vs-. */

/* El contenedor de la plantilla: el relleno, el radio y la sombra son los de .vs-card.vs-form del diseño. */
.e-con.e-con.vs-form{--display: block; --gap: 0px; --row-gap: 0px; --column-gap: 0px; --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; --width: 100%; max-width: none;}
.e-con.vs-form > .e-con-inner{display: block; max-width: none; padding: 0;}
.e-con.vs-form .elementor-widget{margin: 0;}
.vs2 .e-con.vs-form{background-color: var(--vs-white); border-radius: var(--vs-r-lg); padding: clamp(24px, 4vw, 40px);}
/* En móvil la tarjeta sale un poco del margen, como .vs-form en el diseño (menos en el hero de Contacto). Hace falta
   más peso que el reinicio de márgenes de los elementos de Elementor dentro de los contenedores 2.0. */
@media (max-width: 639px){.vs2 .e-con.e-con.vs-form{width: auto; margin-inline: calc(var(--vs-gutter) * -.4);}.vs2 .vs-hero--contact .e-con.e-con.vs-form{margin: 0;}}

/* Prefijo con especificidad suficiente para ganar al CSS de Elementor Pro, sin !important */
body .elementor-widget-form.vs2-form.vs2-form{font-family: var(--vs-font); color: var(--vs-ink); font-size: 1.0625rem; line-height: 1.65;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-form{margin: 0; padding: 0; width: 100%;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-form-fields-wrapper{display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 18px; row-gap: 0; margin: 0;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group{grid-column: 1 / -1; width: auto; max-width: none; flex: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch;}
/* El núcleo de Elementor da flex-basis: 100 % a los campos y al botón (etiquetas encima, botón a todo el ancho) y
   deja que los grupos salten de línea: en un grupo en columna, eso es el 100 % del alto, y lo que va detrás (la nota
   y el aviso legal bajo el botón) saltaba a otra columna, fuera de la tarjeta. Cada hijo, a su tamaño. */
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group > *{flex: none;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group.elementor-col-50{grid-column: auto;}
@media (max-width: 639px){body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group.elementor-col-50{grid-column: 1 / -1;}}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-html{margin-bottom: 0; display: block;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-honeypot{position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;}

/* Textos del diseño (campos HTML) */
body .elementor-widget-form.vs2-form.vs2-form .vs-form__title{margin: 0 0 24px; font-size: 1.375rem; font-weight: 600; line-height: 1.65; letter-spacing: -.015em; color: var(--vs-ink); font-family: var(--vs-font);}
body .elementor-widget-form.vs2-form.vs2-form .vs-form__title.vs-h2{font-size: 1.5rem; line-height: 1.25; margin-bottom: 20px; font-family: var(--vs-font-head);}
body .elementor-widget-form.vs2-form.vs2-form .vs-help{margin: 6px 0 0; font-size: .8125rem; line-height: 1.4; color: var(--vs-slate);}
body .elementor-widget-form.vs2-form.vs2-form .vs-form__legal{margin: 0 0 22px; font-size: .8125rem; line-height: 1.5; color: var(--vs-slate);}
body .elementor-widget-form.vs2-form.vs2-form .vs-form__note{margin: 12px 0 0; font-size: .875rem; color: var(--vs-slate); text-align: center;}
body .elementor-widget-form.vs2-form.vs2-form a{color: var(--vs-brand);}
body .elementor-widget-form.vs2-form.vs2-form a:hover{color: var(--vs-brand-dark);}

/* Etiquetas y obligatorio (el asterisco del diseño, en color de marca) */
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-label{margin: 0 0 6px; padding: 0; font-size: .875rem; font-weight: 600; line-height: 1.65; color: var(--vs-ink); font-family: inherit;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-mark-required .elementor-field-label::after{content: " *"; color: var(--vs-brand); margin: 0; padding: 0;}

/* Campos */
body .elementor-widget-form.vs2-form.vs2-form :is(.elementor-field-textual, .elementor-field-textual:hover){width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid #CDD2DD; border-radius: var(--vs-r-sm); background: #fff; color: var(--vs-ink); font-family: inherit; font-size: 1rem; line-height: 1.65; box-shadow: none; transition: border-color .2s, box-shadow .2s;}
body .elementor-widget-form.vs2-form.vs2-form :is(textarea.elementor-field-textual, textarea.elementor-field-textual:hover){min-height: 120px; resize: vertical; line-height: 1.5;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-textual::placeholder{color: #8A93A5; opacity: 1;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-textual:focus{outline: none; border-color: var(--vs-brand); box-shadow: 0 0 0 4px rgba(91, 61, 245, .15);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-select-wrapper{position: relative; background: transparent; border: 0; padding: 0;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-select-wrapper::before{content: none;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-select-wrapper .select-caret-down-wrapper{display: none;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-select-wrapper::after{content: ""; position: absolute; right: 16px; top: 50%; width: 8px; height: 8px; border-right: 1.6px solid var(--vs-ink); border-bottom: 1.6px solid var(--vs-ink); transform: translateY(-70%) rotate(45deg); pointer-events: none;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-select-wrapper select{appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer;}

/* Casilla de privacidad (como .vs-check) */
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance{margin: 0 0 12px;} /* en la maqueta, sus 4 px de arriba se juntan con los 18 del campo de antes */
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance .elementor-field-subgroup{display: block; margin: 0;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance .elementor-field-option{display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 4px 12px; align-items: start; margin: 0; padding: 0; width: auto;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance input[type=checkbox]{appearance: none; -webkit-appearance: none; width: 22px; height: 22px; margin: 1px 0 0; border: 1.5px solid #AEB6C7; border-radius: 6px; display: grid; place-content: center; cursor: pointer; background: #fff; transition: background-color .2s, border-color .2s;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance input[type=checkbox]::before{content: ""; width: 12px; height: 12px; background: #fff; clip-path: polygon(14% 52%, 0 66%, 38% 100%, 100% 22%, 86% 8%, 38% 72%); transform: scale(0); transition: transform .2s var(--vs-ease);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance input[type=checkbox]:checked{background: var(--vs-brand); border-color: var(--vs-brand);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance input[type=checkbox]:checked::before{transform: scale(1);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance label{font-size: .9375rem; font-weight: 400; line-height: 1.45; padding: 0; margin: 0; color: var(--vs-ink);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-acceptance.elementor-mark-required .elementor-field-option label::after{content: " *"; color: var(--vs-brand); margin: 0;}

/* Botón (vs-btn vs-btn--primary vs-btn--lg vs-btn--block) */
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-type-submit{margin: 0;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-button{display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 54px; padding: 0 26px; border: 1.5px solid transparent; border-radius: var(--vs-r-sm); background: var(--vs-brand); background-image: none; color: #fff; font-family: var(--vs-font-btn); font-size: 1.0625rem; font-weight: 600; line-height: 1.1; letter-spacing: normal; text-transform: none; box-shadow: 0 8px 20px -10px rgba(91, 61, 245, .7); cursor: pointer; transition: background-color .2s, box-shadow .2s, transform .15s;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-button:hover{background: var(--vs-brand-dark); color: #fff; box-shadow: 0 12px 26px -10px rgba(91, 61, 245, .75);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-button:active{transform: translateY(1px);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-button:focus-visible{outline: 2px solid var(--vs-brand); outline-offset: 3px;}

/* Mensajes de Pro: error del campo y resultado del envío (como .vs-error y .vs-form__status) */
body .elementor-widget-form.vs2-form.vs2-form .elementor-error .elementor-field-textual{border-color: var(--vs-error);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group .elementor-message{margin: 6px 0 0; font-size: .8125rem; color: var(--vs-error);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-message{margin: 14px 0 0; font-size: .9375rem; font-weight: 600; line-height: 1.5; color: var(--vs-ink);}
body .elementor-widget-form.vs2-form.vs2-form .elementor-message::before{content: none;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-message.elementor-message-success{padding: 14px 16px; border-radius: var(--vs-r-sm); background: #E8F6EE; color: #0E5C36; font-weight: 500;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-message.elementor-message-danger{color: var(--vs-error);}

/* Etiquetas encima siempre y cada campo a todo el ancho de su grupo, aunque el formulario tenga «Etiquetas en
   línea» u otro CSS ponga los grupos en fila. Solo aquí se usa !important: es la colocación, no un estilo. */
body .elementor-widget-form.vs2-form.vs2-form .elementor-form-fields-wrapper{display: grid !important; flex-wrap: nowrap;}
body .elementor-widget-form.vs2-form.vs2-form .elementor-field-group:not(.elementor-field-type-submit):not(.elementor-field-type-html):not(.elementor-field-type-honeypot):not(.elementor-field-type-hidden):not(.elementor-field-type-acceptance) > *{width: 100% !important; max-width: 100% !important; flex: none; margin-left: 0; margin-right: 0;}
