/*
 * Página Nosotros — Engranaje Corporativo.
 * ============================================================================
 * Encolado SOLO en la página "nosotros" (ver ec_encolar_pagina_actual() en
 * functions.php, que ya lo hace solo con que este archivo exista). El hero
 * reutiliza templates/partes/hero.php SIN modificador (su tamaño/tipografía
 * de fábrica ya calzan con esta página, verificado contra el PSD) -- por
 * eso .ec-servicio-hero* no aparece aquí, esas reglas viven en style.css.
 *
 * Coordenadas de esta ronda: preview/real/spec-nosotros.md (caja de tinta,
 * tipografía efectiva y colores ya convertidos a sRGB desde el PSD en Adobe
 * RGB) y preview/real/psd-nosotros.json, exportados con
 * herramientas/psd_especificacion.py y psd_textos_json.py. Verificado con
 * preview/real/verificar-psd.js (ecVerificarPSD()) a 1440px.
 *
 * OJO -- defectos de extracción del PSD (ver el docblock de
 * inc/paginas/nosotros.php): el JSON trae, en varias capas, un texto viejo
 * que ya no se ve en el PNG final (año, las 4 tarjetas de la línea de
 * tiempo, la primera cifra). La POSICIÓN/tipografía de esas capas sí se
 * usó tal cual; lo que no se usó fue su campo "texto". Como
 * ecVerificarPSD() empareja cada capa con su elemento por texto, esas
 * capas concretas van a salir en "sinPareja" (no en "difs") -- awaiting
 * verificación en vivo, documentado en el reporte de esta ronda.
 *
 * Sin !important en todo el archivo. Colores solo con var(--ec-*) definidas
 * en style.css, salvo dos excepciones sin token (mismo criterio que
 * style.css: "Cuenta y buscador..." / .ec-cifras-item::before), señaladas
 * en su sitio: el gris #B4B4B4 del párrafo de "Lo que hacemos" y el
 * separador #3B3B3B de los sectores (el MISMO gris sin token que ya usa
 * .ec-cifras-item::before en style.css, no uno nuevo).
 *
 * Robustez frente al CSS real de mymedi (2-mymedi.css/4-mymedi-dinamico.css,
 * cargados ANTES que este archivo): cada regla de abajo fija SIEMPRE
 * font-size/line-height/font-weight/margin/padding en vez de heredarlos.
 * ========================================================================== */

/* --------------------------------------------------------------------------
   Contenedor — lienzo de 1440px, mismo criterio que .ec-industrias-contenedor
   (assets/css/industrias.css): tope del diseño, se centra en vez de crecer
   más allá. 72px a la izquierda / 88px a la derecha, medidos del PSD
   (fila de la línea de tiempo, la más ancha de las secciones contenidas:
   x73 a la izquierda, x1440−1356=84 a la derecha del último punto de la
   fila; 72/88 redondea ambos lados a la baja/alza sobre ese mismo
   renglón). Usado por la Intro, la Línea de tiempo y las Cifras -- Video,
   "Lo que hacemos" y el Testimonio son de fondo completo (100vw, ver más
   abajo) con su propio margen interno equivalente.
   -------------------------------------------------------------------------- */
.ec-nosotros-contenedor {
	max-width: 90rem; /* 1440px */
	margin: 0 auto;
	padding: 0 5.5rem 0 4.5rem; /* 88px / 72px */
}

/* La Línea de tiempo arranca un poco más adentro que la Intro/las Cifras
   (x91-93 del PSD contra los x72 que calzan ahí) -- override local, mismo
   criterio que .ec-nosotros-soluciones > .ec-nosotros-contenedor, más
   abajo. Ajustado en vivo con ecVerificarPSD(). */
.ec-nosotros-contenedor--tiempo {
	padding-left: 5.75rem; /* 92px */
}

/* --------------------------------------------------------------------------
   Antetítulo — Outfit 400, 20.83px, tracking +4.17px (0.2em), repetido 5
   veces en esta página ("DESDE" es su propia clase, ver más abajo, mismo
   tamaño pero sin mayúsculas fijas por CSS: los 5 rótulos se guardan ya en
   mayúsculas en inc/paginas/nosotros.php, mismo criterio que "INDUSTRIA"
   en inc/industrias.php -- no hay text-transform aquí a propósito, para
   que quien edite el campo controle la caja exacta que ve). Color oscuro
   por omisión; --claro para "LO QUE HACEMOS", sobre fondo oscuro.
   -------------------------------------------------------------------------- */
.ec-nosotros-eyebrow {
	margin: 0 0 1rem;
	color: var(--ec-texto);
	font-size: 1.301875rem; /* 20.83px */
	font-weight: var(--ec-peso-regular);
	letter-spacing: 0.2em;
	line-height: 1.3;
}

.ec-nosotros-eyebrow--claro {
	color: var(--ec-blanco);
}

/* ============================================================================
   2. Intro «Quiénes somos»
   ============================================================================
   Dos columnas: fotos encimadas a la izquierda (ancho fijo, medido del
   PSD), texto a la derecha (el resto). 33.8125rem/541px es el ancho de la
   caja que encierra las dos fotos (Capa 39 x107..548 + Capa 40 x303..648,
   ver el reporte) -- no 1fr/1fr, mismo criterio que .ec-industrias-intro.
   ========================================================================== */
.ec-nosotros-intro {
	display: grid;
	grid-template-columns: 33.8125rem 1fr;
	column-gap: 3rem;
	align-items: start;
	padding: 6.875rem 0 6rem; /* 110px hasta la foto/año (ajustado en vivo con ecVerificarPSD(), no los 119px de la caja de tinta), 96px hasta el video -- del PSD */
}

/* width:100% + max-width (no un ancho fijo): así se puede medir cada foto
   de adentro en % (ver .ec-nosotros-intro-foto--bn/--color) en vez de con
   transform:scale() -- transform NO cambia la caja de layout (solo lo que
   se PINTA), así que un scale() aquí dejaba el hijo de grid pidiendo sus
   541px de ancho real de todos modos y descuadraba a .ec-nosotros-intro-
   texto en la misma fila -- defecto encontrado revisando a 375px, ver el
   reporte. Con % de por medio, el aspect-ratio hace que el alto siga al
   ancho disponible sin necesitar transform ni recalcular nada por punto
   de quiebre. */
.ec-nosotros-intro-fotos {
	position: relative;
	width: 100%;
	max-width: 33.8125rem; /* 541px */
	aspect-ratio: 541 / 727;
}

.ec-nosotros-intro-foto {
	position: absolute;
	display: block;
	margin: 0;
	object-fit: cover;
}

