/* =========================================================================
   Tema Lankoa · v2

   La foto de un taller —unas manos dibujando un sociograma— llega hasta
   arriba, bajo una cabecera transparente. Debajo, los ocho servicios en
   baldosas que pisan el héroe.

   Paleta: el verde manda, el burdeos señala y el crema ilumina.

   Orden: variables, base, maquetación, botones, cabecera, héroe, baldosas
   de servicios, tarjetas, carrusel de entidades, método, redes y panel,
   cabecera interior, servicios, red, proyectos, contenido, migas y
   paginación, formularios, pie, anchos menores y utilidades.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Variables
   ---------------------------------------------------------------------- */

:root {
	--lk-verde: #0f3d3a;
	--lk-verde-noche: #0a2826;
	--lk-verde-rgb: 15, 61, 58;
	--lk-verde-noche-rgb: 10, 40, 38;
	--lk-burdeos: #6c151e;
	--lk-burdeos-hondo: #54101a;
	--lk-crema: #f5dabf;
	--lk-marfil: #faf7f2;
	--lk-arena: #efe6da;
	--lk-tinta: #14201f;
	--lk-gris: #5e6a68;
	--lk-gris-suave: #8a9492;
	--lk-borde: #e7dfd4;
	--lk-blanco: #ffffff;

	--lk-fuente: "Jost", "Century Gothic", "Avenir Next", "Segoe UI", system-ui, sans-serif;
	--lk-display: "Lora", "Iowan Old Style", Georgia, "Times New Roman", serif;

	--lk-t-xs: 0.75rem;
	--lk-t-s: 0.875rem;
	--lk-t-base: 1rem;
	--lk-t-m: 1.125rem;
	--lk-t-xl: clamp(2rem, 1.3rem + 2.2vw, 3rem);
	--lk-t-xxl: clamp(2.5rem, 1.4rem + 3.8vw, 4.75rem);

	--lk-ancho: 1240px;
	--lk-margen: clamp(20px, 5vw, 100px);
	--lk-ancho-texto: 68ch;
	--lk-encabezado: 104px;
	--lk-seccion: clamp(80px, 8.5vw, 120px);

	/* La foto del héroe termina dentro de la primera fila de baldosas, cerca
	   de su base: así las baldosas claras cruzan de la foto al fondo claro y
	   cosen los dos bloques. Se calcula a partir del ancho de la rejilla:
	   4 columnas en proporción 5:3. */
	--lk-rejilla-ancho: min(100vw - 2 * var(--lk-margen), var(--lk-ancho));
	--lk-baldosas-ancho: calc(var(--lk-rejilla-ancho) * .9);
	--lk-solape: calc((var(--lk-baldosas-ancho) - 72px) * .15 * .78);
	--lk-baldosas-aire: 90px;
	--lk-heroe-arriba: 152px;

	--lk-radio: 6px;
	--lk-sombra: 0 2px 4px rgba(20, 32, 31, .04), 0 22px 48px rgba(20, 32, 31, .10);
	--lk-sombra-alta: 0 4px 10px rgba(20, 32, 31, .06), 0 30px 64px rgba(20, 32, 31, .16);

	--lk-t: 220ms cubic-bezier(.3, .7, .4, 1);
}

/* Color principal alternativo: azul pizarra, el del logotipo. Se elige en
   Apariencia → Personalizar → Color de la web, o se previsualiza con
   ?color=azul|verde en la dirección. Solo cambian las variables: todo lo
   que usa el color principal, velos de las fotos incluidos, las sigue. */
body.lk-color-azul {
	--lk-verde: #56697e;
	--lk-verde-noche: #3f4f63;
	--lk-verde-rgb: 86, 105, 126;
	--lk-verde-noche-rgb: 63, 79, 99;
}

/* -------------------------------------------------------------------------
   2. Base
   ---------------------------------------------------------------------- */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 96px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

body {
	margin: 0;
	font-family: var(--lk-fuente);
	font-size: var(--lk-t-base);
	line-height: 1.65;
	color: var(--lk-tinta);
	background: var(--lk-marfil);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2 {
	margin: 0 0 .5em;
	font-family: var(--lk-display);
	font-weight: 400;
	line-height: 1.06;
	letter-spacing: -.015em;
	color: var(--lk-tinta);
	text-wrap: balance;
}

h1 { font-size: var(--lk-t-xxl); }
h2 { font-size: var(--lk-t-xl); }

h3, h4, h5, h6 {
	margin: 0 0 .5em;
	font-family: var(--lk-display);
	font-weight: 600;
	line-height: 1.25;
	color: var(--lk-tinta);
	text-wrap: balance;
}

h3 { font-size: 1.25rem; }
h4 { font-size: 1.0625rem; }

p { margin: 0 0 1.2em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }

a {
	color: var(--lk-burdeos);
	text-decoration-thickness: 1px;
	text-underline-offset: .2em;
	transition: color var(--lk-t);
}

a:hover { color: var(--lk-burdeos-hondo); }

:focus-visible {
	outline: 2px solid var(--lk-burdeos);
	outline-offset: 3px;
	border-radius: 2px;
}

img, svg, video {
	max-width: 100%;
	height: auto;
	display: block;
}

ul, ol { padding-left: 1.25em; }

blockquote {
	margin: 2.2em 0;
	padding: .2em 0 .2em 1.5em;
	border-left: 2px solid var(--lk-burdeos);
	font-family: var(--lk-display);
	font-size: 1.375rem;
	font-style: italic;
	line-height: 1.4;
	color: var(--lk-verde);
}

hr {
	border: 0;
	border-top: 1px solid var(--lk-borde);
	margin: 3em 0;
}

table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.6em 0;
	font-size: var(--lk-t-s);
}

th, td {
	padding: .75em .9em;
	border-bottom: 1px solid var(--lk-borde);
	text-align: left;
	vertical-align: top;
}

th { font-weight: 600; background: var(--lk-arena); }

.lk-contenido table,
.lk-contenido pre { display: block; overflow-x: auto; }

/* -------------------------------------------------------------------------
   3. Maquetación
   ---------------------------------------------------------------------- */

.lk-contenedor {
	width: min(100% - 2 * var(--lk-margen), var(--lk-ancho));
	margin-inline: auto;
}

