/* ==========================================================================
   Sistema común de diseño (repaso del 20-10-2026)

   Cada página de Elementor traía sus propios tamaños de título (siete tamaños
   distintos para el H1) y su propia forma de botón. Aquí se fija una sola
   escala para toda la web.

   Los selectores son un poco más específicos que los que genera Elementor para
   cada widget (.elementor-123 .elementor-element-abc …), así que mandan sobre
   el tamaño que tenga puesto cada título en el editor. Para cambiar la escala,
   cambia las variables de :root. La portada queda fuera: tiene su propio diseño.
   ========================================================================== */

:root {
	--ci-h1: clamp(2.25rem, 1.5rem + 2.4vw, 3.5rem);   /* 36 px en móvil → 56 px en escritorio */
	--ci-h2: clamp(1.75rem, 1.25rem + 1.6vw, 2.5rem);  /* 28 → 40 px */
	--ci-h2-entrada: clamp(1.5rem, 1.2rem + 1vw, 2rem); /* 24 → 32 px, dentro de las entradas */
	--ci-h3-entrada: clamp(1.25rem, 1.15rem + .4vw, 1.45rem);
	--ci-ancho-lectura: 880px;
}

/* --- Títulos de las páginas --------------------------------------------- */

/* Título principal (cabecera de cada página) */
body:not(.home) [data-elementor-type="wp-page"] .elementor-widget-heading h1.elementor-heading-title,
body.page .site-main > .page-header .entry-title {
	font-family: var(--ci-fuente-titulos);
	font-size: var(--ci-h1);
	font-weight: 200;
	line-height: 1.12;
	letter-spacing: 0;
}

/* Títulos de sección. No toca los de las tarjetas del blog (elementos de bucle) */
body:not(.home) [data-elementor-type="wp-page"] .elementor-widget-heading h2.elementor-heading-title:not([data-elementor-type="loop-item"] *),
body:not(.home) [data-elementor-type="wp-page"] .ci-texto h2 {
	font-family: var(--ci-fuente-titulos);
	font-size: var(--ci-h2);
	font-weight: 300;
	line-height: 1.2;
}
body:not(.home) [data-elementor-type="wp-page"] .ci-texto h3:not(.ci-ficha h3) {
	font-family: var(--ci-fuente-titulos);
	font-size: 1.45rem;
	font-weight: 400;
	line-height: 1.3;
}

/* --- Botones: siempre redondeados --------------------------------------- */
body .elementor .elementor-widget .elementor-button-wrapper .elementor-button,
body .elementor .elementor-form .elementor-field-type-submit .elementor-button {
	border-radius: var(--ci-radio-boton);
}

/* ==========================================================================
   Entradas del blog
   ========================================================================== */

/* Subtítulos: mismo tamaño en todas las entradas, aunque el widget tenga otro */
.single-post .elementor-widget-theme-post-content .elementor-widget-heading h2.elementor-heading-title,
.single-post .elementor-widget-theme-post-content .elementor-widget-text-editor h2 {
	font-family: var(--ci-fuente-titulos);
	font-size: var(--ci-h2-entrada);
	font-weight: 400;
	line-height: 1.25;
}
.single-post .elementor-widget-theme-post-content .elementor-widget-heading h3.elementor-heading-title,
.single-post .elementor-widget-theme-post-content .elementor-widget-text-editor h3 {
	font-family: var(--ci-fuente-titulos);
	font-size: var(--ci-h3-entrada);
	font-weight: 400;
	line-height: 1.3;
}

/* Texto pegado desde Google Docs o Word: sus estilos en línea dejaban texto negro
   sobre el fondo oscuro, en Arial y sin saltos de línea (se salía de la columna) */
.single-post .elementor-widget-theme-post-content [style*="white-space"] {
	white-space: normal !important;
}
.single-post .elementor-widget-theme-post-content :is(p, li, span, div, td)[style*="color: #000"],
.single-post .elementor-widget-theme-post-content :is(p, li, span, div, td)[style*="color:#000"],
.single-post .elementor-widget-theme-post-content :is(p, li, span, div, td)[style*="color: rgb(0, 0, 0)"],
.single-post .elementor-widget-theme-post-content :is(p, li, span, div, td)[style*="color: black"] {
	color: inherit !important;
}
.single-post .elementor-widget-theme-post-content :is(p, li, span, h2, h3, h4)[style*="font-family"] {
	font-family: inherit !important;
}
.single-post .elementor-widget-theme-post-content :is(p, li, span)[style*="font-size"] {
	font-size: inherit !important;
}
.single-post .elementor-widget-theme-post-content [style*="justify"] {
	text-align: left !important;
}