.ec-nosotros-intro-foto--bn {
	top: 0;
	left: 0;
	width: 81.516%; /* 441 ÷ 541 */
	height: 80.880%; /* 588 ÷ 727 */
}

.ec-nosotros-intro-foto--color {
	top: 47.999%; /* 349 ÷ 727 */
	left: 36.229%; /* 196 ÷ 541 */
	width: 63.770%; /* 345 ÷ 541 */
	height: 51.994%; /* 378 ÷ 727 */
	/* No mide el PSD (una foto encimada sobre otra no proyecta sombra en un
	   PNG plano) -- toque de profundidad razonable para que el borde de la
	   foto a color no se pierda contra la de blanco y negro. */
	box-shadow: 0 0.75rem 2rem rgba(28, 28, 28, 0.18);
}

/* El bloque "DESDE 1997" arranca 173px a la izquierda de "QUIÉNES SOMOS" y
   compañía (x573 contra x746 del PSD) -- no comparten el mismo borde
   izquierdo de columna. .ec-nosotros-intro-texto (abajo) desplaza TODA la
   columna a la derecha hasta el borde de "QUIÉNES SOMOS"; este margen
   negativo trae de vuelta SOLO el año a su propio borde -- ajustado en
   vivo con ecVerificarPSD(), ver el reporte. */
.ec-nosotros-intro-anio {
	display: flex;
	align-items: center;
	gap: 0.1875rem; /* 3px, del PSD -- "DESDE" queda casi pegado al primer dígito */
	margin: 0 0 2.6875rem -10.5rem; /* 43px abajo (ajustado en vivo, no los 60px de la caja de tinta) / -168px a la izquierda (ajustado en vivo, no los 173px) */
}

.ec-nosotros-intro-desde {
	color: var(--ec-naranja);
	font-size: 1.301875rem; /* 20.83px */
	font-weight: var(--ec-peso-regular);
	letter-spacing: 0.2em;
	line-height: 1.3;
}

.ec-nosotros-intro-anio-numero {
	color: var(--ec-naranja);
	font-weight: var(--ec-peso-bold);
	letter-spacing: 0.1em; /* +12.57px a 125.7px, el tracking del PSD */
	line-height: 0.95; /* 119.42 ÷ 125.7 */
	font-size: clamp(3.4375rem, 2.175rem + 6.3125vw, 7.85625rem); /* 125.7px a 1440px */
}

.ec-nosotros-intro-texto {
	/* Borde izquierdo real de "QUIÉNES SOMOS"/H1/párrafo/botón (x746 del
	   PSD) -- 85px más adentro que el borde de la columna del grid (x661,
	   heredado del ancho fijo de .ec-nosotros-intro-fotos + su gap).
	   Ajustado en vivo con ecVerificarPSD(), ver el reporte. */
	padding-left: 5rem; /* 80px, ajustado en vivo (no los 85px de la caja de tinta) */
}

/* :not() para no arrastrar a "NOSOTROS" (2 clases, más abajo) -- esta regla
   ya solo pintaba a "QUIÉNES SOMOS" por especificidad (ver el comentario de
   esa otra regla), pero sin :not() no podía sumarle un margin-left propio
   sin afectar también a "NOSOTROS". Su borde izquierdo real (x746 del PSD)
   queda 5px más adentro que el resto de la columna (x741-742, "NOSOTROS"/
   el título/el párrafo) -- ajustado en vivo con ecVerificarPSD(). */
.ec-nosotros-intro-texto .ec-nosotros-eyebrow:not(.ec-nosotros-intro-rotulo) {
	margin-bottom: 0.875rem; /* 14px hasta el título (ajustado en vivo, no los 31px de la caja de tinta) */
	margin-left: 0.3125rem; /* 5px */
}

.ec-nosotros-intro-titulo {
	margin: 0 0 2.8125rem; /* 45px hasta el párrafo (ajustado en vivo, no los 43px de la caja de tinta) */
	color: var(--ec-texto);
	font-weight: var(--ec-peso-bold);
	letter-spacing: -0.04em; /* -3.33px a 83.33px, el tracking del PSD */
	line-height: 0.9501; /* 79.17 ÷ 83.33 */
	font-size: clamp(2.625rem, 1.886964rem + 3.6902vw, 5.208125rem); /* 83.33px a 1440px */
	text-wrap: balance;
}

.ec-nosotros-intro-parrafo {
	margin: 0 0 3.375rem; /* 54px hasta el rótulo "NOSOTROS" (ajustado en vivo, no los 64px de la caja de tinta) */
	max-width: 38.4375rem; /* 615px, del PSD */
	color: var(--ec-texto);
	font-size: 1.5625rem; /* 25px */
	font-weight: var(--ec-peso-regular);
	line-height: 1.823125rem; /* 29.17px directo, el interlineado del PSD */
}

/* Único tramo en naranja/negrita -- a diferencia de
   .ec-industrias-intro-texto .ec-texto-naranja (industrias.css), el resto
   del párrafo NO va en negrita (el PSD de Nosotros no lo pide, solo esta
   frase). Mismo tamaño (29.17px) que esa otra página -- coincidencia del
   propio PSD, no un valor copiado sin medir. */
.ec-nosotros-intro-parrafo .ec-texto-naranja {
	color: var(--ec-naranja);
	font-size: 1.823125rem; /* 29.17px */
	font-weight: var(--ec-peso-bold);
}

/* Selector de 2 clases a propósito -- .ec-nosotros-intro-texto
   .ec-nosotros-eyebrow (arriba) también pinta este mismo elemento (lleva
   las dos clases) y con la misma especificidad (2 clases) hubiera ganado
   por venir antes en el archivo si esta regla se quedaba en solo 1 clase
   -- defecto encontrado en vivo con ecVerificarPSD() (el margen de
   "QUIÉNES SOMOS" se aplicaba también aquí, tapando este valor). */
.ec-nosotros-eyebrow.ec-nosotros-intro-rotulo {
	margin-bottom: 2.125rem; /* 34px hasta el botón (ajustado en vivo, no los 35px de la caja de tinta) */
}

/* .ec-boton-primario (style.css) ya pinta el tamaño/tipografía exactos de
   "CONÓCENOS" -- este margen solo corrige que su padding en "em" (pensado
   para que el botón crezca con el texto, ver el comentario de esa clase)
   deja la tinta de la letra un poco más adentro de lo que mide el PSD
   para ESTE botón en concreto. Ajustado en vivo con ecVerificarPSD(). */
.ec-nosotros-intro-boton {
	margin-left: 1.1875rem; /* 19px (ajustado en vivo, no los 14px anteriores) */
}

