@media (max-width: 600px) {
	* {
		max-width: 100% !important;
		box-sizing: border-box !important;
	}
	
	.wp-site-blocks, .entry-content, .wp-block-group, .wp-block-cover {
		padding: 0 10px !important;
		margin: 0 !important;
		width: 100% !important;
	}
	
	h1, h2, .has-x-large-font-size {
		font-size: 24px !important;
		line-height: 1.4 !important;
		display: block !important;
	}
	
	.wp-block-site-logo img {
		max-width: 100px !important;
	}
}

/* Forzar fondo blanco en los submenús */
.wp-block-navigation .wp-block-navigation__submenu-container {
	background-color: #ffffff !important;
}

/* Forzar texto verde oscuro en los submenús para que se vea sobre el blanco */
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: #1B4D2B !important;
}

/* Alinea el submenú a la izquierda del elemento padre */
.wp-block-navigation .wp-block-navigation__submenu-container {
	left: 0 !important;
	right: auto !important;
	text-align: left !important;
}

/* Elimina márgenes extraños que mueven el submenú */
.wp-block-navigation-item.has-child {
	position: relative !important;
}

/* 1. Fondo blanco y texto verde para el menú móvil abierto */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: #ffffff !important;
}

/* 2. Forzar que todos los textos del menú móvil sean verdes y se alineen a la izquierda */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-open {
	color: #1B4D2B !important;
	text-align: left !important;
	justify-content: flex-start !important;
}

/* 3. Empujar todo el contenido hacia la izquierda */
.wp-block-navigation__responsive-container-content {
	align-items: flex-start !important;
	padding-left: 20px !important;
}

/* 4. Quitar el verde de los submenús también */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	background-color: #ffffff !important;
}

* 1. Fondo blanco total para el menú móvil */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: #ffffff !important;
	align-items: flex-start !important;
/* Alinea todo a la izquierda */
	padding: 40px 20px !important;
/* Espacio para que no toque el borde */
}

/* 2. Alineación de cada palabra a la izquierda */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: flex-start !important;
	text-align: left !important;
	width: 100% !important;
}

/* 3. Asegurar que los enlaces y submenús miren a la izquierda */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start !important;
	width: 100% !important;
}

/* 4. El botón de cerrar (X) también a la izquierda */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	margin-left: 0 !important;
	margin-right: auto !important;
	color: #1B4D2B !important;
	margin-bottom: 20px !important;
}

/* 5. Color verde para todos los textos del menú */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	color: #1B4D2B !important;
	padding-left: 0 !important;
}

/* 1. Importar una fuente moderna (Montserrat) */
/* 2. Aplicarla a títulos y menú para que se vea serio y limpio */
h1, h2, h3, .wp-block-navigation-item__content {
	font-family: 'Montserrat', sans-serif !important;
	letter-spacing: -.5px;
/* Esto hace que el texto se vea más compacto y pro */
}

/* 3. Poner los enlaces principales en negrita y quitar subrayados feos */
.wp-block-navigation-item__content {
	font-weight: 700 !important;
	text-transform: uppercase;
/* Todo en mayúsculas para que sea más imponente */
	font-size: 14px !important;
}

/* 4. Dejar los submenús más suaves (no mayúsculas, menos peso) */
.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-weight: 400 !important;
	text-transform: none;
	font-size: 15px !important;
	text-decoration: none !important;
/* Quita las líneas de los submenús */
}