/* Enlaces del texto: siempre naranjas (algunas entradas los tenían en azul en línea) */
.single-post .elementor-widget-theme-post-content a:not(.elementor-button),
.single-post .elementor-widget-theme-post-content a:not(.elementor-button) :is(span, strong, em, b) {
	color: var(--ci-naranja) !important;
}

/* Las secciones con fondo de las entradas antiguas tenían tanto margen interior que
   el texto quedaba en una columna de 400 px */
.single-post .elementor-widget-theme-post-content .e-con {
	padding-inline: clamp(12px, 2.5vw, 32px) !important;
}

/* ==========================================================================
   Páginas sin Elementor: documentos de los complementos y textos legales
   ========================================================================== */
/* Plantilla de página del tema (sin Elementor): la que pinta .page-header con el título */
body.page .site-main:has(> .page-header) {
	max-width: calc(var(--ci-ancho-lectura) + 48px);
	margin-inline: auto;
	padding: 2.5rem 24px 4rem;
}
body.page .site-main > .page-header {
	margin-bottom: 1.5rem;
}
body.page .site-main > .page-header .entry-title {
	margin: 0;
	color: var(--ci-nav-texto, #F1F3F4);
}

/* Documentos de los complementos (/complementos/, /politica-de-privacidad/, /condiciones-del-servicio/) */
.ci-doc {
	color: var(--ci-nav-texto, #F1F3F4);
	font-family: var(--ci-fuente-texto);
	font-size: 1.0625rem;
	line-height: 1.7;
}
.ci-doc :is(h2, h3) {
	color: var(--ci-nav-texto, #F1F3F4);
	font-family: var(--ci-fuente-titulos);
	font-weight: 400;
	line-height: 1.3;
}
.ci-doc h2 {
	margin: 2.75rem 0 .75rem;
	font-size: 1.6rem;
}
.ci-doc h3 {
	margin: 0 0 .35rem;
	font-size: 1.2rem;
}
.ci-doc p {
	margin: 0 0 1rem;
}
.ci-doc :is(ul, ol) {
	margin: 0 0 1rem;
	padding-left: 1.4rem;
}
.ci-doc li {
	margin-bottom: .4rem;
}
.ci-doc a {
	color: var(--ci-naranja);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.ci-doc .ci-doc__entrada {
	margin: 0 0 2rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid rgba(241, 243, 244, .2);
	color: var(--ci-nav-texto-suave, #BDC1C6);
	font-size: 1.15rem;
}
.ci-doc .complemento {
	margin-bottom: 1rem;
	padding: 1.25rem 1.4rem;
	border: 1px solid rgba(241, 243, 244, .18);
	border-radius: 14px;
	background: rgba(255, 255, 255, .03);
}
.ci-doc .complemento > :last-child {
	margin-bottom: 0;
}
.ci-doc .permisos {
	margin-top: .75rem;
	padding: .75rem 1rem;
	border-radius: 10px;
	background: rgba(255, 255, 255, .06);
	color: var(--ci-nav-texto-suave, #BDC1C6);
	font-size: .9rem;
}
.ci-doc code {
	padding: 1px 5px;
	border: 1px solid rgba(241, 243, 244, .2);
	border-radius: 4px;
	background: rgba(255, 255, 255, .1);
	color: var(--ci-nav-texto, #F1F3F4);
	font-size: .85em;
	overflow-wrap: anywhere;
}
.ci-doc .destacado {
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--ci-naranja);
	border-radius: 0 12px 12px 0;
	background: rgba(255, 103, 0, .08);
}
.ci-doc .destacado > :last-child {
	margin-bottom: 0;
}
.ci-doc table {
	width: 100%;
	margin: 1rem 0 1.5rem;
	border-collapse: collapse;
	font-size: .95rem;
}
.ci-doc :is(th, td) {
	padding: .6rem .8rem;
	border: 1px solid rgba(241, 243, 244, .15);
	text-align: left;
	vertical-align: top;
}
.ci-doc th {
	background: rgba(255, 255, 255, .06);
	font-weight: 600;
}
.ci-doc .ci-doc__pie {
	margin-top: 3.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(241, 243, 244, .2);
	color: var(--ci-nav-texto-suave, #BDC1C6);
	font-size: .9rem;
}
.ci-doc .ci-doc__pie a {
	margin-right: 1.25rem;
}
@media (max-width: 767px) {
	.ci-doc table {
		display: block;
		overflow-x: auto;
	}
}

/* Política de cookies que genera Complianz: estaba en texto oscuro sobre el fondo oscuro.
   Ojo: Complianz pone la clase cmplz-document también en <body>; por eso se usa el id del bloque */
#cmplz-document {
	max-width: var(--ci-ancho-lectura);
	color: var(--ci-nav-texto, #F1F3F4) !important;
	font-family: var(--ci-fuente-texto);
	font-size: 1.0625rem;
	line-height: 1.7;
}
#cmplz-document :is(p, li, span, td, th, summary, label) {
	color: var(--ci-nav-texto, #F1F3F4) !important;
}
#cmplz-document :is(h2, h3, h4) {
	color: var(--ci-nav-texto, #F1F3F4) !important;
	font-family: var(--ci-fuente-titulos);
	font-weight: 400;
}
#cmplz-document h2 {
	margin: 2.5rem 0 .75rem !important;
	font-size: 1.6rem !important;
}
#cmplz-document h3 {
	font-size: 1.25rem !important;
}
#cmplz-document a {
	color: var(--ci-naranja) !important;
}
#cmplz-document details.cmplz-dropdown,
#cmplz-document .cmplz-dropdown summary {
	border-color: rgba(241, 243, 244, .18) !important;
	background: rgba(255, 255, 255, .05) !important;
	color: var(--ci-nav-texto, #F1F3F4) !important;
}
#cmplz-document details.cmplz-dropdown {
	margin-bottom: .6rem;
	border: 1px solid rgba(241, 243, 244, .18) !important;
	border-radius: 12px;
	overflow: hidden;
}
#cmplz-document .cmplz-service-description,
#cmplz-document .cmplz-sharing-data,
#cmplz-document .cookies-per-purpose {
	background: transparent !important;
	color: var(--ci-nav-texto, #F1F3F4) !important;
}
#cmplz-document .cmplz-dropdown summary::after,
#cmplz-document .cmplz-dropdown .cmplz-icon {
	filter: invert(1);
}

/* ==========================================================================
   Móvil
   ========================================================================== */

/* Palabras y direcciones largas (una URL de Google Calendar en una entrada estiraba la página a 1.100 px) */
.elementor-widget-text-editor,
.elementor-widget-theme-post-content,
.ci-doc,
#cmplz-document {
	overflow-wrap: break-word;
}

/* El formulario de Elementor separa sus campos con márgenes negativos: en móvil asomaban 9 px por la derecha */
.elementor-widget-form > .elementor-widget-container,
.elementor-widget-form {
	overflow-x: clip;
}

/* Texto justificado escrito a mano en el contenido (style="text-align: justify"): a la izquierda */
[data-elementor-type="wp-page"] [style*="text-align: justify"],
[data-elementor-type="wp-page"] [style*="text-align:justify"] {
	text-align: left !important;
}

@media (max-width: 767px) {
	/* Tarjetas del blog: títulos más contenidos (ocupaban media pantalla) */
	body .elementor-loop-container .e-loop-item .elementor-widget-theme-post-title .elementor-heading-title {
		font-size: 1.25rem;
		line-height: 1.3;
	}
	/* Tablas comparativas: caben en el ancho del móvil en lugar de quedar cortadas */
	.ci-texto .ci-tabla table {
		min-width: 0;
		font-size: .85rem;
	}
	.ci-texto .ci-tabla :is(th, td) {
		padding: .6rem .5rem;
	}
	.ci-texto .ci-tabla small {
		font-size: .75rem;
	}
	.ci-texto .ci-barra::before {
		flex-basis: calc(var(--valor) * .7px);
	}
}
@media (max-width: 767px) {
	/* Portada: el texto de cada cifra, centrado bajo el número */
	body.home .elementor .elementor-widget-counter .elementor-counter-title {
		text-align: center;
	}
}