.lk-seccion { padding-block: var(--lk-seccion); }
.lk-seccion--blanca { background: var(--lk-blanco); }
.lk-seccion--arena,
.lk-seccion--papel { background: var(--lk-arena); }

.lk-seccion--oscura {
	position: relative;
	background: var(--lk-verde);
	color: rgba(255, 255, 255, .78);
	overflow: hidden;
}

.lk-seccion--oscura h2,
.lk-seccion--oscura h3 { color: #fff; }

.lk-rotulo {
	display: block;
	margin-bottom: 14px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--lk-burdeos);
}

.lk-seccion__cab {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px 48px;
	margin-bottom: 48px;
}

.lk-seccion__titulo { margin: 0; }

.lk-seccion__entradilla {
	max-width: 42ch;
	margin: 0;
	color: var(--lk-gris);
	font-size: 1rem;
	line-height: 1.55;
}

.lk-seccion--oscura .lk-seccion__entradilla { color: rgba(255, 255, 255, .7); }

.lk-rejilla {
	display: grid;
	gap: 28px;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
}

.lk-rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.lk-saltar {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	padding: .9em 1.4em;
	background: var(--lk-verde-noche);
	color: #fff;
}

.lk-saltar:focus { left: 0; color: #fff; }

/* -------------------------------------------------------------------------
   4. Botones y enlaces
   ---------------------------------------------------------------------- */

.lk-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 26px;
	border: 1px solid transparent;
	border-radius: 4px;
	background: var(--lk-burdeos);
	color: var(--lk-crema);
	font: 600 .9375rem/1 var(--lk-fuente);
	letter-spacing: .01em;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--lk-t), color var(--lk-t), border-color var(--lk-t);
}

.lk-boton:hover { background: var(--lk-burdeos-hondo); color: var(--lk-crema); }

.lk-boton .lk-svg { width: 16px; height: 16px; transition: transform var(--lk-t); }
.lk-boton:hover .lk-svg { transform: translateX(3px); }

.lk-boton--sm { padding: 11px 18px; font-size: .8125rem; }