/* ============================================================================
   3. Video — envoltura
   ============================================================================
   El parcial en sí (marco angosto, botón blanco) es el modificador
   ec-video--nosotros, en la sección «Componentes compartidos» de
   style.css -- aquí solo el margen negativo que monta su mitad inferior
   sobre la franja oscura de "Lo que hacemos", con la pila de capas
   (z-index) para que quede ENCIMA de esa franja y no debajo.
   ========================================================================== */
.ec-nosotros-video-envoltura {
	position: relative;
	z-index: 2;
	/* -374px: 1927 (borde inferior del marco de video en el PSD) − 1553
	   (borde superior de la franja oscura siguiente) -- ver el reporte. */
	margin-bottom: -23.375rem;
}

/* ============================================================================
   4. «Lo que hacemos»
   ============================================================================
   Franja oscura a todo lo ancho (100vw, mismo truco que .ec-servicio-hero
   en style.css) -- el padding-top (477px) se cuenta desde el borde
   SUPERIOR REAL de esta franja (y1553 del PSD), sin importar que el video
   de arriba tape visualmente sus primeros 374px (ver la envoltura, arriba):
   el resultado es que el contenido de abajo aparece 103px después de donde
   termina el marco del video, tal como mide el PSD.
   ========================================================================== */
.ec-nosotros-soluciones {
	position: relative;
	z-index: 1;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	padding-top: 29.3125rem; /* 469px (ajustado en vivo, no los 477px de la caja de tinta) */
	padding-bottom: 7.0625rem; /* 113px, del PSD */
	background-color: var(--ec-negro-footer);
	overflow: hidden; /* contiene el margin negativo de la envoltura del video en su propio contexto, mismo criterio que .ec-video */
}

/* Esta sección arranca un poco más adentro que el resto de las secciones
   contenidas (x88/101 contra los x91-93 de la Intro/Línea de tiempo, que
   sí calzan con el borde de .ec-nosotros-contenedor) -- override local en
   vez de tocar ese padding compartido, que ya está calibrado para las
   otras tres secciones. Ajustado en vivo con ecVerificarPSD(). */
.ec-nosotros-soluciones > .ec-nosotros-contenedor {
	padding-left: 5.5rem; /* 88px, el borde real de "Ofrecemos soluciones..." -- ajustado en vivo */
}

/* "LO QUE HACEMOS" arranca 13px más adentro que "Ofrecemos..." (x101
   contra x88 del PSD) -- mismo caso que "DESDE" en la Intro (ver ese
   comentario): no comparten borde izquierdo con el resto de su columna.
   Ajustado en vivo con ecVerificarPSD(). */
.ec-nosotros-soluciones-titulos .ec-nosotros-eyebrow--claro {
	margin-left: 0.8125rem; /* 13px */
}

.ec-nosotros-soluciones-cabecera {
	display: flex;
	/* No space-between: eso pega .ec-nosotros-soluciones-texto al borde
	   derecho del contenedor, pero el PSD deja 75px de aire después de su
	   línea más larga (x1277 contra el borde en x1352) -- con "titulos" a
	   su ancho fijo (abajo) y este gap, el hueco natural entre las dos
	   columnas ya reproduce esos 75px sin tener que fijarlos aparte en el
	   párrafo. Ajustado en vivo con ecVerificarPSD(). */
	justify-content: flex-start;
	align-items: start;
	gap: 7.6875rem; /* 123px = x759 (donde arranca el párrafo) − x636 (donde termina "titulos") */
	margin-bottom: 4.5rem; /* 72px hasta la fila de sectores, del PSD */
}

.ec-nosotros-soluciones-titulos {
	/* width, no max-width: con max-width nada más, un contenido más angosto
	   que 548px (el propio texto, con text-wrap:balance) encoge la caja
	   flex y el gap de arriba deja de medir lo que debe -- ver el
	   comentario de la cabecera. */
	width: 34.25rem; /* 548px, del PSD -- fuerza el mismo salto de línea en 3 tramos que dibuja el diseño */
	flex: none;
}

.ec-nosotros-soluciones-titulos .ec-nosotros-eyebrow--claro {
	margin-bottom: 1.875rem; /* 30px hasta el título (ajustado en vivo, no los 41px de la caja de tinta) */
}

.ec-nosotros-soluciones-titulo {
	margin: 0;
	color: var(--ec-blanco);
}

.ec-nosotros-soluciones-texto {
	margin: 8.25rem 0 0; /* 132px (ajustado en vivo, no los 75px de la caja de tinta) */
	max-width: 32.375rem; /* 518px, del PSD */
	/* Gris sin token -- ver la cabecera del archivo. Comprobado contra
	   :root (style.css): no coincide con --ec-texto-secundario (#6A6A6A,
	   ~4 puntos más oscuro) ni con ningún otro. */
	color: #b4b4b4;
	font-size: 1.301875rem; /* 20.83px */
	font-weight: var(--ec-peso-regular);
	line-height: 1.823125rem; /* 29.17px directo, el interlineado del PSD */
}

/* --------------------------------------------------------------------------
   Fila de 8 sectores — icono + nombre, separados por una línea vertical.
   El separador es un ::before, no un <span> hermano -- mismo motivo que
   .ec-cifras-item::before en style.css (un elemento de grid con grid-row
   propio pero sin columna fija se coloca ANTES que los que no la tienen).
   -------------------------------------------------------------------------- */
.ec-nosotros-sectores {
	display: grid;
	/* Los 7 separadores del PSD no caen en octavos parejos, y las 2 columnas
	   de los extremos tampoco miden lo mismo que las 6 del centro: 83px del
	   borde real del contenedor (x88) al primer separador (x171), 141px del
	   último separador (x1211) al borde derecho (x1352) -- NO 174px en los
	   dos extremos como antes (ese valor no medía el hueco hasta el borde,
	   solo repetía el de un lado al otro). Las 6 columnas centrales sí
	   miden entre separadores tal cual (167 a 180px según el par). fr, no
	   rem, mismo criterio que .ec-cifras--nosotros en style.css --
	   verificado en vivo con ecVerificarPSD(), ver el reporte. */
	/* minmax(0, Nfr), no Nfr solo -- el mínimo de fábrica de una pista de
	   grid es "auto" (= el min-content de su contenido, nunca menos), y
	   "Mecánica de suelos" (columna 1, la más angosta) pedía más de esos
	   83fr -- el motor de grid la estiraba a costa de las otras 6 columnas
	   centrales, que perdían ancho por igual y por eso arrastraban su
	   nombre. Con minmax(0, ...) el reparto es 100% proporcional a los fr,
	   pase lo que pase con el contenido -- defecto encontrado en vivo con
	   ecVerificarPSD(), ver el reporte. */
	grid-template-columns: minmax(0, 83fr) minmax(0, 167fr) minmax(0, 180fr) minmax(0, 171fr) minmax(0, 170.5fr) minmax(0, 171.5fr) minmax(0, 180fr) minmax(0, 141fr);
	/* position:relative + top, NO margin-top -- toda la fila (iconos +
	   nombres) quedaba 15-20px más arriba de lo que mide el PSD, pero un
	   margin-top aquí ALARGA .ec-nosotros-soluciones (su alto lo da el
	   contenido, no un valor fijo) y empuja hacia abajo TODO lo que viene
	   después (línea de tiempo, testimonio, cifras) -- defecto encontrado
	   en vivo con ecVerificarPSD(). position:relative solo mueve la
	   PINTURA, no el flujo. */
	position: relative;
	top: 1.125rem; /* 18px */
}

