/*
Theme Name: Astra — Electromecánica Casa Grande
Theme URI: https://smartbytes.es
Template: astra
Author: Smartbytes
Author URI: https://smartbytes.es
Description: Tema hijo de Astra para la web de Electromecánica Casa Grande, taller de electromecánica en Telde. Fuentes locales, estilos de marca, datos de la empresa (NAP), SEO técnico (sitemap, robots, datos estructurados), botones de llamada y WhatsApp y franja del Kit Digital.
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-ecg
*/

/* ---------- Fuentes locales (sin conexión a Google Fonts) ---------- */
@font-face {
	font-family: "Montserrat";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("assets/fonts/montserrat-latin-wght-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/inter-latin-wght-normal.woff2") format("woff2");
}

/* ---------- Marca (paleta corporativa, verificada WCAG 2.1 AA) ---------- */
:root {
	--color-grafito: #1F242B;        /* principal: texto sobre blanco (15,6:1), fondos oscuros */
	--color-grafito-hondo: #171B20;  /* hero y franja inferior del pie */
	--color-amarillo: #FFB502;       /* amarillo de marca: gráficos, iconos, acentos, botones. NUNCA texto sobre blanco */
	--color-naranja-texto: #9A5F00;  /* naranja accesible: texto naranja sobre blanco (5,2:1) */
	--color-blanco: #FFFFFF;
	--color-fondo: #F5F6F7;          /* gris de fondo */
	--color-borde: #D5D9DE;          /* gris de borde (solo decorativo) */
	--color-texto: #1F242B;
	--color-texto-suave: #4A525C;    /* 7,9:1 sobre blanco, 7,3:1 sobre gris de fondo */
	--color-borde-campo: #5B6470;    /* borde de campos: 6,0:1 sobre blanco (≥ 3:1 de componente) */
	--color-whatsapp: #25D366;       /* solo el icono, sobre grafito (7,9:1 como gráfico) */
	--color-error: #B42318;          /* 6,6:1 sobre blanco */
	--color-ok: #1E7A3C;             /* 5,4:1 sobre blanco */

	--font-heading: "Montserrat", "Arial Black", Arial, sans-serif;
	--font-body: "Inter", Arial, sans-serif;

	--radius: 6px;
	--focus-claro: #1F242B;
	--focus-oscuro: #FFB502;
	--alto-barra-movil: 64px;
}

html { scroll-padding-top: 24px; scroll-padding-bottom: 96px; }
body, button, input, select, textarea { font-family: var(--font-body); }
h1, h2, h3, h4, h5, h6, .site-title, .entry-title {
	font-family: var(--font-heading);
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--color-grafito);
}

a[href^="mailto:"] { overflow-wrap: anywhere; }
/* Los teléfonos y las franjas horarias no se parten en dos líneas. */
a[href^="tel:"] { white-space: nowrap; }
.ecg-franja { white-space: nowrap; }
::selection { background: var(--color-amarillo); color: var(--color-grafito); }

/* Foco visible para teclado: contorno de 3 px, oscuro sobre claro y amarillo sobre oscuro. */
body :is(a, button, input, textarea, select, summary, [tabindex]):focus-visible,
body .elementor-button:focus-visible,
body .onetap-container-toggle .onetap-toggle:focus-visible {
	outline: 3px solid var(--focus-claro) !important;
	outline-offset: 3px;
}
body .site-header :is(a, button):focus-visible,
body .site-footer :is(a, button):focus-visible,
body .ecg-oscuro :is(a, button):focus-visible,
body .ecg-barra-movil a:focus-visible,
body .ecg-whatsapp-flotante:focus-visible { outline-color: var(--focus-oscuro) !important; }

/* Enlace «Ir al contenido»: visible al recibir el foco. */
.skip-link.screen-reader-text:focus {
	background: var(--color-amarillo);
	color: var(--color-grafito);
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
	padding: .9rem 1.25rem;
	left: 1rem;
	top: 1rem;
	z-index: 100000;
	font-weight: 700;
	text-decoration: underline;
}

