/* SPI Core · UI global e inicio (agente C). Solo estructura y efectos: colores y tipografías salen de las globales del kit de Elementor. */

/* ---------- Utilidades ---------- */
.ui-home-acento { color: var(--e-global-color-chispa); }
.ui-home-svg { display: inline-block; flex: none; width: 1.25em; height: 1.25em; vertical-align: -0.25em; }
.ui-home-icono { display: inline-flex; color: var(--e-global-color-chispa); }
.ui-home-icono .ui-home-svg { width: 48px; height: 48px; stroke-width: 1.25; }

/* Etiqueta: línea corta antes del texto */
.ui-home-etiqueta .elementor-heading-title::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 2px;
	margin-right: 12px;
	vertical-align: 0.3em;
	background: var(--e-global-color-chispa);
}
.ui-home-etiqueta--centro .elementor-heading-title::after {
	content: "";
	display: inline-block;
	width: 24px;
	height: 2px;
	margin-left: 12px;
	vertical-align: 0.3em;
	background: var(--e-global-color-chispa);
}

/* Botón de contorno con caja separada para la flecha */
.ui-home-btn-flecha .elementor-button { padding: 0; }
.ui-home-btn-flecha .elementor-button-content-wrapper { align-items: stretch; gap: 0; }
.ui-home-btn-flecha .elementor-button-text { padding: 17px 24px; }
.ui-home-btn-flecha .elementor-button-icon {
	display: flex;
	align-items: center;
	padding: 0 18px;
	border-left: 1px solid currentColor;
	transition: transform 0.25s ease;
}
.ui-home-btn-flecha .elementor-button:hover .elementor-button-icon svg,
.ui-home-btn-flecha .elementor-button:focus-visible .elementor-button-icon svg { transform: translateX(3px); }
.ui-home-btn-flecha .elementor-button-icon svg { transition: transform 0.25s ease; }

/* Foco visible en todos los enlaces y botones del header, footer e inicio */
.elementor-location-header a:focus-visible,
.elementor-location-header .elementor-menu-toggle:focus-visible,
.elementor-location-footer a:focus-visible,
.ui-home a:focus-visible,
.ui-home .elementor-button:focus-visible {
	outline: 3px solid var(--e-global-color-chispa);
	outline-offset: 3px;
}

/* ---------- Header ---------- */
.ui-home-topbar .ui-home-datos--barra { justify-content: flex-start; }
.ui-home-topbar .elementor-widget-shortcode:last-child .ui-home-datos--barra { justify-content: flex-end; }
.ui-home-mainbar { transition: background-color 0.3s ease, box-shadow 0.3s ease; }
.ui-home-mainbar.elementor-sticky--effects { box-shadow: 0 1px 0 color-mix(in srgb, var(--e-global-color-acero) 30%, transparent); }

/* Portada: header encima del hero, transparente hasta que se hace scroll */
body.home .elementor-location-header {
	position: absolute;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	z-index: 100;
}
body.home .ui-home-topbar { background-color: transparent !important; }
body.home .ui-home-mainbar:not(.elementor-sticky--effects) { background-color: transparent !important; }

.ui-home-logo .elementor-heading-title a,
.ui-home-logo .elementor-heading-title { text-decoration: none; white-space: nowrap; }

/* Menú principal: submenús abiertos también con el foco del teclado */
@media (min-width: 1025px) {
	.ui-home-nav .elementor-nav-menu--main .menu-item-has-children:focus-within > .sub-menu {
		display: block !important;
		opacity: 1;
		visibility: visible;
	}
	.ui-home-nav .elementor-nav-menu--main .sub-menu { min-width: 280px; }
	.ui-home-nav .elementor-nav-menu--main .sub-menu a { white-space: normal; }
}