.ec-nosotros-sectores-item {
	position: relative;
	padding: 0 1rem;
	text-align: center;
}

.ec-nosotros-sectores-item:not(:first-child)::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 0.25rem; /* 4px */
	height: 9.9375rem; /* 159px, del PSD */
	/* Mismo gris sin token que .ec-cifras-item::before (style.css) -- no es
	   una segunda excepción nueva, es el mismo valor reutilizado aquí. */
	background-color: #3b3b3b;
}

.ec-nosotros-sectores-icono {
	display: block;
	margin: 0 auto 1.125rem; /* 18px hasta el nombre, aproximado -- ver el reporte */
	width: 3.125rem; /* 50px */
	height: 3.125rem;
	object-fit: contain;
}

.ec-nosotros-sectores-nombre {
	margin: 0;
	color: var(--ec-blanco);
	font-size: 1.301875rem; /* 20.83px */
	font-weight: var(--ec-peso-regular);
	line-height: 1.301875rem; /* interlineado 20.83px directo, del PSD -- los nombres de 2 líneas lo necesitan ajustado */
}

/* 1.5.10 -- colocación de icono y nombre en la fila de 8 columnas (≥1025px).
   Hasta la 1.5.9 cinco de los ocho ítems llevaban un translateX en px
   (-55/+27/-9/+28/+16) medido contra el PSD viejo. Contra el PNG de diseño
   (que manda) dos de esos corrimientos estaban mal -- Tierras físicas y Pozos
   de agua quedaban ~30px a la derecha de su columna y, en UN solo renglón,
   la línea divisoria de la columna siguiente les pasaba por encima («Pozos
   de aguc») -- y como son px fijos sobre columnas que escalan con la ventana
   (fr), a 1280-1366 los demás tampoco calzaban. Ahora el PNG se reproduce con
   reglas generales:
   - cada icono y cada nombre va CENTRADO en su columna (entre su línea
     divisoria y la siguiente), a cualquier ancho, sin corrimientos por ítem;
   - el nombre tiene un ancho máximo (7.9rem = 126.4px) que da los cortes de
     renglón del PNG: "Exploración y" (124.5px) cabe en una línea y "Tierras
     físicas" (128.1px) ya no; "Pozos de agua" (132px) parte tras "de"; las
     demás ya partían bien;
   - las dos columnas de los extremos SANGRAN fuera de la rejilla, como en el
     PNG (texto de «Mecánica de suelos» desde x49, con la rejilla desde x88;
     «Exploración y sondeos» hasta x1365, con la rejilla hasta x1352): sus
     cajas se alargan con un margen negativo -- 80px la primera, 40px la
     última -- y el centrado hace el resto.
   Los separadores (::before) no cambian: el relleno izquierdo de 0.25rem
   deja fuera la línea al centrar (4px). Por debajo de 1025px (4 y 2 columnas)
   nada de esto aplica, y la fila queda como estaba.
   min-width:1025px porque los px de sangrado son del grid de 8 columnas. */
@media (min-width: 1025px) {
	.ec-nosotros-sectores-item {
		padding: 0;
	}

	.ec-nosotros-sectores-item:not(:first-child) {
		padding-left: 0.25rem; /* 4px, el ancho del separador */
	}

	.ec-nosotros-sectores-nombre {
		max-width: 7.9rem; /* 126.4px -- ver arriba */
		margin-left: auto;
		margin-right: auto;
	}

	.ec-nosotros-sectores-item:first-child {
		margin-left: -5rem; /* 80px de sangrado a la izquierda de la rejilla */
	}

	/* "Mecánica de" mide 116.6px: con el máximo general partiría
	   "Mecánica de / suelos" y el PNG es "Mecánica / de suelos". */
	.ec-nosotros-sectores-item:first-child .ec-nosotros-sectores-nombre {
		max-width: 6.25rem; /* 100px */
	}

	.ec-nosotros-sectores-item:last-child {
		margin-right: -2.5rem; /* 40px de sangrado a la derecha de la rejilla */
	}
}

/* «Pozos de agua» es el único de los 8 nombres cuya capa de texto en el PSD
   trae interlineado AUTOMÁTICO (25px = 1.2 × su tamaño) en vez del 20.83px
   fijo de los otros 7 -- confirmado en psd-nosotros.json capa por capa, no
   es un error de medición. Único ajuste por ítem de esta fila (el resto sí
   comparte una sola regla): "Pozos de agua" es la 7a fila de
   ec_nosotros_sectores_defecto() (inc/paginas/nosotros.php). */
.ec-nosotros-sectores-item:nth-child(7) .ec-nosotros-sectores-nombre {
	line-height: 1.5625rem; /* 25px = 20.83px × 1.2 */
}

/* 1.5.10 -- «Pozos de agua» ahora parte en dos renglones también a 1440+
   (antes, desbordado, iba en uno). Sus 2 × 25px de interlineado le sacan
   ~8.3px a la fila de 2 × 20.83px de las demás y correrían hacia abajo
   TODO lo que sigue (línea de tiempo, testimonio, cifras). El margen
   negativo devuelve esa diferencia, así el alto de la fila no cambia -- y el
   PNG pinta ese nombre 5px más arriba y 3px más abajo que los demás (sube
   -5px, ver translateY de abajo), sin afectar el flujo. */
@media (min-width: 1025px) {
	.ec-nosotros-sectores-item:nth-child(7) .ec-nosotros-sectores-nombre {
		margin-bottom: calc(-2 * (1.5625rem - 1.301875rem)); /* -8.34px */
		transform: translateY(-0.3125rem); /* -5px: el aire de más del interlineado de 25px queda arriba de la primera línea */
	}
}

