/*
 * Tokens Elementor — V4 primero, V3 como fallback (kit + design-system-sync).
 * Definir en Variables V4 (y sync a Global Colors/Fonts V3):
 *   color-primary | color-secondary | color-white | color-surface
 *   font-body | font-primary
 */
:root {
	--cs-color-primary: var(--color-primary, var(--e-global-color-primary));
	--cs-color-secondary: var(--color-secondary, var(--e-global-color-secondary));
	--cs-color-text: var(--e-global-color-text);
	--cs-color-accent: var(--e-global-color-accent);
	--cs-color-on-dark: var(--color-on-dark, #ffffff);
	--cs-color-surface: var(--color-surface, #efefef);
	--cs-site-max-width: var(--site-max-width, 1600px);
	--cs-font-body: var(--font-body, var(--e-global-typography-v4-text-body-font-family), sans-serif);
	--cs-font-heading: var(--font-primary, var(--e-global-typography-primary-font-family), sans-serif);
}

.formulari p, .formulari p a, .pop1 a, .popmake-22302 { color: var(--cs-color-on-dark) !important; }
.bloc01, .bloc02 { display: flex; flex-flow: wrap; justify-content: space-between; align-items: stretch; }
.bloc02 { margin-top: 40px; align-items: center; }
.columna01 input.wpcf7-text { width: 550px; }
.columna02 textarea { height: 330px; font-size: 12px; color: var(--cs-color-on-dark); }
.columna03 { margin-top: 20px; font-size: 12px; }
.bloc02 span.wpcf7-list-item { display: inline-block; margin: 0; }
.email-telefono { display: block !important; margin-bottom: 20px !important; }
.email { width: 48% !important; float: right; }
.telefono { width: 48% !important; }
.columna04 { width: 70%; }
.columna04 p { font-size: 14px; line-height: 1.5625rem; }
.columna05 .wpcf7-submit { padding: 15px 70px; font-size: 34px; font-weight: 700; }
.wpcf7-response-output { margin: 2em 0.5em 1em; padding: 2em; border: 2px solid var(--cs-color-primary); font-size: 18px; font-weight: 700; }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--cs-color-on-dark); background-color: var(--cs-color-on-dark); }

input[type="text"], input[type="email"], textarea, select { 
	font-family: var(--cs-font-body);
	font-weight: 600 !important; font-style: italic; color: var(--cs-color-text) !important; background-color: var(--cs-color-on-dark); border-color: rgba(0,0,0,0); 
}
.intl-tel-input .country-list li.country { color: var(--cs-color-text); }

@media (max-width: 1024px) {
	.formulari, .columna04 { width: 100%; }
	.formulari { padding: 0 40px; }
	.columna01 input.wpcf7-text { width: 100%; }
	.bloc01 { display: block; }
	.formulari .wpcf7-textarea { max-height: 170px; }
}

/* -------------------------------------------------------------------------
   Menús Elementor — IDs estables en Header Base (28893):
     #site-topbar      → barra azul superior (padding lateral)
     #site-navigation  → barra blanca (sticky + mega + padding lateral)
     #cs-nav-secondary / .cs-nav-secondary → menú superior
     #cs-nav-primary   / .cs-nav-primary   → menú principal
   ------------------------------------------------------------------------- */
:is(#site-topbar, #site-navigation) {
	padding-left: max(20px, calc((100vw - var(--site-max-width, 1600px)) / 2)) !important;
	padding-right: max(20px, calc((100vw - var(--site-max-width, 1600px)) / 2)) !important;
	box-sizing: border-box;
}
:is(#cs-nav-secondary, .cs-nav-secondary) .elementor-nav-menu a,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu a {
	text-transform: none !important;
}