.lk-boton--crema { background: var(--lk-crema); color: var(--lk-verde); }
.lk-boton--crema:hover { background: #fff; color: var(--lk-verde); }

.lk-boton--borde { background: var(--lk-blanco); border-color: var(--lk-borde); color: var(--lk-tinta); }
.lk-boton--borde:hover { background: var(--lk-blanco); border-color: var(--lk-tinta); color: var(--lk-tinta); }

.lk-boton--linea { background: transparent; border-color: rgba(255, 255, 255, .45); color: #fff; }
.lk-boton--linea:hover { background: rgba(255, 255, 255, .1); border-color: #fff; color: #fff; }

.lk-boton--oscuro { background: var(--lk-verde); color: #fff; }
.lk-boton--oscuro:hover { background: var(--lk-verde-noche); color: #fff; }

/* Alias de la versión 1, que aún puede aparecer en contenidos guardados. */
.lk-boton--ocre { background: var(--lk-burdeos); }

.lk-flecha {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: 600 .9375rem/1.3 var(--lk-fuente);
	color: var(--lk-burdeos);
	text-decoration: none;
}

.lk-flecha::after {
	content: "→";
	transition: transform var(--lk-t);
}

.lk-flecha:hover { color: var(--lk-burdeos-hondo); }
.lk-flecha:hover::after { transform: translateX(4px); }

/* -------------------------------------------------------------------------
   5. Cabecera

   Transparente sobre la foto o sobre la banda verde de cada página. Al
   bajar se vuelve verde sólida y algo más baja.
   ---------------------------------------------------------------------- */

.lk-encabezado {
	position: fixed;
	inset: 0 0 auto;
	z-index: 100;
	color: #fff;
	transition: background var(--lk-t), box-shadow var(--lk-t);
}

.admin-bar .lk-encabezado { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .lk-encabezado { top: 46px; }
}

.lk-encabezado.esta-fijo,
body.lk-sin-scroll .lk-encabezado {
	background: rgba(var(--lk-verde-noche-rgb), .97);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
}

.lk-encabezado__interior {
	display: flex;
	align-items: center;
	gap: 36px;
	height: var(--lk-encabezado);
	transition: height var(--lk-t);
}

.lk-encabezado.esta-fijo .lk-encabezado__interior { height: 80px; }

.lk-marca {
	display: block;
	flex: none;
	width: 168px;
	transition: width var(--lk-t);
}

.lk-marca__img { width: 100%; height: auto; }

.lk-encabezado.esta-fijo .lk-marca { width: 140px; }

.lk-navegacion {
	display: flex;
	align-items: center;
	gap: 36px;
	margin-left: auto;
}

.lk-navegacion .menu {
	display: flex;
	align-items: center;
	gap: 34px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lk-navegacion .menu a {
	position: relative;
	display: inline-block;
	padding: 8px 0;
	font: 500 .9375rem/1.3 var(--lk-fuente);
	color: rgba(255, 255, 255, .84);
	text-decoration: none;
	white-space: nowrap;
}

.lk-navegacion .menu a:hover,
.lk-navegacion .current-menu-item > a,
.lk-navegacion .current_page_item > a { color: #fff; }

.lk-navegacion .menu a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: var(--lk-crema);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--lk-t);
}

.lk-navegacion .menu a:hover::after,
.lk-navegacion .current-menu-item > a::after,
.lk-navegacion .current_page_item > a::after { transform: scaleX(1); }

.lk-idiomas ul {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lk-idiomas a {
	display: inline-block;
	padding: 6px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .08em;
	text-decoration: none;
	transition: color var(--lk-t);
}

.lk-idiomas--cabecera a { color: rgba(255, 255, 255, .56); }
.lk-idiomas--cabecera a:hover,
.lk-idiomas--cabecera a.es-activo { color: #fff; }

.lk-hamburguesa {
	display: none;
	position: relative;
	width: 44px;
	height: 44px;
	margin-left: auto;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.lk-hamburguesa span {
	position: absolute;
	left: 50%;
	width: 24px;
	height: 2px;
	border-radius: 2px;
	background: #fff;
	transform: translateX(-50%);
	transition: transform var(--lk-t), opacity var(--lk-t);
}

.lk-hamburguesa span:nth-child(1) { top: 15px; }
.lk-hamburguesa span:nth-child(2) { top: 21px; }
.lk-hamburguesa span:nth-child(3) { top: 27px; }

.lk-hamburguesa[aria-expanded="true"] span:nth-child(1) { transform: translateX(-50%) translateY(6px) rotate(45deg); }
.lk-hamburguesa[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.lk-hamburguesa[aria-expanded="true"] span:nth-child(3) { transform: translateX(-50%) translateY(-6px) rotate(-45deg); }

/* -------------------------------------------------------------------------
   6. Héroe de portada
   ---------------------------------------------------------------------- */

.lk-heroe {
	position: relative;
	isolation: isolate;
	background: var(--lk-verde);
	color: #fff;
	overflow: hidden;
}

.lk-heroe__fondo {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: 62% 45%;
}

.lk-heroe::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(180deg, rgba(var(--lk-verde-noche-rgb), .62) 0, rgba(var(--lk-verde-noche-rgb), 0) 190px),
		linear-gradient(90deg, rgba(var(--lk-verde-rgb), .97) 0%, rgba(var(--lk-verde-rgb), .9) 30%, rgba(var(--lk-verde-rgb), .58) 60%, rgba(var(--lk-verde-rgb), .42) 100%);

	/* Abajo el velo se afloja: ahí están las baldosas de cristal y así se ve
	   la foto a través de ellas. */
	-webkit-mask-image: linear-gradient(180deg, #000 0 70%, rgba(0, 0, 0, .45) 100%);
	mask-image: linear-gradient(180deg, #000 0 70%, rgba(0, 0, 0, .45) 100%);
}

.lk-heroe__interior { padding-block: var(--lk-heroe-arriba) calc(var(--lk-solape) + var(--lk-baldosas-aire)); }

/* Sin partir el titular a mano: con este ancho, el equilibrado de líneas lo
   deja en dos en los tres idiomas. */
.lk-heroe__titulo {
	max-width: 10em;
	margin: 0;
	color: #fff;
	font-size: var(--lk-t-xxl);
}

.lk-heroe__texto {
	max-width: 44ch;
	margin: 24px 0 0;
	color: rgba(255, 255, 255, .82);
	font-size: var(--lk-t-m);
	line-height: 1.6;
}

/* -------------------------------------------------------------------------
   7. Baldosas de servicios, que pisan el héroe
   ---------------------------------------------------------------------- */

.lk-baldosas {
	position: relative;
	z-index: 2;
	width: var(--lk-baldosas-ancho);
	margin-top: calc(-1 * var(--lk-solape));
}

.lk-baldosas__rejilla {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lk-baldosas__rejilla > li { display: grid; }

/* La sección que sigue a las baldosas arranca antes de lo normal: con el
   aire de sección completo quedaba un hueco enorme entre ellas y «En qué
   andamos». */
.lk-baldosas + .lk-seccion { padding-top: 74px; }

.lk-baldosa {
	position: relative;
	min-width: 0;
	display: grid;
	grid-template-rows: auto 1fr;
	aspect-ratio: 5 / 3;
	padding: 18px 20px 22px;
	border-radius: var(--lk-radio);
	background: var(--lk-verde);
	color: var(--lk-crema);
	box-shadow: var(--lk-sombra);
	text-decoration: none;
	transition: transform var(--lk-t), box-shadow var(--lk-t), background var(--lk-t);
}

.lk-baldosa:hover {
	transform: translateY(-4px);
	box-shadow: var(--lk-sombra-alta);
	background: var(--lk-verde-noche);
	color: var(--lk-crema);
}

.lk-baldosa__icono { width: 26px; height: 26px; opacity: .8; }
.lk-baldosa__icono .lk-icono { width: 100%; height: 100%; }

.lk-baldosa__titulo {
	place-self: center;
	text-align: center;
	font: 600 clamp(1.125rem, .85rem + .7vw, 1.5rem)/1.15 var(--lk-display);
	text-wrap: balance;
}

/* Las cuatro primeras caen sobre la foto del héroe: claras y opacas, para
   que contrasten con ella. El icono, en burdeos. */
.lk-baldosa--clara {
	background: var(--lk-marfil);
	color: var(--lk-verde);
}

.lk-baldosa--clara:hover { background: #fff; color: var(--lk-verde); }
.lk-baldosa--clara .lk-baldosa__icono { color: var(--lk-burdeos); opacity: .9; }


/* -------------------------------------------------------------------------
   8. Tarjetas de actualidad
   ---------------------------------------------------------------------- */

.lk-tarjeta {
	position: relative;
	height: 100%;
	background: var(--lk-blanco);
	border-radius: var(--lk-radio);
	box-shadow: var(--lk-sombra);
	transition: transform var(--lk-t), box-shadow var(--lk-t);
}

.lk-tarjeta:hover { transform: translateY(-3px); box-shadow: var(--lk-sombra-alta); }

.lk-tarjeta__enlace {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.lk-tarjeta__enlace:hover { color: inherit; }

.lk-tarjeta__media {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--lk-arena);
	border-radius: var(--lk-radio) var(--lk-radio) 0 0;
}

.lk-tarjeta__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--lk-radio) var(--lk-radio) 0 0;
}

/* Sin foto: un sociograma en crema sobre verde en lugar de un hueco gris. */
.lk-tarjeta__sinimagen {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: var(--lk-radio) var(--lk-radio) 0 0;
	background: var(--lk-verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 200'%3E%3Cg fill='none' stroke='%23F5DABF' stroke-opacity='.3'%3E%3Cpath d='M60 150 150 90l100 30M150 90l30-60M250 120l40-70M60 150l-30-80'/%3E%3C/g%3E%3Cg fill='%23F5DABF' fill-opacity='.4'%3E%3Ccircle cx='60' cy='150' r='6'/%3E%3Ccircle cx='150' cy='90' r='12'/%3E%3Ccircle cx='250' cy='120' r='8'/%3E%3Ccircle cx='180' cy='30' r='5'/%3E%3Ccircle cx='290' cy='50' r='5'/%3E%3Ccircle cx='30' cy='70' r='4'/%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat;
}

.lk-tarjeta__sello {
	position: absolute;
	right: 24px;
	bottom: -30px;
	display: grid;
	place-items: center;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--lk-verde);
	color: var(--lk-crema);
	box-shadow: 0 0 0 5px var(--lk-blanco);
}

.lk-tarjeta__sello .lk-icono { width: 26px; height: 26px; }

/* La tarjeta del medio lleva el sello en burdeos. */
.lk-rejilla > :nth-child(3n + 2) .lk-tarjeta__sello { background: var(--lk-burdeos); }

.lk-tarjeta__cuerpo {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 30px 30px 32px;
}

.lk-tarjeta__fecha {
	padding-right: 76px;
	font: 600 var(--lk-t-xs)/1.4 var(--lk-fuente);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--lk-gris);
}

.lk-tarjeta__titulo {
	margin: 0;
	font-size: 1.25rem;
	line-height: 1.3;
}

.lk-tarjeta__extracto {
	margin: 0;
	color: var(--lk-gris);
	font-size: .9375rem;
	line-height: 1.6;
}

.lk-tarjeta__mas {
	align-self: flex-start;
	margin-top: auto;
	padding: 11px 18px;
	border-radius: 4px;
	background: var(--lk-burdeos);
	color: var(--lk-crema);
	font: 600 .8125rem/1 var(--lk-fuente);
	transition: background var(--lk-t);
}

.lk-tarjeta:hover .lk-tarjeta__mas { background: var(--lk-burdeos-hondo); }

/* -------------------------------------------------------------------------
   9. Franja de principios y carrusel de entidades
   ---------------------------------------------------------------------- */

/* Franja estrecha entre la actualidad y las entidades: verde noche, el
   mismo de la cabecera cuando baja, con la frase centrada. */
.lk-franja {
	padding-block: clamp(40px, 4.4vw, 56px);
	background: var(--lk-verde-noche);
	text-align: center;
}

.lk-franja__interior {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

/* El símbolo redondo de la marca, pequeño, presidiendo la frase. */
.lk-franja__simbolo {
	width: 54px;
	height: auto;
	opacity: .9;
}

.lk-franja__texto {
	max-width: none;
	margin: 0;
	font: 400 clamp(1.0625rem, .9rem + .45vw, 1.375rem)/1.5 var(--lk-display);
	letter-spacing: -.01em;
	color: #fff;
}

.lk-carrusel__entradilla { max-width: none; margin-top: 12px; }

/* Una flecha a cada lado de la tira de logos. */
.lk-carrusel__marco {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr) 48px;
	align-items: center;
	column-gap: clamp(12px, 7vw, 102px);
}

.lk-carrusel__boton[data-carrusel="previo"] { grid-column: 1; grid-row: 1; }
.lk-carrusel__marco .lk-carrusel__pista { grid-column: 2; grid-row: 1; }
.lk-carrusel__boton[data-carrusel="siguiente"] { grid-column: 3; grid-row: 1; }

.lk-carrusel__boton {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid var(--lk-borde);
	border-radius: 50%;
	background: var(--lk-blanco);
	color: var(--lk-verde);
	cursor: pointer;
	transition: background var(--lk-t), border-color var(--lk-t), color var(--lk-t);
}

.lk-carrusel__boton:hover { background: var(--lk-burdeos); border-color: var(--lk-burdeos); color: var(--lk-crema); }
.lk-carrusel__boton .lk-svg { width: 20px; height: 20px; }
.lk-carrusel__boton[data-carrusel="previo"] .lk-svg { transform: scaleX(-1); }

/* Cinco logos a la vista; se arrastra con el dedo o la rueda y encaja solo. */
.lk-carrusel__pista {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 4 * 16px) / 5);
	gap: 16px;
	margin: 0;
	padding: 4px 0;
	list-style: none;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.lk-carrusel__pista::-webkit-scrollbar { display: none; }

.lk-carrusel__item { scroll-snap-align: start; }

.lk-entidad {
	display: grid;
	place-items: center;
	height: 110px;
	padding: 12px;
	background: var(--lk-blanco);
	border-radius: var(--lk-radio);
	color: var(--lk-gris);
	text-decoration: none;
}

.lk-entidad img {
	width: auto;
	max-width: 84%;
	max-height: 72px;
	object-fit: contain;
	filter: grayscale(1);
	mix-blend-mode: multiply;
	opacity: .8;
	transition: filter var(--lk-t), opacity var(--lk-t);
}

.lk-entidad:hover img { filter: none; opacity: 1; }

/* -------------------------------------------------------------------------
   10. Cómo trabajamos, redes y panel de contacto
   ---------------------------------------------------------------------- */

/* El panel se prolonga hasta el borde derecho: se recorta aquí para que no
   aparezca desplazamiento horizontal. */
.lk-metodo {
	overflow-x: clip;
	padding: var(--lk-seccion) 0;
}

.lk-metodo__interior {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: 64px;
	align-items: start;
}

.lk-metodo__texto { padding-top: 72px; }

.lk-metodo__entradilla {
	max-width: 46ch;
	margin: 20px 0 0;
	color: var(--lk-gris);
	font-size: 1.0625rem;
}

.lk-pasos {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 56px 0 0;
	padding: 0;
	list-style: none;
}

.lk-paso { position: relative; }

.lk-paso__circulo {
	display: grid;
	place-items: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--lk-arena);
	color: var(--lk-verde);
}

.lk-paso__circulo .lk-svg { width: 28px; height: 28px; }

.lk-paso--final .lk-paso__circulo { background: var(--lk-burdeos); color: var(--lk-crema); }

/* Arista punteada con flecha entre un paso y el siguiente. */
.lk-paso:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 36px;
	left: 88px;
	right: 4px;
	height: 1px;
	background: repeating-linear-gradient(90deg, #bdb1a2 0 6px, transparent 6px 10px);
}

.lk-paso:not(:last-child)::before {
	content: "";
	position: absolute;
	top: 32px;
	right: 3px;
	width: 8px;
	height: 8px;
	border-top: 1.5px solid #a89a8a;
	border-right: 1.5px solid #a89a8a;
	transform: rotate(45deg);
}

.lk-paso__titulo { margin: 20px 0 0; font-size: 1rem; }

.lk-paso__texto {
	margin: 6px 0 0;
	color: var(--lk-gris);
	font-size: .875rem;
	line-height: 1.55;
}

/* Redes: perfil de Instagram con su vista previa y el resto de redes. */
.lk-social {
	margin-top: 56px;
	padding-top: 40px;
	border-top: 1px solid var(--lk-borde);
}

.lk-social__titulo {
	margin: 0 0 20px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--lk-burdeos);
}

.lk-social__perfil { display: flex; align-items: center; gap: 16px; }

.lk-social__avatar {
	display: grid;
	place-items: center;
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--lk-verde);
	color: var(--lk-crema);
}

.lk-social__avatar svg { width: 24px; height: 24px; }

.lk-social__cuenta {
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
	line-height: 1.35;
}

.lk-social__cuenta strong { font-weight: 600; overflow-wrap: anywhere; }
.lk-social__cuenta span { color: var(--lk-gris); font-size: var(--lk-t-s); }

.lk-social__perfil .lk-boton { margin-left: auto; }

.lk-social__rejilla {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.lk-social__rejilla a {
	display: block;
	aspect-ratio: 1;
	overflow: hidden;
	border-radius: 4px;
	background: var(--lk-arena);
}

.lk-social__rejilla img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 500ms ease;
}

.lk-social__rejilla a:hover img { transform: scale(1.05); }

.lk-social__otras { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.lk-social__otras .lk-boton svg { width: 16px; height: 16px; }

.lk-panel {
	position: relative;
	padding: 64px 48px 72px 56px;
	background: var(--lk-verde);
	color: #fff;
	border-radius: 8px 0 0 8px;
}

/* Prolonga el panel hasta el borde; solapa 2px para que no quede costura. */
.lk-panel::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(100% - 2px);
	width: 50vw;
	background: var(--lk-verde);
}

.lk-panel__titulo {
	margin: 0;
	color: #fff;
	font-size: clamp(1.875rem, 1.2rem + 1.6vw, 2.5rem);
}

.lk-panel__intro {
	max-width: 42ch;
	margin: 12px 0 0;
	color: rgba(255, 255, 255, .72);
	font-size: .9375rem;
}

.lk-panel__intro a {
	color: #fff;
	white-space: nowrap;
	text-decoration-color: rgba(245, 218, 191, .5);
}

.lk-panel__intro a:hover { color: var(--lk-crema); }

/* El formulario lo pinta el plugin: aquí solo se adapta al fondo verde. */
.lk-panel .lk-formulario {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 14px;
	margin-top: 32px;
}

.lk-panel .lk-campo { grid-column: 1 / -1; margin: 0; }

.lk-panel .lk-campo:has(> input[name="lankoa_nombre"]),
.lk-panel .lk-campo:has(> input[name="lankoa_email"]) { grid-column: auto; }

.lk-panel .lk-campo label { color: var(--lk-crema); }

.lk-panel .lk-campo input[type="text"],
.lk-panel .lk-campo input[type="email"],
.lk-panel .lk-campo textarea {
	background: rgba(255, 255, 255, .06);
	border-color: rgba(255, 255, 255, .18);
	color: #fff;
}

.lk-panel .lk-campo input[type="text"]:hover,
.lk-panel .lk-campo input[type="email"]:hover,
.lk-panel .lk-campo textarea:hover { border-color: rgba(255, 255, 255, .34); }

.lk-panel .lk-campo input:focus,
.lk-panel .lk-campo textarea:focus {
	border-color: var(--lk-crema);
	box-shadow: 0 0 0 3px rgba(245, 218, 191, .2);
}

.lk-panel .lk-campo textarea { min-height: 120px; }

.lk-panel .lk-campo label:has(input[type="checkbox"]) {
	color: rgba(255, 255, 255, .75);
	font-size: .875rem;
	line-height: 1.5;
}

.lk-panel .lk-campo input[type="checkbox"] { accent-color: var(--lk-crema); }
.lk-panel .lk-campo a { color: #fff; }
.lk-panel .lk-error { color: #ffb4a8; }

.lk-panel .lk-formulario .lk-boton {
	grid-column: 1 / -1;
	justify-self: start;
	margin-top: 6px;
	background: var(--lk-crema);
	color: var(--lk-verde);
}

.lk-panel .lk-formulario .lk-boton:hover { background: #fff; }

.lk-panel .lk-aviso {
	margin: 24px 0 0;
	background: rgba(255, 255, 255, .08);
	border-left-color: var(--lk-crema);
	color: #fff;
}

/* -------------------------------------------------------------------------
   11. Cabecera de página interior

   La misma foto que la portada, bajo un velo verde más denso: así todas las
   páginas empiezan igual y la cabecera transparente siempre tiene fondo.
   ---------------------------------------------------------------------- */

.lk-cabecera {
	position: relative;
	isolation: isolate;
	padding: calc(var(--lk-encabezado) + clamp(48px, 6vw, 88px)) 0 clamp(56px, 7vw, 96px);
	background: var(--lk-verde);
	color: #fff;
	overflow: hidden;
}

.lk-cabecera__fondo {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: 62% 40%;
}

.lk-cabecera::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(180deg, rgba(var(--lk-verde-noche-rgb), .6) 0, rgba(var(--lk-verde-noche-rgb), 0) 180px),
		linear-gradient(90deg, rgba(var(--lk-verde-rgb), .97) 0%, rgba(var(--lk-verde-rgb), .92) 45%, rgba(var(--lk-verde-rgb), .74) 100%);
}

.lk-cabecera__interior { position: relative; }
.lk-cabecera .lk-rotulo { color: var(--lk-crema); }

.lk-cabecera__titulo {
	max-width: 18em;
	margin: 0;
	color: #fff;
	font-size: clamp(2.5rem, 1.6rem + 3vw, 4.25rem);
}

.lk-cabecera__entradilla {
	max-width: 56ch;
	margin: 20px 0 0;
	color: rgba(255, 255, 255, .8);
	font-size: var(--lk-t-m);
	line-height: 1.55;
}

/* El motivo topográfico de la v1 ya no se usa. */
.lk-curvas,
.lk-agua { display: none; }

/* -------------------------------------------------------------------------
   12. Servicios (página de proyectos)
   ---------------------------------------------------------------------- */

.lk-servicios { border-top: 1px solid var(--lk-borde); }

.lk-servicio {
	position: relative;
	display: grid;
	gap: 8px 40px;
	padding: clamp(28px, 3vw, 40px) 0;
	border-bottom: 1px solid var(--lk-borde);
}

@media (min-width: 860px) {
	.lk-servicio {
		grid-template-columns: 72px minmax(0, 15rem) minmax(0, 1fr) 56px;
		align-items: start;
	}
}

.lk-servicio__num {
	font: 400 1.75rem/1 var(--lk-display);
	color: var(--lk-burdeos);
	font-variant-numeric: tabular-nums;
}

.lk-servicio__titulo {
	margin: 0;
	font: 600 1.375rem/1.25 var(--lk-display);
	letter-spacing: 0;
	color: var(--lk-tinta);
}

.lk-servicio__texto {
	max-width: 62ch;
	margin: 0;
	color: var(--lk-gris);
	line-height: 1.65;
}

.lk-servicio__icono {
	display: none;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--lk-arena);
	color: var(--lk-verde);
	transition: background var(--lk-t), color var(--lk-t);
}

@media (min-width: 860px) {
	.lk-servicio__icono { display: grid; }
}

.lk-servicio:hover .lk-servicio__icono { background: var(--lk-burdeos); color: var(--lk-crema); }
.lk-servicio__icono .lk-icono { width: 26px; height: 26px; }

/* -------------------------------------------------------------------------
   13. Red de personas y ficha
   ---------------------------------------------------------------------- */

/*
 * Los retratos que existen son de 200x226 y no hay mayores. En vez de
 * estirarlos, la rejilla se ajusta a ese tamaño. Cuando lleguen las fotos
 * buenas basta con subir el ancho.
 */
.lk-personas {
	display: grid;
	gap: clamp(24px, 2.6vw, 36px);
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.lk-persona { position: relative; }

.lk-persona__enlace { display: block; color: inherit; text-decoration: none; }
.lk-persona__enlace:hover { color: inherit; }

.lk-persona__foto {
	position: relative;
	aspect-ratio: 200 / 226;
	max-width: 220px;
	margin-bottom: 16px;
	overflow: hidden;
	border-radius: var(--lk-radio);
	background: var(--lk-arena);
}

.lk-persona__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	filter: grayscale(1) contrast(1.04);
	transition: filter 520ms ease, transform 700ms cubic-bezier(.2, .6, .2, 1);
}

.lk-persona__enlace:hover .lk-persona__foto img,
.lk-persona__enlace:focus-visible .lk-persona__foto img {
	filter: grayscale(0) contrast(1);
	transform: scale(1.04);
}

.lk-persona__foto::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--lk-verde);
	mix-blend-mode: color;
	opacity: .5;
	transition: opacity 520ms ease;
	pointer-events: none;
}

.lk-persona__enlace:hover .lk-persona__foto::after,
.lk-persona__enlace:focus-visible .lk-persona__foto::after { opacity: 0; }

.lk-persona__inicial {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font: 400 4.5rem/1 var(--lk-display);
	color: var(--lk-gris-suave);
}

.lk-persona__nombre { margin: 0 0 4px; font-size: 1.0625rem; }

.lk-persona__cargo {
	margin: 0;
	color: var(--lk-gris);
	font-size: var(--lk-t-s);
	line-height: 1.5;
}

.lk-ficha { display: grid; gap: 32px; grid-template-columns: 1fr; }

@media (min-width: 940px) {
	.lk-ficha {
		grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
		gap: clamp(40px, 6vw, 80px);
	}
}

.lk-ficha__foto { align-self: start; position: sticky; top: 112px; }

.lk-ficha__retrato {
	width: 100%;
	max-width: 240px;
	aspect-ratio: 200 / 226;
	overflow: hidden;
	border-radius: var(--lk-radio);
	background: var(--lk-arena);
}

.lk-ficha__retrato img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.lk-ficha__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 240px;
	margin-top: 20px;
}

.lk-ficha__bloque + .lk-ficha__bloque {
	margin-top: 44px;
	padding-top: 44px;
	border-top: 1px solid var(--lk-borde);
}

.lk-ficha__rotulo {
	margin-bottom: 16px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--lk-burdeos);
}

.lk-etiquetas { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.lk-etiqueta {
	padding: 6px 14px;
	border: 1px solid var(--lk-borde);
	border-radius: 999px;
	background: var(--lk-blanco);
	color: var(--lk-verde);
	font-size: .8125rem;
	font-weight: 500;
}

/* -------------------------------------------------------------------------
   14. Proyectos por año
   ---------------------------------------------------------------------- */

.lk-tiempo { position: relative; }

.lk-anio {
	display: grid;
	gap: 16px 48px;
	padding-block: clamp(32px, 4vw, 48px);
	border-top: 1px solid var(--lk-borde);
}

@media (min-width: 860px) {
	.lk-anio { grid-template-columns: 10rem minmax(0, 1fr); }

	/* El año se queda fijo mientras se recorre su lista. */
	.lk-anio > div:first-child { position: sticky; top: 104px; align-self: start; }
}

.lk-anio__rotulo {
	margin: 0;
	font: 400 2.5rem/1 var(--lk-display);
	letter-spacing: -.02em;
	color: var(--lk-burdeos);
	font-variant-numeric: tabular-nums;
}

.lk-anio__cuenta {
	display: block;
	margin-top: 8px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--lk-gris-suave);
}

.lk-proyectos { margin: 0; padding: 0; list-style: none; }

.lk-proyecto {
	position: relative;
	display: grid;
	gap: 8px 32px;
	padding: 20px 18px 20px 20px;
	border-left: 2px solid transparent;
	border-radius: 0 var(--lk-radio) var(--lk-radio) 0;
	transition: background var(--lk-t), border-color var(--lk-t);
}

@media (min-width: 1100px) {
	.lk-proyecto {
		grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
		align-items: baseline;
	}
}

.lk-proyecto + .lk-proyecto { border-top: 1px solid var(--lk-borde); }

.lk-proyecto:hover { background: var(--lk-blanco); border-left-color: var(--lk-burdeos); }

.lk-proyecto__titulo {
	margin: 0;
	font: 600 1.0625rem/1.45 var(--lk-display);
	letter-spacing: 0;
	text-wrap: pretty;
}

.lk-proyecto__titulo a { color: inherit; text-decoration: none; }
.lk-proyecto__titulo a:hover { color: var(--lk-burdeos); text-decoration: underline; }

.lk-proyecto__meta {
	margin: 0;
	color: var(--lk-gris);
	font-size: var(--lk-t-s);
	line-height: 1.5;
	text-wrap: pretty;
}

.lk-proyecto__meta::before {
	content: attr(data-rotulo);
	display: block;
	margin-bottom: 2px;
	color: var(--lk-gris-suave);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
}

/* -------------------------------------------------------------------------
   15. Contenido de texto
   ---------------------------------------------------------------------- */

.lk-contenido { max-width: var(--lk-ancho-texto); font-size: 1.0625rem; line-height: 1.75; }
.lk-contenido--ancho { max-width: none; }
.lk-contenido > * + * { margin-top: 1.2em; }

.lk-contenido h2 { margin-top: 2em; font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.25rem); }
.lk-contenido h3 { margin-top: 1.8em; font-size: 1.25rem; }

.lk-contenido ul,
.lk-contenido ol { padding-left: 1.35em; }

.lk-contenido li + li { margin-top: .4em; }
.lk-contenido img { border-radius: var(--lk-radio); }

.lk-entrada__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 40px;
	font: 600 var(--lk-t-xs)/1.4 var(--lk-fuente);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--lk-burdeos);
}