/* ============================================================================
   5. Línea de tiempo
   ============================================================================
   Grid de 3 filas × N columnas (N = número de entradas, ec-tiempo-n): la
   cabecera y las tarjetas "arriba" van en la fila 1; la línea con sus
   puntos, en la fila 2; las tarjetas "abajo" y el cierre, en la fila 3.
   Cada tarjeta/punto fija su COLUMNA con la variable --ec-col (en su
   style="", calculada en templates/nosotros.php desde su índice) -- la
   FILA la decide 'data-posicion' (abajo, con el selector de atributo) o la
   clase fija (cabecera/cierre, que no cambian de fila nunca). Así se
   cumple lo que pide el encargo: "una regla general (posición... o un
   campo arriba/abajo), no reglas por ítem" -- ninguna regla de aquí abajo
   menciona un año ni un índice concreto.
   La cabecera ocupa las columnas de la PRIMERA MITAD (1 a N/2) y el cierre
   las de la SEGUNDA MITAD (N/2+1 a N) -- con las 4 entradas de fábrica (2
   abajo / 2 arriba, en ese orden) da columnas 1-2 y 3-4, tal como mide el
   PSD. Con otro reparto de abajo/arriba el resultado ya no calca el PSD al
   pixel, pero sigue siendo una fila limpia -- el encargo no pide más que
   una regla general, no fidelidad para cualquier combinación futura.

   OJO -- ronda del 11 sep: esta sección se mide sobre Nosotros.png (el
   archivo de exportación, MÁS NUEVO que el PSD del que salen spec-
   nosotros.md/psd-nosotros.json para el resto de la página, ver el
   docblock de inc/paginas/nosotros.php). Las tarjetas, la línea, los
   puntos y la cabecera de abajo se ajustaron recortando esa franja del PNG
   con Python/PIL (Engranaje Coorporativo/08. Diseño Web/Nosotros/
   Nosotros.png, franja y≈2760-3330) y midiendo ahí bordes/texto -- NO con
   ecVerificarPSD(), que compara contra el JSON viejo (ver el reporte de
   esta ronda para la tabla completa PNG-vs-página). El bloque de cierre
   ("MÁS DE 30 AÑOS...") si sale en el JSON con el mismo texto de hoy, así
   que sí se deja verificar con la herramienta -- su posición se resolvió
   sola al corregir el alto de las tarjetas de arriba (ver el reporte). */
.ec-nosotros-tiempo {
	display: grid;
	/* minmax(0, 1fr), no 1fr solo -- mismo defecto que .ec-nosotros-sectores
	   (nosotros.css, más arriba): el mínimo de fábrica de una pista de grid
	   es "auto" (= el min-content de su contenido), y la tarjeta de ancho
	   fijo (302px, ver .ec-nosotros-tiempo-tarjeta) forzaba las 4 columnas
	   a 302px sin importar el 1fr, saliéndose del contenedor -- defecto
	   encontrado en vivo con ecVerificarPSD() (corría las tarjetas "abajo"
	   y el cierre hacia la derecha). */
	grid-template-columns: repeat(var(--ec-tiempo-n), minmax(0, 1fr));
	column-gap: 2.3125rem; /* 37px, del PSD (gap entre las 2 tarjetas de una misma fila) -- probado a 41px (medido entre cantos de tarjeta en el PNG) y descartado: esa medida mezcla el gap real de la columna con el desborde de la tarjeta (más angosta que su columna, ver el margin auto de .ec-nosotros-tiempo-tarjeta), así que no es el mismo dato -- empeoraba, no mejoraba, contra ecVerificarPSD(). */
	/* 237px hasta el antetítulo -- el PNG (Nosotros.png, más nuevo que el PSD
	   de esta sección, ver el docblock grande de más abajo) mide "LÍNEA DE
	   TIEMPO" en y2840 sobre un lienzo de 5311px; con el resto de la página
	   ya calzado, esos 237px son los que hacen falta para que caiga ahí.
	   31px tras la última tarjeta -- ver el reporte para el resto de esta
	   sección, medida en el PNG con Python/PIL, no con psd-nosotros.json
	   (defasado, ver el docblock). */
	padding: 8.8125rem 0 16.6875rem; /* 96px menos arriba que antes de esta ronda -- ver el comentario de margin-top en .ec-nosotros-tiempo-cabecera, más abajo: esos 96px de aire ARRIBA de la cabecera los pide la fila 1 por las tarjetas "arriba" (más altas que la cabecera), no la cabecera misma, así que se devuelven ahí en vez de aquí, para no mover el antetítulo de y2840. Abajo, 260px (antes 76px): las tarjetas/el cierre, ya del tamaño real del PNG, y esos mismos 96px restados arriba, dejaban el Testimonio muy por ARRIBA de donde mide su propio spec -- ajustado en vivo con ecVerificarPSD() para que ese spec (que sí sigue vigente, ver el reporte) vuelva a cuadrar. */
}

.ec-nosotros-tiempo-cabecera {
	grid-column: 1 / var(--ec-fin);
	grid-row: 1;
	/* start, no end -- a diferencia de las tarjetas "arriba" (que sí cuelgan
	   del borde inferior de la fila 1, pegadas a la línea): con el copy
	   real de la tarjeta "2026" (bastante más largo que el del PSD, ver el
	   docblock de ec_nosotros_tiempo_entradas_defecto() en
	   inc/paginas/nosotros.php) la fila 1 crece mucho más alta que la
	   cabecera -- alineada por abajo, esta quedaba flotando muy por debajo
	   de donde mide el PSD. Alineada por arriba, arranca justo después del
	   padding-top de la sección pase lo que pase con el alto de las
	   tarjetas -- ajustado en vivo con ecVerificarPSD(), ver el reporte. */
	align-self: start;
	margin-top: 6rem; /* 96px -- ver el comentario del padding-top de .ec-nosotros-tiempo: se lo resta a ese padding y se lo devuelve aquí, sin mover el antetítulo (y2840 en el PNG) */
}

.ec-nosotros-tiempo-cabecera .ec-nosotros-eyebrow {
	margin-bottom: 2rem; /* 32px hasta el título, del PSD */
}

.ec-nosotros-tiempo-titulo {
	margin: 0;
	color: var(--ec-texto);
	font-weight: var(--ec-peso-bold);
	letter-spacing: -0.04em; /* -2.26px a 56.46px, el tracking del PSD */
	line-height: 1.187; /* 67.02 ÷ 56.46 */
	font-size: clamp(1.75rem, 1.241786rem + 2.5411vw, 3.52875rem); /* 56.46px a 1440px */
	text-wrap: balance;
}

.ec-nosotros-tiempo-item {
	grid-column: var(--ec-col);
}

.ec-nosotros-tiempo-item[data-posicion='arriba'] {
	grid-row: 1;
	align-self: end;
}