/* ---------- Cabecera: [logo] Inicio | Servicios | Contacto [Llamar ahora] [WhatsApp] ---------- */
.site-header .custom-logo-link { display: inline-block; line-height: 0; }
.site-header .custom-logo { width: 52px; height: auto; }
.site-header .site-title {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: .02em;
	text-transform: uppercase;
	margin: 0;
}
.site-header .site-title a,
.site-header .site-title a:hover { color: #fff; }
/* El nombre nunca se parte («ELECTROMECÁ / NICA»): una línea por renglón y la marca no se encoge. */
.site-header .site-title, .site-header .site-title a { white-space: nowrap; }
.site-header .site-branding, .site-header .ast-site-identity { flex-shrink: 0; }
.site-header .ecg-titulo-acento {
	display: block;
	color: var(--color-amarillo);
	font-size: .78em;
	font-weight: 700;
	letter-spacing: .24em;
}
.main-header-menu .menu-link {
	font-family: var(--font-heading);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	position: relative;
}
.ast-desktop .main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 1em; right: 1em; bottom: 1.5em;
	height: 3px;
	background: var(--color-amarillo);
	transform: scaleX(0);
	transition: transform .2s ease;
}
/* Página actual y paso del ratón marcados con una barra, no solo con el color (WCAG 1.4.1). */
.ast-desktop .main-header-menu > .menu-item > .menu-link:hover::after,
.ast-desktop .main-header-menu > .menu-item > .menu-link:focus-visible::after,
.ast-desktop .main-header-menu > .current-menu-item > .menu-link::after { transform: scaleX(1); }