.lk-entrada__meta a { color: inherit; text-decoration: none; }

/* -------------------------------------------------------------------------
   16. Migas y paginación
   ---------------------------------------------------------------------- */

.lk-migas {
	padding-block: 14px;
	background: var(--lk-blanco);
	border-bottom: 1px solid var(--lk-borde);
	font-size: .8125rem;
}

.lk-migas ol {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--lk-gris-suave);
}

.lk-migas li + li::before { content: "/"; margin-right: 8px; color: var(--lk-borde); }
.lk-migas a { color: var(--lk-gris); text-decoration: none; }
.lk-migas a:hover { color: var(--lk-burdeos); }

.lk-paginacion { margin-top: 56px; }

.lk-paginacion ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lk-paginacion a,
.lk-paginacion span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	height: 46px;
	padding: 0 12px;
	border: 1px solid var(--lk-borde);
	border-radius: 4px;
	background: var(--lk-blanco);
	color: var(--lk-tinta);
	font-size: var(--lk-t-s);
	text-decoration: none;
	transition: border-color var(--lk-t), color var(--lk-t);
}

.lk-paginacion a:hover { border-color: var(--lk-burdeos); color: var(--lk-burdeos); }

.lk-paginacion .current {
	background: var(--lk-verde);
	border-color: var(--lk-verde);
	color: #fff;
	font-weight: 600;
}