.ec-nosotros-tiempo-item[data-posicion='abajo'] {
	grid-row: 3;
	align-self: start;
}

.ec-nosotros-tiempo-item[data-posicion='arriba'] .ec-nosotros-tiempo-tarjeta {
	margin-bottom: 2.5625rem; /* 41px hasta la línea, medido en el PNG (no los 59px del PSD viejo) */
}

.ec-nosotros-tiempo-item[data-posicion='abajo'] .ec-nosotros-tiempo-tarjeta {
	margin-top: 2.4375rem; /* 39px desde la línea -- ajustado en vivo con ecVerificarPSD(), no los 46px medidos a ojo en el PNG */
}

.ec-nosotros-tiempo-tarjeta {
	box-sizing: border-box;
	width: 18.875rem; /* 302px, medido en el PNG (no los 305px del PSD viejo) */
	/* position+transform, NO margin:auto -- la tarjeta (302px) es más ANCHA
	   que su columna del grid (1260px de hueco entre 4 columnas y 3 huecos
	   de 37px, ≈287px cada una): con margin:auto en una caja más ancha que
	   su contenedor, el navegador NO reparte el desborde entre los dos
	   márgenes (los deja en 0/negativo, pegada a la izquierda) -- mismo
	   defecto que ya se vio en .ec-nosotros-sectores-nombre:nth-child(1)
	   (nosotros.css, más arriba), misma solución: centrar con
	   left:50%+transform, que sí reparte el desborde parejo a los dos
	   lados sea cual sea el ancho del padre. */
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	padding: 1.375rem 1.5625rem 1.75rem; /* 22px arriba / 25px a los lados / 28px abajo, medidos en el PNG */
	background-color: var(--ec-blanco);
	/* No mide el PSD (una sombra suave no se distingue en un PNG plano
	   contra fondo blanco) -- toque de profundidad razonable, mismo
	   criterio que la foto a color de la Intro, arriba. */
	box-shadow: 0 0.25rem 1.5rem rgba(28, 28, 28, 0.08);
	text-align: center;
}

/* Ajuste fino de las 2 tarjetas "abajo" -- el centrado de arriba (left:50%
   + transform) ya reparte el desborde parejo, pero el PNG no cae exacto a
   la mitad de cada columna en ninguna de las dos: "1997" un poco a la
   izquierda, "2006" un poco a la derecha. [style*] en vez de :nth-child --
   cabecera/línea/puntos son hermanos de por medio en el grid, así que el
   índice de hijo no calza con el índice de la tarjeta; --ec-col sí lo
   identifica sin ambigüedad. Medido en vivo con ecVerificarPSD().
   min-width:901px -- por debajo de 900px el grid pasa a 1 columna (ver el
   @media más abajo) y la tarjeta ya mide 100% del ancho disponible: estos
   px, pensados sobre el ancho de columna de 1440px, ya no describen nada
   ahí y solo la corrían unos px de más. */
@media (min-width: 901px) {
	.ec-nosotros-tiempo-item[style*='--ec-col: 1;'] .ec-nosotros-tiempo-tarjeta {
		transform: translateX(calc(-50% - 0.5rem)); /* -8px */
	}

	.ec-nosotros-tiempo-item[style*='--ec-col: 2;'] .ec-nosotros-tiempo-tarjeta {
		transform: translateX(calc(-50% + 0.625rem)); /* +10px */
	}
}

.ec-nosotros-tiempo-anio,
.ec-nosotros-tiempo-item-titulo {
	margin: 0;
	color: var(--ec-texto);
	font-weight: var(--ec-peso-bold);
	letter-spacing: -0.0201em; /* -0.47px a 23.41px -- el tamaño no cambió del PSD viejo al PNG, medido igual en los dos (año de una sola línea, sin descendentes: 17px de tinta ≈ 0.72 × 23.41, el cap-height típico de Outfit) */
	font-size: 1.463125rem; /* 23.41px */
}

.ec-nosotros-tiempo-anio {
	line-height: 1; /* interlineado 23.41px = tamaño -- el año siempre es una sola línea, no le hace falta más */
	margin-bottom: 0.875rem; /* 14px hasta el título, medido en el PNG (no los 16px del PSD viejo) */
}

.ec-nosotros-tiempo-item-titulo {
	/* line-height propio (no el de arriba): a diferencia del año, el título
	   sí puede caer en 1-2 líneas -- 22px, medido en el PNG entre renglones
	   de la tarjeta "2017" (única con título a 2 líneas). El 1 (=23.41px)
	   heredado de la regla de arriba solo se verificó contra un año de una
	   línea. */
	line-height: 1.375rem; /* 22px */
	margin-bottom: 1.125rem; /* 18px hasta el texto, del PSD viejo -- el PNG mide igual aquí */
}

.ec-nosotros-tiempo-item-texto {
	margin: 0;
	color: var(--ec-texto-secundario); /* #6A6A6A -- el PSD mide #6B6B6B, dentro de la tolerancia */
	font-weight: var(--ec-peso-regular);
	/* 16px/18px, NO los 18.28px/interlineado-1 del PSD viejo -- ese valor
	   venía de una capa de texto vieja (ver el docblock grande de esta
	   sección); a 18.28px el párrafo de "2017"/"2026" envuelve una línea de
	   más que en el PNG (verificado letra por letra: los mismos cortes de
	   línea que el PNG SOLO aparecen a 16px). Medido en el PNG. */
	line-height: 1.125rem; /* 18px */
	font-size: 1rem; /* 16px */
}

.ec-nosotros-tiempo-linea {
	grid-row: 2;
	grid-column: 1 / -1;
	align-self: center;
	height: 0.3125rem; /* 5px, medido en el PNG (no los 9px del PSD viejo) */
	background-color: var(--ec-gris-lineas); /* #E8E8E8 -- el PNG mide #E5E5E5 (229,229,229), dentro de la tolerancia -- mismo color del PSD viejo, no cambió */
}

.ec-nosotros-tiempo-punto {
	grid-row: 2;
	grid-column: var(--ec-col);
	align-self: center;
	justify-self: center;
	width: 0.5625rem; /* 9px, medido en el PNG (no los 15px del PSD viejo) */
	height: 0.5625rem;
	border-radius: 50%;
	background-color: var(--ec-negro-footer);
}

.ec-nosotros-tiempo-cierre {
	grid-column: var(--ec-inicio) / var(--ec-fin);
	grid-row: 3;
	align-self: start;
	/* 68px, no los 46px de las tarjetas "abajo" -- este bloque es solo texto
	   (sin tarjeta blanca ni sombra alrededor), así que su propio margin no
	   tiene por qué calzar con el de ellas; no cambia el alto de la fila 3
	   (las tarjetas "abajo" siguen midiendo más, ver el reporte). Ajustado
	   en vivo con ecVerificarPSD(). */
	margin-top: 4.25rem; /* 68px */
	text-align: center;
}