/* 5. Un toque de sombra suave al header para que "flote" */
header, .wp-block-template-part {
	box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* --- AJUSTES ESPECÍFICOS PARA EL HERO MÓVIL (Zijenik) --- */
@media (max-width: 600px) {
	/* 1. Estirar el fondo de la imagen al 100% de la pantalla */
	.wp-block-cover {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
	}
	
	/* 2. El texto grande: un poco más pequeño, más separado y centrado */
	.wp-block-cover h1, .wp-block-cover .has-x-large-font-size {
		font-size: 26px !important;
		line-height: 1.4 !important;
		margin-bottom: 30px !important;
		text-align: center !important;
		display: block !important;
	}
	
	/* 3. El texto pequeño: centrado y más legible */
	.wp-block-cover .wp-block-group__inner-container p, .wp-block-cover p {
		text-align: center !important;
		margin-bottom: 25px !important;
		width: 90% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	
	/* 4. El botón naranja: más ancho y centrado */
	.wp-block-cover .wp-block-button {
		width: 80% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		display: block !important;
	}
}

/* Hacer que las tres rayitas del móvil sean verdes y grandes */
.wp-block-navigation__responsive-container-open svg {
	width: 32px !important;
	height: 32px !important;
	fill: #1B4D2B !important;
/* Tu verde Zijenik */
}

/* Quitar cualquier texto que acompañe a las rayitas */
.wp-block-navigation__responsive-container-open {
	text-transform: none !important;
	font-size: 0 !important;
/* Esconde la palabra Menú si aparece */
}

/* Alinearlas bien a la derecha */
.wp-block-navigation__responsive-container-open {
	margin-left: auto !important;
	display: flex !important;
}

/* --- LIMPIEZA TOTAL PARA MÓVIL --- */
@media (max-width: 600px) {
	/* 1. Prohibir que nada se salga de la pantalla */
	html, body {
		overflow-x: hidden !important;
		width: 100% !important;
		position: relative !important;
	}
	
	/* 2. Ajustar el bloque de la imagen (Hero) */
	.wp-block-cover, .wp-block-group, .entry-content {
		width: 100vw !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 10px !important;
		padding-right: 10px !important;
		box-sizing: border-box !important;
	}
	
	/* 3. Ajustar el texto verde para que no empuje hacia afuera */
	h1, h2, .has-x-large-font-size {
		font-size: 24px !important;
		line-height: 1.3 !important;
		word-wrap: break-word !important;
		max-width: 100% !important;
	}
	
	/* 4. El Menú: Forzar que se quede dentro del header */
	header, .wp-block-template-part {
		width: 100% !important;
		max-width: 100vw !important;
		padding: 10px !important;
		box-sizing: border-box !important;
	}
	
	/* 5. Asegurar que el botón "Menú" no flote fuera */
	.wp-block-navigation__responsive-container-open {
		margin-right: 10px !important;
	}
	
	/* 1. Forzar que aparezca el icono de hamburguesa (tres rayitas) */
	.wp-block-navigation__responsive-container-open svg {
		display: block !important;
		width: 35px !important;
		height: 35px !important;
		fill: #1B4D2B !important;
	/* Tu verde oscuro */
	}
	
	/* 2. Eliminar la palabra "Menú" si estorba */
	.wp-block-navigation__responsive-container-open {
		font-size: 0 !important;
		padding: 10px !important;
		border: none !important;
		background: none !important;
	}
	
	/* 3. Si el icono sigue sin salir, este código dibuja las 3 rayitas manualmente */
	.wp-block-navigation__responsive-container-open::before {
		content: "";
		display: block;
		width: 25px;
		height: 3px;
		background: #1B4D2B;
		box-shadow: 0 8px 0 #1B4D2B, 0 16px 0 #1B4D2B;
		margin: 10px auto;
	}
	
	/* 4. Alinear el botón a la derecha del header */
	.wp-block-navigation {
		justify-content: flex-end !important;
	}
}

.wp-block-button__link {
	padding: 12px 24px !important;
	font-size: 16px !important;
	white-space: normal !important;
/* Permite que el texto respire */
	text-align: center;
}

/* Unificar tamaño de iconos de beneficios */
.wp-block-image img {
/* --- ALINEACIÓN TOTAL MÓVIL (Zijenik) --- */
/* 1. Header: Logo izquierda, Rayitas derecha */
	display: flex !important;
	flex-direction: row !important;
/* Fuerza la línea horizontal */
	justify-content: space-between !important;
/* Separa los extremos */
	align-items: center !important;
	width: 100% !important;
}

/* 2. Ajustar el logo para que no sea gigante */
.wp-block-site-logo img, .wp-block-image img[src*="zij-en-ik"] {
	max-width: 120px !important;
	height: auto !important;
}

/* 3. Texto del Hero: De izquierda a derecha con margen */
.wp-block-cover h1, 
    .wp-block-cover .has-x-large-font-size,
    .wp-block-cover p {
	text-align: left !important;
/* Alinea el texto a la izquierda */
	width: 90% !important;
	margin-left: 5% !important;
/* Da un pequeño margen para que no toque el borde */
	padding: 0 !important;
	display: block !important;
}

/* 4. El botón también a la izquierda */
.wp-block-cover .wp-block-button {
	text-align: left !important;
	margin-left: 5% !important;
	width: auto !important;
}	
}

/* FORZAR LOGO A LA IZQUIERDA Y MENÚ A LA DERECHA */
@media (max-width: 600px) {
	/* Seleccionamos el contenedor que envuelve logo y menú */
	header .wp-block-group, 
										    header .wp-block-navigation,
										    .wp-block-template-part header > div {
		display: flex !important;
		flex-direction: row !important;
	/* Horizontal */
		justify-content: space-between !important;
	/* Uno a cada punta */
		align-items: center !important;
		width: 100% !important;
		max-width: 100vw !important;
		padding: 10px 15px !important;
		box-sizing: border-box !important;
	}
	
	/* 1. FUERZA BRUTA PARA EL HEADER (LOGO IZQUIERDA - MENÚ DERECHA) */
	@media (max-width: 600px) {
	/* Seleccionamos todos los posibles contenedores del header */
	header div, .wp-block-template-part header, .wp-block-navigation {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		justify-content: space-between !important;
		align-items: center !important;
		width: 100% !important;
		max-width: 100vw !important;
	}
	
	/* Forzar al logo a irse al extremo izquierdo */
	.wp-block-site-logo, header .wp-block-image {
		margin-left: 0 !important;
		margin-right: auto !important;
		flex: 0 1 auto !important;
	}
	
	/* Forzar a las rayitas a irse al extremo derecho */
	.wp-block-navigation__responsive-container-open {
		margin-right: 0 !important;
		margin-left: auto !important;
		flex: 0 1 auto !important;
	}
	
	/* 2. FUERZA BRUTA PARA EL TEXTO (TODO A LA IZQUIERDA) */
	.wp-block-cover__inner-container, 
										    .wp-block-cover__content,
										    .wp-block-group__inner-container {
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
	/* Alinea contenido al inicio (izquierda) */
		text-align: left !important;
	/* Alinea texto a la izquierda */
		width: 100% !important;
		padding-left: 20px !important;
	/* Margen de seguridad */
	}
	
	/* Títulos y párrafos sin márgenes que los centren */
	.wp-block-cover h1, 
										    .wp-block-cover p, 
										    .wp-block-button {
		margin-left: 0 !important;
		margin-right: auto !important;
		text-align: left !important;
		width: 90% !important;
	}
}

@media (max-width: 600px) {
	/* 1. SEPARAR LOGO Y MENÚ */
	header .wp-block-group, 
										    header .wp-block-columns,
										    .wp-block-navigation {
		display: flex !important;
		flex-direction: row !important;
		justify-content: space-between !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* 2. TEXTO A LA IZQUIERDA (Eliminando márgenes automáticos) */
	.wp-block-cover__inner-container,
										    .wp-block-cover h1,
										    .wp-block-cover p,
										    .wp-block-button {
		text-align: left !important;
		margin-left: 0 !important;
	/* Esto quita el centrado */
		margin-right: auto !important;
		align-items: flex-start !important;
		display: flex !important;
		flex-direction: column !important;
	}
	
	/* 3. QUITAR EL BLOQUEO DE ANCHO (El culpable) */
	.entry-content > *, 
										    .wp-block-cover__inner-container {
		max-width: none !important;
		width: 100% !important;
	}
	
	@media (max-width: 600px) {
	/* 1. SEPARAR LOGO Y MENÚ */
	header .wp-block-group, 
										    header .wp-block-columns,
										    .wp-block-navigation {
		display: flex !important;
		flex-direction: row !important;
		justify-content: space-between !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* 2. TEXTO A LA IZQUIERDA (Eliminando márgenes automáticos) */
	.wp-block-cover__inner-container,
										    .wp-block-cover h1,
										    .wp-block-cover p,
										    .wp-block-button {
		text-align: left !important;
		margin-left: 0 !important;
	/* Esto quita el centrado */
		margin-right: auto !important;
		align-items: flex-start !important;
		display: flex !important;
		flex-direction: column !important;
	}
	
	/* 3. QUITAR EL BLOQUEO DE ANCHO (El culpable) */
	.entry-content > *, 
										    .wp-block-cover__inner-container {
		max-width: none !important;
		width: 100% !important;
	}
}

	
}

@media (max-width: 600px) {
	/* 1. HEADER: LOGO IZQUIERDA Y MENÚ DERECHA */
	/* Buscamos el contenedor más profundo para forzar la línea */
	header .wp-block-group, 
										    header .wp-block-navigation,
										    .wp-block-template-part header > div {
		display: flex !important;
		flex-direction: row !important;
	/* Fuerza horizontal */
		justify-content: space-between !important;
	/* Separa extremos */
		align-items: center !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 10px 15px !important;
	}
	
	/* 2. TEXTO DEL HERO (EL VERDE) A LA IZQUIERDA */
	/* Rompemos el centrado del contenedor del fondo */
	.wp-block-cover__inner-container, 
										    .wp-block-cover__content {
		margin-left: 0 !important;
		margin-right: auto !important;
		text-align: left !important;
		width: 100% !important;
		align-items: flex-start !important;
	/* Clave para empujar a la izquierda */
		display: flex !important;
		flex-direction: column !important;
	}
}

/* --- LIMPIEZA TOTAL DE MENÚ MÓVIL --- */
@media (max-width: 900px) {
	/* 1. Ocultar el menú de texto que flota y estorba */
	.wp-block-navigation__container, 
								    .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}
	
	/* 2. Forzar que solo aparezca el botón de las 3 rayitas (hamburguesa) */
	.wp-block-navigation__responsive-container-open {
		display: flex !important;
		margin-left: auto !important;
	}
	
	/* 3. Arreglar el Header para que el logo y las rayas estén en una línea */
	header .wp-block-group, header .wp-block-columns {
		display: flex !important;
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center !important;
		width: 100% !important;
		padding: 10px 20px !important;
	}
	
	/* 4. Evitar que el logo se haga gigante */
	header img, .wp-block-site-logo img {
		max-width: 120px !important;
		height: auto !important;
	}
}

/* --- MENÚ MÓVIL VERTICAL Y LIMPIO --- */
@media (max-width: 600px) {
	/* 1. Forzar que la lista de enlaces sea vertical */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		display: flex !important;
		flex-direction: column !important;
	/* Alineación vertical */
		align-items: flex-start !important;
	/* Alineación a la izquierda */
		gap: 20px !important;
	/* Espacio entre cada botón */
		padding: 40px 20px !important;
	}
	
	/* 2. Arreglar el texto amontonado (HOME, DIENSTEN, etc.) */
	.wp-block-navigation-item, 
							    .wp-block-navigation-item__content {
		display: block !important;
		width: 100% !important;
		text-align: left !important;
		font-size: 20px !important;
	/* Letra más grande y legible */
	}
	
	/* 3. Estilo para los submenús (Thuisbatterij, etc.) */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		padding-left: 20px !important;
	/* Sangría para submenús */
		display: flex !important;
		flex-direction: column !important;
		gap: 15px !important;
	}
	
	/* 4. El botón "Cerrar" arriba a la derecha */
	.wp-block-navigation__responsive-container-close {
		position: absolute !important;
		top: 20px !important;
		right: 20px !important;
	}
}

/* --- MAPA A TODO ANCHO EN MÓVIL --- */
@media (max-width: 600px) {
	/* Seleccionamos el bloque del mapa y sus padres */
	.wp-block-google-maps, 
							    .wp-block-embed-google-maps,
							    iframe[src*="google.com/maps"],
							    .wp-block-group.has-background {
		width: 100% !important;
		max-width: 100vw !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	
	/* Forzar al contenedor padre a dejar de limitar el ancho */
	.wp-site-blocks > .wp-block-group, 
							    .entry-content > .wp-block-group {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	
	/* Ajustar la altura para que sea cómodo de ver */
	iframe[src*="google.com/maps"] {
		height: 350px !important;
	}
}

/* --- FORMULARIO MEDIANO Y CENTRADO --- */
.wp-block-contact-form, 
form.wpcf7-form, 
.wpforms-container {
	max-width: 800px !important;
/* El ancho ideal para que no sea gigante */
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: #f9f9f9;
/* Un gris muy suave de fondo para que resalte */
	padding: 40px !important;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.05);
/* Sombra elegante */
}

/* Ajuste de los campos para que respiren */
input[type="text"], 
input[type="email"], 
textarea {
	border: 1px solid #ccc !important;
	border-radius: 6px !important;
	padding: 12px !important;
	margin-top: 8px !important;
}

/* Centralizar el título que pusiste arriba */
h2.wp-block-heading {
	text-align: center !important;
	margin-bottom: 30px !important;
}

/* AJUSTE MANUAL DE TAMAÑO DE FORMULARIO */
/* Esto busca cualquier formulario dentro de la página de contacto */
form.wp-block-contact-form, 
.wpcf7-form, 
.wpforms-form,
#contact-form-7 /* ID común */ {
	max-width: 650px !important;
/* CAMBIA ESTE NÚMERO: 500px más pequeño, 800px más ancho */
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	padding: 30px !important;
	background-color: #ffffff !important;
/* Para que destaque sobre el fondo gris */
	border-radius: 15px !important;
	box-sizing: border-box !important;
}

/* Forzar que las cajas de texto no se estiren */
.wp-block-contact-form input, 
.wp-block-contact-form textarea {
	width: 100% !important;
	max-width: 100% !important;
}

/* --- FORZAR SOLO LA CAJA DEL FORMULARIO A TAMAÑO MEDIANO --- */
/* 1. Limitamos el ancho de la caja principal del formulario */
.wp-block-contact-form, 
form.grunion-contact-form, 
.wpcf7-form {
	max-width: 600px !important;
/* El tamaño estándar mediano */
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	padding: 30px !important;
	background-color: #ffffff !important;
/* Lo hace resaltar como una caja limpia */
	border-radius: 10px !important;
	box-shadow: 0 5px 20px rgba(0,0,0,0.1) !important;
/* Sombra suave para que flote */
	box-sizing: border-box !important;
}

/* 2. Forzamos que los campos (Nombre, Email) no se estiren fuera de la caja */
.wp-block-contact-form .grunion-field-wrap,
.wp-block-contact-form input,
.wp-block-contact-form textarea {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
	margin-bottom: 15px !important;
}

/* 3. El botón de enviar también se ajusta al centro */
.wp-block-contact-form .contact-submit,
.wp-block-contact-form button[type="submit"] {
	text-align: center !important;
	width: 100% !important;
}

.wp-block-contact-form .button, 
.wp-block-contact-form button {
	width: auto !important;
	min-width: 180px !important;
}

/* --- FORZADO DE CAJA MEDIANA (ESTÁNDAR) --- */
/* Atacamos el contenedor que envuelve al formulario */
.wp-block-contact-form, 
.grunion-contact-form, 
form.wp-block-contact-form {
	display: block !important;
	max-width: 600px !important;
/* El ancho mediano */
	width: 90% !important;
	margin: 0 auto !important;
/* Centrado automático */
	float: none !important;
	padding: 40px !important;
	background-color: #ffffff !important;
/* Caja blanca limpia */
	border-radius: 12px !important;
	box-shadow: 0 10px 40px rgba(0,0,0,0.1) !important;
}

/* Evitar que los campos se salgan de la caja */
.wp-block-contact-form .grunion-field-wrap, 
.wp-block-contact-form .wp-block-jetpack-contact-form-field {
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Centralizar el botón de envío */
.contact-submit, .wp-block-jetpack-contact-form-button {
	text-align: center !important;
	padding-top: 20px !important;
}

/* ELIMINAR ANCHO ESTIRADO - SOLO FORMULARIO */
div.wp-block-jetpack-contact-form, 
.wp-block-contact-form {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
/* Centra el contenido */
	width: 100% !important;
}

/* Forzar la caja a ser mediana */
.wp-block-contact-form form, 
form.grunion-contact-form {
	max-width: 600px !important;
/* EL ESTÁNDAR MEDIANO */
	width: 100% !important;
	margin: 0 auto !important;
	padding: 30px !important;
	background: #ffffff !important;
	border-radius: 10px !important;
	box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}

/* Forzar que los campos de texto NO se pongan de lado a lado */
.grunion-field-wrap {
	width: 100% !important;
	float: none !important;
	margin-bottom: 15px !important;
}

/* CENTRAR Y ENCOGER LA CAJA DE CONTACTO */
.wp-block-jetpack-contact-form {
	max-width: 650px !important;
/* Ancho estándar mediano */
	margin: 40px auto !important;
/* Lo separa de arriba/abajo y lo centra */
	background-color: #ffffff !important;
/* Fondo blanco para que destaque */
	padding: 40px !important;
	border-radius: 15px !important;
	box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
/* Sombra profesional */
}

/* Hacer que el fondo gris de la captura sea el que rodea a la caja blanca */
.page-id-71 .entry-content {
	background-color: #f0f2f5;
/* O el gris que prefieras para el fondo de la web */
}

/* Ajustar los campos para que no toquen los bordes de la nueva caja blanca */
.wp-block-jetpack-contact-form input,
.wp-block-jetpack-contact-form textarea {
	width: 100% !important;
	border: 1px solid #ccc !important;
	border-radius: 5px !important;
}

/* 1. ARREGLAR JA / NEE (Radio buttons) */
.wp-block-jetpack-contact-form .grunion-radio-label {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
/* Separa el círculo de la palabra */
	width: auto !important;
	white-space: nowrap !important;
/* Evita que la letra se vaya abajo */
}

/* 2. ARREGLAR EL CAMPO DE TEXTO (Opmerkingen) */
.wp-block-jetpack-contact-form textarea {
	min-height: 150px !important;
	margin-bottom: 5px !important;
}

/* 3. ARREGLAR EL TEXTO LEGAL DEL FINAL */
.wp-block-jetpack-contact-form .contact-form-submission-consent {
	display: flex !important;
	align-items: flex-start !important;
	gap: 10px !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
	margin-top: 20px !important;
}

/* 4. LIMPIAR EL MENSAJE DE ERROR (Opcional) */
.wp-block-jetpack-contact-form .form-error {
	font-size: 13px !important;
	margin-top: 5px !important;
}

/* 1. ARREGLAR BOTÓN DE ENVIAR (Para que no sea una barra infinita) */
.wp-block-jetpack-contact-form .contact-submit button,
.wp-block-jetpack-contact-form input[type="submit"] {
	width: auto !important;
	min-width: 200px !important;
	max-width: 100% !important;
	background-color: #1B4D2B !important;
/* Tu verde */
	padding: 12px 30px !important;
	border-radius: 5px !important;
	display: inline-block !important;
}

/* 2. ARREGLAR EL CHECKBOX ESTIRADO */
.wp-block-jetpack-contact-form .contact-form-submission-consent input[type="checkbox"] {
	width: 20px !important;
/* Tamaño normal de un cuadradito */
	height: 20px !important;
	margin-right: 10px !important;
	flex-shrink: 0 !important;
	appearance: checkbox !important;
/* Fuerza a que parezca un checkbox */
	-webkit-appearance: checkbox !important;
}

/* 3. ALINEAR TEXTO LEGAL */
.wp-block-jetpack-contact-form .contact-form-submission-consent {
	display: flex !important;
	align-items: center !important;
	text-align: left !important;
	margin-top: 20px !important;
}

/* 1. ELIMINAR LA BARRA VERDE (Checkbox estirado) */
.wp-block-jetpack-contact-form .contact-form-submission-consent input[type="checkbox"] {
	appearance: checkbox !important;
	-webkit-appearance: checkbox !important;
	width: 18px !important;
/* Fuerza el tamaño cuadrado */
	height: 18px !important;
	min-width: 18px !important;
	margin-right: 12px !important;
	cursor: pointer !important;
	display: inline-block !important;
	flex-shrink: 0 !important;
/* Evita que se aplaste */
}

/* 2. ALINEAR EL TEXTO LEGAL AL LADO DEL CUADRADITO */
.wp-block-jetpack-contact-form .contact-form-submission-consent {
	display: flex !important;
	flex-direction: row !important;
/* Obliga a estar en la misma línea */
	align-items: flex-start !important;
	text-align: left !important;
	padding: 10px 0 !important;
	width: 100% !important;
}

/* 3. ARREGLAR EL BOTÓN DE ENVIAR (Para que no sea gigante) */
.wp-block-jetpack-contact-form .contact-submit button {
	width: auto !important;
	padding: 12px 40px !important;
	background-color: #1B4D2B !important;
	border: none !important;
	border-radius: 4px !important;
}

/* --- RESETEO TOTAL DEL FORMULARIO ZIJENIK --- */
/* 1. ELIMINAR LA BARRA VERDE (Forzar el cuadradito) */
.wp-block-jetpack-contact-form input[type="checkbox"] {
/* Ignora todas las reglas del tema */
	width: 20px !important;
	height: 20px !important;
	margin-right: 15px !important;
	float: left !important;
/* Lo pega a la izquierda */
	accent-color: #1B4D2B !important;
/* Lo pone de tu color verde */
}

/* 2. ARREGLAR EL TEXTO QUE SE CORTA (Ja / Nee) */
.grunion-radio-label, .grunion-checkbox-label {
	display: inline-block !important;
	width: auto !important;
	white-space: nowrap !important;
/* Evita que las letras bajen */
	margin-bottom: 10px !important;
}

/* 3. ENCOGER LA CAJA DEL FORMULARIO (Estándar Mediano) */
.wp-block-jetpack-contact-form {
	max-width: 600px !important;
	width: 100% !important;
	margin: 40px auto !important;
	padding: 30px !important;
	background: #ffffff !important;
	border-radius: 15px !important;
	box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
	display: block !important;
}

/* 4. ARREGLAR EL TEXTO LEGAL DEL FINAL */
.contact-form-submission-consent {
	display: block !important;
	overflow: hidden !important;
	margin-top: 25px !important;
}

/* REAPARICIÓN DEL BOTÓN ENVIAR */
.wp-block-jetpack-contact-form .contact-submit,
.wp-block-jetpack-contact-form .wp-block-button__link,
.wp-block-jetpack-contact-form button[type="submit"] {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: 100% !important;
/* Ocupa todo el ancho de la caja blanca */
	max-width: 300px !important;
/* Pero no más de 300px */
	margin: 20px auto !important;
/* Centrado */
	padding: 15px 30px !important;
	background-color: #1B4D2B !important;
/* Tu verde oscuro */
	color: #ffffff !important;
/* Texto blanco */
	border-radius: 8px !important;
	font-weight: bold !important;
	text-align: center !important;
	cursor: pointer !important;
	border: none !important;
	height: auto !important;
}

/* Efecto al pasar el ratón para saber que funciona */
.wp-block-jetpack-contact-form button[type="submit"]:hover {
	background-color: #2a7a44 !important;
	transform: scale(1.02);
}

/* ARREGLO DEFINITIVO BOTÓN VERZENDEN */
.wp-block-jetpack-contact-form .contact-submit button,
.wp-block-jetpack-contact-form button[type="submit"] {
	display: inline-block !important;
	width: auto !important;
/* Que el ancho lo mande el texto */
	min-width: 220px !important;
/* Un mínimo para que no se vea raquítico */
	padding: 15px 40px !important;
	background-color: #1B4D2B !important;
	color: #ffffff !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	text-transform: none !important;
/* Evita que las mayúsculas lo estiren más */
	white-space: nowrap !important;
/* ¡ESTO evita que la palabra se parta! */
	border-radius: 8px !important;
	border: none !important;
	cursor: pointer !important;
	margin: 20px auto !important;
}

/* Centrar el contenedor del botón */
.contact-submit {
	text-align: center !important;
	width: 100% !important;
}

/* CENTRAR BOTÓN EN EL FORMULARIO */
.wp-block-jetpack-contact-form .contact-submit,
div.contact-submit {
	display: flex !important;
	justify-content: center !important;
/* Centrado horizontal */
	align-items: center !important;
	width: 100% !important;
	padding: 20px 0 !important;
	clear: both !important;
}

.wp-block-jetpack-contact-form .contact-submit button,
.wp-block-jetpack-contact-form button[type="submit"] {
	display: inline-block !important;
	width: auto !important;
	min-width: 200px !important;
/* Tamaño mediano estándar */
	padding: 14px 35px !important;
	background-color: #1B4D2B !important;
/* Tu verde */
	color: #ffffff !important;
	font-size: 18px !important;
	font-weight: bold !important;
	border-radius: 8px !important;
	border: none !important;
	white-space: nowrap !important;
/* Evita que la palabra se parta */
	cursor: pointer !important;
}.wp-block-template-part {
    border: none !important;
    outline: none !important;
}