/* -------------------------------------------------------------------------
   17. Formularios
   ---------------------------------------------------------------------- */

.lk-campo { margin-bottom: 22px; }

.lk-campo label {
	display: block;
	margin-bottom: 8px;
	font: 500 .8125rem/1.4 var(--lk-fuente);
	color: var(--lk-tinta);
}

.lk-campo input[type="text"],
.lk-campo input[type="email"],
.lk-campo input[type="tel"],
.lk-campo input[type="url"],
.lk-campo input[type="search"],
.lk-campo textarea,
.lk-campo select {
	width: 100%;
	padding: 13px 14px;
	border: 1px solid var(--lk-borde);
	border-radius: 4px;
	background: var(--lk-blanco);
	color: var(--lk-tinta);
	font-family: inherit;
	font-size: .9375rem;
	transition: border-color var(--lk-t), box-shadow var(--lk-t);
}

.lk-campo textarea { min-height: 160px; resize: vertical; }

.lk-campo input:focus,
.lk-campo textarea:focus,
.lk-campo select:focus {
	outline: none;
	border-color: var(--lk-burdeos);
	box-shadow: 0 0 0 3px rgba(108, 21, 30, .14);
}

.lk-campo input[type="checkbox"] { accent-color: var(--lk-burdeos); }

.lk-error {
	display: block;
	margin-top: 6px;
	color: #a3202c;
	font-size: .8125rem;
}