/* +25px: con las columnas 3-4 ya del ancho real (minmax(0,1fr), arriba), el
   centro de este bloque de 2 columnas queda 25px a la izquierda de donde
   mide el PNG -- no hay una segunda medida (aparte del ancho de columna)
   que lo explique, así que se ajusta en vivo con ecVerificarPSD(), ver el
   reporte. min-width:901px, aparte de la regla base -- por debajo de
   900px este bloque pasa a grid-column:1 (ancho completo, ver el @media
   más abajo) y ya no hay "columnas 3-4" que centrar de más. */
@media (min-width: 901px) {
	.ec-nosotros-tiempo-cierre {
		transform: translateX(1.5625rem);
	}
}

.ec-nosotros-tiempo-cierre-titulo {
	margin: 0 0 1.5rem; /* 24px hasta el texto, aproximado -- ver el reporte */
	color: var(--ec-texto);
	font-weight: var(--ec-peso-bold);
	letter-spacing: 0.12em; /* +2.5px a 20.83px, el tracking del PSD */
	line-height: 1.3;
	font-size: 1.301875rem; /* 20.83px */
}

.ec-nosotros-tiempo-cierre-texto {
	margin: 0 auto;
	max-width: 30.625rem; /* 490px, del PSD */
	color: var(--ec-texto-secundario);
	font-weight: var(--ec-peso-regular);
	line-height: 1; /* interlineado 18.28px = tamaño 18.28px en el PSD */
	font-size: 1.1425rem; /* 18.28px */
}

/* ============================================================================
   6. Testimonio — envoltura con foto
   ============================================================================
   Fila a todo lo ancho: la tarjeta de .ec-testimonio (style.css, SIN
   tocarla) a la izquierda, y una foto propia de esta composición
   llenando el resto -- "una clase de envoltura de tu página", tal como
   pide el encargo para no romper Inicio. .ec-testimonio ya mide 690px de
   fábrica (43.125rem, ver style.css), el mismo ancho que pide el PSD de
   Nosotros para esta tarjeta -- no hace falta ningún ajuste.
   ========================================================================== */
.ec-nosotros-testimonio-fila {
	display: flex;
	align-items: stretch;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: 39.6875rem; /* 635px, del PSD (alto de la foto de fondo) */
	overflow: hidden;
}

/* La tarjeta oscura del PSD sangra 10px fuera del borde izquierdo real
   (x-10, "Rectángulo 8" en el reporte) -- .ec-testimonio (style.css) no
   lo sabe ni tiene por qué saberlo (en Inicio arranca en x0), así que ese
   ajuste de esta composición va aquí, sin tocar ese archivo. Ajustado en
   vivo con ecVerificarPSD(). */
.ec-nosotros-testimonio-fila .ec-testimonio {
	flex: none;
	margin-left: -0.625rem; /* -10px */
}

.ec-nosotros-testimonio-foto {
	display: block;
	/* flex-basis:0, no "auto" -- con "auto" el flex-basis toma el width de
	   abajo (100%, el ancho del CONTENEDOR completo) antes de repartir el
	   espacio, y esta imagen terminaba pidiendo 100% de 1425px DEMÁS de lo
	   que ya ocupa la tarjeta -- overflow horizontal real, oculto solo
	   porque .ec-nosotros-testimonio-fila tiene overflow:hidden (defecto
	   encontrado revisando con la barra de desplazamiento visible, ver el
	   reporte). Con flex-basis:0 el 100% de ancho de abajo por fin se
	   calcula sobre el espacio que le sobra a este ítem, no sobre el
	   contenedor entero. */
	flex: 1 1 0;
	min-width: 0; /* el mínimo de fábrica de un flex item es "auto" (= su ancho intrínseco), no 0 -- sin esto, el <img> no encoge por debajo de eso y se sale igual */
	width: auto;
	height: auto;
	object-fit: cover;
}

/* ============================================================================
   7. Cifras
   ============================================================================
   El estilo (números oscuros, rótulos oscuros, separador) es el
   modificador ec-cifras--nosotros, en la sección «Componentes compartidos»
   de style.css -- aquí solo el aire vertical de la sección, dentro de
   .ec-nosotros-contenedor.
   ========================================================================== */
.ec-nosotros-contenedor > .ec-cifras--nosotros {
	padding: 6.375rem 0 7.5rem; /* 102px arriba (ajustado en vivo, no los 96px anteriores) */
}

/* ============================================================================
   Responsive — 1024 / 767, mismo criterio que el resto del tema (fluido
   por debajo de 1440 vía columnas en fr/1fr y los clamp() de arriba;
   apilado limpio en estos dos quiebres, sin scroll horizontal).
   ========================================================================== */