/* Botones de contacto (cabecera, hero, llamadas a la acción). */
.ecg-acciones { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.ecg-btn {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	min-height: 48px;
	padding: .65rem 1.25rem;
	border: 2px solid transparent;
	border-radius: var(--radius);
	font-family: var(--font-heading);
	font-size: .875rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.1;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.ecg-btn .ecg-icono { width: 20px; height: 20px; flex: none; }
/* Colores de los botones con !important: deben imponerse a los colores de enlace de Astra,
   del texto de Elementor y del pie, estén donde estén. Cada variante lleva icono y texto. */
.ecg-btn { text-decoration: none !important; }
.ecg-btn:hover, .ecg-btn:focus-visible { text-decoration: underline !important; text-underline-offset: .2em; }
/* Llamar: amarillo con texto grafito (8,8:1). Al pasar: blanco con borde grafito. */
.ecg-btn--llamar { background: var(--color-amarillo) !important; color: var(--color-grafito) !important; border-color: var(--color-amarillo) !important; }
.ecg-btn--llamar:hover, .ecg-btn--llamar:focus-visible { background: #fff !important; border-color: var(--color-grafito) !important; }
/* WhatsApp: sobre oscuro, contorno blanco con texto blanco; sobre claro, grafito con texto blanco. Al pasar: blanco. */
.ecg-btn--whatsapp { background: transparent !important; color: #fff !important; border-color: #fff !important; }
.ecg-claro .ecg-btn--whatsapp { background: var(--color-grafito) !important; border-color: var(--color-grafito) !important; }
.ecg-btn--whatsapp .ecg-icono { color: var(--color-whatsapp); }
.ecg-btn--whatsapp:hover, .ecg-btn--whatsapp:focus-visible,
.ecg-claro .ecg-btn--whatsapp:hover, .ecg-claro .ecg-btn--whatsapp:focus-visible { background: #fff !important; color: var(--color-grafito) !important; border-color: var(--color-grafito) !important; }
.ecg-btn--whatsapp:hover .ecg-icono, .ecg-btn--whatsapp:focus-visible .ecg-icono { color: #128C3E; }
/* Email / móvil: contorno grafito sobre claro y contorno blanco sobre oscuro. */
.ecg-btn--email { background: transparent !important; color: var(--color-grafito) !important; border-color: var(--color-grafito) !important; }
.ecg-btn--email:hover, .ecg-btn--email:focus-visible { background: var(--color-grafito) !important; color: #fff !important; }
.ecg-oscuro .ecg-btn--email { color: #fff !important; border-color: #fff !important; }
.ecg-oscuro .ecg-btn--email:hover, .ecg-oscuro .ecg-btn--email:focus-visible { background: #fff !important; color: var(--color-grafito) !important; }
/* Barra móvil y botón flotante. */
.ecg-barra-movil__btn--llamar { color: var(--color-grafito) !important; }
.ecg-barra-movil__btn--whatsapp, .ecg-whatsapp-flotante { color: #fff !important; }
.ast-header-html .ecg-acciones { flex-wrap: nowrap; gap: .5rem; }
.ast-header-html .ecg-btn { min-height: 44px; padding: .55rem 1rem; }
/* Escritorio estrecho: todo cabe en una fila sin partir el nombre ni el menú. */
.ast-desktop .main-header-menu { flex-wrap: nowrap; }
.ast-desktop .main-header-menu .menu-link { white-space: nowrap; }
@media (min-width: 922px) and (max-width: 1240px) {
	.ast-header-html .ecg-btn { padding: .55rem .7rem; font-size: .8125rem; }
	.main-header-menu .menu-link { letter-spacing: .05em; padding-left: .7em; padding-right: .7em; }
	.site-header .site-title { font-size: .9rem; }
	.site-header .custom-logo { width: 44px; }
}
@media (min-width: 922px) and (max-width: 1023px) {
	.ast-header-html .ecg-acciones { gap: .35rem; }
	.ast-header-html .ecg-btn { padding: .55rem .55rem; letter-spacing: .03em; }
	.main-header-menu .menu-link { letter-spacing: .02em; padding-left: .55em; padding-right: .55em; }
	.site-header .site-title { font-size: .82rem; }
	.site-header .custom-logo { width: 40px; }
}

/* Menú móvil (desplegable). */
.ast-mobile-menu-trigger-minimal { min-width: 44px; min-height: 44px; }
.ast-mobile-header-content {
	background: var(--color-grafito);
	border-top: 3px solid var(--color-amarillo);
	box-shadow: 0 12px 24px rgba(0, 0, 0, .35);
}
.ast-mobile-header-content .ast-builder-menu-mobile .main-navigation .main-header-menu,
.ast-mobile-header-content .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-link { background-color: var(--color-grafito); color: #fff; }
.ast-mobile-header-content .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-link:hover { background-color: var(--color-grafito-hondo); color: #fff; text-decoration: underline; text-decoration-color: var(--color-amarillo); }
.ast-mobile-header-content .main-header-menu .menu-item { border-bottom: 1px solid rgba(255, 255, 255, .14); }
.ast-mobile-header-content .main-header-menu .menu-link { display: flex; align-items: center; min-height: 52px; padding: .75rem 20px; }
.ast-header-break-point .main-header-menu .current-menu-item > .menu-link { text-decoration: underline; text-decoration-color: var(--color-amarillo); text-decoration-thickness: 3px; text-underline-offset: .4em; }
@media (max-width: 400px) {
	.site-header .site-title { font-size: .9rem; }
	.site-header .custom-logo { width: 44px; }
}

/* ---------- Contacto rápido: barra inferior en móvil y botón flotante de WhatsApp ---------- */
.ecg-barra-movil { display: none; }
.ecg-whatsapp-flotante { display: none; }
@media (max-width: 921px) {
	.ecg-barra-movil {
		display: grid;
		grid-template-columns: 1fr 1fr;
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 9990;
		background: var(--color-grafito);
		border-top: 3px solid var(--color-amarillo);
		padding-bottom: env(safe-area-inset-bottom, 0);
	}
	.ecg-barra-movil__btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .5rem;
		min-height: var(--alto-barra-movil);
		font-family: var(--font-heading);
		font-size: 1rem;
		font-weight: 800;
		letter-spacing: .04em;
		text-transform: uppercase;
		text-decoration: none;
	}
	.ecg-barra-movil__btn .ecg-icono { width: 22px; height: 22px; }
	.ecg-barra-movil__btn--llamar,
	.ecg-barra-movil__btn--llamar:visited { background: var(--color-amarillo); color: var(--color-grafito); }
	.ecg-barra-movil__btn--whatsapp,
	.ecg-barra-movil__btn--whatsapp:visited { color: #fff; }
	.ecg-barra-movil__btn--whatsapp .ecg-icono { color: var(--color-whatsapp); }
	.ecg-barra-movil__btn:hover { text-decoration: underline; }
	.ecg-barra-movil a:focus-visible { outline-offset: -5px !important; }
	/* El contenido deja hueco para la barra: no tapa nada al final de la página. */
	body { padding-bottom: calc(var(--alto-barra-movil) + 3px + env(safe-area-inset-bottom, 0px)); }
	/* Al tabular, el elemento enfocado no queda bajo la barra ni bajo el botón de accesibilidad. */
	html { scroll-padding-bottom: calc(var(--alto-barra-movil) + 96px); }
}
/* Escritorio: la cabecera queda fija arriba, así «Llamar ahora» y «WhatsApp» están siempre a mano. */
@media (min-width: 922px) {
	#masthead { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 999; }
	html { scroll-padding-top: 112px; }
}
/* Botón flotante de WhatsApp: solo en pantallas anchas, dentro del margen lateral libre
   (el contenido mide 1200 px), de modo que nunca tapa texto ni otros botones. Con nombre accesible,
   foco visible y sin animación. */
@media (min-width: 1400px) {
	.ecg-whatsapp-flotante {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		right: 24px;
		bottom: 24px;
		z-index: 9990;
		width: 60px;
		height: 60px;
		background: var(--color-grafito);
		border: 2px solid #fff;
		border-radius: 50%;
		box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
		text-decoration: none;
	}
	.ecg-whatsapp-flotante__icono { width: 30px; height: 30px; color: var(--color-whatsapp); }
	.ecg-whatsapp-flotante:hover { background: #000; }
}
@media print { .ecg-barra-movil, .ecg-whatsapp-flotante { display: none !important; } }

/* ---------- Piezas de marca usadas en Elementor ---------- */
/* Antetítulo con barra amarilla (el amarillo es solo gráfico; el texto va en grafito o naranja accesible). */
.ecg-kicker .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	line-height: 1.5;
}
.ecg-kicker .elementor-heading-title::before {
	content: "";
	flex: none;
	width: 28px;
	height: 4px;
	background: var(--color-amarillo);
	border-radius: 2px;
}
.ecg-kicker-centro { text-align: center; }

/* Hero de portada. */
.ecg-hero { position: relative; overflow: hidden; }
.ecg-hero::after {
	/* Franja diagonal amarilla (decorativa). */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 8px;
	background: repeating-linear-gradient(-45deg, var(--color-amarillo) 0 16px, var(--color-grafito-hondo) 16px 32px);
	pointer-events: none;
}
.ecg-hero h1.elementor-heading-title { text-wrap: balance; }
.ecg-hero .ecg-subtitulo .elementor-heading-title { color: var(--color-amarillo); }

.ecg-foto img { border-radius: var(--radius); display: block; }
.ecg-foto-sombra img { box-shadow: 0 24px 48px -24px rgba(0, 0, 0, .55); }

/* Tarjetas con borde superior amarillo. */
.ecg-card { border-top-color: var(--color-amarillo) !important; }
.ecg-card .elementor-icon-wrapper { line-height: 0; }
.ecg-card .elementor-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: var(--radius);
	background: var(--color-grafito);
	color: var(--color-amarillo);
}
.ecg-card .elementor-icon svg { fill: var(--color-amarillo); width: 26px; height: 26px; }
.ecg-card .elementor-widget-text-editor p { color: var(--color-texto-suave); }
.ecg-card-enlace a { font-weight: 700; }

.ecg-lista ul { list-style: none; padding-left: 0; margin: 0; }
.ecg-lista li { position: relative; padding: .5rem 0 .5rem 2rem; }
.ecg-lista li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .95rem;
	width: 14px;
	height: 8px;
	border-left: 3px solid var(--color-naranja-texto);
	border-bottom: 3px solid var(--color-naranja-texto);
	transform: rotate(-45deg);
}
.ecg-oscuro .ecg-lista li::before { border-color: var(--color-amarillo); }

/* Tableta vertical (768–900 px): las filas de texto + foto se apilan. */
@media (min-width: 768px) and (max-width: 900px) {
	.ecg-fila:has(> .ecg-col) { flex-direction: column !important; }
	.ecg-fila:has(> .ecg-col) > .ecg-col { --width: 100% !important; width: 100% !important; }
}

/* Secciones oscuras: textos en blanco. */
.ecg-oscuro .elementor-widget-text-editor,
.ecg-oscuro .elementor-widget-text-editor p,
.ecg-oscuro .elementor-widget-text-editor li { color: #fff; }
.ecg-oscuro .elementor-widget-text-editor a { color: #fff; text-decoration-color: var(--color-amarillo); }

/* Franja de datos rápidos (portada). */
.ecg-dato-rapido p { margin: 0; }
.ecg-dato-rapido .ecg-icono { color: var(--color-amarillo); width: 28px; height: 28px; }
.ecg-dato-rapido .ecg-etiqueta { display: block; font-family: var(--font-heading); font-size: .75rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--color-amarillo); margin: .55rem 0 .3rem; }
.ecg-dato-rapido a { text-decoration: underline; text-decoration-color: var(--color-amarillo); text-underline-offset: .22em; }

.elementor-widget-text-editor p:last-child { margin-bottom: 0; }

/* Enlaces dentro del texto: subrayados (no se distinguen solo por el color). */
.site-content .elementor-widget-text-editor a,
.site-content .ecg-form a { color: var(--color-grafito); text-decoration: underline; text-decoration-color: var(--color-naranja-texto); text-underline-offset: .18em; text-decoration-thickness: 2px; }
.site-content .elementor-widget-text-editor a:hover,
.site-content .ecg-form a:hover { color: var(--color-naranja-texto); }
.site-content .ecg-oscuro .elementor-widget-text-editor a,
.site-content .ecg-oscuro .elementor-widget-text-editor a:hover { color: #fff; text-decoration-color: var(--color-amarillo); }

/* Migas de pan. */
.ecg-migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem; font-size: .9375rem; }
.ecg-migas li { display: inline-flex; align-items: center; gap: .25rem; color: #fff; }
.ecg-migas li + li::before { content: "›"; color: var(--color-amarillo); font-weight: 700; padding: 0 .35rem; }
.site-content .ecg-migas a { color: #fff; text-decoration: underline; text-decoration-color: var(--color-amarillo); text-underline-offset: .2em; }

/* Tres formas de contacto (Contacto y portada). */
.ecg-via .elementor-widget-text-editor p { margin: 0; }
.ecg-via__valor { font-family: var(--font-heading); font-size: 1.375rem; font-weight: 800; letter-spacing: .01em; color: var(--color-grafito); }
@media (max-width: 400px) { .ecg-via__valor { font-size: 1.15rem; } }
.site-content .ecg-via__valor a { color: var(--color-grafito); text-decoration: underline; text-decoration-color: var(--color-amarillo); text-decoration-thickness: 3px; text-underline-offset: .25em; }
.site-content .ecg-via__valor a:hover { color: var(--color-naranja-texto); }

/* Datos de contacto en columna (Contacto). */
.ecg-dato .ecg-icono { color: var(--color-naranja-texto); }
.ecg-dato p { margin: 0; }

/* Mapa con carga bajo demanda. */
.ecg-mapa { position: relative; min-height: 360px; border-radius: var(--radius); overflow: hidden; background: var(--color-fondo); border: 1px solid var(--color-borde); }
.ecg-mapa__aviso { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-height: 360px; padding: 2rem 1.25rem; gap: .35rem; background-image: repeating-linear-gradient(0deg, transparent 0 39px, rgba(31, 36, 43, .06) 39px 40px), repeating-linear-gradient(90deg, transparent 0 39px, rgba(31, 36, 43, .06) 39px 40px); }
.ecg-mapa__aviso p { margin: 0; }
.ecg-mapa__icono { width: 40px; height: 40px; color: var(--color-naranja-texto); margin-bottom: .25rem; }
.ecg-mapa__titulo { font-family: var(--font-heading); font-weight: 800; font-size: 1.15rem; color: var(--color-grafito); }
.ecg-mapa__nota { font-size: .875rem; color: var(--color-texto-suave); max-width: 46ch; margin-top: .4rem !important; }
.ecg-mapa__botones { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; align-items: center; justify-content: center; margin-top: 1rem !important; }
.ecg-mapa__cargar {
	min-height: 48px; padding: .6rem 1.4rem; border: 0; border-radius: var(--radius);
	background: var(--color-grafito); color: #fff; cursor: pointer;
	font-family: var(--font-heading); font-weight: 800; font-size: .875rem; letter-spacing: .06em; text-transform: uppercase;
}
.ecg-mapa__cargar:hover, .ecg-mapa__cargar:focus-visible { background: #000; text-decoration: underline; }
.ecg-mapa iframe { display: block; width: 100%; height: 400px; border: 0; }
.ecg-mapa__pie { margin: 0; padding: .75rem 1rem; background: #fff; border-top: 1px solid var(--color-borde); }
.site-content .ecg-mapa a { color: var(--color-grafito); font-weight: 600; text-decoration: underline; text-decoration-color: var(--color-naranja-texto); text-decoration-thickness: 2px; text-underline-offset: .18em; }

/* Páginas legales. */
.ecg-legal h2 { font-size: 1.5rem; margin-top: 2.25rem; }
.ecg-legal h3 { font-size: 1.15rem; margin-top: 1.5rem; }
.ecg-legal ul { margin-left: 1.25rem; }
.ecg-legal table { border-collapse: collapse; width: 100%; font-size: .9375rem; margin: 1rem 0 1.5rem; }
.ecg-legal th, .ecg-legal td { border: 1px solid var(--color-borde); padding: .6rem .75rem; text-align: left; vertical-align: top; }
.ecg-legal th { background: var(--color-fondo); color: var(--color-grafito); }
.ecg-legal .ecg-tabla { overflow-x: auto; }
@media (max-width: 600px) {
	.ecg-legal table, .ecg-legal tbody, .ecg-legal tr, .ecg-legal td { display: block; width: 100%; }
	.ecg-legal thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
	.ecg-legal tr { border: 1px solid var(--color-borde); border-radius: var(--radius); margin-bottom: 1rem; overflow: hidden; }
	.ecg-legal td { border: 0; border-bottom: 1px solid var(--color-borde); display: grid; grid-template-columns: 6.5rem 1fr; gap: .75rem; }
	.ecg-legal td:last-child { border-bottom: 0; }
	.ecg-legal td::before { content: attr(data-label); font-weight: 700; color: var(--color-grafito); }
	.ecg-legal tr td:first-child { background: var(--color-fondo); font-weight: 600; }
}

/* Datos que aún debe facilitar el cliente: muy visibles para no publicarlos por error. */
.ecg-pendiente { background: #FFF3C4; color: #5C3B00; outline: 1px dashed #5C3B00; padding: 0 .25em; font-family: var(--font-body); font-size: 1rem; }

/* ---------- Formulario de contacto (Contact Form 7) ---------- */
.ecg-form p { margin: 0 0 1.9rem; }
.ecg-form__nota { font-size: .9375rem; color: var(--color-texto-suave); }
.ecg-form__fila { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
@media (max-width: 600px) { .ecg-form__fila { grid-template-columns: 1fr; } }
.ecg-form label { display: block; font-size: 1rem; font-weight: 600; color: var(--color-grafito); }
.ecg-form .wpcf7-form-control-wrap { display: block; margin-top: .35rem; position: relative; }
.ecg-form input[type="text"],
.ecg-form input[type="email"],
.ecg-form input[type="tel"],
.ecg-form textarea {
	width: 100%;
	padding: .8rem .9rem;
	font-size: 1rem;
	color: var(--color-texto);
	background: #fff;
	border: 1px solid var(--color-borde-campo);
	border-radius: var(--radius);
}
.ecg-form textarea { min-height: 8.5rem; resize: vertical; }
.ecg-form input:focus-visible,
.ecg-form textarea:focus-visible { outline: 3px solid var(--focus-claro); outline-offset: 2px; border-color: var(--color-grafito); }
.ecg-form [aria-invalid="true"] { border-color: var(--color-error) !important; border-width: 2px !important; }
.ecg-form .wpcf7-not-valid-tip { position: absolute; left: 0; top: 100%; color: var(--color-error); font-size: .875rem; font-weight: 600; line-height: 1.3; margin-top: .25rem; }
.ecg-form .wpcf7-not-valid-tip::before { content: "⚠ "; }
.ecg-form__ayuda { display: block; font-size: .9375rem; font-weight: 400; color: var(--color-texto-suave); margin-top: .2rem; }
.ecg-form__legal { font-size: .875rem; line-height: 1.55; padding: 1rem 1.1rem; background: var(--color-fondo); border-left: 4px solid var(--color-amarillo); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: 1rem; }
.ecg-form__legal p { margin: 0; }
.ecg-form .wpcf7-acceptance .wpcf7-list-item { margin: 0; display: block; }
.ecg-form .wpcf7-acceptance label { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; color: var(--color-texto); cursor: pointer; }
.ecg-form input[type="checkbox"] { width: 1.25rem; height: 1.25rem; margin-top: .2rem; flex: none; accent-color: var(--color-grafito); }
.ecg-form input[type="submit"] {
	font-family: var(--font-heading);
	font-size: .9375rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--color-grafito);
	background: var(--color-amarillo);
	border: 2px solid var(--color-grafito);
	border-radius: var(--radius);
	padding: 1rem 1.9rem;
	min-height: 48px;
	cursor: pointer;
}
.ecg-form input[type="submit"]:hover,
.ecg-form input[type="submit"]:focus-visible { background: var(--color-grafito); color: #fff; text-decoration: underline; }
.ecg-form .wpcf7-spinner { vertical-align: middle; }
.ecg-form .ecg-hp { display: none !important; }
.wpcf7 form .wpcf7-response-output { margin: 1rem 0 0; padding: .9rem 1rem; border-width: 2px; border-radius: var(--radius); font-size: 1rem; background: #fff; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: var(--color-error); color: var(--color-error); }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--color-ok); color: #155D2D; }

/* ---------- Botones de Elementor ---------- */
.elementor-button { min-height: 48px; display: inline-flex; align-items: center; letter-spacing: .06em; text-transform: uppercase; border: 2px solid transparent; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.elementor-button:hover, .elementor-button:focus-visible { text-decoration: underline; text-underline-offset: .2em; }
.elementor-button .elementor-button-icon svg { width: 1.1em; height: 1.1em; }

/* ---------- Página 404 (404.php) ---------- */
.ecg-404 { background: var(--color-fondo); padding: clamp(56px, 8vw, 104px) 16px; }
.ecg-404__caja { max-width: 760px; margin: 0 auto; text-align: center; }
.ecg-404__codigo { display: inline-block; font-family: var(--font-heading); font-size: .875rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--color-grafito); background: var(--color-amarillo); padding: .35rem .8rem; border-radius: var(--radius); margin: 0 0 1.25rem; }
.ecg-404 h1 { font-size: clamp(2rem, 5vw, 3rem); line-height: 1.1; margin: 0 0 1rem; }
.ecg-404__texto { font-size: 1.125rem; color: var(--color-texto-suave); margin: 0 auto 2rem; max-width: 56ch; }
.ecg-404__enlaces ul { list-style: none; margin: 0 0 2.25rem; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.ecg-404__enlaces a { display: inline-flex; align-items: center; min-height: 48px; padding: .5rem 1.25rem; border: 2px solid var(--color-grafito); border-radius: var(--radius); color: var(--color-grafito); font-family: var(--font-heading); font-weight: 800; font-size: .875rem; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.ecg-404__enlaces li:first-child a { background: var(--color-amarillo); }
.ecg-404__enlaces a:hover { background: var(--color-grafito); color: #fff; text-decoration: underline; }
.ecg-404__ayuda { font-size: 1.0625rem; margin: 0; }
.ecg-404__ayuda a { color: var(--color-grafito); font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-naranja-texto); text-decoration-thickness: 2px; text-underline-offset: .18em; }
.error404 .site-content > .ast-container { max-width: none; padding: 0; display: block; }

/* ---------- Banner de cookies (CookieYes) ---------- */
.cky-consent-container .cky-notice-btn-wrapper { display: flex; flex-direction: column; gap: 10px; }
.cky-consent-container .cky-notice-btn-wrapper .cky-btn { width: 100%; margin: 0; }
.cky-consent-container .cky-btn,
.cky-modal .cky-btn { opacity: 1; font-family: var(--font-body); font-weight: 600; border-radius: var(--radius); }
.cky-consent-container .cky-btn:hover,
.cky-modal .cky-btn:hover { opacity: 1; text-decoration: underline; }
.cky-modal .cky-accordion-btn { letter-spacing: normal; text-transform: none; font-family: var(--font-body); font-weight: 600; }
.cky-consent-container :focus-visible,
.cky-modal :focus-visible { outline: 3px solid var(--focus-claro); outline-offset: 2px; }
/* El banner queda por encima de la barra móvil mientras se decide. */
.cky-consent-container { z-index: 9999 !important; }

/* ---------- Widget de accesibilidad (OneTap) ---------- */
nav.onetap-accessibility:not(.onetap-toggle-open) { visibility: hidden; box-shadow: none !important; }
body .onetap-container-toggle .onetap-toggle { z-index: 9995 !important; }

/* ---------- Pie ---------- */
.site-footer { font-size: 1rem; }
.site-primary-footer-wrap { border-top: 6px solid var(--color-amarillo); }
.site-footer .ast-builder-html-element h2,
.site-footer .footer-widget-area h2 {
	font-family: var(--font-heading);
	font-size: .8125rem;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	line-height: 1.3;
	color: var(--color-amarillo);
	margin-bottom: 1rem;
}
.site-footer .ast-builder-html-element p,
.site-footer .footer-widget-area p { color: #fff; }
.site-footer a { color: #fff; text-decoration: underline; text-underline-offset: .2em; text-decoration-color: var(--color-amarillo); }
.site-footer a:hover { color: var(--color-amarillo); text-decoration-thickness: 2px; }
.site-footer a.ecg-pie-marca { display: inline-block; text-decoration: none; }
.site-footer a.ecg-pie-marca img { width: 150px; height: auto; }
.site-footer .ecg-pie-texto { color: #fff; font-size: .9375rem; line-height: 1.6; margin: 1rem 0 0; max-width: 24rem; }
@media (min-width: 922px) {
	.site-primary-footer-wrap .ast-builder-grid-row { grid-template-columns: 1.1fr 1fr 1fr; column-gap: 3rem; }
}
.ecg-pie-lista { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.ecg-pie-lista li { display: flex; align-items: flex-start; gap: .75rem; margin: 0 0 .85rem; color: #fff; line-height: 1.55; }
.ecg-pie-lista li:last-child, .ecg-pie-lista:last-child { margin-bottom: 0; }
.ecg-icono { flex: none; }
.ecg-pie-lista .ecg-icono { color: var(--color-amarillo); margin-top: .2em; }
.site-below-footer-wrap { border-top: 1px solid rgba(255, 255, 255, .14); }
.site-below-footer-wrap .ast-footer-copyright p { font-size: .875rem; }
#astra-footer-menu .menu-link { font-size: .875rem; }
#astra-footer-menu { flex-wrap: wrap; column-gap: .25rem; }
@media (max-width: 1240px) {
	.site-footer .site-primary-footer-wrap,
	.site-footer .site-below-footer-wrap { padding-left: 20px; padding-right: 20px; }
}
@media (max-width: 544px) {
	.site-primary-footer-wrap .site-footer-section + .site-footer-section { margin-top: 2rem; }
}

/* Distintivos obligatorios del Kit Digital. Hueco inferior para el botón flotante y el de accesibilidad. */
.ecg-kit-digital { background: #fff; padding: 1rem clamp(1rem, 4vw, 2.5rem) 5.5rem; text-align: center; }
.ecg-kit-digital img { width: 100%; max-width: 900px; height: auto; display: inline-block; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

.ecg-botonera p { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; }
/* El email es largo: en las tarjetas de contacto va algo más pequeño para no partirse. */
.ecg-via__valor a[href^="mailto:"] { font-size: .8em; }
/* Pantallas estrechas (320 px / zoom 400 %): los botones pueden partir el texto en dos líneas. */
@media (max-width: 480px) {
	.ecg-btn { white-space: normal; max-width: 100%; text-align: left; }
}
/* Web solo en español: sin selector de idioma en el panel de accesibilidad. */
nav.onetap-accessibility .onetap-languages,
nav.onetap-accessibility .onetap-list-of-languages { display: none !important; }

/* Pasos de «Cómo trabajamos»: número grande en grafito sobre amarillo (no es texto amarillo sobre blanco). */
.ecg-paso .ecg-paso__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0;
	border-radius: var(--radius);
	background: var(--color-amarillo);
	color: var(--color-grafito) !important;
	font-family: Montserrat, sans-serif;
	font-weight: 800;
	font-size: 1.5rem;
	line-height: 1;
}