:is(#cs-nav-secondary, .cs-nav-secondary) .sub-arrow,
:is(#cs-nav-primary, .cs-nav-primary) .sub-arrow {
	display: none !important;
}

/*
 * Elementor usa flex en fila en .elementor-item / .elementor-sub-item.
 * Sin flex-direction:column la .description queda al lado del título.
 */
:is(#cs-nav-secondary, .cs-nav-secondary) .elementor-nav-menu a.elementor-item,
:is(#cs-nav-secondary, .cs-nav-secondary) .elementor-nav-menu a.elementor-sub-item,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu a.elementor-item,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu a.elementor-sub-item {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	flex-wrap: nowrap !important;
	white-space: normal !important;
	height: auto !important;
	line-height: 1.25 !important;
}

:is(#cs-nav-secondary, .cs-nav-secondary) .elementor-nav-menu a .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu a .description {
	display: block !important;
	position: static !important;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 auto !important;
	align-self: stretch !important;
	box-sizing: border-box;
	line-height: 1.25 !important;
	margin: 0.2em 0 0 !important;
	padding: 0 !important;
	text-transform: none !important;
	font-size: 0.75em !important;
	font-weight: 400 !important;
	font-style: normal;
	opacity: 0.65;
	white-space: normal !important;
	text-rendering: optimizelegibility;
	-webkit-font-smoothing: antialiased;
}

/* Título + descripción: no heredar blanco en hover/activo */
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a:hover,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a:focus,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a.highlighted,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item-active,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li.current-menu-item > a,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li.current-menu-ancestor > a {
	color: var(--color-secondary, var(--cs-color-secondary)) !important;
	fill: var(--color-secondary, var(--cs-color-secondary)) !important;
}

:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a:hover .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a:focus .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a.highlighted .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item-active .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li.current-menu-item > a .description,
:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li.current-menu-ancestor > a .description {
	color: var(--color-secondary, var(--cs-color-secondary)) !important;
	opacity: 0.55 !important;
	fill: unset !important;
}

/* Sticky: el header entero, desplazado -altura(topbar) para que solo quede #site-navigation.
 * Sticky en #site-navigation solo no funciona: su padre <header> es bajo y se va al scroll. */
.elementor-location-header {
	--cs-topbar-h: 0px;
	position: sticky;
	top: calc(-1 * var(--cs-topbar-h));
	z-index: 10000;
	width: 100%;
	overflow: visible;
}

#site-navigation {
	position: relative;
	z-index: 1;
	width: 100%;
	background-color: var(--cs-color-on-dark, #ffffff);
}

@media (min-width: 1025px) {
	/*
	 * Elementor pone align-items:center → el menú no llena la altura del logo.
	 * Mega (position:static) se ancla a #site-navigation; el resto al <li>.
	 * Sin stretch, el mega arranca más abajo que los otros dropdowns.
	 */
	#site-navigation {
		align-items: stretch !important;
	}

	#site-navigation > .e-con,
	#site-navigation > .e-div-block-base {
		align-self: stretch !important;
		display: flex !important;
		align-items: center !important; /* logo / menú centrados en su columna */
		height: auto !important;
	}

	.elementor-location-header,
	#site-navigation .e-con,
	#site-navigation .e-con-inner,
	#site-navigation .elementor-element,
	#site-navigation .elementor-widget,
	#site-navigation .elementor-widget-container,
	#site-navigation .elementor-nav-menu--main,
	#site-navigation .elementor-nav-menu {
		overflow: visible !important;
	}

	#site-navigation .e-con,
	#site-navigation .e-con-inner,
	#site-navigation .elementor-element,
	#site-navigation .elementor-widget,
	#site-navigation .elementor-widget-container,
	#site-navigation .elementor-nav-menu--main,
	#site-navigation .elementor-nav-menu {
		position: static !important;
		transform: none !important;
	}

	/* El widget del menú principal ocupa toda la altura de la barra */
	:is(#cs-nav-primary, .cs-nav-primary),
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-widget-container,
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main {
		align-self: stretch !important;
		height: 100% !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: stretch !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-widget-container {
		flex: 1 1 auto !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main {
		flex: 1 1 auto !important;
		width: 100%;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: stretch;
		height: 100% !important;
		flex: 1 1 auto !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li {
		border-right: 1px solid color-mix(in srgb, var(--cs-color-secondary) 15%, transparent);
		display: flex !important;
		align-items: stretch;
		height: 100% !important;
	}
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li:last-child {
		border-right: none;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li > a {
		letter-spacing: -0.4px;
		line-height: 1.25;
		padding-top: 0.85em;
		padding-bottom: 0.85em;
		height: 100%;
		box-sizing: border-box;
	}

	:is(#cs-nav-secondary, .cs-nav-secondary) .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown {
		min-width: 280px;
		padding: 10px 0;
		top: 100% !important;
		margin-top: 0 !important;
	}

	/* Desplegables normales del menú principal (no mega): más anchos.
	 * SmartMenus/Elementor escribe width inline = ancho del <li>; hace falta !important. */
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li:not(.mega-menu) > .elementor-nav-menu--dropdown {
		width: 360px !important;
		min-width: 360px !important;
		max-width: min(420px, calc(100vw - 24px)) !important;
		padding: 10px 0 !important;
		top: 100% !important;
		margin-top: 0 !important;
		left: 0 !important;
		right: auto !important;
		inset-inline-start: 0 !important;
		inset-inline-end: auto !important;
		box-sizing: border-box !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li:not(.mega-menu) > .elementor-nav-menu--dropdown a {
		white-space: normal !important;
	}

	/* Si no cabe a la derecha (último ítem o clase JS): abre hacia la izquierda */
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li:not(.mega-menu):last-child > .elementor-nav-menu--dropdown,
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li:not(.mega-menu).cs-dropdown-flip > .elementor-nav-menu--dropdown {
		left: auto !important;
		right: 0 !important;
		inset-inline-start: auto !important;
		inset-inline-end: 0 !important;
	}

	/* Mega menu: clase "mega-menu" en el ítem de WP Menús */
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu {
		position: static !important;
	}

	/*
	 * Sin hueco entre barra y panel: si hay gap, el :hover se pierde.
	 * Mismo top/padding vertical que el resto de dropdowns; puente ::before.
	 */
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu:hover > .elementor-nav-menu--dropdown,
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu:focus-within > .elementor-nav-menu--dropdown,
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu.focus > .elementor-nav-menu--dropdown {
		display: flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		position: absolute !important;
		top: 100% !important;
		left: 0 !important;
		right: auto !important;
		inset-inline-start: 0 !important;
		inset-inline-end: auto !important;
		width: 100vw !important;
		max-width: 100vw !important;
		margin: 0 0 0 calc(50% - 50vw) !important;
		transform: none !important;
		transition: none !important;
		animation: none !important;
		/* Fondo/color/tipografía: los del dropdown Elementor (no override). */
		z-index: 99999 !important;
		padding-top: 10px !important;
		padding-bottom: 10px !important;
		padding-left: max(20px, calc((100vw - var(--site-max-width, 1600px)) / 2)) !important;
		padding-right: max(20px, calc((100vw - var(--site-max-width, 1600px)) / 2)) !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		justify-content: center !important;
		align-items: flex-start !important;
		border-radius: 0 !important;
		box-sizing: border-box !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu:hover > .elementor-nav-menu--dropdown::before,
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu:focus-within > .elementor-nav-menu--dropdown::before,
	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu.focus > .elementor-nav-menu--dropdown::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 100%;
		height: 12px;
		background: transparent;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown > li {
		flex: 1 1 0 !important;
		max-width: 350px !important;
		padding: 0 20px !important;
		border: none !important;
		display: block !important;
		position: relative !important;
		width: auto !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown > li > a {
		text-transform: none !important;
		border-bottom: 2px solid var(--cs-color-primary) !important;
		margin-bottom: 8px !important;
		padding-bottom: 8px !important;
		display: block !important;
		background: transparent !important;
		line-height: 1.3 !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown > li > .elementor-nav-menu--dropdown {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		position: relative !important;
		top: 0 !important;
		left: 0 !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		box-shadow: none !important;
		background: transparent !important;
		padding: 0 !important;
		margin: 0 !important;
		border: none !important;
		transform: none !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown > li > .elementor-nav-menu--dropdown li {
		width: 100% !important;
		border: none !important;
		display: block !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown > li > .elementor-nav-menu--dropdown a {
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		text-transform: none !important;
		background: transparent !important;
		border: none !important;
		white-space: normal !important;
		height: auto !important;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .mega-menu > .elementor-nav-menu--dropdown .description {
		margin-top: 0.25em !important;
		display: block !important;
		width: 100% !important;
		line-height: 1.3 !important;
		white-space: normal !important;
	}
}

@media (max-width: 1024px) {
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-nav-menu--main > .elementor-nav-menu > li {
		border-right: none;
	}

	:is(#cs-nav-primary, .cs-nav-primary) .elementor-item .description {
		font-weight: 700;
		font-size: 10px;
		opacity: 0.8;
	}
}

@media (max-width: 768px) {
	:is(#cs-nav-primary, .cs-nav-primary) .elementor-item .description {
		font-size: 14px;
		color: var(--cs-color-primary) !important;
		font-weight: 400;
		opacity: 1;
	}
}

ul li .menu1 a { color: var(--cs-color-on-dark) !important; }
ul li .menu1 a:hover { color: var(--cs-color-primary) !important; }

.acordio mark, .gris mark { font-size: 30px; font-weight: 700; line-height: 2.2rem; }
.acordio mark { background-color: var(--cs-color-on-dark) !important; }
.gris mark { background-color: var(--cs-color-surface) !important; }
.peu a { color: var(--cs-color-on-dark) !important; text-decoration: underline !important; }

.cs-center-layout {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	margin-top: 30px;
}

.cs-center-form-col .wpcf7 {
	background: var(--cs-color-surface);
	padding: 30px;
	border-radius: 8px;
}

.cs-center-form-col .wpcf7 p {
	margin-bottom: 1.2em;
}

.cs-center-form-col .wpcf7 input[type="text"],
.cs-center-form-col .wpcf7 input[type="email"],
.cs-center-form-col .wpcf7 input[type="tel"],
.cs-center-form-col .wpcf7 textarea {
	width: 100%;
	box-sizing: border-box;
}

.cs-center-form-col .wpcf7 .wpcf7-list-item {
	margin: 0 1em 0 0;
}

.cs-center-form-col .wpcf7-submit {
	padding: 15px 70px;
	font-size: 24px;
	font-weight: 700;
	background: var(--cs-color-primary);
	color: var(--cs-color-on-dark);
	border: none;
	cursor: pointer;
	width: 100%;
}

.cs-center-data-strip {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-top: 30px;
	padding: 20px;
	background: var(--cs-color-surface);
	border-radius: 8px;
}

.cs-data-item strong {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--cs-color-secondary);
}

.cs-data-item address,
.cs-data-item span {
	font-style: normal;
	font-size: 15px;
	line-height: 1.6;
}

.cs-data-item a {
	color: var(--cs-color-secondary);
	text-decoration: underline;
}

@media (max-width: 768px) {
	.cs-center-layout {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.cs-center-data-strip {
		grid-template-columns: 1fr;
	}
	.cs-center-form-col .wpcf7 {
		padding: 20px;
	}
}

/* -------------------------------------------------------------------------
   WPML language switcher — Header Base
   ID/clase estables: #cs-lang-switcher / .cs-lang-switcher
   ------------------------------------------------------------------------- */
:is(#cs-lang-switcher, .cs-lang-switcher, .wpml-elementor-ls) {
	position: relative;
	display: inline-block;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal {
	border: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal ul,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal li,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal li {
	display: none;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal:before,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal:before {
	content: attr(data-lang) " ▾";
	display: block;
	padding: 3px 10px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--cs-color-on-dark) !important;
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 3px;
	cursor: pointer;
	white-space: nowrap;
	user-select: none;
}

:is(#cs-lang-switcher, .cs-lang-switcher, .wpml-elementor-ls).cs-open .wpml-ls-legacy-list-horizontal ul {
	display: block;
	position: absolute;
	top: calc(100% + 2px);
	left: 0;
	z-index: 10001;
	min-width: 120px;
	background: var(--cs-color-secondary) !important;
	border-radius: 3px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

:is(#cs-lang-switcher, .cs-lang-switcher, .wpml-elementor-ls).cs-open .wpml-ls-legacy-list-horizontal li {
	display: block;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal li a,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal li a {
	display: block;
	padding: 6px 10px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--cs-color-on-dark) !important;
	white-space: nowrap;
	text-decoration: none !important;
	background: transparent !important;
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal li + li a,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal li + li a {
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

:is(#cs-lang-switcher, .cs-lang-switcher) .wpml-ls-legacy-list-horizontal li a:hover,
.wpml-elementor-ls .wpml-ls-legacy-list-horizontal li a:hover {
	background: rgba(255, 255, 255, 0.08) !important;
}