/* Menú móvil a pantalla completa */
@media (max-width: 1024px) {
	.ui-home-logo,
	.ui-home-wa-movil,
	.ui-home-nav .elementor-menu-toggle { position: relative; z-index: 3; }
	.ui-home-nav .elementor-nav-menu--dropdown.elementor-nav-menu__container {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0;
		width: 100% !important;
		margin: 0 !important;
		z-index: 2;
		transform-origin: top;
		background-color: var(--e-global-color-carbon);
	}
	.ui-home-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container {
		height: 100vh;
		height: 100dvh;
		max-height: none !important;
		overflow-y: auto !important;
		padding: calc(var(--wp-admin--admin-bar--height, 0px) + 96px) 0 48px;
	}
	.ui-home-nav .elementor-nav-menu--dropdown .elementor-nav-menu > li > a {
		font-family: var(--e-global-typography-h3-font-family), sans-serif !important;
		font-size: 26px !important;
		font-weight: 800 !important;
		letter-spacing: 0 !important;
		text-transform: uppercase;
		border-bottom: 1px solid color-mix(in srgb, var(--e-global-color-acero) 25%, transparent);
	}
	.ui-home-nav .elementor-nav-menu--dropdown .sub-menu a { font-size: 17px !important; text-transform: none !important; letter-spacing: 0 !important; }
	body.ui-home-menu-abierto { overflow: hidden; }
}

/* ---------- Datos de contacto (barra superior y footer) ---------- */
.ui-home-datos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; }
.ui-home-datos--lista { flex-direction: column; gap: 14px; }
.ui-home-datos__item a,
.ui-home-datos li > a,
.ui-home-datos__item { display: inline-flex; align-items: flex-start; gap: 10px; color: inherit; text-decoration: none; }
.ui-home-datos a:hover .ui-home-datos__texto,
.ui-home-redes a:hover span { color: var(--e-global-color-chispa); }
.ui-home-datos .ui-home-svg { color: var(--e-global-color-chispa); width: 18px; height: 18px; margin-top: 2px; }
.ui-home-datos--barra { font-size: 13px; }
.ui-home-datos--barra .ui-home-svg { width: 15px; height: 15px; margin-top: 1px; }
.ui-home-copy { display: inline; }

/* ---------- Footer ---------- */
.ui-home-footer-menu .elementor-nav-menu--main .elementor-item { padding-left: 0 !important; padding-right: 0 !important; }

/* ---------- Inicio ---------- */
/* Hero: retícula técnica sutil sobre el degradado (o la foto destacada) */
.ui-home-hero { isolation: isolate; }
.ui-home-hero::after,
.ui-home-textura-reticula::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-image:
		linear-gradient(to right, color-mix(in srgb, var(--e-global-color-acero) 10%, transparent) 1px, transparent 1px),
		linear-gradient(to bottom, color-mix(in srgb, var(--e-global-color-acero) 10%, transparent) 1px, transparent 1px);
	background-size: 96px 96px;
	-webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 75%);
	mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 75%);
}
.ui-home-hero > .e-con-inner,
.ui-home-textura-reticula > *,
.ui-home-textura-granalla > .e-con-inner { position: relative; z-index: 1; }
.ui-home-hero-propuesta { border-left: 2px solid var(--e-global-color-chispa); }

/* Marquesina */
.ui-home-cinta { display: flex; overflow: hidden; width: 100%; }
.ui-home-cinta__pista {
	display: flex;
	flex: none;
	align-items: center;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	animation: ui-home-cinta 38s linear infinite;
}
.ui-home-cinta li {
	display: flex;
	align-items: center;
	white-space: nowrap;
	font-family: var(--e-global-typography-h2-font-family), sans-serif;
	font-weight: var(--e-global-typography-h2-font-weight, 800);
	text-transform: uppercase;
	font-size: clamp(22px, 2.6vw, 34px);
	line-height: 1;
}
.ui-home-cinta li::after {
	content: "";
	width: 12px;
	height: 12px;
	margin: 0 36px;
	background: currentColor;
	transform: rotate(45deg);
}
.ui-home-cinta:hover .ui-home-cinta__pista { animation-play-state: paused; }
@keyframes ui-home-cinta { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
	.ui-home-cinta { justify-content: center; }
	.ui-home-cinta__pista { animation: none; flex-wrap: wrap; justify-content: center; row-gap: 16px; flex: 1 1 auto; }
	.ui-home-cinta__pista[aria-hidden="true"],
	.ui-home-cinta li[aria-hidden="true"] { display: none; }
}

/* Servicios núcleo: columnas separadas por líneas */
.ui-home-servicio { border-top: 2px solid color-mix(in srgb, var(--e-global-color-acero) 40%, transparent); transition: border-color 0.25s ease; }
.ui-home-servicio:hover,
.ui-home-servicio:focus-within { border-top-color: var(--e-global-color-chispa); }
.ui-home-num .elementor-heading-title { font-variant-numeric: tabular-nums; }

