/* elementor-puente.css — PUENTE DE INTEGRACIÓN, NO DISEÑO.
 *
 * Este fichero no es una copia del boceto (los otros tres de assets/css/ sí lo son, los
 * sincroniza tema/sincronizar.sh). Vive sólo aquí porque el problema sólo existe aquí: en
 * WordPress el marcado del boceto viaja dentro de contenedores de Elementor, y esos
 * contenedores traen ajustes propios que el boceto no declara.
 *
 * Regla de este fichero: ni un color, ni una tipografía, ni una medida propia. Sólo aparta
 * los defaults de Elementor para que decida el CSS del boceto.
 *
 * Se carga DESPUÉS de tinta.css (functions.php).
 */

/* Los contenedores nuestros llevan la clase `cr`. Medido en producción 2026-09-08 sobre el
 * contenedor de la portada: `gap: 20px` y `padding: 10px`, ninguno declarado por el boceto
 * (los 20px metían un aire de más entre las cinco secciones y el padding empujaba el sitio
 * entero 10px hacia dentro, partiendo el borde inferior de la cabecera).
 *
 * Se reescriben las VARIABLES, no las propiedades. Elementor conduce esos dos ajustes por
 * variables —`.e-con { padding-inline-start: var(--padding-inline-start) }`,
 * `.elementor-element:where(.e-con-full,.elementor-widget) { gap: var(--row-gap) var(--column-gap) }`—
 * con especificidad (0,1,0), la misma que `.caja`, `.seccion`, `.bloque` o `.formulario`.
 * Reescribir aquí las PROPIEDADES obligaría a subir de especificidad y el boceto perdería el
 * control (`.seccion` se quedaría sin su padding vertical, `.formulario` sin su grid);
 * reescribir las VARIABLES en (0,2,0) deja las propiedades donde estaban y el valor final
 * vuelve a salir del boceto. Control negativo medido: quitando esta regla, gap vuelve a 20px.
 *
 * Lo que NO hace falta, medido, y por qué no se pone:
 *   - `--display`: Elementor lo emite POR ELEMENTO en su CSS de post
 *     (`.elementor-2716 .elementor-element.elementor-element-859a3cd { --display: flex }`,
 *     especificidad (0,3,0)), así que una regla (0,2,0) no lo gana. Y no hace falta: con el
 *     gap a 0, una columna flex de secciones a ancho completo se dispone igual que el flujo
 *     de bloque del boceto, y donde el boceto SÍ declara display (`.bloque`, `.formulario`,
 *     `.rasgos`…) gana él, porque ahí la pelea es de propiedad a propiedad y no de variable.
 *   - `--gap`: ninguna regla la consume; la que se aplica es `--row-gap`/`--column-gap`.
 *   - `--margin-*`: ya valen 0px de fábrica.
 */
.e-con.cr {
  --row-gap: 0px;
  --column-gap: 0px;
  --padding-top: 0px;
  --padding-right: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
}

/* El widget Form separa sus campos con un canalón propio (controles `column_gap`/`row_gap`, con
 * valor por defecto aunque nadie los toque) y Elementor lo emite en el CSS del post con
 * especificidad (0,4,0): 5px de padding lateral y 10px de margen inferior por campo, más los
 * márgenes negativos con que el envoltorio los compensa. Medido: los campos salían 570px de
 * ancho dentro de un `.formulario` de 560 —se salían por la derecha— y el ritmo vertical lo
 * ponía ese canalón en vez del `gap` del boceto.
 *
 * Se apaga aquí y no en los ajustes del widget porque el diseño no puede vivir en Elementor.
 * Los ceros no son medidas de diseño: son «Elementor no pone espacio», y el espacio lo pone el
 * boceto. Empata en especificidad con el CSS del post y manda por orden de carga. */
.e-con.cr .elementor-form .elementor-field-group {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 0;
}
.e-con.cr .elementor-form .elementor-form-fields-wrapper {
  margin: 0;
}

/* En el boceto `.cabecera` es hija de <body> y su `position: sticky` tiene todo el documento
 * por delante. En WordPress la envuelven cuatro cajas (la ubicación del Theme Builder, el
 * contenedor y los dos <div> del widget) y el sticky sólo puede recorrer la altura de su
 * padre, que es la de la propia cabecera: queda inerte. La posición se devuelve al envoltorio,
 * que sí es hijo del <body>.
 *
 * No son una decisión de diseño nueva: son el mismo comportamiento trasladado al elemento que
 * puede ejercerlo. La profundidad sale del token `--z-cabecera` (tokens.css) y no de un 10
 * escrito aquí: era la única medida propia de este fichero y nada vigilaba que las dos copias
 * —ésta y la de `.cabecera` en base.css— no se separaran. */
.elementor-location-header {
  position: sticky;
  top: 0;
  z-index: var(--z-cabecera);
}