@media (max-width: 1024px) {
	.ec-nosotros-contenedor {
		padding: 0 2.5rem;
	}

	.ec-nosotros-intro {
		grid-template-columns: 1fr;
		row-gap: 3rem;
		padding: 4rem 0;
	}

	/* min-width:0 -- el mínimo de fábrica de un elemento de grid es "auto"
	   (= su ancho de contenido, NUNCA menor), no 0: sin esto,
	   .ec-nosotros-intro-texto no encogía por debajo del ancho que pide
	   "1997" (el número más grande de la página, sin dónde partir línea)
	   y se salía del contenedor -- defecto encontrado revisando a 375px,
	   ver el reporte. Mismo defecto, misma causa, que el de la foto del
	   Testimonio (ver ese comentario, más abajo en este archivo). Ya no
	   hace falta en .ec-nosotros-intro-fotos: esa columna ahora se mide en
	   % de su propio contenedor (ver la regla base), no con un ancho fijo
	   más grande que el hueco disponible. */
	.ec-nosotros-intro-texto {
		min-width: 0;
	}

	/* El escalón entre "DESDE 1997" y el resto de la columna (margin-left
	   negativo del año + padding-left del texto, ver la Intro en
	   escritorio) es un ajuste de las DOS columnas lado a lado -- apiladas
	   en una sola columna ya no hace falta, y esos valores de escritorio
	   sacaban el año por la izquierda de la pantalla a este ancho (defecto
	   encontrado revisando con la barra de desplazamiento visible, ver el
	   reporte). */
	.ec-nosotros-intro-texto {
		padding-left: 0;
	}

	.ec-nosotros-intro-anio {
		margin-left: 0;
	}

	.ec-nosotros-video-envoltura {
		margin-bottom: -14rem;
	}

	.ec-nosotros-soluciones {
		padding-top: 18rem;
		padding-bottom: 4rem;
	}

	/* El padding-left "a medida" de esta sección (5.5rem/88px, ver la regla
	   base) es más específico que el 2.5rem general de aquí arriba y
	   ganaba en CUALQUIER ancho si no se resetea aparte -- defecto
	   encontrado revisando a 375px, ver el reporte. */
	.ec-nosotros-soluciones > .ec-nosotros-contenedor {
		padding-left: 2.5rem;
	}

	.ec-nosotros-soluciones-cabecera {
		flex-direction: column;
		gap: 1.5rem;
	}

	/* width, no max-width -- igual que la regla base: un ancho FIJO de
	   548px (pensado para el salto de línea de escritorio) se salía del
	   contenedor apilado por debajo de eso, ver el reporte. */
	.ec-nosotros-soluciones-titulos {
		width: 100%;
	}

	.ec-nosotros-soluciones-texto {
		margin-top: 0;
		max-width: none;
	}

	.ec-nosotros-sectores {
		grid-template-columns: repeat(4, 1fr);
		row-gap: 2.5rem;
	}

	/* A 4 columnas (2 filas de 4), el separador de cada primer elemento DE
	   FILA sobra -- mismo criterio que los separadores de
	   .ec-servicio-banda-columna en móvil (style.css). */
	.ec-nosotros-sectores-item:nth-child(4n + 1)::before {
		display: none;
	}

	.ec-nosotros-tiempo {
		column-gap: 1.5rem;
		padding: 6rem 0;
	}

	.ec-nosotros-tiempo-tarjeta {
		width: 100%;
		padding: 1.75rem 1.25rem;
	}

	.ec-nosotros-testimonio-fila {
		flex-direction: column;
		min-height: 0;
	}

	.ec-nosotros-testimonio-foto {
		height: 18.75rem; /* 300px */
	}
}

/* La Línea de tiempo en 4 columnas necesita más de 900px reales para que
   las tarjetas no se vean angostas y altísimas (el copy real, más largo
   que el del PSD -- ver el docblock grande de esa sección -- envuelve a
   muchas más líneas por debajo de eso) -- defecto encontrado revisando a
   768px con la barra de desplazamiento visible, ver el reporte. Se pasa a
   vertical un poco antes que el resto de la página (que sigue apilando en
   767px), duplicando aquí las mismas reglas del @media de 767px de más
   abajo -- adelantar TODO ese bloque a 900px angostaría de más el resto
   de secciones (sectores, fotos de la Intro) que a 768-900px sí caben
   cómodas en su composición de tablet. */
@media (max-width: 900px) {
	.ec-nosotros-tiempo {
		grid-template-columns: 1fr;
		row-gap: 2rem;
		padding: 4rem 0;
	}

	.ec-nosotros-tiempo-cabecera,
	.ec-nosotros-tiempo-cierre {
		grid-column: 1;
		grid-row: auto;
		align-self: auto;
		margin: 0;
		text-align: center;
	}

	/* [data-posicion], no la clase sola: .ec-nosotros-tiempo-item[data-
	   posicion='arriba'/'abajo'] (la fila base, arriba en este archivo) ya
	   tiene esa misma especificidad (1 clase + 1 atributo) -- con solo la
	   clase, esta regla nunca les gana y la fila/columna de escritorio se
	   quedaba puesta (defecto encontrado revisando a 768px con la barra de
	   desplazamiento visible: la tarjeta "2026" se colaba primero en el
	   orden en vez de al final, ver el reporte). */
	.ec-nosotros-tiempo-item[data-posicion] {
		grid-column: 1;
		grid-row: auto;
		align-self: auto;
		margin: 0;
		text-align: center;
	}

	.ec-nosotros-tiempo-linea,
	.ec-nosotros-tiempo-punto {
		display: none;
	}

	.ec-nosotros-tiempo-tarjeta {
		margin: 0 auto;
		max-width: 22rem;
	}

	.ec-nosotros-tiempo-cierre-texto {
		max-width: none;
	}
}

@media (max-width: 767px) {
	.ec-nosotros-contenedor {
		padding: 0 1.25rem; /* mismo margen lateral que el resto del sitio en este ancho, ver .ec-servicio-columnas en style.css */
	}

	.ec-nosotros-intro {
		padding: 3rem 0;
	}

	.ec-nosotros-intro-anio {
		gap: 0.5rem;
	}

	.ec-nosotros-video-envoltura {
		margin-bottom: -8rem;
	}

	.ec-nosotros-soluciones {
		padding-top: 10rem;
		padding-bottom: 3rem;
	}

	.ec-nosotros-soluciones-titulos {
		max-width: none;
	}

	.ec-nosotros-sectores {
		grid-template-columns: repeat(2, 1fr);
		row-gap: 2rem;
	}

	.ec-nosotros-sectores-item:nth-child(4n + 1)::before {
		display: block; /* revierte el @media de 1024px -- a 2 columnas vuelve a hacer falta cada 2, no cada 4 */
	}

	.ec-nosotros-sectores-item:nth-child(2n + 1)::before {
		display: none;
	}

	.ec-nosotros-sectores-icono {
		width: 2.5rem; /* 40px */
		height: 2.5rem;
	}

	/* Línea de tiempo vertical -- pedido explícito del encargo. El grid
	   pasa a 1 columna; "order" (fijado en templates/nosotros.php) es lo
	   único que decide la secuencia -- cabecera, cada entrada en su orden
	   de captura, cierre -- sin depender de "arriba/abajo". */
	.ec-nosotros-tiempo {
		grid-template-columns: 1fr;
		row-gap: 2rem;
		padding: 4rem 0;
	}

	.ec-nosotros-tiempo-cabecera,
	.ec-nosotros-tiempo-cierre {
		grid-column: 1;
		grid-row: auto;
		align-self: auto;
		margin: 0;
		text-align: center;
	}

	/* [data-posicion] -- misma especificidad que la regla base, ver el
	   comentario igual que este en el @media de 900px, más arriba. */
	.ec-nosotros-tiempo-item[data-posicion] {
		grid-column: 1;
		grid-row: auto;
		align-self: auto;
		margin: 0;
		text-align: center;
	}

	.ec-nosotros-tiempo-linea,
	.ec-nosotros-tiempo-punto {
		display: none;
	}

	.ec-nosotros-tiempo-tarjeta {
		margin: 0 auto;
		max-width: 22rem;
	}

	.ec-nosotros-tiempo-cierre-texto {
		max-width: none;
	}

	.ec-nosotros-testimonio-foto {
		height: 15rem; /* 240px */
	}
}