/* Proceso: foto que sale del contenedor hacia el borde derecho */
@media (min-width: 1025px) {
	.ui-home-sangra-derecha { margin-right: calc(-1 * max(24px, (100vw - 1240px) / 2)) !important; }
}
.ui-home-foto-placeholder {
	background-image:
		repeating-linear-gradient(115deg, color-mix(in srgb, var(--e-global-color-plata) 6%, transparent) 0 1px, transparent 1px 14px),
		linear-gradient(135deg, var(--e-global-color-acero) 0%, var(--e-global-color-grafito) 55%, var(--e-global-color-carbon) 100%);
}
.ui-home-lista-chispa ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.ui-home-lista-chispa li {
	position: relative;
	padding: 18px 0 18px 36px;
	border-bottom: 1px solid color-mix(in srgb, var(--e-global-color-acero) 30%, transparent);
}
.ui-home-lista-chispa li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 1.55em;
	width: 12px;
	height: 12px;
	background: var(--e-global-color-chispa);
}
.ui-home-lista-chispa strong { color: inherit; font-weight: 700; }

/* Cifras: separadores verticales */
.ui-home-cifra { border-left: 1px solid color-mix(in srgb, var(--e-global-color-acero) 35%, transparent); }
.ui-home-cifra .elementor-counter-number-wrapper { justify-content: flex-start; }
.ui-home-cifra .elementor-counter-number-prefix { flex-grow: 0 !important; }
.ui-home-cifra .elementor-counter-number-suffix { flex-grow: 1 !important; text-align: start; }
.ui-home-cifra .elementor-counter-title { line-height: 1.5; }
.ui-home-cifra .elementor-counter-number-suffix { color: var(--e-global-color-chispa); }

/* Complementarios: mosaico */
.ui-home-mosaico-card { transition: transform 0.3s ease; }
.ui-home-mosaico-card:hover,
.ui-home-mosaico-card:focus-within { transform: translateY(-4px); }
.ui-home-mosaico-card .elementor-heading-title a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.ui-home-mosaico-card .elementor-heading-title a:focus-visible { outline: none; }
.ui-home-mosaico-card:focus-within { outline: 3px solid var(--e-global-color-chispa); outline-offset: 3px; }
.ui-home-mosaico-card .elementor-heading-title a { color: inherit; text-decoration: none; }
.ui-home-servicio .elementor-heading-title a { color: inherit; text-decoration: none; }
.ui-home-wa-movil .elementor-button-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ui-home-wa-movil .elementor-button { padding: 10px; }
.ui-home-wa-movil .elementor-button-icon svg { width: 22px; height: 22px; }
.ui-home-mosaico-card .ui-home-num-grande .elementor-heading-title {
	-webkit-text-stroke: 1px color-mix(in srgb, var(--e-global-color-plata) 45%, transparent);
	color: transparent;
}

/* Por qué SPI: grilla con bordes */
.ui-home-criterio { border-top: 1px solid var(--e-global-color-plata); }
.ui-home-criterio:hover { border-top-color: var(--e-global-color-chispa); }

/* CTA final: textura de granalla */
.ui-home-textura-granalla { isolation: isolate; }
.ui-home-textura-granalla::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-image:
		radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--e-global-color-acero) 40%, transparent) 1px, transparent 1.6px),
		radial-gradient(circle at 3px 4px, color-mix(in srgb, var(--e-global-color-plata) 18%, transparent) 1.2px, transparent 2px);
	background-size: 7px 7px, 13px 11px;
	-webkit-mask-image: radial-gradient(ellipse at center, transparent 10%, #000 85%);
	mask-image: radial-gradient(ellipse at center, transparent 10%, #000 85%);
}

/* Proyectos: mensaje cuando aún no hay proyectos publicados */
.ui-home .e-loop-nothing-found-message { padding: 48px 32px; border: 1px dashed color-mix(in srgb, var(--e-global-color-acero) 50%, transparent); }

@media (prefers-reduced-motion: reduce) {
	.ui-home-mosaico-card:hover,
	.ui-home-mosaico-card:focus-within { transform: none; }
}