.lk-aviso {
	margin-bottom: 24px;
	padding: 16px 20px;
	border-left: 3px solid var(--lk-burdeos);
	border-radius: 0 var(--lk-radio) var(--lk-radio) 0;
	background: var(--lk-arena);
	font-size: .9375rem;
}

.lk-aviso--ok { border-left-color: #2f7d4f; background: #eaf4ee; }
.lk-aviso--error { border-left-color: #a3202c; background: #f8eaeb; }

/* -------------------------------------------------------------------------
   18. Pie
   ---------------------------------------------------------------------- */

.lk-pie {
	padding: 56px 0 28px;
	background: var(--lk-verde-noche);
	color: rgba(255, 255, 255, .72);
	font-size: .9375rem;
}

.lk-pie a { color: rgba(255, 255, 255, .72); text-decoration: none; transition: color var(--lk-t); }
.lk-pie a:hover { color: #fff; }

.lk-pie__rejilla {
	display: grid;
	grid-template-columns: 1.6fr 1.1fr 1fr;
	gap: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.lk-pie__logo { width: 180px; height: auto; }
.lk-pie__lema { max-width: none; margin: 20px 0 0; }

.lk-pie__titulo {
	margin: 0 0 18px;
	font: 600 var(--lk-t-xs)/1.2 var(--lk-fuente);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--lk-crema);
}

.lk-pie ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lk-pie__rejilla nav .menu {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 24px;
}

.lk-pie__redes { display: flex; gap: 10px; margin-top: 20px; }

.lk-pie__redes a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 50%;
	transition: background var(--lk-t), border-color var(--lk-t);
}

.lk-pie__redes a:hover { background: var(--lk-burdeos); border-color: var(--lk-burdeos); }
.lk-pie__redes svg { width: 17px; height: 17px; }

/* Franja final: copyright, enlaces legales y firma, en versalitas. */
.lk-pie__base {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px 32px;
	padding-top: 28px;
	font: 500 .6875rem/1.4 var(--lk-fuente);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
}

.lk-pie__base p { margin: 0; }

.lk-pie__legal .menu {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 28px;
}

.lk-pie__legal a { color: rgba(255, 255, 255, .6); }
.lk-pie__firma { justify-self: end; }
.lk-pie__firma a { color: #fff; }

/* -------------------------------------------------------------------------
   19. Anchos menores
   ---------------------------------------------------------------------- */

@media (max-width: 1080px) {
	/* Los saltos escritos en la frase de la franja y en el lema del pie solo
	   valen cuando la primera línea cabe entera; por debajo de este ancho
	   dejaban una línea suelta, así que el texto pasa a fluir solo. */
	.lk-franja__texto br,
	.lk-pie__lema br { display: none; }

	.lk-hamburguesa { display: block; }

	/* Menú a pantalla completa, detrás del logo y del botón. */
	.lk-navegacion {
		position: fixed;
		inset: 0;
		z-index: -1;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 28px;
		margin: 0;
		padding: calc(var(--lk-encabezado) + 16px) var(--lk-margen) 48px;
		background: var(--lk-verde-noche);
		overflow-y: auto;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-12px);
		transition: opacity var(--lk-t), transform var(--lk-t), visibility var(--lk-t);
	}

	.lk-navegacion.esta-abierta { opacity: 1; visibility: visible; transform: none; }

	.lk-navegacion .menu { flex-direction: column; align-items: stretch; gap: 0; }
	.lk-navegacion .menu li { border-bottom: 1px solid rgba(255, 255, 255, .12); }

	.lk-navegacion .menu a {
		display: block;
		padding: 16px 0;
		font: 400 1.75rem/1.2 var(--lk-display);
		color: #fff;
	}

	.lk-navegacion .menu a::after { display: none; }

	.lk-idiomas--cabecera a {
		padding: 8px 14px;
		border: 1px solid rgba(255, 255, 255, .2);
		border-radius: 999px;
	}

	.lk-encabezado__cta { align-self: flex-start; }

	body.lk-sin-scroll { overflow: hidden; }

	:root { --lk-solape: calc((var(--lk-baldosas-ancho) - 48px) * .15 * .78); }

	.lk-baldosas__rejilla { gap: 16px; }

	.lk-carrusel__pista { grid-auto-columns: calc((100% - 3 * 16px) / 4); }

	.lk-metodo__interior { gap: 48px; }
	.lk-panel { padding-left: 40px; }

	.lk-pie__rejilla { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 860px) {
	/* A dos columnas los nombres largos ocupan dos líneas: sin proporción
	   fija, la fila manda y las tarjetas miden lo mismo. */
	.lk-baldosa { aspect-ratio: auto; min-height: 7.5rem; }

	/* A dos columnas, las cuatro primeras son dos filas: pisan el héroe las dos. */
	:root {
		--lk-baldosas-ancho: min(100% - 2 * var(--lk-margen), var(--lk-ancho));
		--lk-baldosas-aire: 40px;
		--lk-solape: calc((var(--lk-rejilla-ancho) - 14px) * .534 + 14px);
	}
	.lk-baldosas__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }

	.lk-rejilla--3 { grid-template-columns: minmax(0, 1fr); }

	.lk-seccion__cab { flex-direction: column; align-items: flex-start; }

	.lk-carrusel__pista { grid-auto-columns: calc((100% - 2 * 16px) / 3); }

	.lk-metodo__interior { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.lk-metodo__texto { padding-top: 0; }

	.lk-pasos { grid-template-columns: minmax(0, 1fr); gap: 26px; margin-top: 36px; }

	.lk-paso {
		display: grid;
		grid-template-columns: 64px minmax(0, 1fr);
		column-gap: 18px;
		align-items: start;
	}

	.lk-paso__circulo { grid-row: 1 / span 2; width: 64px; height: 64px; }
	.lk-paso__titulo { margin-top: 8px; }

	.lk-paso__titulo,
	.lk-paso__texto { grid-column: 2; }

	.lk-paso:not(:last-child)::after {
		top: 72px;
		bottom: -20px;
		left: 32px;
		right: auto;
		width: 1px;
		height: auto;
		background: repeating-linear-gradient(180deg, #bdb1a2 0 6px, transparent 6px 10px);
	}

	.lk-paso:not(:last-child)::before { display: none; }

	.lk-panel { padding: 40px 28px 44px; border-radius: 8px; }
	.lk-panel::after { display: none; }

	.lk-pie__base {
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		text-align: center;
	}

	.lk-pie__firma { justify-self: center; }
}

@media (max-width: 560px) {
	:root { --lk-encabezado: 84px; }

	.lk-marca { width: 132px; }

	.lk-heroe { min-height: 0; }
	.lk-heroe__fondo { object-position: 70% 50%; }

	.lk-heroe::before {
		background: linear-gradient(180deg, rgba(var(--lk-verde-noche-rgb), .6) 0%, rgba(var(--lk-verde-rgb), .45) 26%, rgba(var(--lk-verde-rgb), .9) 56%, rgba(var(--lk-verde-rgb), .97) 100%);
	}

	:root { --lk-heroe-arriba: 230px; --lk-solape: calc((var(--lk-rejilla-ancho) - 10px) * .534 + 10px); }
	.lk-heroe__texto { font-size: 1rem; }

	.lk-baldosas__rejilla { gap: 10px; }

	.lk-carrusel__pista { grid-auto-columns: calc((100% - 16px) / 2); }
	.lk-carrusel__marco { grid-template-columns: 40px minmax(0, 1fr) 40px; }
	.lk-carrusel__boton { width: 40px; height: 40px; }
	.lk-entidad { height: 90px; }

	.lk-social__perfil { gap: 12px; }

	/* La Red, a dos columnas: a una sola, cada persona ocupaba una fila con
	   medio ancho vacío. La foto llena la columna sin pasar de su tamaño real. */
	.lk-personas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 14px; }
	.lk-persona__foto { max-width: none; }
	.lk-persona__nombre { font-size: 1rem; }
	.lk-persona__cargo { font-size: .8125rem; }
	.lk-social__avatar { width: 48px; height: 48px; }
	.lk-social__cuenta { flex: 1; }

	.lk-panel .lk-formulario { grid-template-columns: minmax(0, 1fr); }

	.lk-pie__rejilla { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

/* -------------------------------------------------------------------------
   20. Utilidades
   ---------------------------------------------------------------------- */

.lk-oculto-visual {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.lk-centrado { text-align: center; }

.js .lk-revelar {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 700ms ease, transform 700ms cubic-bezier(.2, .6, .2, 1);
}

.js .lk-revelar.es-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.js .lk-revelar { opacity: 1; transform: none; }
}

@media print {
	.lk-encabezado, .lk-pie, .lk-idiomas, .lk-hamburguesa, .lk-migas, .lk-heroe__fondo, .lk-cabecera__fondo, .lk-carrusel__controles { display: none !important; }
	.lk-cabecera, .lk-heroe { padding-top: 24px; background: #fff; color: #000; }
	.lk-cabecera__titulo, .lk-heroe__titulo { color: #000; }
	body { color: #000; background: #fff; font-size: 11pt; }
	a { text-decoration: underline; }
}