/*
Theme Name: Kadence Hacemos Memoria
Theme URI: https://hacemosmemoria.org
Description: Child theme de Kadence para el rediseño de hacemosmemoria.org — "El archivo vivo". Basado en Kadence.
Author: Hacemos Memoria
Template: kadence
Version: 0.1.0
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: kadence-child
*/

/* ==========================================================================
   Design tokens — concepto "El archivo vivo"
   La fecha de cada contenido es protagonista (sello de archivo): la
   organización documenta y verifica cronologías contra el olvido. La
   paleta evita los defaults genéricos (crema+serif+terracota /
   negro+neón): negro tinta cálido, papel hueso, oro-llama como acento
   único, teal apagado para metadatos/estructura.
   ========================================================================== */
:root {
	/* Color */
	--hm-ink: #15130f;         /* fondo, noche/ausencia */
	--hm-paper: #ede6d8;       /* texto principal, hueso/papel */
	--hm-flame: #c99a3e;       /* acento único: la memoria como llama, uso escaso */
	--hm-flame-soft: #e0b869;  /* variante clara del acento, hover/focus */
	--hm-stamp: #4a6670;       /* teal apagado: categorías, metadatos, enlaces */
	--hm-stamp-soft: #7fa0a9;  /* variante clara del teal, hover/focus sobre fondo oscuro */
	--hm-charcoal: #3a362e;    /* bordes, separadores, superficies elevadas */
	--hm-surface: #211d18;     /* tarjetas/superficies sobre el fondo ink */

	/* Tipografia */
	--hm-font-display: 'Roboto', ui-sans-serif, system-ui, sans-serif;
	--hm-font-body: 'Roboto', ui-sans-serif, system-ui, sans-serif;
	--hm-font-mono: 'Roboto Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
	--hm-font-body-width: 100%;
	--hm-font-ui-width: 94%;

	/* Escala tipografica (base 1rem = 16px, ratio ~1.25) */
	--hm-text-xs: 0.75rem;
	--hm-text-sm: 0.875rem;
	--hm-text-base: 1rem;
	--hm-text-lg: 1.25rem;
	--hm-text-xl: 1.563rem;
	--hm-text-2xl: 1.953rem;
	--hm-text-3xl: 2.441rem;
	--hm-text-4xl: 3.052rem;

	/* Espaciado */
	--hm-space-1: 0.25rem;
	--hm-space-2: 0.5rem;
	--hm-space-3: 1rem;
	--hm-space-4: 1.5rem;
	--hm-space-5: 2.5rem;
	--hm-space-6: 4rem;

	--hm-radius-sm: 3px;
	--hm-radius: 4px;
	--hm-radius-lg: 4px;
	--hm-shell: min(1380px, calc(100vw - 48px));
	--hm-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ==========================================================================
   Base
   ========================================================================== */
/* !important deliberado: Kadence fija el fondo del sitio via selectores mas
   especificos que "body" segun el layout elegido (ej. .content-style-boxed);
   el fondo oscuro es la decision de diseño mas fundacional de esta propuesta,
   no algo que deba perder ante el estilo de layout del theme padre. */
body,
.site.wp-site-blocks {
	background-color: var(--hm-ink) !important;
	color: var(--hm-paper);
	font-family: var(--hm-font-body);
	font-weight: 400;
	font-stretch: var(--hm-font-body-width);
}

h1, h2, h3, h4, h5, h6,
.entry-title, .site-title {
	font-family: var(--hm-font-display);
	font-weight: 600;
	font-variation-settings: 'opsz' 40;
	color: var(--hm-paper) !important;
	letter-spacing: -0.01em;
}

/* !important: WordPress inyecta un <style id="global-styles-inline-css"> con
   reglas de igual especificidad (elemento "h1") mas tarde en el <head>, que
   por orden de cascada le gana a una hoja externa como esta. */
h1, .entry-title {
	/* Escala editorial mesurada: un titular de 80px competia por atencion con
	   el sello de fecha (el elemento senal real de "El archivo vivo") y
	   rompia line-length (65-75 caracteres/linea es lo legible). La audacia
	   del diseño va en el sello, no en gritar el titular. */
	font-size: clamp(var(--hm-text-2xl), 3vw, var(--hm-text-4xl)) !important;
	line-height: 1.2 !important;
	font-weight: 600 !important;
}

.wp-block-post-title a,
.wp-block-post-title {
	letter-spacing: -0.01em;
}

/* Titulos enlazados (post-title con isLink) no deben tomar el color de
   link generico: pierden el contraste/protagonismo del titular. */
h1 a, h2 a, h3 a, h4 a,
.wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover,
.wp-block-post-title a:hover {
	color: var(--hm-flame);
}

/* !important: mismo caso que h1/h2 arriba — el <style id="global-styles-
   inline-css"> de WordPress trae su propia regla "a { color }" con igual
   especificidad pero se inyecta despues, y gana por orden de cascada. */
a {
	color: var(--hm-stamp-soft) !important;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}
a:hover,
a:focus-visible {
	color: var(--hm-flame-soft) !important;
}

/* Foco visible siempre — accesibilidad (hallazgo de diagnostico: 78-82/100) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var(--hm-flame);
	outline-offset: 2px;
}

/* ==========================================================================
   Header — Kadence pinta el fondo del header/nav por fuera de "body"
   (selectores propios, mas especificos), asi que se sobreescribe aca en vez
   de pelear con especificidad en la regla de "body".
   ========================================================================== */
.site-header,
.site-header-row-container {
	background-color: var(--hm-ink) !important;
	border-color: var(--hm-charcoal) !important;
}
.site-header .site-title a,
.site-header .site-title,
.main-navigation a,
.main-navigation .menu-link {
	color: var(--hm-paper) !important;
	font-family: var(--hm-font-body);
	font-stretch: var(--hm-font-ui-width);
}
.main-navigation a:hover,
.main-navigation a:focus {
	color: var(--hm-flame) !important;
}
.main-navigation .sub-menu {
	background-color: var(--hm-surface) !important;
	border: 1px solid var(--hm-charcoal) !important;
}
.main-navigation .sub-menu a {
	color: var(--hm-paper) !important;
	border-color: var(--hm-charcoal) !important;
}
.main-navigation .sub-menu a:hover,
.main-navigation .sub-menu a:focus {
	color: var(--hm-flame) !important;
	background-color: var(--hm-charcoal) !important;
}

/* ==========================================================================
   Footer — sin esto, hereda el mismo fondo "ink" que el contenido y no se
   distingue de la última sección de la página. Un salto sutil de superficie
   (el mismo recurso que ya usan las tarjetas) más un borde superior alcanzan
   para separarlo sin introducir un color nuevo.
   ========================================================================== */
.site-footer {
	background-color: var(--hm-surface) !important;
	border-top: 1px solid rgba(237, 230, 216, 0.14);
}
.site-footer .site-footer-wrap {
	padding-top: clamp(2.5rem, 5vw, 4rem);
}

/* Banner de titulo de pagina (entry-hero) — se usa en todas las paginas de
   contenido normales (no en la home, ahi va oculto via el control nativo
   del tema "_kad_post_title" = hide, sin tocar codigo, porque ya tiene su
   propio hero de bloques). El contenedor interno ".entry-hero-container-
   inner" trae su propio fondo claro por defecto de Kadence y tapa el fondo
   oscuro del padre — hay que pintarlo tambien, no solo ".entry-hero". */
.entry-hero,
.entry-hero-container-inner {
	background-color: var(--hm-ink) !important;
}
.entry-hero .entry-title {
	color: var(--hm-paper) !important;
}

/* ==========================================================================
   Imagenes — prevenir Cumulative Layout Shift (hallazgo de diagnostico:
   CLS de laboratorio 0.33-0.51 vs. umbral 0.25). WP core ya agrega
   width/height en imagenes servidas via wp_get_attachment_image(); esto es
   una red de seguridad para cualquier imagen que no las traiga.
   ========================================================================== */
img {
	max-width: 100%;
	height: auto;
}

/* ==========================================================================
   Sello de fecha — elemento senal del concepto "archivo vivo".
   Se usa en el listado de posts y en la cabecera de cada articulo: la
   fecha como dato verificado, no decoracion.
   ========================================================================== */
.hm-datestamp {
	display: inline-flex;
	align-items: center;
	gap: var(--hm-space-2);
	font-family: var(--hm-font-mono);
	font-size: var(--hm-text-sm);
	font-weight: 500;
	color: var(--hm-flame);
	border: 1px solid var(--hm-flame);
	border-radius: var(--hm-radius);
	padding: var(--hm-space-1) var(--hm-space-2);
	letter-spacing: 0.02em;
}

.hm-category-label {
	font-family: var(--hm-font-mono);
	font-size: var(--hm-text-xs);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--hm-stamp-soft);
}

.hm-card {
	background-color: var(--hm-surface);
	border: 1px solid var(--hm-charcoal);
	border-radius: var(--hm-radius);
}

/* ==========================================================================
   Portada editorial 2026 — archivo vivo en movimiento
   ========================================================================== */
.home .content-area {
	margin: 0;
}

.home .site-main,
.home .content-container {
	max-width: none;
	padding: 0;
}

.hm-home {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 78% 8%, rgba(74, 102, 112, 0.13), transparent 28rem),
		var(--hm-ink);
}

.hm-shell {
	position: relative;
	width: var(--hm-shell);
	margin-inline: auto;
}

.hm-grid-lines {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.34;
	background-image: linear-gradient(to right, transparent calc(100% - 1px), rgba(237, 230, 216, 0.055) 1px);
	background-size: calc((100vw - max(48px, (100vw - 1380px))) / 6) 100%;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	transition: background-color 350ms var(--hm-ease), border-color 350ms var(--hm-ease), backdrop-filter 350ms var(--hm-ease);
}

.site-header.hm-header-scrolled {
	background: rgba(21, 19, 15, 0.8) !important;
	border-bottom: 1px solid rgba(237, 230, 216, 0.1) !important;
	backdrop-filter: blur(18px) saturate(120%);
}

.site-header .site-title {
	font-family: var(--hm-font-display);
	font-weight: 650;
	letter-spacing: -0.035em;
}

.main-navigation .menu-link {
	position: relative;
}

.main-navigation .menu-link::after {
	content: '';
	position: absolute;
	right: 0.9em;
	bottom: 0.7em;
	left: 0.9em;
	height: 1px;
	background: var(--hm-flame);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 320ms var(--hm-ease);
}

.main-navigation .menu-link:hover::after,
.main-navigation .current-menu-item > .menu-link::after {
	transform: scaleX(1);
	transform-origin: left;
}

.hm-hero {
	position: relative;
	z-index: 1;
	padding: clamp(3rem, 6vw, 6rem) 0 clamp(4rem, 7vw, 6.5rem);
}

.hm-masthead {
	max-width: 1050px;
	margin: 0 auto clamp(3.5rem, 6vw, 6.5rem);
	text-align: center;
}

.hm-masthead-title {
	max-width: 13ch;
	margin: 1.2rem auto clamp(1.5rem, 3vw, 2.5rem);
	color: var(--hm-paper);
	font: 650 clamp(3rem, 5.6vw, 7rem)/0.98 var(--hm-font-display);
	letter-spacing: -0.012em;
	text-wrap: balance;
}

.hm-type-word {
	display: inline-block;
	white-space: nowrap;
}

.hm-char {
	display: inline-block;
	will-change: transform, opacity, filter;
}

.hm-type-ready .hm-char {
	opacity: 0;
	filter: blur(7px);
	transform: translateY(0.32em) rotate(1.5deg);
}

.hm-type-ready .hm-char.is-typed {
	opacity: 1;
	filter: blur(0);
	transform: translateY(0) rotate(0);
	transition:
		opacity 460ms var(--hm-ease),
		transform 620ms var(--hm-ease),
		filter 520ms ease;
}

.hm-type-caret {
	display: inline-block;
	width: 0.045em;
	height: 0.78em;
	margin-left: 0.08em;
	background: var(--hm-flame);
	vertical-align: -0.04em;
	animation: hm-caret 780ms steps(1, end) infinite;
}

.hm-type-caret.is-done {
	opacity: 0;
	transition: opacity 500ms ease 700ms;
}

@keyframes hm-caret {
	50% { opacity: 0; }
}

.hm-search {
	display: flex;
	width: min(100%, 660px);
	min-height: 58px;
	align-items: center;
	gap: 0.85rem;
	margin-inline: auto;
	padding: 0.35rem 0.45rem 0.35rem 1.1rem;
	border: 1px solid rgba(237, 230, 216, 0.16);
	border-radius: 999px;
	background: rgba(237, 230, 216, 0.055);
	backdrop-filter: blur(12px);
	transition: border-color 250ms ease, background-color 250ms ease, box-shadow 350ms var(--hm-ease);
}

.hm-search:focus-within {
	border-color: var(--hm-stamp-soft);
	background: rgba(237, 230, 216, 0.085);
	box-shadow: 0 0 0 4px rgba(127, 160, 169, 0.1);
}

.hm-search > span {
	color: var(--hm-stamp-soft);
	font-size: 1.35rem;
}

.hm-search input,
.hm-search input[type="search"] {
	min-width: 0;
	flex: 1;
	border: 0;
	background: transparent !important;
	box-shadow: none;
	color: var(--hm-paper) !important;
	font-family: var(--hm-font-body);
}

.hm-search input::placeholder { color: rgba(237, 230, 216, 0.56); }
.hm-search input:focus { outline: 0; box-shadow: none; }

.hm-search button {
	min-height: 46px;
	padding: 0.65rem 1.25rem;
	border: 0;
	border-radius: 999px;
	background: var(--hm-paper);
	color: var(--hm-ink);
	font-size: var(--hm-text-sm);
	font-weight: 700;
	transition: transform 250ms var(--hm-ease), background-color 200ms ease;
}

.hm-search button:hover {
	transform: translateY(-2px);
	background: var(--hm-flame-soft);
}

.hm-hero-kicker,
.hm-hero-meta,
.hm-section-heading,
.hm-manifesto-grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 20px;
}

.hm-hero-kicker {
	margin-bottom: clamp(2rem, 5vw, 4.5rem);
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(237, 230, 216, 0.2);
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.hm-hero-kicker span:nth-child(1) { grid-column: 1 / 5; }
.hm-hero-kicker span:nth-child(2) { grid-column: 7 / 11; }
.hm-hero-kicker span:nth-child(3) { grid-column: 12; text-align: right; }

.hm-hero-grid {
	display: grid;
	grid-template-columns: minmax(360px, 0.92fr) minmax(420px, 1.08fr);
	gap: clamp(2.5rem, 5vw, 5.5rem);
	align-items: center;
}

.hm-hero-media {
	position: relative;
	display: block;
	min-height: clamp(320px, 32vw, 480px);
	overflow: hidden;
	border-radius: var(--hm-radius-lg);
	background: var(--hm-surface);
	box-shadow: 0 36px 90px rgba(0, 0, 0, 0.28);
}

.hm-hero-media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 62%, rgba(21, 19, 15, 0.55));
	pointer-events: none;
}

.hm-hero-media img {
	width: 100%;
	height: 100%;
	position: absolute;
	inset: 0;
	object-fit: cover;
	transition: transform 1.1s var(--hm-ease), filter 700ms ease;
}

.hm-hero-media:hover img {
	transform: scale(1.035);
	filter: saturate(1.08) contrast(1.03);
}

.hm-media-index {
	position: absolute;
	right: 1.25rem;
	bottom: 1.15rem;
	z-index: 2;
	color: var(--hm-paper);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	letter-spacing: 0.08em;
}

.hm-hero-copy {
	padding-block: 2rem;
}

.hm-hero-meta {
	align-items: center;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.hm-hero-meta .hm-category-label { grid-column: 1 / 7; }
.hm-hero-meta .hm-datestamp { grid-column: 8 / 13; justify-self: end; }

.hm-hero h1 {
	max-width: 20ch;
	margin: 0 0 1.75rem;
	font-size: clamp(2.5rem, 3.6vw, 4.75rem) !important;
	line-height: 1.08 !important;
	letter-spacing: -0.012em;
	text-wrap: pretty;
}

.hm-hero-excerpt {
	max-width: 58ch;
	color: rgba(237, 230, 216, 0.74);
	font-size: clamp(1rem, 1.25vw, 1.2rem);
	line-height: 1.75;
}

.hm-text-link {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 3rem;
	min-width: 13rem;
	margin-top: 2.25rem;
	padding-bottom: 0.65rem;
	border-bottom: 1px solid currentColor;
	font: 600 var(--hm-text-sm)/1 var(--hm-font-body);
	text-decoration: none;
	transition: gap 300ms var(--hm-ease), color 200ms ease;
}

.hm-text-link:hover { gap: 4rem; }

.hm-news,
.hm-sections,
.hm-manifesto {
	position: relative;
	z-index: 1;
	padding: clamp(5rem, 9vw, 9rem) 0;
}

.hm-news {
	border-block: 1px solid rgba(237, 230, 216, 0.12);
	background: rgba(33, 29, 24, 0.56);
}

.hm-section-heading {
	align-items: end;
	margin-bottom: clamp(2.5rem, 5vw, 5rem);
}

.hm-section-heading > div { grid-column: 1 / 8; }
.hm-section-heading > p {
	grid-column: 9 / 13;
	margin: 0;
	color: rgba(237, 230, 216, 0.62);
	line-height: 1.65;
}

.hm-eyebrow {
	display: block;
	margin-bottom: 0.8rem;
	color: var(--hm-flame);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.hm-section-heading h2 {
	margin: 0;
	font-size: clamp(2.6rem, 5vw, 5.8rem) !important;
	line-height: 0.95 !important;
	letter-spacing: -0.045em;
}

.hm-news-marquee {
	width: 100%;
	overflow: hidden;
	cursor: none;
}

.hm-news-marquee.is-draggable-ready {
	overflow-x: auto;
	cursor: grab;
	scrollbar-width: none;
	touch-action: pan-y pinch-zoom;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
}

.hm-news-marquee.is-draggable-ready::-webkit-scrollbar {
	display: none;
}

.hm-news-marquee.is-draggable-ready.is-dragging {
	cursor: grabbing;
	user-select: none;
}

.hm-news-marquee.is-draggable-ready .hm-news-track {
	animation: none;
	transform: none;
}

.hm-news-marquee.is-reverse.is-draggable-ready .hm-news-track {
	animation: none;
	transform: none;
}

.hm-news-marquee.is-draggable-ready.is-dragging .hm-news-card {
	pointer-events: none;
}

.hm-news-bands {
	display: grid;
	gap: clamp(3rem, 6vw, 6rem);
}

.hm-news-marquee.is-reverse .hm-news-track {
	animation-name: hm-marquee-reverse;
	animation-duration: 66s;
	transform: translateX(-50%);
}

.hm-news-track {
	display: flex;
	width: max-content;
	padding-left: max(24px, calc((100vw - 1380px) / 2));
	animation: hm-marquee 52s linear infinite;
	will-change: transform;
}

.hm-news-marquee:hover .hm-news-track,
.hm-news-marquee:focus-within .hm-news-track {
	animation-play-state: paused;
}

.hm-news-set {
	display: flex;
	gap: 1.25rem;
	padding-right: 1.25rem;
}

.hm-news-card {
	width: clamp(310px, 29vw, 440px);
	flex: 0 0 auto;
	overflow: hidden;
	border: 1px solid rgba(237, 230, 216, 0.13);
	border-radius: var(--hm-radius);
	background: var(--hm-ink);
	transition: transform 500ms var(--hm-ease), border-color 300ms ease, box-shadow 500ms var(--hm-ease);
}

.hm-news-card:hover {
	transform: translateY(-10px);
	border-color: rgba(201, 154, 62, 0.65);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
}

.hm-news-card-link {
	display: block;
	color: var(--hm-paper) !important;
	text-decoration: none;
}

.hm-news-image {
	position: relative;
	height: clamp(250px, 25vw, 355px);
	overflow: hidden;
	background: var(--hm-charcoal);
}

.hm-news-image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(21, 19, 15, 0.75), transparent 50%);
}

.hm-news-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.82);
	transition: transform 800ms var(--hm-ease), filter 500ms ease;
}

.hm-news-card:hover img {
	transform: scale(1.055);
	filter: saturate(1.04);
}

.hm-news-category {
	position: absolute;
	right: 1rem;
	bottom: 1rem;
	left: 1rem;
	z-index: 1;
	overflow: hidden;
	color: var(--hm-paper);
	font: 500 0.68rem/1.2 var(--hm-font-mono);
	letter-spacing: 0.08em;
	text-overflow: ellipsis;
	text-transform: uppercase;
	white-space: nowrap;
}

.hm-news-copy {
	position: relative;
	display: grid;
	min-height: 330px;
	grid-template-rows: auto auto 1fr auto;
	row-gap: 1rem;
	padding: 1.4rem 1.5rem 1.6rem;
}

.hm-news-copy time {
	color: var(--hm-flame);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
}

.hm-news-copy h3 {
	margin: 1.25rem 0 0;
	font-size: clamp(1.45rem, 2vw, 2rem);
	line-height: 1.08;
	text-wrap: balance;
}

.hm-news-copy p {
	display: -webkit-box;
	align-self: start;
	margin: 1rem 0 0;
	color: rgba(237, 230, 216, 0.65);
	font-size: var(--hm-text-sm);
	line-height: 1.55;
	opacity: 0;
	overflow: hidden;
	transform: translateY(12px);
	transition: opacity 350ms ease, transform 500ms var(--hm-ease);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

.hm-news-card:hover .hm-news-copy p,
.hm-news-card:focus-within .hm-news-copy p {
	opacity: 1;
	transform: translateY(0);
}

.hm-news-action {
	display: flex;
	justify-content: space-between;
	align-self: end;
	margin-top: 0;
	padding-top: 0.8rem;
	border-top: 1px solid rgba(237, 230, 216, 0.16);
	color: var(--hm-stamp-soft);
	font-size: var(--hm-text-sm);
}

@keyframes hm-marquee {
	to { transform: translateX(-50%); }
}

@keyframes hm-marquee-reverse {
	to { transform: translateX(0); }
}

.hm-archive-status {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 2rem;
	margin-top: clamp(3rem, 7vw, 6rem);
	padding-top: 1.5rem;
	border-top: 1px solid rgba(237, 230, 216, 0.16);
}

.hm-page-indicator {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.hm-page-indicator strong {
	color: var(--hm-paper);
	font-size: var(--hm-text-lg);
}

.hm-page-line {
	width: clamp(70px, 12vw, 180px);
	height: 1px;
	background: linear-gradient(to right, var(--hm-flame), var(--hm-charcoal));
}

.hm-archive-status {
	align-items: stretch;
	margin-top: clamp(4rem, 8vw, 7rem);
	padding: 0;
	border: 1px solid rgba(237, 230, 216, 0.18);
	border-radius: 4px;
	background: linear-gradient(125deg, rgba(237, 230, 216, 0.045), rgba(237, 230, 216, 0.012));
}

.hm-archive-callout {
	display: flex;
	width: 55%;
	flex-direction: column;
	justify-content: center;
	padding: clamp(2rem, 4vw, 4rem);
}

.hm-archive-callout h3 {
	max-width: 720px;
	margin: 0.9rem 0 1rem;
	color: var(--hm-paper);
	font: 600 clamp(2.5rem, 5vw, 5.4rem)/0.9 var(--hm-font-display);
	letter-spacing: -0.055em;
	text-wrap: balance;
}

.hm-archive-callout p {
	max-width: 590px;
	margin: 0;
	color: rgba(237, 230, 216, 0.62);
	font-size: var(--hm-text-md);
	line-height: 1.6;
}

.hm-archive-jump-panel {
	display: flex;
	width: 45%;
	flex-direction: column;
	justify-content: space-between;
	gap: 2.5rem;
	padding: clamp(2rem, 4vw, 4rem);
	border-left: 1px solid rgba(237, 230, 216, 0.18);
	background: rgba(18, 17, 14, 0.3);
}

.hm-archive-total {
	display: flex;
	align-items: end;
	gap: 1rem;
}

.hm-archive-total strong {
	color: var(--hm-flame);
	font: 600 clamp(4.5rem, 8vw, 8rem)/0.72 var(--hm-font-display);
	letter-spacing: -0.07em;
}

.hm-archive-total span {
	max-width: 8rem;
	padding-bottom: 0.25rem;
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1.3 var(--hm-font-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.hm-archive-jump-panel .hm-page-jump {
	width: 100%;
	max-width: 420px;
}

.hm-stats {
	position: relative;
	z-index: 1;
	padding: clamp(5rem, 9vw, 9rem) 0;
	border-bottom: 1px solid rgba(237, 230, 216, 0.12);
}

.hm-stats-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-block: 1px solid rgba(237, 230, 216, 0.16);
}

.hm-stat {
	display: flex;
	min-height: 260px;
	flex-direction: column;
	justify-content: space-between;
	padding: 2rem;
	border-right: 1px solid rgba(237, 230, 216, 0.16);
}

.hm-stat:last-child { border-right: 0; }

.hm-stat strong {
	color: var(--hm-paper);
	font: 600 clamp(4rem, 8vw, 8rem)/0.85 var(--hm-font-display);
	letter-spacing: -0.06em;
}

.hm-stat span {
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1.2 var(--hm-font-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Motion granular: cada pieza entra y sale según la dirección del scroll. */
.hm-motion-item {
	--hm-motion-delay: 0ms;
	opacity: 0;
	filter: blur(12px);
	transform: translate3d(0, 78px, 0) scale(0.975);
	transition:
		opacity 700ms var(--hm-ease) var(--hm-motion-delay),
		transform 900ms var(--hm-ease) var(--hm-motion-delay),
		filter 760ms ease var(--hm-motion-delay);
	will-change: transform, opacity, filter;
}

.hm-motion-item.hm-enter-up {
	transform: translate3d(0, -68px, 0) scale(0.975);
}

.hm-motion-item.hm-enter-down {
	transform: translate3d(0, 78px, 0) scale(0.975);
}

.hm-motion-item.is-motion-visible {
	opacity: 1;
	filter: blur(0);
	transform: translate3d(0, 0, 0) scale(1);
}

/* Logo tipográfico: efecto de máquina de escribir antigua al hover. */
.site-title .hm-brand-type,
.site-title.hm-brand-type {
	min-width: max-content;
}

.hm-brand-char {
	display: inline-block;
	opacity: 1;
}

.hm-brand-type.is-brand-typing .hm-brand-char {
	opacity: 0;
	transform: translateY(2px);
}

.hm-brand-type.is-brand-typing .hm-brand-char.is-struck {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 45ms steps(1, end), transform 90ms steps(2, end);
}

.hm-brand-caret {
	display: inline-block;
	width: 0.07em;
	height: 0.85em;
	margin-left: 0.08em;
	background: var(--hm-flame);
	vertical-align: -0.04em;
	opacity: 0;
}

.hm-brand-type.is-brand-typing .hm-brand-caret {
	opacity: 1;
	animation: hm-caret 440ms steps(1, end) infinite;
}

/* Páginas internas y artículos: extensión del lenguaje editorial. */
.page:not(.home) .content-area,
.single .content-area,
.archive .content-area,
.search .content-area {
	width: var(--hm-shell);
	max-width: none;
	margin: 0 auto;
	padding: clamp(3rem, 7vw, 7rem) 0 clamp(6rem, 10vw, 10rem);
}

.page:not(.home) .entry-hero,
.single .entry-hero,
.archive .entry-hero {
	min-height: clamp(280px, 42vh, 520px);
	display: grid;
	align-items: end;
	border-bottom: 1px solid rgba(237, 230, 216, 0.14);
}

.page:not(.home) .entry-hero .entry-title,
.single .entry-hero .entry-title,
.archive .entry-hero .entry-title {
	max-width: 18ch;
	font-size: clamp(2.75rem, 4.2vw, 4.75rem) !important;
	line-height: 1.04 !important;
	letter-spacing: -0.014em;
	text-wrap: balance;
}

.page:not(.home) .entry-content,
.single .entry-content {
	color: #ddd6c9;
	font-size: clamp(1.05rem, 1.25vw, 1.2rem);
	line-height: 1.8;
}

/*
 * Kadence aplica blanco a `.content-bg`; con la tipografía crema del sistema
 * editorial producía contraste 1.24:1. La superficie de lectura debe pertenecer
 * a la misma noche tinta de la interfaz, mientras los relacionados se elevan
 * sobre una superficie ligeramente más clara.
 */
.single .single-entry.content-bg,
.page:not(.home) .entry.content-bg {
	background: transparent !important;
	color: var(--hm-paper) !important;
	box-shadow: none !important;
}

.single .loop-entry.content-bg,
.page:not(.home) .loop-entry.content-bg,
.archive .loop-entry.content-bg,
.search .loop-entry.content-bg {
	border: 1px solid rgba(237, 230, 216, 0.18);
	border-radius: 4px;
	background: var(--hm-surface) !important;
	color: var(--hm-paper) !important;
	box-shadow: none !important;
}

.single .entry-header .entry-meta,
.single .entry-header .entry-meta span,
.single .entry-header .entry-meta time,
.single .entry-header .entry-meta a {
	color: #9eb9c0 !important;
}

.single .entry-content :where(p, li, dd, dt),
.page:not(.home) .entry-content :where(p, li, dd, dt) {
	color: #ddd6c9 !important;
}

.single .entry-content :where(strong, b),
.page:not(.home) .entry-content :where(strong, b) {
	color: var(--hm-paper) !important;
	font-weight: 700;
}

.single .entry-content :where(h2, h3, h4, h5, h6),
.page:not(.home) .entry-content :where(h2, h3, h4, h5, h6) {
	color: var(--hm-paper) !important;
}

.single .entry-content a,
.page:not(.home) .entry-content a {
	color: #9fc3cc !important;
	text-decoration-color: rgba(159, 195, 204, 0.55);
}

.single .entry-content a:hover,
.single .entry-content a:focus-visible,
.page:not(.home) .entry-content a:hover,
.page:not(.home) .entry-content a:focus-visible {
	color: var(--hm-flame-soft) !important;
	text-decoration-color: currentColor;
}

.single .entry-content blockquote,
.page:not(.home) .entry-content blockquote {
	margin-block: clamp(2rem, 5vw, 4rem);
	padding: clamp(1.5rem, 4vw, 3rem);
	border-left: 3px solid var(--hm-flame);
	border-radius: 0 4px 4px 0;
	background: var(--hm-surface);
	color: var(--hm-paper) !important;
}

.single .entry-content blockquote *,
.page:not(.home) .entry-content blockquote * {
	color: inherit !important;
}

.single .entry-content figcaption,
.page:not(.home) .entry-content figcaption,
.single .wp-caption-text,
.page:not(.home) .wp-caption-text {
	color: #aab6b7 !important;
	font-size: 0.88rem;
	line-height: 1.55;
}

.single .entry-content table,
.page:not(.home) .entry-content table {
	border-color: rgba(237, 230, 216, 0.28);
	background: var(--hm-surface);
	color: var(--hm-paper);
}

.single .entry-content th,
.page:not(.home) .entry-content th {
	background: var(--hm-charcoal);
	color: var(--hm-paper) !important;
}

.single .entry-content td,
.page:not(.home) .entry-content td {
	border-color: rgba(237, 230, 216, 0.22);
	color: #ddd6c9 !important;
}

.page:not(.home) .entry-content > p,
.single .entry-content > p,
.single .entry-content > ul,
.single .entry-content > ol {
	max-width: 74ch;
	margin-inline: auto;
}

.page:not(.home) .entry-content h2,
.single .entry-content h2 {
	max-width: 20ch;
	margin-top: clamp(4rem, 8vw, 8rem);
	font-size: clamp(2.4rem, 5vw, 5rem) !important;
	line-height: 0.98 !important;
	letter-spacing: -0.045em;
}

.page:not(.home) .entry-content img,
.single .entry-content img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto !important;
	max-height: none;
	object-fit: contain;
	border-radius: 4px;
}

/* En articulos, las fotografias conservan siempre su proporcion original.
   El recorte editorial con cover queda reservado para cards y bandas. */
.single .article-post-thumbnail,
.single .article-post-thumbnail .post-thumbnail-inner {
	height: auto !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	overflow: hidden;
	border-radius: 4px;
}

.single .article-post-thumbnail {
	padding-bottom: 0 !important;
}

.single .article-post-thumbnail .post-thumbnail-inner {
	position: relative !important;
	inset: auto !important;
}

.single .article-post-thumbnail img,
.single img.post-top-featured {
	position: relative;
	inset: auto;
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto !important;
	max-height: none;
	object-fit: contain !important;
	border-radius: 4px;
}

.single .entry-content figure,
.single .entry-content .wp-block-image,
.page:not(.home) .entry-content figure,
.page:not(.home) .entry-content .wp-block-image {
	height: auto !important;
	max-height: none;
	aspect-ratio: auto !important;
}

.archive .site-main .loop-entry,
.search .site-main .loop-entry {
	padding: 1.5rem;
	border: 1px solid rgba(237, 230, 216, 0.14);
	border-radius: 4px;
}

.archive .site-main .loop-entry .entry-title,
.search .site-main .loop-entry .entry-title {
	overflow-wrap: break-word;
	font-size: clamp(1.4rem, 1.8vw, 1.9rem) !important;
	line-height: 1.15 !important;
	letter-spacing: -0.015em;
}

.hm-section-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}

.hm-section-card {
	position: relative;
	display: flex;
	min-height: 270px;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
	padding: 1.75rem;
	border: 1px solid rgba(237, 230, 216, 0.14);
	border-radius: var(--hm-radius);
	background: linear-gradient(145deg, rgba(33, 29, 24, 0.82), rgba(21, 19, 15, 0.95));
	color: var(--hm-paper) !important;
	text-decoration: none;
	transition: transform 500ms var(--hm-ease), border-color 300ms ease, background-color 300ms ease;
}

.hm-section-card::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 85% 15%, rgba(127, 160, 169, 0.2), transparent 42%);
	opacity: 0;
	transition: opacity 500ms ease;
}

.hm-section-card:hover {
	transform: translateY(-8px);
	border-color: var(--hm-stamp);
}

.hm-section-card:hover::before { opacity: 1; }

.hm-section-index {
	position: absolute;
	top: 1.5rem;
	left: 1.75rem;
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
}

.hm-section-card h3 {
	position: relative;
	max-width: 12ch;
	margin: 0 0 0.75rem;
	font-size: clamp(1.7rem, 2.5vw, 2.7rem);
	line-height: 1;
}

.hm-section-count {
	position: relative;
	color: rgba(237, 230, 216, 0.56);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	text-transform: uppercase;
}

.hm-section-arrow {
	position: absolute;
	right: 1.6rem;
	bottom: 1.6rem;
	display: grid;
	width: 2.7rem;
	height: 2.7rem;
	place-items: center;
	border: 1px solid rgba(237, 230, 216, 0.2);
	border-radius: 50%;
	transition: transform 450ms var(--hm-ease), background-color 300ms ease, color 300ms ease;
}

.hm-section-card:hover .hm-section-arrow {
	transform: rotate(45deg);
	background: var(--hm-paper);
	color: var(--hm-ink);
}

.hm-manifesto {
	background: var(--hm-paper);
	color: var(--hm-ink);
}

.hm-manifesto .hm-eyebrow {
	grid-column: 1 / 4;
	color: var(--hm-stamp);
}

.hm-manifesto-grid > div { grid-column: 5 / 13; }

.hm-manifesto-lead {
	max-width: 22ch;
	margin: 0;
	font: 600 clamp(2.7rem, 5.2vw, 6rem)/0.98 var(--hm-font-display);
	letter-spacing: -0.048em;
	text-wrap: balance;
}

.hm-manifesto-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
	margin-top: 3rem;
}

.hm-button {
	display: inline-flex;
	align-items: center;
	min-height: 50px;
	padding: 0.8rem 1.25rem;
	border: 1px solid var(--hm-ink);
	border-radius: 999px;
	background: var(--hm-ink);
	color: var(--hm-paper) !important;
	font-size: var(--hm-text-sm);
	font-weight: 650;
	text-decoration: none;
	transition: transform 300ms var(--hm-ease), background-color 200ms ease, color 200ms ease;
}

.hm-button:hover { transform: translateY(-3px); }
.hm-button-secondary { background: transparent; color: var(--hm-ink) !important; }
.hm-button-secondary:hover { background: var(--hm-ink); color: var(--hm-paper) !important; }

.hm-reveal {
	opacity: 0;
	transform: translateY(42px);
	transition: opacity 800ms var(--hm-ease), transform 900ms var(--hm-ease);
}

.hm-reveal.from-up {
	transform: translateY(-34px);
}

.hm-reveal.from-down {
	transform: translateY(42px);
}

.hm-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* Selector y archivo editorial */
.hm-page-jump {
	display: grid;
	gap: 0.65rem;
	min-width: min(100%, 330px);
}

.hm-page-jump label {
	color: var(--hm-stamp-soft);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.hm-page-jump-control {
	display: grid;
	align-items: center;
	grid-template-columns: 76px minmax(92px, 1fr) auto;
	min-height: 54px;
	border: 1px solid rgba(237, 230, 216, 0.28);
	border-radius: 4px;
	background: rgba(237, 230, 216, 0.035);
	overflow: hidden;
	transition: border-color 220ms ease, background 220ms ease;
}

.hm-page-jump-control:focus-within {
	border-color: var(--hm-flame);
	background: rgba(197, 151, 37, 0.08);
}

.hm-page-jump input {
	width: 76px;
	height: 52px;
	padding: 0 0.35rem 0 1rem;
	border: 0;
	background: transparent;
	color: var(--hm-paper);
	font: 600 var(--hm-text-lg)/1 var(--hm-font-display);
	appearance: textfield;
}

.hm-page-jump input::-webkit-inner-spin-button {
	opacity: 0.68;
	filter: invert(1);
}
.hm-page-jump input:focus { outline: 0; }

.hm-page-total {
	display: flex;
	align-items: baseline;
	gap: 0.35rem;
	min-width: 0;
	padding: 0 0.75rem;
	border-left: 1px solid rgba(237, 230, 216, 0.14);
	color: var(--hm-paper);
	white-space: nowrap;
}

.hm-page-total strong {
	color: var(--hm-paper);
	font: 700 var(--hm-text-md)/1 var(--hm-font-display);
	letter-spacing: -0.02em;
}

.hm-page-total small {
	color: rgba(237, 230, 216, 0.72);
	font: 500 0.64rem/1 var(--hm-font-mono);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.hm-page-jump button {
	display: flex;
	align-self: stretch;
	align-items: center;
	justify-content: space-between;
	gap: 0.8rem;
	min-width: 132px;
	padding: 0 1.25rem;
	border: 0;
	border-left: 1px solid rgba(237, 230, 216, 0.2);
	border-radius: 0;
	background: var(--hm-paper);
	color: var(--hm-ink);
	font: 700 var(--hm-text-sm)/1 var(--hm-font-body);
	transition: background 220ms ease, color 220ms ease;
}

.hm-page-jump button:hover,
.hm-page-jump button:focus-visible {
	background: var(--hm-flame);
	color: var(--hm-charcoal);
}

.hm-archive-page {
	min-height: 100vh;
	background:
		linear-gradient(90deg, rgba(237, 230, 216, 0.025) 1px, transparent 1px) center / 12.5% 100%,
		var(--hm-ink);
	color: var(--hm-paper);
}

.hm-archive-hero {
	padding: clamp(8rem, 14vw, 13rem) 0 clamp(5rem, 9vw, 8rem);
	border-bottom: 1px solid rgba(237, 230, 216, 0.16);
}

.hm-archive-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 8fr) minmax(250px, 4fr);
	gap: 2rem;
	align-items: end;
	margin-top: clamp(2rem, 5vw, 5rem);
}

.hm-archive-hero h1 {
	max-width: 950px;
	margin: 0;
	overflow-wrap: break-word;
	color: var(--hm-paper);
	font: 600 clamp(3.6rem, 6.4vw, 7.2rem)/0.98 var(--hm-font-display) !important;
	letter-spacing: -0.014em;
}

.hm-archive-intro {
	display: grid;
	gap: 3rem;
	padding-bottom: 0.8rem;
}

.hm-archive-intro p {
	max-width: 34rem;
	margin: 0;
	color: rgba(237, 230, 216, 0.66);
	font-size: var(--hm-text-md);
	line-height: 1.7;
}

.hm-archive-results {
	padding-block: clamp(5rem, 9vw, 9rem);
}

.hm-archive-toolbar {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 3rem;
	margin-bottom: clamp(3rem, 6vw, 5.5rem);
	padding-bottom: 1.5rem;
	border-bottom: 1px solid rgba(237, 230, 216, 0.18);
}

.hm-archive-toolbar h2 {
	margin: 0.5rem 0 0;
	color: var(--hm-paper);
	font: 600 clamp(2.2rem, 3.6vw, 3.6rem)/1 var(--hm-font-display);
	letter-spacing: -0.016em;
}

.hm-archive-grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: clamp(2rem, 5vw, 5rem) 1.5rem;
}

.hm-archive-card {
	grid-column: span 6;
	min-width: 0;
	border-bottom: 1px solid rgba(237, 230, 216, 0.18);
}

.hm-archive-card:nth-child(3n) { grid-column: 3 / span 8; }

.hm-archive-card > a {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(230px, 5fr);
	min-height: 430px;
	color: inherit;
	text-decoration: none;
}

.hm-archive-card:nth-child(3n) > a {
	grid-template-columns: minmax(0, 7fr) minmax(280px, 5fr);
}

.hm-archive-card-media {
	position: relative;
	min-height: 390px;
	border-radius: 4px 4px 0 0;
	background: var(--hm-charcoal-soft);
	overflow: hidden;
}

.hm-news-image::before,
.hm-archive-card-media::before,
.hm-hero-media::before,
.entry-content figure::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background:
		linear-gradient(135deg, transparent 0 49.8%, rgba(197, 151, 37, 0.24) 50%, transparent 50.2%),
		linear-gradient(45deg, rgba(237, 230, 216, 0.035), rgba(197, 151, 37, 0.08)),
		var(--hm-charcoal-soft);
	color: rgba(237, 230, 216, 0.48);
	content: "Hacemos Memoria";
	font: 600 clamp(1.35rem, 3vw, 2.8rem)/1 var(--hm-font-display);
	letter-spacing: -0.035em;
	opacity: 0;
	pointer-events: none;
	transition: opacity 300ms ease;
}

.hm-media-missing::before { opacity: 1; }
.hm-media-missing > img,
.hm-media-missing > picture { opacity: 0; }

.entry-content figure { position: relative; }

.hm-archive-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.82) contrast(1.04);
	transition: filter 650ms ease, transform 850ms var(--hm-ease);
}

.hm-archive-card:hover img,
.hm-archive-card:focus-within img {
	filter: saturate(1) contrast(1.02);
	transform: scale(1.035);
}

.hm-image-placeholder {
	display: grid;
	width: 100%;
	height: 100%;
	min-height: inherit;
	place-items: center;
	color: rgba(237, 230, 216, 0.18);
	font: 600 clamp(4rem, 8vw, 8rem)/1 var(--hm-font-display);
}

.hm-archive-card-index {
	position: absolute;
	top: 1rem;
	left: 1rem;
	display: grid;
	width: 42px;
	height: 42px;
	place-items: center;
	border: 1px solid rgba(237, 230, 216, 0.45);
	border-radius: 50%;
	background: rgba(18, 17, 14, 0.28);
	backdrop-filter: blur(10px);
	color: var(--hm-paper);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
}

.hm-archive-card-copy {
	display: flex;
	flex-direction: column;
	padding: 1.5rem 0 1.5rem clamp(1.5rem, 3vw, 2.5rem);
}

.hm-archive-card-meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.75rem;
	color: var(--hm-stamp-soft);
	font: 500 0.66rem/1.25 var(--hm-font-mono);
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.hm-archive-card h3 {
	margin: 2rem 0 1rem;
	overflow-wrap: break-word;
	color: var(--hm-paper);
	font: 600 clamp(1.5rem, 1.7vw, 2.2rem)/1.08 var(--hm-font-display);
	letter-spacing: -0.03em;
	text-wrap: balance;
}

.hm-archive-card p {
	margin: 0;
	color: rgba(237, 230, 216, 0.62);
	font-size: var(--hm-text-sm);
	line-height: 1.6;
}

.hm-archive-card .hm-news-action { margin-top: auto; }

.hm-archive-pagination {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 2rem;
	margin-top: clamp(5rem, 9vw, 9rem);
	padding-top: 1.5rem;
	border-top: 1px solid rgba(237, 230, 216, 0.18);
}

.hm-pagination-arrow {
	color: var(--hm-paper);
	font: 600 var(--hm-text-sm)/1 var(--hm-font-body);
	text-decoration: none;
}

.hm-pagination-arrow:last-child { justify-self: end; }
.hm-pagination-arrow.is-disabled { opacity: 0.28; }

.hm-pagination-pages {
	display: flex;
	gap: 0.4rem;
}

.hm-pagination-pages a {
	display: grid;
	width: 48px;
	height: 48px;
	place-items: center;
	border: 1px solid rgba(237, 230, 216, 0.2);
	border-radius: 50%;
	color: rgba(237, 230, 216, 0.68);
	font: 500 var(--hm-text-xs)/1 var(--hm-font-mono);
	text-decoration: none;
	transition: border-color 220ms ease, color 220ms ease, background 220ms ease;
}

.hm-pagination-pages a:hover,
.hm-pagination-pages a:focus-visible,
.hm-pagination-pages a.is-current {
	border-color: var(--hm-flame);
	background: var(--hm-flame);
	color: var(--hm-charcoal) !important;
}

@media (max-width: 1024px) {
	:root { --hm-shell: min(100% - 40px, 900px); }
	.site-mobile-header-wrap .site-title.vs-md-false { display: block !important; }
	.hm-hero-grid { grid-template-columns: 1fr; gap: 2rem; }
	.hm-hero-media { min-height: min(70vw, 620px); }
	.hm-hero-copy { max-width: 780px; }
	.hm-section-grid { grid-template-columns: repeat(2, 1fr); }
	.hm-section-heading > div { grid-column: 1 / 9; }
	.hm-section-heading > p { grid-column: 9 / 13; }
	.hm-archive-card,
	.hm-archive-card:nth-child(3n) { grid-column: 1 / -1; }
	.hm-archive-status { align-items: flex-start; flex-direction: column; }
	.hm-archive-callout,
	.hm-archive-jump-panel { width: 100%; }
	.hm-archive-jump-panel {
		border-top: 1px solid rgba(237, 230, 216, 0.18);
		border-left: 0;
	}
	.hm-archive-jump-panel .hm-page-jump { width: 100%; }
}

@media (max-width: 767px) {
	:root { --hm-shell: calc(100% - 32px); }
	.hm-grid-lines { background-size: 25% 100%; }
	.hm-hero { padding-top: 4rem; }
	.hm-masthead { margin-bottom: 5rem; }
	.hm-masthead-title { font-size: clamp(3.2rem, 16vw, 5.4rem); }
	.hm-search { min-height: 54px; text-align: left; }
	.hm-search button { padding-inline: 1rem; }
	.hm-hero-kicker span:nth-child(1) { grid-column: 1 / 7; }
	.hm-hero-kicker span:nth-child(2) { display: none; }
	.hm-hero-kicker span:nth-child(3) { grid-column: 11 / 13; }
	.hm-hero-media { min-height: 116vw; border-radius: var(--hm-radius); }
	.hm-hero h1 { font-size: clamp(2.7rem, 13vw, 4.5rem) !important; }
	.hm-hero-meta .hm-category-label { grid-column: 1 / 8; }
	.hm-hero-meta .hm-datestamp { grid-column: 8 / 13; }
	.hm-section-heading > div,
	.hm-section-heading > p { grid-column: 1 / 13; }
	.hm-section-heading > p { margin-top: 1.5rem; }
	.hm-news-track { padding-left: 16px; }
	.hm-news-card { width: min(82vw, 360px); }
	.hm-section-grid { grid-template-columns: 1fr; }
	.hm-section-card { min-height: 220px; }
	.hm-manifesto .hm-eyebrow,
	.hm-manifesto-grid > div { grid-column: 1 / 13; }
	.hm-manifesto-grid > div { margin-top: 2rem; }
	.hm-manifesto-lead { font-size: clamp(2.5rem, 12vw, 4.6rem); }
	.hm-archive-status { align-items: flex-start; flex-direction: column; }
	.hm-archive-callout,
	.hm-archive-jump-panel { width: 100%; }
	.hm-archive-jump-panel {
		border-top: 1px solid rgba(237, 230, 216, 0.18);
		border-left: 0;
	}
	.hm-stats-grid { grid-template-columns: 1fr; }
	.hm-stat { min-height: 210px; border-right: 0; border-bottom: 1px solid rgba(237, 230, 216, 0.16); }
	.hm-stat:last-child { border-bottom: 0; }
	.hm-page-jump { width: 100%; }
	.hm-archive-hero-grid { grid-template-columns: 1fr; }
	.hm-archive-hero h1 { font-size: clamp(3.6rem, 18vw, 6rem) !important; }
	.hm-archive-toolbar { align-items: flex-start; flex-direction: column; }
	.hm-archive-card > a,
	.hm-archive-card:nth-child(3n) > a { grid-template-columns: 1fr; }
	.hm-archive-card-media { min-height: 105vw; }
	.hm-archive-card-copy { min-height: 330px; padding-left: 0; }
	.hm-archive-pagination { grid-template-columns: 1fr 1fr; }
	.hm-pagination-pages { grid-column: 1 / -1; grid-row: 1; justify-content: center; }
	.hm-pagination-arrow { grid-row: 2; }
	.hm-page-jump-control {
		grid-template-columns: 76px minmax(0, 1fr);
	}
	.hm-page-total {
		justify-content: flex-start;
	}
	.hm-page-jump button {
		min-height: 50px;
		grid-column: 1 / -1;
		border-top: 1px solid rgba(237, 230, 216, 0.2);
		border-left: 0;
	}
}

.hm-back-to-top {
	position: fixed;
	right: clamp(16px, 3vw, 32px);
	bottom: clamp(16px, 3vw, 32px);
	z-index: 40;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border: 1px solid rgba(237, 230, 216, 0.2);
	border-radius: 50%;
	background: rgba(21, 19, 15, 0.82);
	backdrop-filter: blur(8px);
	color: var(--hm-paper);
	font-size: 1.2rem;
	line-height: 1;
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	cursor: pointer;
	transition: opacity 260ms var(--hm-ease), transform 260ms var(--hm-ease), border-color 220ms ease, background-color 220ms ease, color 220ms ease;
}

.hm-back-to-top.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.hm-back-to-top:hover,
.hm-back-to-top:focus-visible {
	border-color: var(--hm-flame);
	background: var(--hm-flame);
	color: var(--hm-charcoal);
}

.hm-back-to-top:focus-visible {
	outline: 2px solid var(--hm-flame);
	outline-offset: 2px;
}

@media (max-width: 767px) {
	.hm-back-to-top {
		width: 46px;
		height: 46px;
		font-size: 1.05rem;
	}
}

/* Respeta preferencia de movimiento reducido */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.hm-reveal { opacity: 1; transform: none; }
	.hm-news-track { animation: none; }
	.hm-news-marquee { overflow-x: auto; }
	.hm-type-ready .hm-char,
	.hm-type-ready .hm-char.is-typed {
		opacity: 1;
		filter: none;
		transform: none;
	}
	.hm-type-caret { display: none; }
	.hm-motion-item,
	.hm-motion-item.is-motion-visible {
		opacity: 1;
		filter: none;
		transform: none;
	}
}

/* ==========================================================================
   Variante de preview: paleta original del logo (turquesa/terracota) en vez
   del dorado "archivo vivo". Mismo diseño/estructura — solo remapea los
   acentos de color vía custom properties, que heredan en toda la cascada.
   Ver template-home-paleta-logo.php.
   ========================================================================== */
.hm-home--brand-palette {
	--hm-flame: #d3592b;
	--hm-flame-soft: #ea8256;
	--hm-stamp: #3f8f89;
	--hm-stamp-soft: #6cbab2;
}

/* ==========================================================================
   Cuadrícula de cursos/diplomas (página "Formación"). Reemplaza el volcado
   lineal de HTML de Divi (encabezado + imagen enorme + párrafo, repetido)
   por tarjetas consistentes con el resto del sistema editorial.
   ========================================================================== */
.hm-course-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2rem;
	margin-top: 2.5rem !important;
	/* Excluido del fade-in por scroll (".entry-content > *" en editorial-home.js):
	   con 13 tarjetas es demasiado alto para cruzar el umbral de intersección
	   y quedaba invisible para siempre. Ver el mismo caso con el carrusel del home. */
	opacity: 1 !important;
	filter: none !important;
	transform: none !important;
}

.hm-course-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgba(237, 230, 216, 0.14);
	border-radius: 4px;
	background: var(--hm-surface);
	transition: border-color 250ms ease, transform 400ms var(--hm-ease);
}

.hm-course-card:hover {
	border-color: rgba(201, 154, 62, 0.5);
	transform: translateY(-4px);
}

.hm-course-card-media {
	margin: 0 !important;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--hm-charcoal);
}

.hm-course-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.9);
}

.hm-course-card-kicker {
	margin: 1.5rem 1.5rem 0 !important;
}

.hm-course-card-title {
	margin: 0.6rem 1.5rem 0 !important;
	color: var(--hm-paper) !important;
	font-size: clamp(1.3rem, 1.6vw, 1.6rem) !important;
	line-height: 1.15 !important;
	letter-spacing: -0.015em;
}

.hm-course-card-excerpt {
	margin: 0.85rem 1.5rem 1.5rem !important;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	color: rgba(237, 230, 216, 0.66) !important;
	font-size: 0.95rem !important;
	line-height: 1.65 !important;
}

@media (max-width: 1024px) {
	.hm-course-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
	.hm-course-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Resultados de búsqueda sin coincidencias. Ver search.php.
   ========================================================================== */
.hm-search-empty {
	padding: clamp(3rem, 8vw, 6rem) 0;
	text-align: center;
}

.hm-search-empty p {
	max-width: 44ch;
	margin: 0 auto;
	color: rgba(237, 230, 216, 0.7);
	font-size: clamp(1.1rem, 1.6vw, 1.3rem);
	line-height: 1.7;
}

/* ==========================================================================
   Paginación por defecto de WordPress (the_posts_pagination) — usada en
   search.php. El azul de Kadence por defecto no combina con la paleta;
   se reutiliza el mismo lenguaje visual de ".hm-pagination-pages".
   ========================================================================== */
.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin-top: clamp(3rem, 6vw, 5rem);
}

.pagination .page-numbers {
	display: grid;
	min-width: 44px;
	height: 44px;
	place-items: center;
	padding-inline: 0.4rem;
	border: 1px solid rgba(237, 230, 216, 0.2);
	border-radius: 50%;
	color: rgba(237, 230, 216, 0.68) !important;
	font: 500 var(--hm-text-sm)/1 var(--hm-font-mono);
	text-decoration: none;
	transition: border-color 220ms ease, color 220ms ease, background 220ms ease;
}

.pagination .page-numbers.dots {
	border-color: transparent;
}

.pagination .page-numbers:hover,
.pagination .page-numbers:focus-visible,
.pagination .page-numbers.current {
	border-color: var(--hm-flame);
	background: var(--hm-flame);
	color: var(--hm-charcoal) !important;
}

.pagination .page-numbers.next,
.pagination .page-numbers.prev {
	border-radius: 999px;
	padding-inline: 1rem;
}
/* ================================================================
   Cabecera editorial 2026 — identidad clara, navegación persistente
   ================================================================ */
:root {
	/* Color de cada área. Ajustes del sitio → Colores puede reemplazarlos
	   (hm_imprime_colores_de_area()); los demás usos de estos tonos son de
	   marca y no cambian con el área. */
	--hm-color-actualidad: #d3592b;
	--hm-color-especiales: #337f91;
	--hm-color-academia: #6f2c3f;
	--hm-color-nosotros: #76543f;
	--hm-brand-burgundy: #6f2c3f;
	--hm-brand-terra: #d3592b;
	--hm-brand-turquoise: #3f8f89;
	--hm-brand-ink: #211d1b;
	--hm-brand-paper: #fff;
	--hm-header-height: 100px;
}

body { padding-top: var(--hm-header-height); }
#masthead.site-header { display: none !important; }

.hm-editorial-header {
	position: fixed;
	z-index: 9990;
	inset: 0 0 auto;
	height: var(--hm-header-height);
	color: var(--hm-brand-ink);
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid rgba(33, 29, 27, .16);
	transition: height .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease, top .35s ease;
}

/* La cabecera es "position: fixed; top: 0", por lo que sin este ajuste
 * queda tapada por la barra negra de administración de WordPress (tiene más
 * z-index). La barra mide 32px en escritorio y 46px en el breakpoint móvil
 * de WordPress (782px), que no coincide con nuestros propios breakpoints. */
body.admin-bar .hm-editorial-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .hm-editorial-header {
		top: 46px;
	}
}

.hm-editorial-header.is-compact {
	height: 68px;
	box-shadow: 0 12px 35px rgba(44, 29, 27, .08);
}

.hm-editorial-header.is-compact:hover,
.hm-editorial-header.is-compact:focus-within,
.hm-editorial-header.is-menu-open,
.hm-editorial-header.is-search-open { height: var(--hm-header-height); }

.hm-header-inner {
	width: min(100% - 40px, 1520px);
	height: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: minmax(185px, .8fr) auto minmax(185px, .8fr);
	align-items: center;
	gap: 28px;
	transition: padding .35s ease;
}

.hm-header-brand {
	justify-self: start;
	color: var(--hm-brand-burgundy);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 21px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
}

.hm-header-logo {
	width: auto;
	max-width: 150px;
	height: 76px;
	margin-top: 8px;
	object-fit: contain;
	object-position: left center;
	transition: height .35s ease;
}
.is-compact:not(:hover):not(:focus-within) .hm-header-logo { height: 52px; margin-top: 4px; }

.hm-primary-nav { display: flex; align-items: center; gap: clamp(16px, 2vw, 36px); }

.hm-header-tools { justify-self: end; display: flex; align-items: center; gap: 20px; }
.hm-search-toggle {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	color: #fff !important;
	background: var(--hm-brand-terra);
	border: 1px solid var(--hm-brand-terra);
	border-radius: 50%;
	font-size: 20px;
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.hm-search-toggle:hover,
.hm-search-toggle:focus-visible {
	background: var(--hm-brand-burgundy);
	border-color: var(--hm-brand-burgundy);
	transform: translateY(-1px);
	box-shadow: 0 6px 14px rgba(111, 44, 63, .28);
}
/* Menu movil. Por debajo de 768px los cuatro enlaces de .hm-primary-nav no
   caben en la barra: piden 339px y quedan 317 con pantalla de 360 y 277 con
   pantalla de 320, asi que "Nosotros" se salia (62px fuera a 320). Ahi los
   enlaces se van a este panel y la barra deja solo un boton, con lo que la
   cabecera se queda en sus 74px. Las redes viajan al panel: en la barra estan
   en display:none desde 767px, de modo que en movil no aparecian en ninguna
   parte del sitio salvo el footer. */
/* El azul se declara aqui a proposito. Es #215387, que resulta ser
   --global-palette2 de Kadence, o sea su paleta POR DEFECTO, no la de Hacemos
   Memoria (borgona / terra / turquesa). Aparecio solo porque el estilo de
   boton de Kadence le gana a ".hm-nav-toggle" a secas. Se deja escrito y con
   selector mas especifico para que sea una decision y no una herencia: si
   alguien personaliza la paleta de Kadence en el Personalizador, este boton
   no cambia. */
.hm-editorial-header .hm-nav-toggle {
	display: none;
	align-items: center;
	gap: 8px;
	height: 40px;
	padding: 0 15px 0 13px;
	color: #fff;
	background: #215387;
	border: 1px solid #215387;
	border-radius: 999px;
	font: 650 11px/1 var(--hm-font-mono, "Roboto Mono", monospace);
	letter-spacing: .07em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.hm-editorial-header .hm-nav-toggle:hover,
.hm-editorial-header .hm-nav-toggle:focus-visible {
	background: #1a4269;
	border-color: #1a4269;
	box-shadow: 0 6px 14px rgba(33, 83, 135, .3);
}

.hm-nav-toggle-bars {
	position: relative;
	display: block;
	width: 16px;
	height: 2px;
	background: currentColor;
}

.hm-nav-toggle-bars::before,
.hm-nav-toggle-bars::after {
	content: "";
	position: absolute;
	left: 0;
	width: 16px;
	height: 2px;
	background: currentColor;
	transition: transform .25s ease;
}

.hm-nav-toggle-bars::before { top: -5px; }
.hm-nav-toggle-bars::after { top: 5px; }

/* Abierto se vuelve aspa: la barra del medio se apaga y las otras se cruzan. */
.is-menu-open .hm-nav-toggle-bars { background: transparent; }
.is-menu-open .hm-nav-toggle-bars::before { transform: translateY(5px) rotate(45deg); }
.is-menu-open .hm-nav-toggle-bars::after { transform: translateY(-5px) rotate(-45deg); }

.hm-mobile-nav {
	position: fixed;
	top: var(--hm-header-height);
	right: 0;
	left: 0;
	z-index: 9989;
	padding: 4px 20px 26px;
	/* Opaco del todo, no .99: con el alfa se transparentaba el titular de la
	   pagina y el panel se leia como parte del contenido. */
	background: #fff;
	border-bottom: 1px solid rgba(33, 29, 27, .16);
	box-shadow: 0 22px 40px rgba(44, 29, 27, .22);
}

/* Velo sobre el resto de la pagina. Sin el, el panel es blanco sobre blanco y
   no se distingue del contenido de la portada. Es un <button> de verdad y no
   un ::after para que tocarlo cierre el menu y para que tenga nombre
   accesible ("Cerrar menu"). Se posiciona respecto al panel, que es fixed. */
.hm-mobile-nav-scrim {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	height: 100vh;
	padding: 0;
	background: rgba(28, 22, 20, .5) !important;
	border: 0;
	border-radius: 0;
	cursor: pointer;
}

.hm-mobile-nav[hidden] { display: none; }

/* Mismo motivo que la cabecera y el buscador: bajo este ancho la barra de
   administracion de WordPress mide 46px. */
body.admin-bar .hm-mobile-nav { top: calc(var(--hm-header-height) + 46px); }

.hm-mobile-nav-links { display: flex; flex-direction: column; }

.hm-mobile-nav-link {
	--hm-area-color: var(--hm-brand-ink);
	display: flex;
	min-height: 52px;
	align-items: center;
	border-bottom: 1px solid rgba(33, 29, 27, .12);
	color: var(--hm-brand-ink) !important;
	font: 650 15px/1.2 var(--hm-font-mono, "Roboto Mono", monospace);
	letter-spacing: .035em;
	text-decoration: none;
}

.hm-mobile-nav-link:hover,
.hm-mobile-nav-link:focus-visible,
.hm-mobile-nav-link.is-active { color: var(--hm-area-color) !important; }

.hm-mobile-nav-social {
	display: flex;
	gap: 5px;
	margin-top: 18px;
}

.hm-social-links { display: flex; gap: 5px; }
.hm-social-links a,
.hm-mobile-nav-social a {
	display: grid;
	width: 34px;
	height: 34px;
	border: 1px solid transparent;
	border-radius: 50%;
	place-items: center;
	color: var(--hm-brand-ink);
	text-decoration: none;
	transition:
		color .25s ease,
		background-color .25s ease,
		border-color .25s ease,
		transform .3s cubic-bezier(.22,1,.36,1);
}
.hm-social-links a:hover,
.hm-social-links a:focus-visible,
.hm-mobile-nav-social a:hover,
.hm-mobile-nav-social a:focus-visible {
	border-color: rgba(118,44,67,.24);
	background: #f5ece9;
	color: var(--hm-brand-burgundy);
	transform: translateY(-2px);
}
.hm-social-links svg,
.hm-mobile-nav-social svg {
	width: 17px;
	height: 17px;
	overflow: visible;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
}
.hm-social-links svg .is-filled,
.hm-mobile-nav-social svg .is-filled {
	fill: currentColor;
	stroke: none;
}

.hm-header-search {
	position: absolute;
	top: 100%;
	right: max(20px, calc((100vw - 1520px) / 2));
	width: min(560px, calc(100vw - 40px));
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 16px;
	padding: 18px;
	background: var(--hm-brand-paper);
	border: 1px solid rgba(33,29,27,.18);
	box-shadow: 0 22px 45px rgba(40,22,20,.12);
}
.hm-header-search[hidden] { display: none; }
.hm-header-search label { font: 600 10px/1.2 "Roboto Mono", monospace; text-transform: uppercase; }
.hm-header-search input { min-width: 0; padding: 10px 4px; border: 0; border-bottom: 1px solid; background: transparent; }
.hm-header-search button { padding: 11px 17px; color: white; background: var(--hm-brand-burgundy); border: 0; border-radius: 4px; }

.hm-editorial-header :focus-visible { outline: 2px solid var(--hm-brand-turquoise); outline-offset: 4px; }

/* Franja promocional editorial */
.hm-promo-wrap { padding: clamp(58px, 7vw, 96px) 0; background: #fff; }
.hm-promo-bar {
	display: grid;
	height: clamp(240px, 19vw, 280px);
	min-height: clamp(240px, 19vw, 280px);
	grid-template-columns: minmax(0, 1.38fr) minmax(340px, 1fr);
	color: #fff;
	background: var(--hm-brand-burgundy);
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(84, 33, 50, .14);
}
.hm-promo-bar:not(.has-image) { grid-template-columns: 1fr; }
.hm-promo-media {
	position: relative;
	height: 100%;
	min-height: clamp(240px, 19vw, 280px);
	overflow: hidden;
	background: #efe9e1;
}
.hm-promo-media::after {
	content: "";
	position: absolute;
	inset: 0 0 0 auto;
	width: 1px;
	background: rgba(255, 255, 255, .2);
}
.hm-promo-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s cubic-bezier(.22, 1, .36, 1);
}
.hm-promo-bar:hover .hm-promo-media img,
.hm-promo-bar:focus-within .hm-promo-media img { transform: scale(1.035); }
.hm-promo-content {
	display: flex;
	min-width: 0;
	flex-direction: column;
	justify-content: space-between;
	gap: 16px;
	padding: 28px 32px;
}
.hm-promo-copy { display: grid; gap: 10px; }
.hm-promo-copy span {
	color: #ffd7c6;
	font: 600 10px/1 var(--hm-font-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
}
.hm-promo-copy strong {
	max-width: 17ch;
	color: #fff;
	font: 650 clamp(1.7rem, 2.1vw, 2.15rem)/.98 var(--hm-font-display);
	letter-spacing: -.035em;
	text-wrap: balance;
}
.hm-promo-description {
	max-width: 46ch;
	margin: 0;
	color: rgba(255, 255, 255, .82) !important;
	font: 450 .96rem/1.55 var(--hm-font-body);
}
.hm-promo-action {
	display: inline-flex;
	width: fit-content;
	min-height: 44px;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 12px 16px;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .52);
	border-radius: 4px;
	font: 600 12px/1.2 var(--hm-font-body);
	text-decoration: none;
}
.hm-promo-action span { transition: transform .3s ease; }
.hm-promo-action:hover,
.hm-promo-action:focus-visible { color: var(--hm-brand-burgundy); background: #fff; }
.hm-promo-action:hover span,
.hm-promo-action:focus-visible span { transform: translateX(5px); }

/* Panel editorial ascendente, sin esconder la fotografía */
.hm-news-card { position: relative; overflow: hidden; border-radius: 4px; background: #fff; }
.hm-news-card-link { position: relative; min-height: 520px; display: block; color: var(--hm-brand-ink); }
.hm-news-image { position: absolute; inset: 0; height: 100%; }
.hm-news-image img { width: 100%; height: 100%; object-fit: cover; }
.hm-news-copy {
	position: absolute;
	z-index: 2;
	inset: auto 0 0;
	min-height: 42%;
	padding: 25px;
	color: var(--hm-brand-ink);
	background: rgba(255,255,255,.95);
	border-top: 3px solid var(--hm-brand-terra);
	transform: translateY(calc(100% - 154px));
	transition: transform .5s cubic-bezier(.22,1,.36,1), background .3s ease;
}
.hm-news-copy h3 { color: #5d5651; transition: color .25s ease; }
.hm-news-copy p { display: block; max-height: none; color: #625a55; opacity: 0; transform: translateY(12px); transition: opacity .3s ease .08s, transform .35s ease .08s; }
.hm-news-card:hover .hm-news-copy,
.hm-news-card:focus-within .hm-news-copy { transform: translateY(0); }
.hm-news-card:hover .hm-news-copy p,
.hm-news-card:focus-within .hm-news-copy p { opacity: 1; transform: none; }
.hm-news-copy h3:hover,
.hm-news-card-link:focus-visible .hm-news-copy h3 { color: var(--hm-brand-burgundy); }

@media (max-width: 1024px) {
	.hm-header-inner { grid-template-columns: 1fr auto; }
	/* La lupa va antes del boton de secciones: buscar es la accion mas
	   frecuente en movil y queda mas cerca del pulgar. */
	.hm-header-tools { grid-column: 2; grid-row: 1; }
	.hm-primary-nav { grid-column: 3; grid-row: 1; }
}

@media (max-width: 767px) {
	:root { --hm-header-height: 74px; }
	body { padding-top: var(--hm-header-height); }
	.hm-editorial-header,
	.hm-editorial-header.is-compact,
	.hm-editorial-header.is-compact:hover,
	.hm-editorial-header.is-compact:focus-within { height: var(--hm-header-height); }
	.hm-header-inner { width: calc(100% - 28px); grid-template-columns: 1fr auto auto; gap: 12px; }
	.hm-header-logo { height: 54px; max-width: 90px; margin-top: 6px; }
	.hm-header-brand { font-size: 17px; }
	/* Mismo orden que a 1024px: la lupa antes del boton de secciones. */
	.hm-header-tools { grid-column: 2; gap: 8px; }
	/* Los enlaces en linea ceden el sitio al boton: ver .hm-nav-toggle. */
	.hm-primary-nav { display: none; }
	.hm-editorial-header .hm-nav-toggle { display: inline-flex; }
	.hm-social-links { display: none; }
	.hm-header-search { position: fixed; top: var(--hm-header-height); right: 14px; left: 14px; width: auto; grid-template-columns: 1fr auto; }
	body.admin-bar .hm-header-search { top: calc(var(--hm-header-height) + 46px); }
	.hm-header-search label { grid-column: 1 / -1; }
	.hm-promo-bar { grid-template-columns: minmax(0, 1.05fr) minmax(300px, .95fr); }
	.hm-promo-content { padding: 30px; }
	.hm-news-card-link { min-height: 500px; }
	.hm-news-copy { min-height: 38%; transform: none; padding: 20px; }
	.hm-news-copy p { opacity: 1; transform: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}

@media (max-width: 620px) {
	.hm-promo-wrap { padding: 44px 0; }
	.hm-promo-bar,
	.hm-promo-bar.has-image { height: auto; min-height: 0; grid-template-columns: 1fr; }
	.hm-promo-media { min-height: 210px; aspect-ratio: 16 / 9; }
	.hm-promo-content { gap: 24px; padding: 28px 24px 30px; }
	.hm-promo-copy strong { max-width: 20ch; font-size: clamp(1.8rem, 9vw, 2.6rem); }
	.hm-promo-action { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {.hm-editorial-header,
.hm-news-copy,
.hm-news-copy p,
.hm-promo-media img,
.hm-promo-action span { transition-duration: .01ms !important; }
	.hm-promo-bar:hover .hm-promo-media img,
	.hm-promo-bar:focus-within .hm-promo-media img { transform: none; }
}

/* Home sobre papel blanco según el manual de identidad */
.home,
.home .site.wp-site-blocks,
.home .hm-home,
.home .hm-hero,
.home .hm-sections {
	color: var(--hm-brand-ink);
	background: #fff !important;
}
.home .hm-home h1,
.home .hm-home h2,
.home .hm-home h3,
.home .hm-home h4 { color: var(--hm-brand-ink) !important; }
.home .hm-grid-lines {
	opacity: .38;
	background-image: linear-gradient(to right, rgba(63,143,137,.12) 1px, transparent 1px);
}
.home .hm-hero-kicker,
.home .hm-hero-meta,
.home .hm-section-heading { border-color: rgba(33,29,27,.18); }
.home .hm-search { color: var(--hm-brand-ink); border-color: rgba(33,29,27,.28); background: #f7f5f1; }
.home .hm-search input { color: var(--hm-brand-ink); }
.home .hm-search button { color: #fff; background: var(--hm-brand-burgundy); border-radius: 4px; }
.home .hm-hero-media { border-radius: 4px; overflow: hidden; }
.home .hm-datestamp { color: var(--hm-brand-burgundy); border-color: var(--hm-brand-terra); }
.home .hm-category-label,
.home .hm-eyebrow,
.home .hm-news-category { color: var(--hm-brand-turquoise); }

/* Navegación directa aprobada en "Sitio web de Hacemos Memoria.pdf". */
.hm-primary-link {
	--hm-area-color: var(--hm-brand-ink);
	position: relative;
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	padding: 10px 2px;
	color: var(--hm-brand-ink);
	font: 650 13.5px/1.2 var(--hm-font-mono, "Roboto Mono", monospace);
	letter-spacing: .035em;
	text-decoration: none;
}
/* Escritorio a partir de 1025px: dos píxeles más que la base. Se hace en su
 * propia consulta y no cambiando el valor de arriba porque entre 768 y 1024px
 * la barra ya se desplaza en horizontal (ver .hm-primary-nav con scroll-snap
 * en el bloque de 900px) y ahí dos píxeles más solo la aprietan. */
@media (min-width: 1025px) {
	.hm-primary-link {
		font-size: 15.5px;
	}
}

.hm-primary-link.is-actualidad,
.hm-mobile-nav-link.is-actualidad { --hm-area-color: var(--hm-color-actualidad); }
.hm-primary-link.is-especiales,
.hm-mobile-nav-link.is-especiales { --hm-area-color: var(--hm-color-especiales); }
.hm-primary-link.is-academia,
.hm-mobile-nav-link.is-academia { --hm-area-color: var(--hm-color-academia); }
.hm-primary-link.is-nosotros,
.hm-mobile-nav-link.is-nosotros { --hm-area-color: var(--hm-color-nosotros); }
.hm-primary-link::after {
	content: "";
	position: absolute;
	inset: auto 0 3px;
	height: 3px;
	background: var(--hm-area-color);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .28s cubic-bezier(.22,1,.36,1);
}
/* !important: la regla global "a { color !important }" (ver más arriba) tiene
   mayor prioridad en cascada que esta por no llevar !important, así que sin
   esto el menú nunca mostraba el color de categoría, ni en reposo ni en hover. */
.hm-primary-link:hover,
.hm-primary-link:focus-visible,
.hm-primary-link.is-active { color: var(--hm-area-color) !important; }
.hm-primary-link:focus-visible {
	outline: 2px solid var(--hm-area-color);
	outline-offset: 4px;
}
.hm-primary-link:hover::after,
.hm-primary-link:focus-visible::after,
.hm-primary-link.is-active::after { transform: scaleX(1); transform-origin: left; }
.hm-primary-link.is-active { font-weight: 800; }

@media (max-width: 900px) {
	:root { --hm-header-height: 120px; }
	body { padding-top: var(--hm-header-height); }
	.hm-editorial-header,
	.hm-editorial-header.is-compact,
	.hm-editorial-header.is-compact:hover,
	.hm-editorial-header.is-compact:focus-within { height: var(--hm-header-height); }
	.hm-header-inner {
		width: calc(100% - 28px);
		grid-template-columns: minmax(110px, 1fr) auto;
		grid-template-rows: 70px 50px;
		gap: 0 12px;
	}
	.hm-header-brand { grid-column: 1; grid-row: 1; }
	.hm-header-logo,
	.is-compact:not(:hover):not(:focus-within) .hm-header-logo { height: 58px; max-width: 105px; margin-top: 6px; }
	.hm-header-tools { grid-column: 2; grid-row: 1; }
	.hm-primary-nav {
		grid-column: 1 / -1;
		grid-row: 2;
		justify-content: flex-start;
		gap: 25px;
		overflow-x: auto;
		scrollbar-width: none;
		scroll-snap-type: x proximity;
	}
	.hm-primary-nav::-webkit-scrollbar { display: none; }
	.hm-primary-link { flex: 0 0 auto; min-height: 42px; scroll-snap-align: start; }
	.hm-header-search { top: var(--hm-header-height); }
}

@media (max-width: 480px) {
	.hm-primary-nav { gap: 20px; }
	.hm-primary-link { font-size: 11.5px; }
	.hm-social-links { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-primary-link::after { transition-duration: .01ms !important; }
}

.hm-v3-archive-tabs a {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	min-height: 48px;
	padding: .62rem .85rem;
}
.hm-v3-tab-icon {
	display: grid;
	width: 23px;
	height: 23px;
	flex: 0 0 23px;
	place-items: center;
	color: #d3592b;
}
.hm-v3-tab-icon svg {
	width: 100%;
	height: 100%;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.55;
}
.hm-v3-archive-tabs a.is-active .hm-v3-tab-icon,
.hm-v3-archive-tabs a:hover .hm-v3-tab-icon,
.hm-v3-archive-tabs a:focus-visible .hm-v3-tab-icon { color: currentColor; }

@media (max-width: 767px) {
	/* Las pestañas se sangran hasta los bordes para poder desplazarse de lado
	 * a lado, pero el canal lateral tiene que ser el mismo de .hm-shell para
	 * que "Todas" quede alineada con las migas y el título de arriba.
	 *
	 * Dos cosas lo rompían. La primera, el sangrado con calc(50% - 50vw): vw
	 * incluye el ancho de la barra de desplazamiento y el 50% del padre no,
	 * así que en cualquier navegador con barra clásica se pasaba de largo
	 * (7,5px medidos con una barra de 15px). Restar el canal directamente no
	 * depende de vw y da el mismo sangrado en ambos casos. La segunda,
	 * scroll-padding: con scroll-snap-align:start el navegador ancla la
	 * primera pestaña al borde del scrollport —por dentro del padding— y
	 * arrancaba con scrollLeft igual al padding, comiéndose el canal entero. */
	.hm-v3-archive-tabs {
		/* Canal de .hm-shell: 24px por omisión (width: 100% - 48px) y 14px a
		 * partir de max-width:600px, donde pasa a 100% - 28px. El margen
		 * negativo y el padding se cancelan, así que la alineación de la
		 * primera pestaña sale exacta con cualquier valor; el que importe sea
		 * el real es para que el desplazamiento llegue justo hasta el borde. */
		--hm-tabs-gutter: 24px;
		margin-inline: calc(var(--hm-tabs-gutter) * -1);
		padding-inline: var(--hm-tabs-gutter);
		scroll-padding-inline: var(--hm-tabs-gutter);
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}
	.hm-v3-archive-tabs::-webkit-scrollbar { display: none; }
	.hm-v3-archive-tabs a { scroll-snap-align: start; }
}

/* Portada editorial unificada: diez publicaciones recientes. */
.hm-pdf-home { color: var(--hm-brand-ink); background: #fff; }
.hm-latest { padding: clamp(44px, 6vw, 88px) 0 clamp(56px, 7vw, 104px); }
.hm-latest-head {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr);
	align-items: end;
	gap: 32px;
	margin-bottom: 28px;
	padding-bottom: 22px;
	border-bottom: 1px solid #d9d1c8;
}
.hm-editorial-label {
	display: inline-block;
	margin-bottom: 8px;
	color: #d3592b;
	font: 700 .74rem/1.2 var(--hm-font-mono, "Roboto Mono", monospace);
	letter-spacing: .04em;
}
.hm-latest-head h1 {
	margin: 0;
	color: var(--hm-brand-ink);
	font: 700 clamp(3rem, 6vw, 6.5rem)/.9 var(--hm-font-display, "Roboto", sans-serif);
	letter-spacing: -.065em;
}
.hm-latest-head > p { max-width: 42ch; margin: 0; color: #655e59; font-size: 1rem; line-height: 1.55; }
.hm-latest-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr); gap: 16px; }
.hm-latest-medium { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.hm-latest-compact { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.hm-latest-story { min-width: 0; overflow: hidden; border: 1px solid #d9d1c8; border-radius: 4px; background: #fff; }
.hm-latest-story > .hm-card-body { display: flex; height: 100%; flex-direction: column; color: inherit; text-decoration: none; }
.hm-latest-media { overflow: hidden; background: #eee9e2; }
.hm-latest-media img,
.hm-latest-media .hm-v3-placeholder { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.22,1,.36,1); }
.hm-latest-story:hover .hm-latest-media img,
.hm-latest-story:focus-within .hm-latest-media img { transform: scale(1.025); }
.hm-latest-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; padding: 18px; }
.hm-latest-copy h2,
.hm-latest-copy h3 { margin: 10px 0 0; overflow-wrap: normal; word-break: normal; hyphens: none; text-wrap: balance; }
.hm-latest-copy h2 { font: 700 clamp(2rem, 3.25vw, 4.4rem)/.96 var(--hm-font-display, "Roboto", sans-serif); letter-spacing: -.045em; }
.hm-latest-copy h3 { font: 700 clamp(1.1rem, 1.45vw, 1.55rem)/1.02 var(--hm-font-display, "Roboto", sans-serif); letter-spacing: -.025em; }
.hm-latest-copy p { margin: 15px 0 18px; color: #625b56; font-size: .9rem; line-height: 1.5; }
.hm-latest-copy time { margin-top: auto; padding-top: 20px; color: #6d6660; font: 500 .7rem/1.2 var(--hm-font-mono, "Roboto Mono", monospace); }
.hm-editorial-taxonomy { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-family: var(--hm-font-mono, "Roboto Mono", monospace); }
.hm-editorial-category { color: #337f91; font-size: .74rem; font-weight: 700; }
.hm-editorial-tag { padding: 4px 7px; color: #6f2c3f; background: #f5e8e4; border-radius: 3px; font-size: .78rem; font-weight: 750; line-height: 1.2; }

/* Variante para Desaparición, Justicia, Memorias, Reparación y Derechos
 * Humanos: resalta la categoría en vez de la etiqueta secundaria, ya que
 * ahí la categoría es el dato editorial más relevante. */
.hm-editorial-taxonomy.is-category-highlight .hm-editorial-category { padding: 4px 7px; color: #6f2c3f; background: #f5e8e4; border-radius: 3px; font-size: .78rem; font-weight: 750; line-height: 1.2; }
.hm-editorial-taxonomy.is-category-highlight .hm-editorial-tag { padding: 0; color: #337f91; background: none; font-size: .74rem; font-weight: 700; }
.hm-latest-story.is-lead { background: #faf8f4; }
.hm-latest-story.is-lead .hm-latest-media { aspect-ratio: 16 / 9; }
.hm-latest-story.is-medium .hm-latest-media { aspect-ratio: 4 / 3; }
.hm-latest-story.is-compact .hm-latest-media { aspect-ratio: 4 / 3; }
.hm-latest-story.is-compact .hm-latest-copy { padding: 14px; }
.hm-latest-story.is-compact .hm-latest-copy h3 { font-size: clamp(1rem, 1.15vw, 1.25rem); }

.hm-home-v3 aside.hm-ad-banner { padding: 16px 0; background: #f3eee7; }
/* En el teléfono el banner ocupa cerca de un cuarto de la pantalla: el aire
   baja a la mitad, lo justo para que siga separado del encabezado y de
   Actualidad sin comerse tanto del primer golpe de vista. El resto del alto
   lo decide la proporción del arte móvil, no este relleno. */
@media (max-width: 767px) {
	.hm-home-v3 aside.hm-ad-banner { padding: 8px 0; }
}
.hm-ad-banner-link { display: block; }
/* object-fit:cover con un max-height fijo recortaba el banner (imagen fuente
   1200x150) y además la escalaba de más al forzar el ancho completo del shell
   (hasta 1520px) — de ahí el efecto borroso y "cortado". height:auto respeta
   la proporción real de la imagen sin recortar ni sobre-escalar. */
.hm-ad-banner img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; border-radius: 4px; }

.hm-pdf-promo { padding: clamp(18px, 3vw, 36px) 0 clamp(36px, 5vw, 70px); background: #f3eee7; }
.hm-pdf-promo > .hm-shell { display: grid; min-height: 220px; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); overflow: hidden; border-radius: 4px; background: #6f2c3f; }
.hm-pdf-promo-media { min-height: 220px; aspect-ratio: 21 / 9; overflow: hidden; }
.hm-pdf-promo-media img,
.hm-pdf-promo-media .hm-v3-placeholder { width: 100%; height: 100%; object-fit: cover; }
.hm-pdf-promo-copy { display: flex; flex-direction: column; justify-content: center; padding: 28px 34px; color: #fff; }
.hm-pdf-promo-copy > span { color: #fff; font: 700 .72rem/1.2 var(--hm-font-mono); }
.hm-pdf-promo-copy strong { margin-top: 8px; color: #fff; font: 700 clamp(1.45rem, 2vw, 2.2rem)/1 var(--hm-font-display); }
.hm-pdf-promo-copy p { margin: 12px 0; color: #fff; line-height: 1.45; }
.hm-pdf-promo-copy a { width: fit-content; margin-top: 8px; padding: 10px 14px; color: #fff; border: 1px solid #fff; border-radius: 4px; text-decoration: none; }

.hm-instagram-preview { padding: clamp(2.5rem, 4.5vw, 4.5rem) 0; background: #fff; }

/* Los dos bloques de la sección (video destacado y lista) van en la misma
   fila en escritorio, y la fila mide lo que mide el video destacado.
   Grid, no flex: la lista se posiciona en absoluto dentro de su columna
   para no aportar altura (crece con cada video que se agregue), así el
   alto de la fila lo fija solo el póster 16/9 + su titular, y la lista
   scrollea por dentro hasta ese mismo alto. */
.hm-social-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: stretch; gap: clamp(2rem, 4vw, 3rem); margin-top: clamp(2rem, 4vw, 3rem); }
.hm-social-row .hm-social-block { margin-top: 0; min-width: 0; }
.hm-social-block--youtube { position: relative; }
.hm-social-block--youtube .hm-youtube-list { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; }

/* Video destacado: ocupa el ancho que antes tenían las dos tarjetas de
   Instagram. Es un póster con botón de play, no un iframe: el embed pesa
   varios cientos de kB en cada carga del home y el video se abre igual en
   el modal (ver assets/js/video-modal.js). */
.hm-youtube-feature { display: block; overflow: hidden; border: 1px solid #d9d1c8; border-radius: 4px; background: #fff; text-decoration: none; }
.hm-youtube-feature-thumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #ddd7cf; }
.hm-youtube-feature-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* isolation + z-index negativo: la pastilla es un ::before, que se pinta
   encima del texto del propio elemento — sin esto el ▶ blanco desaparece
   bajo el rojo al pasar el mouse. Aislar el contexto la manda detrás del
   glifo sin taparse con la miniatura, que queda fuera de ese contexto. */
.hm-youtube-feature-play { position: absolute; inset: 0; display: grid; place-items: center; isolation: isolate; color: #fff; font-size: 1.5rem; }
.hm-youtube-feature-play::before { content: ""; position: absolute; z-index: -1; width: 68px; height: 48px; border-radius: 10px; background: rgba(20, 17, 15, .72); transition: background-color .2s ease; }
.hm-youtube-feature:hover .hm-youtube-feature-play::before,
.hm-youtube-feature:focus-visible .hm-youtube-feature-play::before { background: #d3592b; }
.hm-youtube-feature-copy { display: block; padding: 16px 18px; }
.hm-youtube-feature-title { display: block; color: var(--hm-v3-ink, #211d1b); font: 650 1.15rem/1.25 var(--hm-font-display); letter-spacing: -.01em; }
.hm-youtube-feature-channel { display: block; margin-top: 5px; color: var(--hm-v3-muted, #6f6963); font-size: .8rem; }

/* Lista tipo "playlist" de YouTube: miniatura pequeña + número (o el ícono
   de play para la primera fila) + título/canal, igual al panel de
   "siguientes" que muestra YouTube junto a un video — pero en el tema claro
   del resto del sitio, no en negro, para no introducir un color ajeno a la
   paleta editorial. */
.hm-youtube-list { max-width: none; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid #d9d1c8; border-radius: 4px; scrollbar-width: thin; }
.hm-youtube-list li + li { border-top: 1px solid #ede7de; }
.hm-youtube-list a { display: flex; align-items: center; gap: 10px; padding: 10px 8px; text-decoration: none; border-radius: 3px; transition: background-color .2s ease; }
.hm-youtube-list a:hover,
.hm-youtube-list a:focus-visible { background: #f4f1eb; }
.hm-youtube-list-thumb { position: relative; flex: 0 0 112px; overflow: hidden; aspect-ratio: 16 / 9; border-radius: 3px; background: #ddd7cf; }
.hm-youtube-list-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hm-youtube-list-copy { min-width: 0; }
.hm-youtube-list-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--hm-v3-ink, #211d1b); font-size: .85rem; font-weight: 650; line-height: 1.3; }
.hm-youtube-list-channel { display: block; margin-top: 3px; color: var(--hm-v3-muted, #6f6963); font-size: .76rem; }

/* Modal de video: reutiliza <dialog> nativo (foco atrapado, cierre con Esc
   y backdrop ya vienen del navegador) en vez de reconstruir esa lógica a
   mano. Clic en un video de la lista abre esto en vez de salir a YouTube;
   ver assets/js/video-modal.js. */
.hm-video-modal { position: fixed; width: min(92vw, 960px); max-width: none; margin: auto; padding: 0; overflow: visible; border: 0; border-radius: 6px; background: transparent; }
.hm-video-modal::backdrop { background: rgba(20, 17, 15, .82); }
.hm-video-modal-embed { aspect-ratio: 16 / 9; background: #000; border-radius: 6px; overflow: hidden; }
.hm-video-modal-embed iframe { display: block; width: 100%; height: 100%; border: 0; }
.hm-video-modal-close { position: absolute; top: -44px; right: 0; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; color: #fff; font-size: 1.1rem; background: rgba(255,255,255,.14); cursor: pointer; transition: background-color .2s ease; }
.hm-video-modal-close:hover,
.hm-video-modal-close:focus-visible { background: rgba(255,255,255,.28); }

@media (max-width: 1100px) {
	.hm-latest-layout { grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr); }
	.hm-latest-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
	/* Apilados ya no hay nada que igualar: la lista vuelve al flujo normal
	   y se muestra completa, sin scroll dentro de un alto ajeno. */
	.hm-social-row { grid-template-columns: 1fr; }
	.hm-social-block--youtube { position: static; }
	.hm-social-block--youtube .hm-youtube-list { position: static; overflow: visible; }
	.hm-latest-head { grid-template-columns: 1fr; }
	.hm-latest-layout { grid-template-columns: 1fr; }
	.hm-latest-medium { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-latest-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-pdf-promo > .hm-shell { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
	.hm-latest { padding-top: 34px; }
	.hm-latest-head h1 { font-size: clamp(2.8rem, 16vw, 4.2rem); }
	.hm-latest-medium,
	.hm-latest-compact {
		display: flex;
		gap: 12px;
		overflow-x: auto;
		padding: 0 16px 12px;
		margin-inline: -16px;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
	}
	.hm-latest-medium { margin-top: 12px; }
	.hm-latest-medium .hm-latest-story,
	.hm-latest-compact .hm-latest-story { flex: 0 0 min(82vw, 310px); scroll-snap-align: start; }
	.hm-latest-story.is-lead .hm-latest-copy h2 { font-size: clamp(1.4rem, 5vw, 1.7rem); line-height: 1.15; }
	.hm-pdf-promo > .hm-shell { grid-template-columns: 1fr; }
	.hm-pdf-promo-media { min-height: 190px; aspect-ratio: 16 / 9; }
	.hm-pdf-promo-copy { padding: 25px 22px; }
	.hm-youtube-list-thumb { flex-basis: 92px; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-latest-media img { transition-duration: .01ms !important; }
	.hm-latest-story:hover .hm-latest-media img,
	.hm-latest-story:focus-within .hm-latest-media img { transform: none; }
}
.home .hm-text-link,
.home .hm-news-action { color: var(--hm-brand-burgundy) !important; border-color: var(--hm-brand-turquoise); }
.home .hm-news { color: var(--hm-brand-ink); background: #f4f0ea !important; }
.home .hm-news-card { border-color: rgba(33,29,27,.17); box-shadow: 0 15px 38px rgba(57,37,31,.09); }
.home .hm-news-card-link { color: var(--hm-brand-ink) !important; }
.home .hm-archive-status { color: var(--hm-brand-ink); border-color: rgba(33,29,27,.18); }
.home .hm-archive-jump-panel { color: #fff; background: var(--hm-brand-burgundy); border-radius: 4px; }
.home .hm-archive-jump-panel h3,
.home .hm-archive-jump-panel strong { color: #fff !important; }
.home .hm-stats { color: var(--hm-brand-ink); background: #dceeea !important; }
.home .hm-stats h2,
.home .hm-stats h3,
.home .hm-stats strong { color: var(--hm-brand-burgundy) !important; }
.home .hm-stat { border-color: rgba(36,95,91,.28); }
.home .hm-section-card { color: var(--hm-brand-ink) !important; border-color: rgba(33,29,27,.2); background: #fff; border-radius: 4px; }
.home .hm-section-card:hover { color: #fff !important; background: var(--hm-brand-burgundy); border-color: var(--hm-brand-burgundy); }
.home .hm-section-card:hover h3 { color: #fff !important; }
.home .hm-manifesto { color: #fff; background: var(--hm-brand-burgundy) !important; }
.home .hm-manifesto h2,
.home .hm-manifesto p { color: #fff !important; }
.home .hm-button { color: var(--hm-brand-burgundy) !important; background: #fff; border-radius: 4px; }
.home .hm-button-secondary { color: #fff !important; background: transparent; border-color: rgba(255,255,255,.55); }
.home .site-footer { color: #fff; background: #542132 !important; }.hm-header-brand,
.hm-header-tools a { color: var(--hm-brand-ink) !important; }

.home .hm-masthead-title {
	color: var(--hm-brand-burgundy);
}
.home .hm-hero-excerpt,
.home .hm-section-heading p,
.home .hm-archive-callout p {
	color: #514b47;
}
.home .hm-hero-kicker span,
.home .hm-eyebrow,
.home .hm-category-label,
.home .hm-news-category {
	color: #245f5b;
}
.home .hm-search input {
	color: #292522 !important;
}
.home .hm-search input::placeholder {
	color: #6a625d;
	opacity: 1;
}
.home .hm-news-copy time {
	color: var(--hm-brand-burgundy);
}
.home .hm-news-copy h3 {
	color: #3f3a36 !important;
}
.home .hm-news-copy p {
	color: #514b47;
}

/* Las áreas de marca invierten su tipografía de forma explícita:
   ninguna etiqueta oscura puede heredarse sobre borgoña o turquesa. */
.home .hm-stats,
.home .hm-stats .hm-section-heading p,
.home .hm-stats .hm-eyebrow,
.home .hm-stats .hm-stat span {
	color: var(--hm-brand-ink);
}
.home .hm-stats .hm-eyebrow,
.home .hm-stats .hm-stat span {
	color: #245f5b;
	opacity: 1;
}
.home .hm-stats-grid,
.home .hm-stat {
	border-color: rgba(36, 95, 91, .28);
}

.home .skip-link:focus {
	color: #fff !important;
	background: var(--hm-brand-burgundy) !important;
}

.home .hm-promo-copy strong {
	color: #fff;
}
.home .hm-promo-copy span {
	color: #ffd7c6;
}
.home .hm-promo-action {
	color: #fff !important;
}
.home .hm-promo-action:hover,
.home .hm-promo-action:focus-visible {
	color: var(--hm-brand-burgundy) !important;
}

.home .hm-manifesto .hm-eyebrow,
.home .hm-manifesto-lead {
	color: #fff !important;
}
.home .hm-manifesto .hm-eyebrow {
	opacity: .9;
}

.home .hm-archive-jump-panel,
.home .hm-archive-jump-panel .hm-eyebrow,
.home .hm-archive-jump-panel label,
.home .hm-archive-jump-panel small,
.home .hm-archive-jump-panel span {
	color: #fff;
}

/* ======================================================================
   Páginas internas — sistema claro de marca
   El diseño nocturno anterior se reemplaza por papel blanco en páginas,
   artículos, búsquedas y archivos. Las superficies oscuras quedan
   reservadas al footer y a acentos deliberados.
   ====================================================================== */
body:not(.home),
body:not(.home) .site.wp-site-blocks,
body:not(.home) .site-main,
body:not(.home) #primary,
body:not(.home) .content-area {
	color: var(--hm-brand-ink);
	background: #fff !important;
}

body:not(.home) :is(h1, h2, h3, h4, h5, h6, .entry-title, .wp-block-post-title) {
	color: var(--hm-brand-ink) !important;
}

body:not(.home) .entry-hero,
body:not(.home) .entry-hero-container-inner {
	color: var(--hm-brand-ink);
	background: #f5f1ec !important;
	border-color: rgba(33, 29, 27, .16);
}

/* Portadas editoriales de categoría */
body.category { --hm-category-accent: var(--hm-brand-burgundy); }
body:is(.category-podcast, .category-desaparicion, .category-investigacion) { --hm-category-accent: #327f7a; }
body:is(.category-el-posacuerdo, .category-paz, .category-reparacion) { --hm-category-accent: var(--hm-brand-terra); }
body:is(.category-las-memorias, .category-opinion, .category-resenas, .category-libros-y-mas) { --hm-category-accent: var(--hm-brand-burgundy); }

body.category .entry-hero {
	position: relative;
	min-height: clamp(390px, 42vw, 570px);
	overflow: hidden;
	border-block: 1px solid rgba(33, 29, 27, .16);
	background: #f7f3ed !important;
}
body.category .entry-hero-container-inner { min-height: inherit; background: transparent !important; }
body.category .entry-hero .hero-section-overlay { display: none; }
body.category .entry-hero .hero-container {
	position: relative;
	z-index: 1;
	display: flex;
	min-height: inherit;
	align-items: stretch;
	padding-block: 0;
}
body.category .entry-hero .post-archive-title {
	position: relative;
	display: grid;
	width: 100%;
	min-height: inherit;
	grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
	grid-template-rows: 1fr auto;
	align-items: center;
	gap: 0 clamp(36px, 5vw, 82px);
	padding: clamp(68px, 8vw, 112px) 0 clamp(42px, 5vw, 70px);
	text-align: left;
}
body.category .entry-hero .post-archive-title::before {
	content: "Hacemos Memoria  /  Archivo editorial";
	position: absolute;
	top: clamp(30px, 4vw, 52px);
	left: 0;
	color: var(--hm-category-accent);
	font: 600 10px/1.2 var(--hm-font-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
}
body.category .entry-hero .archive-title {
	position: relative;
	z-index: 2;
	max-width: 760px;
	margin: 0;
	color: var(--hm-brand-ink) !important;
	font: 650 clamp(4.6rem, 8vw, 8.8rem)/.82 var(--hm-font-display) !important;
	letter-spacing: -.055em;
	text-wrap: balance;
}
body.category .entry-hero .archive-title::after {
	content: "";
	display: block;
	width: clamp(76px, 9vw, 138px);
	height: 4px;
	margin-top: clamp(28px, 4vw, 52px);
	background: var(--hm-category-accent);
}
.hm-category-banner-copy {
	position: relative;
	z-index: 2;
	grid-column: 1;
	grid-row: 2;
	max-width: 620px;
	padding-top: 24px;
}
.hm-category-banner-kicker {
	margin: 0 0 12px;
	color: var(--hm-category-accent);
	font: 600 10px/1.3 var(--hm-font-mono);
	letter-spacing: .11em;
	text-transform: uppercase;
}
.hm-category-banner-description {
	max-width: 54ch;
	margin: 0;
	color: #514b47;
	font: 450 clamp(1rem, 1.25vw, 1.18rem)/1.55 var(--hm-font-body);
}
.hm-category-banner-visual {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	background: #eee7dc url("assets/images/category-archive-texture.png") center / cover no-repeat;
	transform: scale(1.01);
	transition: transform 1.2s cubic-bezier(.22, 1, .36, 1);
}
.hm-category-banner-visual::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(247, 243, 237, .16);
	pointer-events: none;
}
.hm-category-banner-visual::after {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	z-index: 2;
	width: min(58%, 920px);
	background: rgba(247, 243, 237, .72);
	border-right: 1px solid rgba(33, 29, 27, .08);
	pointer-events: none;
}
body.category .entry-hero:hover .hm-category-banner-visual { transform: scale(1.025); }

body.category-el-conflicto .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-el-conflicto.webp"); }
body.category-el-posacuerdo .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-el-posacuerdo.webp"); }
body.category-el-proyecto .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-el-proyecto.webp"); }
body.category-la-red .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-la-red.webp"); }
body.category-las-memorias .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-las-memorias.webp"); }
body.category-libros-y-mas .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-libros-y-mas.webp"); }
body.category-noticias-de-la-memoria .hm-category-banner-visual,
body.category-destacado .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-noticias-de-la-memoria.webp"); }
body.category-opinion .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-opinion.webp"); }
body.category-podcast .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-podcast.webp"); }
body.category-resenas .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-resenas.webp"); }
body.category-testimonios .hm-category-banner-visual,
body.category-carmen .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-testimonios.webp"); }
body.category-voces .hm-category-banner-visual { background-image: url("assets/images/category-banners/category-voces.webp"); }
@media (max-width: 900px) {
	body.category .entry-hero { min-height: 620px; }
	body.category .entry-hero .post-archive-title {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		align-content: start;
		gap: 0;
		padding: 78px 0 0;
	}
	body.category .entry-hero .archive-title { font-size: clamp(4rem, 13vw, 7rem) !important; }
	.hm-category-banner-copy { grid-row: 2; padding: 22px 0 30px; }
	.hm-category-banner-visual {
		position: absolute;
		inset: 0;
		width: auto;
		height: auto;
		margin: 0;
		background-position: 66% center;
	}
	.hm-category-banner-visual::before { background: rgba(247, 243, 237, .24); }
	.hm-category-banner-visual::after {
		width: 100%;
		background: rgba(247, 243, 237, .42);
		border: 0;
	}
}
@media (max-width: 520px) {
	body.category .entry-hero { min-height: 560px; }
	body.category .entry-hero .post-archive-title { grid-template-rows: auto auto; padding-top: 70px; }
	body.category .entry-hero .post-archive-title::before { top: 28px; }
	body.category .entry-hero .archive-title { font-size: clamp(3.4rem, 17vw, 5.3rem) !important; line-height: .86 !important; }
	.hm-category-banner-description { font-size: .96rem; }
	.hm-category-banner-visual { height: auto; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-category-banner-visual,
	body.category .entry-hero:hover .hm-category-banner-visual {
		transform: none;
		transition: none;
	}
}

/* Portada editorial de las páginas internas de un área (Formación,
 * Investigación, Nosotros…). Mismo lenguaje que .hm-v3-archive-intro y
 * .hm-editorial-landing-hero: degradado teñido con el color del área, miga
 * de pan corta y título grande con el efecto de máquina de escribir. El
 * acento se declara por tono para que cada área traiga el suyo, incluido el
 * cursor del efecto, que por omisión usa el dorado global de --hm-flame. */
.hm-area-hero {
	--hm-area-accent: #337f91;
	--hm-flame: var(--hm-area-accent);
	padding: clamp(3rem, 7vw, 7rem) 0 clamp(2.6rem, 4vw, 3.6rem);
	background: linear-gradient(115deg, color-mix(in srgb, var(--hm-area-accent) 10%, white), #fff 64%);
	border-bottom: 1px solid #d8d1c8;
	color: var(--hm-brand-ink);
}

.hm-area-hero.is-actualidad { --hm-area-accent: var(--hm-color-actualidad); }
.hm-area-hero.is-especiales { --hm-area-accent: var(--hm-color-especiales); }
.hm-area-hero.is-academia   { --hm-area-accent: var(--hm-color-academia); }
.hm-area-hero.is-nosotros   { --hm-area-accent: var(--hm-color-nosotros); }

.hm-area-hero > .hm-shell {
	width: min(1240px, calc(100% - 48px));
}

/* Sin versalitas: va como se escribe, con mayúscula solo en la inicial. */
.hm-area-breadcrumb {
	display: flex;
	gap: .55rem;
	margin-bottom: 2.8rem;
	color: var(--hm-area-accent);
	font-family: var(--hm-font-mono);
	font-size: .78rem;
	letter-spacing: .01em;
}

.hm-area-breadcrumb a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}


/* Sin font-size ni line-height propios a propósito: la escala de todos los
 * h1 la fija la regla global de más arriba en este archivo ("h1, .entry-title",
 * con !important para ganarle al global-styles-inline-css de WordPress). Así
 * este título mide exactamente lo mismo que el de Actualidad, Especiales y
 * Academia. Declararlos acá sería CSS muerto: el !important los pisa. */
.hm-area-hero h1 {
	max-width: 16ch;
	margin: .5rem 0 1.2rem;
	color: var(--hm-brand-ink);
	font-family: var(--hm-font-display);
	letter-spacing: -.055em;
	text-wrap: balance;
}

.hm-area-hero > .hm-shell > p {
	max-width: 58ch;
	margin: 0;
	color: #6f6963;
	font-size: clamp(1.05rem, 1.5vw, 1.35rem);
	line-height: 1.55;
}

@media (max-width: 600px) {
	.hm-area-hero > .hm-shell {
		width: min(1240px, calc(100% - 28px));
	}

	.hm-area-breadcrumb {
		margin-bottom: 2rem;
	}
}

.hm-knowledge-content { background: #fff !important; }
.hm-knowledge-archive {
	padding-block: clamp(72px, 8vw, 118px);
}
.hm-knowledge-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
	gap: clamp(22px, 2.4vw, 36px);
}
.hm-knowledge-card {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr;
	min-height: 0;
	overflow: hidden;
	border: 1px solid rgba(33, 29, 27, .16);
	border-radius: 4px;
	background: #fff !important;
	box-shadow: 0 10px 30px rgba(57, 37, 31, .04) !important;
	transition: transform .45s cubic-bezier(.22, 1, .36, 1), box-shadow .45s ease, border-color .3s ease;
}
.hm-knowledge-card::after {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	z-index: 2;
	height: 3px;
	background: linear-gradient(90deg, var(--hm-brand-terra), var(--hm-brand-turquoise));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .4s cubic-bezier(.22, 1, .36, 1);
}
.hm-knowledge-card:hover,
.hm-knowledge-card:focus-within {
	border-color: rgba(111, 44, 63, .34);
	box-shadow: 0 24px 55px rgba(57, 37, 31, .12) !important;
	transform: translateY(-7px);
}
.hm-knowledge-card:hover::after,
.hm-knowledge-card:focus-within::after { transform: scaleX(1); }
.hm-knowledge-card .post-thumbnail {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #f3efe9;
}
.hm-knowledge-card .post-thumbnail-inner { height: 100%; }
.hm-knowledge-card .post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.22, 1, .36, 1), filter .45s ease;
}
.hm-knowledge-card:hover .post-thumbnail img,
.hm-knowledge-card:focus-within .post-thumbnail img {
	filter: saturate(1.05) contrast(1.02);
	transform: scale(1.045);
}
.hm-knowledge-card .entry-content-wrap {
	display: flex;
	min-height: 270px;
	flex-direction: column;
	padding: clamp(20px, 2.2vw, 28px);
}
/* text-transform: none explícito: quitar la declaración no alcanza, porque
 * Kadence pone .entry-taxonomies { text-transform: uppercase } en su
 * content.min.css y sin nada que la contradiga vuelve a ganar. */
.hm-knowledge-card .entry-taxonomies {
	margin-bottom: 10px;
	color: #245f5b;
	font: 600 12px/1.2 var(--hm-font-mono);
	letter-spacing: .02em;
	text-transform: none;
}
/* Mismo titular que las tarjetas de los resultados de búsqueda
 * (.hm-v3-archive-list.is-search-results .hm-v3-card h3): un solo tamaño para
 * todas, sin escala por longitud. El !important es el que ya traía la regla,
 * para ganarle a la escala de h3 del tema padre. */
.hm-knowledge-card .entry-title {
	margin: 0;
	font: 650 clamp(.9rem, 1.25vw, 1.08rem)/1.15 var(--hm-font-display) !important;
}
.hm-knowledge-card .entry-title a {
	display: -webkit-box;
	overflow: hidden;
	color: var(--hm-brand-ink) !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}
.hm-knowledge-card .entry-title a:hover,
.hm-knowledge-card .entry-title a:focus-visible { color: var(--hm-brand-burgundy) !important; }
.hm-knowledge-card .entry-summary { margin-top: 18px; }
.hm-knowledge-card .entry-summary p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: #514b47 !important;
	font-size: .93rem;
	line-height: 1.55;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}
.hm-knowledge-card .entry-footer {
	margin-top: auto;
	padding-top: 22px;
}
/* text-transform: none para deshacer el uppercase que Kadence le pone a
 * a.post-more-link en su content.min.css. */
.hm-knowledge-card .post-more-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--hm-brand-burgundy) !important;
	font: 600 12px/1.2 var(--hm-font-body);
	text-transform: none;
}
.hm-knowledge-card .post-more-link span { transition: transform .3s ease; }
.hm-knowledge-card .post-more-link:hover span,
.hm-knowledge-card .post-more-link:focus-visible span { transform: translateX(5px); }

/* Ficha completa (Formación e Investigación): la tarjeta deja de ser un resumen
 * recortado. Sin franja 16/9 la portada se ve entera —varias son afiches, no
 * fotos, y el recorte les comía el texto—, y el titular y la descripción crecen
 * a su alto real. La retícula ya lleva align-items: start, así que las tarjetas
 * quedan de distinto alto sin estirarse ni romper las tres columnas. */

/* padding-bottom: 0 y el inner fuera de position: absolute deshacen el marco de
 * proporción fija que Kadence arma con .kadence-thumbnail-ratio-2-3; si se deja,
 * el alto del marco manda y la imagen vuelve a quedar recortada por abajo. */
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .post-thumbnail {
	height: auto;
	padding-bottom: 0;
	aspect-ratio: auto;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .post-thumbnail-inner {
	position: static;
	height: auto;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .post-thumbnail img {
	display: block;
	height: auto;
	object-fit: contain;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .entry-content-wrap {
	min-height: 0;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .entry-title a {
	display: block;
	overflow: visible;
	-webkit-line-clamp: none;
}
/* Sin la etiqueta arriba, el aire heredado entre titular y texto quedaba mayor
 * que el que separa la portada del titular y desarmaba la jerarquía. */
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .entry-summary {
	margin-top: 12px;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .entry-summary p {
	display: block;
	overflow: visible;
	-webkit-line-clamp: none;
}
.hm-knowledge-grid.is-ficha-completa .hm-knowledge-card .entry-summary p + p {
	margin-top: .9em;
}

@media (max-width: 900px) {
	.hm-knowledge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
	.hm-knowledge-grid { grid-template-columns: 1fr; }
	.hm-knowledge-card .entry-content-wrap { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-knowledge-card,
	.hm-knowledge-card::after,
	.hm-knowledge-card .post-thumbnail img {
		transform: none;
		transition: none;
	}
}

body:not(.home) .entry.content-bg,
body:not(.home) .single-entry.content-bg {
	color: var(--hm-brand-ink) !important;
	background: #fff !important;
}

body:not(.home) :is(.loop-entry.content-bg, .wp-block-post) {
	color: var(--hm-brand-ink) !important;
	background: #fff !important;
	border-color: rgba(33, 29, 27, .16);
}

.single .entry-content,
.page:not(.home) .entry-content {
	color: #514b47;
}
.single .entry-content :where(p, li, dd, dt),
.page:not(.home) .entry-content :where(p, li, dd, dt),
body:not(.home) .wp-block-post-excerpt {
	color: #514b47 !important;
}
.single .entry-content :where(strong, b, h2, h3, h4, h5, h6),
.page:not(.home) .entry-content :where(strong, b, h2, h3, h4, h5, h6) {
	color: var(--hm-brand-ink) !important;
}
.single .entry-content a,
.page:not(.home) .entry-content a,
body:not(.home) .wp-block-post-title a,
body:not(.home) .wp-block-query a {
	color: var(--hm-brand-burgundy) !important;
	text-decoration-color: rgba(111, 44, 63, .38);
}
.single .entry-content a:hover,
.single .entry-content a:focus-visible,
.page:not(.home) .entry-content a:hover,
.page:not(.home) .entry-content a:focus-visible,
body:not(.home) .wp-block-query a:hover,
body:not(.home) .wp-block-query a:focus-visible {
	color: #9e3f1d !important;
}

.single .entry-header .entry-meta,
.single .entry-header .entry-meta span,
.single .entry-header .entry-meta time,
.single .entry-header .entry-meta a,
body:not(.home) .wp-block-post-date,
body:not(.home) .wp-block-post-terms {
	color: #245f5b !important;
}

.single .entry-content blockquote,
.page:not(.home) .entry-content blockquote {
	color: var(--hm-brand-ink) !important;
	background: #dceeea;
	border-color: var(--hm-brand-terra);
}
.single .entry-content figcaption,
.page:not(.home) .entry-content figcaption,
.single .wp-caption-text,
.page:not(.home) .wp-caption-text {
	color: #625a55 !important;
}
.single .entry-content table,
.page:not(.home) .entry-content table {
	color: var(--hm-brand-ink);
	background: #fff;
	border-color: rgba(33, 29, 27, .22);
}
.single .entry-content th,
.page:not(.home) .entry-content th {
	color: #fff !important;
	background: var(--hm-brand-burgundy);
}
.single .entry-content td,
.page:not(.home) .entry-content td {
	color: #514b47 !important;
	border-color: rgba(33, 29, 27, .18);
}

/* Archivo editorial */
.hm-archive-page,
.hm-archive-hero,
.hm-archive-results {
	color: var(--hm-brand-ink);
	background: #fff !important;
}
.hm-archive-hero {
	background: #f5f1ec !important;
	border-color: rgba(33, 29, 27, .16);
}
.hm-archive-hero h1,
.hm-archive-toolbar h2,
.hm-archive-card h3 {
	color: var(--hm-brand-ink) !important;
}
.hm-archive-intro p,
.hm-archive-card p {
	color: #514b47;
}
.hm-archive-toolbar,
.hm-archive-card,
.hm-archive-pagination {
	border-color: rgba(33, 29, 27, .18);
}
.hm-archive-card > a {
	color: var(--hm-brand-ink) !important;
}
.hm-archive-card-meta {
	color: #245f5b;
}
.hm-pagination-arrow,
.hm-pagination-pages a {
	color: var(--hm-brand-burgundy) !important;
	border-color: rgba(111, 44, 63, .28);
}
.hm-pagination-pages a:hover,
.hm-pagination-pages a:focus-visible,
.hm-pagination-pages a.is-current {
	color: #fff !important;
	background: var(--hm-brand-burgundy);
	border-color: var(--hm-brand-burgundy);
}

body:not(.home) .site-footer,
body:not(.home) .site-footer :is(h1, h2, h3, h4, p, li, span, strong) {
	color: #fff !important;
}
body:not(.home) .site-footer {
	background: #542132 !important;
}

/* Tarjetas editoriales compactas para categorías, archivos y búsqueda */
body:is(.archive, .search) .kadence-posts-list {
	align-items: start;
	gap: clamp(22px, 2.4vw, 36px);
}

body:is(.archive, .search) .loop-entry {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr;
	min-height: 0;
	overflow: hidden;
	border: 1px solid rgba(33, 29, 27, .16);
	border-radius: 4px;
	background: #fff !important;
	box-shadow: 0 10px 30px rgba(57, 37, 31, .04) !important;
	transition:
		transform .45s cubic-bezier(.22, 1, .36, 1),
		box-shadow .45s ease,
		border-color .3s ease;
}

body:is(.archive, .search) .loop-entry::after {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	z-index: 2;
	height: 3px;
	background: linear-gradient(90deg, var(--hm-brand-terra), var(--hm-brand-turquoise));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .4s cubic-bezier(.22, 1, .36, 1);
}

body:is(.archive, .search) .loop-entry:hover,
body:is(.archive, .search) .loop-entry:focus-within {
	border-color: rgba(111, 44, 63, .34);
	box-shadow: 0 24px 55px rgba(57, 37, 31, .12) !important;
	transform: translateY(-7px);
}

body:is(.archive, .search) .loop-entry:hover::after,
body:is(.archive, .search) .loop-entry:focus-within::after {
	transform: scaleX(1);
}

body:is(.archive, .search) .loop-entry .post-thumbnail {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #f3efe9;
}

body:is(.archive, .search) .loop-entry .post-thumbnail-inner {
	height: 100%;
}

body:is(.archive, .search) .loop-entry .post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.22, 1, .36, 1), filter .45s ease;
}

body:is(.archive, .search) .loop-entry:hover .post-thumbnail img,
body:is(.archive, .search) .loop-entry:focus-within .post-thumbnail img {
	filter: saturate(1.05) contrast(1.02);
	transform: scale(1.045);
}

body:is(.archive, .search) .loop-entry .entry-content-wrap {
	display: flex;
	min-height: 250px;
	flex-direction: column;
	padding: clamp(20px, 2.2vw, 28px);
}

body:is(.archive, .search) .loop-entry .entry-taxonomies {
	margin-bottom: 10px;
}

body:is(.archive, .search) .loop-entry .entry-taxonomies a {
	color: #245f5b !important;
	font: 600 10px/1.2 var(--hm-font-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
}

body:is(.archive, .search) .loop-entry .entry-title {
	margin: 0;
	font-size: clamp(1.35rem, 1.45vw, 1.7rem) !important;
	line-height: 1.08 !important;
}

body:is(.archive, .search) .loop-entry .entry-title a {
	display: -webkit-box;
	overflow: hidden;
	color: var(--hm-brand-ink) !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

body:is(.archive, .search) .loop-entry .entry-title a:hover,
body:is(.archive, .search) .loop-entry .entry-title a:focus-visible {
	color: var(--hm-brand-burgundy) !important;
}

body:is(.archive, .search) .loop-entry .entry-meta {
	margin-top: 12px;
	color: #625a55;
	font-size: 11px;
}

body:is(.archive, .search) .loop-entry .entry-meta .posted-by {
	display: none;
}

body:is(.archive, .search) .loop-entry .entry-summary {
	margin-top: 16px;
}

body:is(.archive, .search) .loop-entry .entry-summary p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: #514b47 !important;
	font-size: .93rem;
	line-height: 1.55;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

body:is(.archive, .search) .loop-entry .entry-footer {
	margin-top: auto;
	padding-top: 20px;
}

body:is(.archive, .search) .loop-entry .more-link-wrap {
	margin: 0;
}

body:is(.archive, .search) .loop-entry .post-more-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--hm-brand-burgundy) !important;
	font: 600 12px/1.2 var(--hm-font-body);
	letter-spacing: 0;
	text-transform: none;
}

body:is(.archive, .search) .loop-entry .post-more-link .kadence-svg-iconset {
	transition: transform .3s ease;
}

body:is(.archive, .search) .loop-entry .post-more-link:hover .kadence-svg-iconset,
body:is(.archive, .search) .loop-entry .post-more-link:focus-visible .kadence-svg-iconset {
	transform: translateX(5px);
}

@media (max-width: 767px) {
	body:is(.archive, .search) .kadence-posts-list {
		grid-template-columns: 1fr;
	}
	body:is(.archive, .search) .loop-entry .entry-content-wrap {
		min-height: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	body:is(.archive, .search) .loop-entry,
	body:is(.archive, .search) .loop-entry::after,
	body:is(.archive, .search) .loop-entry .post-thumbnail img,
	body:is(.archive, .search) .loop-entry .post-more-link .kadence-svg-iconset {
		transition-duration: .01ms !important;
	}
}

/* La grilla de Conocimiento comparte la superficie clara de los archivos. */
body.page .hm-knowledge-grid .hm-knowledge-card.content-bg {
	color: var(--hm-brand-ink) !important;
	background: #fff !important;
}
/* Footer editorial global */
.hm-global-footer {
	--hm-footer-burgundy: #5d2034;
	--hm-footer-burgundy-deep: #461727;
	--hm-footer-terra: #d85d32;
	--hm-footer-paper: #fffaf3;
	color: var(--hm-footer-paper);
	background: var(--hm-footer-burgundy);
}

.hm-footer-cta {
	color: #fff;
	background: var(--hm-footer-terra);
}

.hm-footer-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(250px, .45fr);
	gap: clamp(2rem, 7vw, 7rem);
	align-items: end;
	padding-top: clamp(2.5rem, 5vw, 4.75rem);
	padding-bottom: clamp(2.5rem, 5vw, 4.75rem);
}

.hm-footer-eyebrow,
.hm-footer-group h2 {
	margin: 0 0 1rem;
	font-family: "Roboto Mono", monospace;
	font-size: .69rem;
	font-weight: 600;
	letter-spacing: .14em;
	line-height: 1.4;
	text-transform: uppercase;
}

.hm-footer-cta h2 {
	max-width: 790px;
	margin: 0;
	color: inherit;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(2.15rem, 4.25vw, 4.6rem);
	font-weight: 600;
	letter-spacing: -.045em;
	line-height: .98;
}

.hm-footer-cta__link {
	display: flex;
	min-height: 56px;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .8rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, .8);
	color: #fff;
	font-size: .95rem;
	font-weight: 700;
	text-decoration: none;
}

.hm-footer-cta__link span:last-child {
	font-size: 1.4rem;
	transition: transform .25s ease;
}

.hm-footer-cta__link:hover,
.hm-footer-cta__link:focus-visible {
	color: #fff;
	border-color: #fff;
}

.hm-footer-cta__link:hover span:last-child,
.hm-footer-cta__link:focus-visible span:last-child {
	transform: translate(4px, -4px);
}

.hm-footer-main {
	background:
		linear-gradient(120deg, rgba(255, 255, 255, .035), transparent 46%),
		var(--hm-footer-burgundy);
}

.hm-footer-grid {
	display: grid;
	grid-template-columns: minmax(280px, 1.65fr) repeat(3, minmax(145px, .62fr));
	align-items: start;
	gap: clamp(2.25rem, 5vw, 5rem);
	padding-top: clamp(3.5rem, 7vw, 6.5rem);
	padding-bottom: clamp(2rem, 3.5vw, 3rem);
}

.hm-footer-brand {
	max-width: 480px;
}

/* Los dos logos van en la misma línea (HM a la izquierda, UdeA a la derecha),
   separados por un filete. El de HM es casi cuadrado (377x320) y el de la UdeA
   apaisado (1486x402): a los 220px que tenía HM antes la pareja no cabía en los
   480px de .hm-footer-brand, por eso ambos bajan a 150px.

   "nowrap" a propósito: con "wrap" el navegador manda el logo de la UdeA a una
   segunda línea antes de intentar encogerlo, y por debajo de ~340px de columna
   la pareja se partía. Con min-width:0 en los dos, "nowrap" los encoge parejo.

   El ancho va en el <a> y no en el <img>: un ancho en % dentro del enlace se
   resuelve contra un contenedor que a su vez se ajusta al contenido — es
   circular, y el navegador cae al ancho intrínseco del SVG (377px). */
.hm-footer-logos {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: clamp(1rem, 2.2vw, 1.5rem);
	margin-bottom: 2rem;
}

/* Los dos logos miden lo mismo de alto y quedan alineados arriba y abajo: la
   altura manda y el ancho sale del aspecto de cada archivo. Lo pide el manual
   de marca de la Universidad de Antioquia, asi que no se toca por criterio
   estetico: el de HM es casi cuadrado (377x320) y el de la UdeA apaisado
   (1486x402), de modo que a igual altura el de la UdeA sale ~3,1 veces mas
   ancho y pesa mas que el de Hacemos Memoria en su propio pie. Es el costo
   conocido de cumplir el manual, no un descuido.

   No sirve igualar la altura de la letra en vez de la de la caja: "MEMORIA"
   ocupa 62,8 de los 320 del SVG (19,6%) y la caja alta de la UdeA 105 de 402
   (26,1%), asi que emparejar letra obliga a agrandar todavia mas el logo de
   la UdeA. El desequilibrio viene del area, no del cuerpo de letra. */
.hm-footer-logo-link {
	display: block;
	flex: 0 0 auto;
}

.hm-footer-logo,
.hm-footer-logo-udea {
	display: block;
	width: auto;
	height: clamp(44px, 4.5vw, 64px);
}

.hm-footer-logo {
	filter: brightness(0) invert(1);
}

.hm-footer-logo-udea {
	padding-left: clamp(1rem, 2.2vw, 1.5rem);
	border-left: 1px solid rgba(255, 250, 243, .28);
	box-sizing: content-box;
}

.hm-footer-brand p {
	max-width: 42ch;
	margin: 0 0 1.4rem;
	color: rgba(255, 250, 243, .82);
	font-size: clamp(.95rem, 1.15vw, 1.08rem);
	line-height: 1.7;
}

.hm-footer-group h2 {
	color: rgba(255, 250, 243, .62);
}

.hm-footer-group ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hm-footer-group li {
	margin: 0;
}

.hm-footer-group a {
	position: relative;
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	gap: .35rem;
	color: var(--hm-footer-paper);
	font-size: .96rem;
	text-decoration: none;
}

.hm-footer-group a::after {
	position: absolute;
	right: 0;
	bottom: 8px;
	left: 0;
	height: 1px;
	background: currentColor;
	content: "";
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .25s ease;
}

.hm-footer-group a:hover,
.hm-footer-group a:focus-visible {
	color: #fff;
}

.hm-footer-group a:hover::after,
.hm-footer-group a:focus-visible::after {
	transform: scaleX(1);
	transform-origin: left;
}

/* Cierre del footer: una sola pila centrada con contacto, adscripción y
   copyright, al estilo del pie de De la Urbe. Antes eran dos zonas — el
   contacto en la columna de marca y la barra legal a lo ancho — y ninguna
   llenaba su ancho.

   Sin iconos de correo y ubicación a propósito: en texto centrado el icono
   al inicio de la línea desplaza el eje óptico y se nota el desalineo. */
.hm-footer-closing {
	padding-top: clamp(1.2rem, 2vw, 1.6rem);
	padding-bottom: clamp(1.2rem, 2vw, 1.6rem);
	border-top: 1px solid rgba(255, 250, 243, .18);
	color: rgba(255, 250, 243, .62);
	font-size: .84rem;
	line-height: 1.55;
	text-align: center;
}

.hm-footer-closing p {
	margin: 0;
}

.hm-footer-closing-contact {
	font-style: normal;
}

/* Bloque, no inline: cada dato va en su renglón dentro de la pila. */
.hm-footer-closing-contact a {
	display: block;
}

/* !important: mismo caso que ".hm-footer-group a" más abajo — la regla
   global "a { color !important }" le gana en cascada a un color sin
   !important, aunque tenga más especificidad. */
.hm-footer-closing a {
	color: var(--hm-footer-paper) !important;
	text-decoration: none;
}

.hm-footer-closing a:hover,
.hm-footer-closing a:focus-visible {
	color: #fff !important;
	text-decoration: underline;
	text-underline-offset: .2em;
}

@media (max-width: 900px) {
	.hm-footer-grid {
		grid-template-columns: minmax(260px, 1.4fr) repeat(2, minmax(140px, .7fr));
	}

	.hm-footer-group:last-child {
		grid-column: 2;
	}
}

@media (max-width: 767px) {
	.hm-footer-cta__inner,
	.hm-footer-grid {
		grid-template-columns: 1fr;
	}

	.hm-footer-cta__inner {
		gap: 1.8rem;
	}

	.hm-footer-cta h2 {
		font-size: clamp(2.3rem, 12vw, 3.75rem);
	}

	.hm-footer-grid {
		gap: 2rem;
		padding-top: 3.5rem;
		padding-bottom: 3rem;
	}

	.hm-footer-group,
	.hm-footer-group:last-child {
		grid-column: auto;
		padding-top: 1rem;
		border-top: 1px solid rgba(255, 250, 243, .15);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-footer-cta__link span:last-child,
	.hm-footer-group a::after {
		transition: none;
	}
}

/* Mantiene el contraste del footer frente a las reglas cromáticas globales. */
.hm-global-footer .hm-footer-cta h2,
.hm-global-footer .hm-footer-cta__link,
.hm-global-footer .hm-footer-cta__link:hover,
.hm-global-footer .hm-footer-cta__link:focus-visible {
	color: #fff !important;
}

.hm-global-footer .hm-footer-group a,
.hm-global-footer .hm-footer-group a:visited {
	color: #fffaf3 !important;
}

.hm-footer-toggle {
	display: inline-flex;
	width: auto;
	align-items: center;
	justify-content: space-between;
	padding: 0;
	border: 0;
	color: inherit;
	background: transparent;
	font: inherit;
	letter-spacing: inherit;
	text-align: inherit;
	text-transform: inherit;
}

.hm-footer-toggle__mark {
	display: none;
}

@media (min-width: 768px) {
	.hm-footer-toggle {
		pointer-events: none;
	}
}

/* Buscador editorial: acción clara, táctil y completamente redondeada. */
.home .hm-search button {
	min-height: 44px;
	margin: 4px;
	padding-inline: 1.25rem;
	border-radius: 999px !important;
}

.home .hm-search button:focus-visible {
	outline: 3px solid rgba(93, 32, 52, .28);
	outline-offset: 3px;
}

@media (max-width: 767px) {
	.hm-footer-cta__inner {
		gap: 1.25rem;
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
	}

	.hm-footer-eyebrow {
		margin-bottom: .65rem;
		font-size: .62rem;
	}

	.hm-global-footer .hm-footer-cta h2 {
		max-width: 12ch;
		font-size: clamp(2rem, 10vw, 3rem);
		line-height: 1;
	}

	.hm-footer-cta__link {
		min-height: 48px;
		padding: .35rem 0;
	}

	.hm-footer-grid {
		gap: 0;
		padding-top: 1.5rem;
		padding-bottom: 1rem;
	}

	.hm-footer-brand {
		margin-bottom: 1rem;
	}

	.hm-footer-logos {
		gap: .9rem;
		margin-bottom: .75rem;
	}

	.hm-footer-logo-udea {
		padding-left: .9rem;
	}

	/* Sin -webkit-line-clamp: esto es la descripcion fija de Hacemos Memoria,
	   no el extracto de un post, asi que no se corta con puntos suspensivos
	   aunque en movil ocupe cuatro o cinco lineas. */
	.hm-footer-brand p {
		margin-bottom: .85rem;
		font-size: .88rem;
		line-height: 1.55;
	}

	.hm-footer-group,
	.hm-footer-group:last-child {
		padding: 0;
		border-top: 1px solid rgba(255, 250, 243, .2);
	}

	.hm-footer-group:last-child {
		border-bottom: 1px solid rgba(255, 250, 243, .2);
	}

	.hm-footer-group h2 {
		margin: 0;
	}

	.hm-footer-toggle {
		width: 100%;
		min-height: 48px;
		color: #fffaf3 !important;
		background: transparent !important;
		box-shadow: none !important;
		cursor: pointer;
	}

	.hm-footer-toggle:hover,
	.hm-footer-toggle:active,
	.hm-footer-toggle:focus,
	.hm-footer-toggle[aria-expanded="true"] {
		color: #fffaf3 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	.hm-footer-toggle__mark {
		display: inline-grid;
		width: 28px;
		height: 28px;
		place-items: center;
		border: 1px solid rgba(255, 250, 243, .28);
		border-radius: 50%;
		font-family: var(--hm-font-body);
		font-size: 1rem;
		font-weight: 400;
	}

	.hm-footer-toggle:focus-visible {
		outline: 2px solid #fffaf3;
		outline-offset: -2px;
	}

	.hm-footer-panel {
		padding: 0 0 .85rem;
	}

	.hm-footer-enhanced .hm-footer-panel[hidden] {
		display: none;
	}

	.hm-footer-enhanced .hm-footer-panel:not([hidden]) {
		animation: hm-footer-panel-in .24s ease both;
	}

	.hm-footer-group a {
		min-height: 38px;
		font-size: .9rem;
	}

	.hm-footer-closing {
		padding-top: 1.1rem;
		padding-bottom: 1.1rem;
		font-size: .78rem;
		line-height: 1.5;
	}
}

@keyframes hm-footer-panel-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-footer-enhanced .hm-footer-panel:not([hidden]) {
		animation: none;
	}
}

/* Carrusel editorial de historias destacadas */
.hm-featured-carousel {
	position: relative;
}

.hm-carousel-ready .hm-featured-slide[hidden] {
	display: none;
}

.hm-carousel-ready .hm-featured-slide.is-active {
	animation: hm-featured-in .58s var(--hm-ease) both;
}

.hm-featured-title {
	max-width: 20ch;
	margin: 0 0 1.75rem;
	color: var(--hm-brand-ink);
	font-family: var(--hm-font-body);
	font-size: clamp(2.5rem, 3.6vw, 4.75rem) !important;
	font-weight: 500;
	line-height: 1.08 !important;
	letter-spacing: -.012em;
	text-wrap: pretty;
}

.hm-featured-controls {
	display: grid;
	grid-template-columns: 44px auto 44px;
	grid-template-areas:
		"prev dots next"
		"progress progress progress";
	width: min(100%, 560px);
	align-items: center;
	gap: .75rem;
	margin: clamp(1.5rem, 3vw, 2.5rem) 0 0 auto;
}

.hm-featured-arrow,
.hm-featured-dots button {
	display: inline-grid;
	min-width: 44px;
	min-height: 44px;
	place-items: center;
	padding: 0;
	border: 1px solid rgba(33, 29, 27, .22);
	border-radius: 50%;
	color: var(--hm-brand-ink);
	background: transparent;
	font-family: var(--hm-font-mono);
	font-size: .72rem;
	transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}

.hm-featured-arrow:first-of-type {
	grid-area: prev;
}

.hm-featured-arrow:last-of-type {
	grid-area: next;
}

.hm-featured-dots {
	display: flex;
	grid-area: dots;
	align-items: center;
	justify-content: center;
	gap: .35rem;
}

.hm-featured-dots button {
	min-width: 40px;
	min-height: 44px;
	border-color: transparent;
	border-radius: 999px;
}

.hm-featured-arrow:hover,
.hm-featured-arrow:focus-visible,
.hm-featured-dots button:hover,
.hm-featured-dots button:focus-visible,
.hm-featured-dots button[aria-current="true"] {
	color: #fff;
	border-color: var(--hm-brand-burgundy);
	background: var(--hm-brand-burgundy);
}

.hm-featured-progress {
	position: relative;
	display: block;
	height: 2px;
	grid-area: progress;
	overflow: hidden;
	background: rgba(33, 29, 27, .14);
}

.hm-featured-progress > span {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--hm-brand-terra);
	transform: scaleX(0);
	transform-origin: left;
}

.hm-featured-progress > span.is-running {
	animation: hm-featured-progress var(--hm-carousel-duration, 6000ms) linear both;
}

@keyframes hm-featured-in {
	from {
		opacity: 0;
		transform: translateX(24px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes hm-featured-progress {
	to {
		transform: scaleX(1);
	}
}

@media (max-width: 767px) {
	.hm-featured-carousel {
		width: 100%;
	}

	.hm-featured-carousel .hm-hero-grid {
		gap: .75rem;
	}

	.hm-featured-carousel .hm-hero-media {
		width: 100%;
		height: clamp(245px, 36vh, 330px);
		min-height: 0;
	}

	.hm-featured-carousel .hm-hero-copy {
		padding-block: 0;
	}

	.hm-featured-carousel .hm-hero-meta {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: .5rem;
		margin-bottom: .7rem;
	}

	.hm-featured-carousel .hm-hero-meta .hm-category-label {
		max-width: 58%;
	}

	.hm-featured-carousel .hm-hero-meta .hm-datestamp {
		flex: 0 0 auto;
		padding: .45rem .6rem;
		font-size: .64rem;
		white-space: nowrap;
	}

	.hm-featured-carousel .hm-hero h1,
	.hm-featured-carousel .hm-featured-title,
	.hm-featured-carousel h1 {
		display: -webkit-box;
		margin-bottom: .65rem;
		overflow: hidden;
		font-size: clamp(2rem, 9.7vw, 3rem) !important;
		line-height: 1 !important;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
	}

	.hm-featured-carousel .hm-hero-excerpt {
		display: -webkit-box;
		max-width: none;
		margin: 0;
		overflow: hidden;
		font-size: .86rem;
		line-height: 1.45;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}

	.hm-featured-carousel .hm-text-link {
		min-width: min(100%, 10rem);
		min-height: 40px;
		margin-top: .7rem;
		padding-bottom: .35rem;
	}

	.hm-featured-controls {
		width: calc(100% - 54px);
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		gap: .3rem .5rem;
		margin-right: 54px;
		margin-top: .65rem;
	}

	.hm-featured-dots {
		gap: 0;
	}

	.hm-featured-dots button {
		min-width: 36px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-carousel-ready .hm-featured-slide.is-active,
	.hm-featured-progress > span.is-running {
		animation: none;
	}
}

/* ==========================================================================
   Arquitectura editorial v3 — portada aprobada 30/07/2026
   ========================================================================== */
.hm-home-v3 {
	--hm-v3-paper: #f6f3ed;
	--hm-v3-ink: #201d1b;
	--hm-v3-muted: #6f6963;
	--hm-v3-line: #d8d1c8;
	--hm-v3-orange: #e5532d;
	--hm-v3-wine: #762c43;
	background: var(--hm-v3-paper);
	color: var(--hm-v3-ink);
}

.hm-home-v3 section,
.hm-home-v3 aside {
	position: relative;
	padding: clamp(2.25rem, 4vw, 3.75rem) 0;
}

.hm-home-v3 .hm-shell {
	width: min(1240px, calc(100% - 48px));
}

/* Alterna el fondo entre bloques editoriales consecutivos para romper la
 * monotonía visual del landing sin salir de la paleta de marca. */
.hm-v3-topic.is-tone-a { background: var(--hm-v3-paper); }
.hm-v3-topic.is-tone-b,
.hm-v3-compact-sections,
.hm-v3-specials { background: #fff; }
/* El fondo crema separa la sección de pódcast de la que viene antes. La
   paleta --hm-v3-* solo está declarada en .hm-home-v3 y .hm-v3-archive, así
   que fuera de la portada la variable quedaba vacía y la sección salía blanca
   sobre blanco: el respaldo explícito la sostiene en las landings. */
.hm-v3-podcast { background: var(--hm-v3-paper, #f6f3ed); }

/* Las landings no heredan el padding vertical que .hm-home-v3 da a sus
   secciones, y sin él la banda de color queda pegada al contenido. */
.hm-editorial-landing .hm-v3-podcast {
	padding: clamp(2.25rem, 4vw, 3.75rem) 0;
}
.hm-v3-academia { background: var(--hm-v3-paper); }

/* Sección "Más sobre…" de un especial. No usa .hm-v3-archive-list a propósito:
   ese bloque es el encabezado de un archivo, donde el h2 es el titular
   dominante de la página (clamp(2.2rem, 4vw, 3.7rem)) porque no compite con
   ningún h1. Dentro de una landing sí hay h1, y ese h2 se veía más grande que
   el título de la página. Aquí el encabezado es un .hm-v3-section-head normal
   y la banda de color es la misma de la sección de pódcast del especial de la
   Universidad de Antioquia: idéntica declaración, con la misma reserva, porque
   --hm-v3-paper se declara dentro de .hm-home-v3 y de .hm-v3-archive, y una
   landing no cuelga de ninguno de los dos. */
.hm-especial-posts { background: var(--hm-v3-paper, #f6f3ed); }

/* Las landings no heredan el padding vertical que .hm-home-v3 da a sus
   secciones, y sin él la banda de color queda pegada al contenido. */
.hm-editorial-landing .hm-especial-posts {
	padding: clamp(2.25rem, 4vw, 3.75rem) 0;
}

/* En el teléfono la retícula se lee de lado, no apilada: cinco tarjetas a una
   columna obligaban a recorrer toda la página para ver la última. Misma
   técnica que las lecturas relacionadas de un libro (.hm-book-related-grid):
   el mismo grid pasa a fluir en columna y se desplaza en horizontal, así las
   tarjetas conservan sus estilos y no hace falta marcado aparte. */
@media (max-width: 680px) {
	.hm-especial-posts .hm-v3-archive-grid {
		grid-auto-flow: column;
		grid-auto-columns: min(78vw, 320px);
		grid-template-columns: none;
		overflow-x: auto;
		scroll-snap-type: inline mandatory;
		/* El foco del teclado ancla la tarjeta al borde del carril, no bajo el
		   recorte del contenedor. */
		scroll-padding-inline: 0;
	}

	.hm-especial-posts .hm-v3-archive-grid .hm-v3-card {
		scroll-snap-align: start;
	}
}

.hm-v3-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: clamp(1.25rem, 2.4vw, 2rem);
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--hm-v3-line);
}

.hm-v3-section-head h1,
.hm-v3-section-head h2 {
	margin: 0;
	color: var(--hm-v3-ink);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.75rem, 2.6vw, 2.5rem);
	font-weight: 650;
	letter-spacing: -.03em;
	line-height: 1.05;
}

.hm-v3-sort {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: .6rem;
}

.hm-v3-sort label {
	color: var(--hm-v3-muted);
	font-family: "Roboto Mono", monospace;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	white-space: nowrap;
}

.hm-v3-sort select {
	min-height: 40px;
	padding: 0 2.1rem 0 .9rem;
	appearance: none;
	border: 1px solid var(--hm-v3-line);
	border-radius: 999px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23211d1b' stroke-width='1.6'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E") no-repeat right .8rem center / 12px;
	color: var(--hm-v3-ink);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: .85rem;
	font-weight: 600;
	cursor: pointer;
}

.hm-v3-sort select:focus-visible {
	outline: 2px solid var(--hm-v3-orange);
	outline-offset: 2px;
}

@media (max-width: 640px) {
	.hm-v3-results-head {
		flex-wrap: wrap;
		align-items: flex-start;
	}
}

.hm-v3-section-head p {
	max-width: 42rem;
	margin: .55rem 0 0;
	color: var(--hm-v3-muted);
	font-size: .95rem;
}

.hm-v3-more {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: .65rem;
	min-height: 44px;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.hm-v3-more span,
.hm-v3-special-card strong span,
.hm-v3-academia-grid strong span {
	transition: transform .25s ease;
}

.hm-v3-more:hover span,
.hm-v3-more:focus-visible span,
.hm-v3-special-card:hover strong span,
.hm-v3-academia-grid a:hover strong span {
	transform: translateX(4px);
}

.hm-v3-meta {
	display: block;
	color: var(--hm-v3-orange, #e5532d);
	font-family: "Roboto Mono", monospace;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .055em;
	line-height: 1.4;
	text-transform: uppercase;
}

.hm-v3-current-grid {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(380px, 2fr);
	gap: 1rem;
}

/* El color de línea lleva respaldo a propósito: --hm-v3-line se declara en
   .hm-home-v3, así que fuera del home la variable no resuelve, toda la
   declaración `border` se cae y la tarjeta queda SIN borde (border-style
   vuelve a none). Le pasaba a las fichas de /especiales/podcast/, que reusan
   .hm-v3-podcast-card fuera del home. */
.hm-v3-lead,
.hm-v3-card,
.hm-v3-compact-card,
.hm-v3-podcast-card,
.hm-v3-academia-grid > a {
	overflow: hidden;
	border: 1px solid var(--hm-v3-line, #d8d1c8);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-lead > .hm-card-body {
	display: grid;
	height: 100%;
	grid-template-rows: minmax(300px, 1fr) auto;
	color: inherit;
}

.hm-v3-lead a,
.hm-v3-card a,
.hm-v3-compact-card a,
.hm-v3-podcast-card a,
.hm-v3-academia-grid a,
.hm-v3-special-card,
.hm-v3-archive-lead a,
.hm-v3-archive-recent a {
	text-decoration: none !important;
}

.hm-v3-lead-media {
	position: relative;
	height: 100%;
	min-height: 0;
	overflow: hidden;
	background: #ddd7cf;
}

/* Absoluta: asi la foto no aporta alto intrinseco y la fila minmax(300px, 1fr)
   del tema puede repartir la altura contra la columna de laterales. */
.hm-v3-lead-media img {
	position: absolute;
	inset: 0;
}

.hm-v3-lead-media img,
.hm-v3-card-media img,
.hm-v3-compact-media img,
.hm-v3-podcast-art img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .55s cubic-bezier(.2, .7, .2, 1);
}

.hm-v3-lead:hover img,
.hm-v3-card:hover img,
.hm-v3-compact-card:hover img,
.hm-v3-podcast-card:hover img {
	transform: scale(1.025);
}

.hm-v3-lead-copy {
	padding: clamp(1.4rem, 3vw, 2.5rem);
}

.hm-v3-lead-copy h2 {
	max-width: 22ch;
	margin: .65rem 0 .8rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.6rem, 2.3vw, 2.2rem);
	font-weight: 650;
	letter-spacing: -.03em;
	line-height: 1.1;
}

.hm-v3-lead-copy p {
	max-width: 62ch;
	margin: 0 0 1.25rem;
	color: var(--hm-v3-muted);
	line-height: 1.55;
}

.hm-v3-byline,
.hm-v3-card time,
.hm-v3-compact-card time,
.hm-v3-podcast-card time,
.hm-v3-recent-copy time {
	color: var(--hm-v3-muted, #6f6963);
	font-family: "Roboto Mono", monospace;
	font-size: .65rem;
}

/* La fecha de "Más recientes" va pegada al titular, no al fondo de la celda:
   en desktop el bloque de texto está centrado en una fila de alto fijo y un
   margin-top:auto la habría separado del título al que pertenece. */
.hm-v3-recent-copy time {
	display: block;
	margin-top: .3rem;
}

.hm-v3-compact-card time {
	margin-top: auto;
}

.hm-v3-compact-excerpt {
	display: none;
}

.hm-v3-secondary-track {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: 1rem;
}

@media (min-width: 901px) {
	.hm-v3-secondary-track .hm-v3-compact-card {
		position: relative;
		min-height: 336px;
	}

	.hm-v3-secondary-track .hm-v3-compact-card > .hm-card-body {
		position: relative;
		display: block;
		overflow: hidden;
	}

	.hm-v3-secondary-track .hm-v3-compact-media {
		position: absolute;
		inset: 0 0 auto;
		height: 45%;
		aspect-ratio: auto;
		transition: height .52s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-secondary-track .hm-v3-compact-card > .hm-card-body > div:last-child {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 2;
		height: 55%;
		overflow: hidden;
		background: rgba(255,255,255,.97);
		transition:
			height .52s cubic-bezier(.22,1,.36,1),
			box-shadow .4s ease;
	}

	.hm-v3-secondary-track .hm-v3-compact-card h3 {
		display: block;
		margin: .55rem 0 .75rem;
		overflow: visible;
		font-size: clamp(1rem, 1.35vw, 1.25rem);
		line-height: 1.08;
		-webkit-line-clamp: unset;
	}

	.hm-v3-secondary-track .hm-v3-compact-excerpt {
		display: block;
		max-height: 0;
		margin: 0;
		overflow: hidden;
		opacity: 0;
		color: var(--hm-v3-muted);
		font-size: .82rem;
		line-height: 1.45;
		transform: translateY(12px);
		transition:
			max-height .52s cubic-bezier(.22,1,.36,1),
			margin .4s ease,
			opacity .3s ease,
			transform .45s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-secondary-track .hm-v3-compact-card:hover .hm-v3-compact-media,
	.hm-v3-secondary-track .hm-v3-compact-card:focus-within .hm-v3-compact-media {
		height: 0;
	}

	.hm-v3-secondary-track .hm-v3-compact-card:hover > .hm-card-body > div:last-child,
	.hm-v3-secondary-track .hm-v3-compact-card:focus-within > .hm-card-body > div:last-child {
		height: 100%;
		background: #fff;
		box-shadow: 0 -18px 34px rgba(32,29,27,.1);
	}

	.hm-v3-secondary-track .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-v3-secondary-track .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 9rem;
		margin-bottom: .8rem;
		opacity: 1;
		transform: translateY(0);
	}
}

.hm-v3-secondary-track .hm-v3-compact-card,
.hm-v3-compact-list .hm-v3-compact-card {
	height: 100%;
}

.hm-v3-compact-card > .hm-card-body {
	display: grid;
	height: 100%;
	grid-template-rows: auto 1fr;
	color: inherit;
}

.hm-v3-compact-media {
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #ddd7cf;
}

.hm-v3-compact-card > .hm-card-body > div:last-child {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 1rem;
}

.hm-v3-compact-card h3 {
	display: -webkit-box;
	margin: .55rem 0 1.5rem;
	overflow: hidden;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1rem, 1.45vw, 1.35rem);
	font-weight: 620;
	line-height: 1.1;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

.hm-v3-placeholder {
	display: grid;
	width: 100%;
	height: 100%;
	min-height: 110px;
	place-items: center;
	background:
		linear-gradient(135deg, transparent 48%, rgba(118,44,67,.13) 49%, rgba(118,44,67,.13) 51%, transparent 52%),
		#e9e3da;
	color: var(--hm-v3-wine);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.35rem;
}

.hm-v3-banner {
	padding: 1.6rem 0 !important;
}

.hm-v3-banner .hm-shell {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	min-height: 120px;
	padding: 1.4rem 2rem;
	border-radius: 4px;
}

.hm-v3-banner-primary .hm-shell {
	display: grid;
	height: 280px;
	min-height: 0;
	grid-template-columns: 58% 42%;
	gap: 0;
	overflow: hidden;
	padding: 0;
	background: var(--hm-v3-wine);
	color: #fff;
}

.hm-v3-banner-media {
	position: relative;
	height: 100%;
	min-height: 0;
	overflow: hidden;
	background: #d9d2c9;
}

.hm-v3-banner-media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 58%;
	filter: grayscale(1) sepia(.18);
}

.hm-v3-banner-copy {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex-direction: column;
	padding: clamp(1.55rem, 2.2vw, 2rem) clamp(1.7rem, 2.6vw, 2.25rem);
}

.hm-v3-banner-primary .hm-v3-banner-copy {
	padding-top: 1.15rem;
	padding-bottom: 2.65rem;
}

.hm-v3-banner-primary .hm-v3-banner-copy > span {
	color: #f4ddd5;
}

.hm-v3-banner-primary .hm-v3-banner-copy strong {
	max-width: 17ch;
	font-size: clamp(1.65rem, 2.25vw, 2rem);
	line-height: 1;
}

.hm-v3-banner-primary .hm-v3-banner-copy p {
	max-width: 52ch;
	margin: .65rem 0 .85rem;
	color: rgba(255,255,255,.82);
	font-size: .95rem;
	line-height: 1.5;
}

.hm-v3-banner-primary .hm-v3-banner-copy > a {
	display: inline-flex;
	align-items: center;
	gap: 2.5rem;
	padding: .8rem 1rem;
	margin-bottom: .15rem;
	border: 1px solid rgba(255,255,255,.55);
	border-radius: 4px;
	color: #fff !important;
	text-decoration: none !important;
}

.hm-v3-banner-secondary .hm-shell {
	background: var(--hm-v3-wine);
	color: #fff;
}

.hm-v3-banner span {
	font-family: "Roboto Mono", monospace;
	font-size: .67rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.hm-v3-banner strong {
	display: block;
	max-width: 780px;
	margin-top: .35rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.25rem, 2.2vw, 2rem);
	line-height: 1.1;
}

.hm-v3-banner p {
	margin: .45rem 0 0;
	color: inherit;
	opacity: .78;
}

.hm-v3-banner a {
	display: inline-flex;
	flex: 0 0 auto;
	gap: .6rem;
	color: inherit;
	font-family: "Roboto Mono", monospace;
	font-size: .72rem;
	font-weight: 600;
	text-transform: uppercase;
}

.hm-v3-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.hm-v3-card > .hm-card-body {
	display: grid;
	height: 100%;
	grid-template-rows: auto 1fr;
	color: inherit;
}

.hm-v3-card-media {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #ddd7cf;
}

.hm-v3-card-copy {
	display: flex;
	flex-direction: column;
	padding: 1.2rem;
}

.hm-v3-card h3 {
	display: block;
	margin: .7rem 0 2rem;
	overflow: hidden;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.25rem, 2vw, 1.85rem);
	font-weight: 620;
	letter-spacing: -.025em;
	line-height: 1.08;
	-webkit-line-clamp: unset;
}

.hm-v3-card time {
	margin-top: auto;
}

.hm-v3-card-excerpt {
	display: none;
	margin: 0;
	color: var(--hm-v3-muted);
	font-size: .88rem;
	line-height: 1.45;
}

@media (min-width: 901px) {
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card,
	.hm-v3-archive-grid .hm-v3-card {
		min-height: 380px;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card > .hm-card-body {
		grid-template-rows: minmax(0, 52%) minmax(0, 48%);
		transition: grid-template-rows .55s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card-copy {
		position: relative;
		overflow: hidden;
		background: rgba(255,255,255,.98);
		transition: box-shadow .4s ease;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card h3,
	.hm-v3-archive-grid .hm-v3-card h3 {
		margin-bottom: 1rem;
		transition: font-size .4s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card-excerpt {
		display: block;
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		transform: translateY(12px);
		transition:
			max-height .5s cubic-bezier(.22,1,.36,1),
			margin .4s ease,
			opacity .3s ease,
			transform .45s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover > .hm-card-body,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card:hover > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card:focus-within > .hm-card-body {
		grid-template-rows: minmax(0, 35%) minmax(0, 65%);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover .hm-v3-card-copy,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card:hover .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card:focus-within .hm-v3-card-copy {
		box-shadow: 0 -18px 34px rgba(32,29,27,.1);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover h3,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within h3,
	.hm-v3-archive-grid .hm-v3-card:hover h3,
	.hm-v3-archive-grid .hm-v3-card:focus-within h3 {
		font-size: clamp(1.08rem, 1.65vw, 1.45rem);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card:focus-within .hm-v3-card-excerpt {
		max-height: 7.5rem;
		margin-bottom: 1rem;
		opacity: 1;
		transform: translateY(0);
	}
}

.hm-v3-card-grid.is-featured-grid {
	grid-template-columns: 1.4fr .8fr .8fr;
}

.hm-v3-card-grid.is-featured-grid .is-first .hm-v3-card-media {
	aspect-ratio: 16 / 9;
}

/* La nota destacada mantiene el título grande; las dos columnas angostas
 * bajan de tamaño para que la jerarquía visual acompañe el tamaño real
 * de cada tarjeta. */
.hm-v3-card-grid.is-featured-grid .is-first h3 {
	font-size: clamp(1.5rem, 2.3vw, 2.1rem);
}

.hm-v3-card-grid.is-featured-grid .hm-v3-card:not(.is-first) h3 {
	font-size: clamp(1rem, 1.3vw, 1.3rem);
}

.hm-v3-card-grid.is-editorial-grid .hm-v3-card:nth-child(2) {
	transform: none;
}

.hm-v3-compact-columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}

.hm-v3-compact-group {
	padding: clamp(1.25rem, 2.5vw, 2rem);
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: rgba(255,255,255,.65);
}

.hm-v3-compact-group .hm-v3-section-head {
	align-items: center;
	margin-bottom: 1rem;
}

.hm-v3-compact-list {
	display: grid;
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: .8rem;
}

.hm-v3-compact-group {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
}

.hm-v3-card-grid {
	align-items: stretch;
}

.hm-v3-card-grid .hm-v3-card,
.hm-v3-card-grid .hm-v3-card > .hm-card-body {
	height: 100%;
}

.hm-v3-card-grid .hm-v3-card-media {
	width: 100%;
	aspect-ratio: 16 / 10;
}

.hm-v3-special-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.hm-v3-academia-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.hm-v3-special-card {
	display: flex;
	min-height: 320px;
	flex-direction: column;
	padding: clamp(1.5rem, 3vw, 2.4rem);
	border-radius: 4px;
	color: var(--hm-v3-ink);
	transition: transform .3s ease, box-shadow .3s ease;
}

.hm-v3-special-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 16px 40px rgba(32,29,27,.09);
}

.hm-v3-special-card.is-coral { background: #f3cfc4; }
.hm-v3-special-card.is-mint { background: #cce5df; }
.hm-v3-special-card.is-blue { background: #cfdfe5; }

.hm-v3-special-card > span {
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .68rem;
	text-transform: uppercase;
}

.hm-v3-special-card h3 {
	margin: 0 0 .8rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.6rem, 2.5vw, 2.4rem);
	line-height: 1;
}

.hm-v3-special-card p {
	color: #4f4a46;
}

.hm-v3-special-card strong {
	margin-top: auto;
	font-family: "Roboto Mono", monospace;
	font-size: .7rem;
	text-transform: uppercase;
}

.hm-v3-podcast-track {
	display: grid;
	grid-template-columns: repeat(5, minmax(190px, 1fr));
	gap: .8rem;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
}

.hm-v3-podcast-card {
	scroll-snap-align: start;
}

.hm-v3-podcast-card > a {
	display: flex;
	height: 100%;
	flex-direction: column;
	padding: .8rem;
	color: inherit;
}

.hm-v3-podcast-art {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	margin-bottom: 1rem;
	background: #557f8e;
}

.hm-v3-podcast-art > span {
	position: absolute;
	inset: 50% auto auto 50%;
	display: grid;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255,255,255,.65);
	border-radius: 50%;
	place-items: center;
	transform: translate(-50%, -50%);
	background: rgba(32,29,27,.45);
	color: #fff;
}

.hm-v3-podcast-card h3 {
	display: -webkit-box;
	margin: .55rem 0 1.5rem;
	overflow: hidden;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.15rem;
	line-height: 1.12;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.hm-v3-podcast-card time {
	margin-top: auto;
}

.hm-v3-academia-grid > a {
	position: relative;
	display: flex;
	min-height: 230px;
	flex-direction: column;
	padding: 1.6rem;
	color: inherit;
	text-decoration: none !important;
	transition:
		background-color .3s ease,
		border-color .3s ease,
		box-shadow .38s cubic-bezier(.22,1,.36,1),
		transform .38s cubic-bezier(.22,1,.36,1);
}

.hm-v3-academia-grid > a::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	background: var(--hm-v3-orange);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .45s cubic-bezier(.22,1,.36,1);
}

.hm-v3-academia-grid h3 {
	margin: 1rem 0 .7rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.5rem, 2.5vw, 2.15rem);
	transition: color .3s ease, transform .38s cubic-bezier(.22,1,.36,1);
}

.hm-v3-academia-grid p {
	color: var(--hm-v3-muted);
}

.hm-v3-academia-grid strong {
	margin-top: auto;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .7rem;
	text-transform: uppercase;
	transition: color .3s ease, letter-spacing .3s ease, transform .38s cubic-bezier(.22,1,.36,1);
}

.hm-v3-academia-grid > a:hover,
.hm-v3-academia-grid > a:focus-visible {
	border-color: rgba(229,83,45,.45);
	background: #fbf7f2;
	box-shadow: 0 12px 28px rgba(32,29,27,.07);
	transform: translateY(-3px);
}

.hm-v3-academia-grid > a:hover::before,
.hm-v3-academia-grid > a:focus-visible::before {
	transform: scaleX(1);
}

.hm-v3-academia-grid > a:hover h3,
.hm-v3-academia-grid > a:focus-visible h3 {
	color: var(--hm-v3-wine);
	transform: translateX(4px);
}

.hm-v3-academia-grid > a:hover strong,
.hm-v3-academia-grid > a:focus-visible strong {
	letter-spacing: .045em;
	transform: translateX(4px);
}

/* Un tono propio para cada tarjeta de Academia: el vinotinto de Academia en
   Formación y el terracota de Actualidad en Investigación — los mismos dos
   acentos de área que ya usan el menú (.hm-primary-link.is-academia /
   .is-actualidad) y los héroes, no colores nuevos.
   El degradado es el mismo de los encabezados de categoría
   (.hm-v3-archive-intro): 10% del acento arriba a la izquierda hasta blanco,
   que tiñe sin llegar a tarjeta de color — el home no tiene colores marcados. */
.hm-v3-academia-grid > a.is-formacion {
	--hm-card-accent: #6f2c3f;
}

.hm-v3-academia-grid > a.is-investigacion {
	--hm-card-accent: #d3592b;
}

.hm-v3-academia-grid > a.is-formacion,
.hm-v3-academia-grid > a.is-investigacion {
	background: linear-gradient(115deg, color-mix(in srgb, var(--hm-card-accent) 10%, white), #fff 64%);
}

/* El filete de arriba ya no espera al hover: en reposo va a media opacidad,
   lo justo para identificar la tarjeta sin gritar. */
.hm-v3-academia-grid > a.is-formacion::before,
.hm-v3-academia-grid > a.is-investigacion::before {
	transform: scaleX(1);
	background: var(--hm-card-accent);
	opacity: .5;
	transition: opacity .3s ease;
}

.hm-v3-academia-grid > a.is-formacion strong,
.hm-v3-academia-grid > a.is-investigacion strong {
	color: var(--hm-card-accent);
}

.hm-v3-academia-grid > a.is-formacion:hover,
.hm-v3-academia-grid > a.is-formacion:focus-visible,
.hm-v3-academia-grid > a.is-investigacion:hover,
.hm-v3-academia-grid > a.is-investigacion:focus-visible {
	border-color: color-mix(in srgb, var(--hm-card-accent) 45%, white);
	background: linear-gradient(115deg, color-mix(in srgb, var(--hm-card-accent) 16%, white), #fff 64%);
}

.hm-v3-academia-grid > a.is-formacion:hover::before,
.hm-v3-academia-grid > a.is-formacion:focus-visible::before,
.hm-v3-academia-grid > a.is-investigacion:hover::before,
.hm-v3-academia-grid > a.is-investigacion:focus-visible::before {
	opacity: 1;
}

.hm-v3-academia-grid > a.is-formacion:hover h3,
.hm-v3-academia-grid > a.is-formacion:focus-visible h3,
.hm-v3-academia-grid > a.is-investigacion:hover h3,
.hm-v3-academia-grid > a.is-investigacion:focus-visible h3 {
	color: var(--hm-card-accent);
}

.hm-v3-explore {
	padding-bottom: clamp(4rem, 8vw, 8rem) !important;
}

.hm-v3-explore-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .8rem;
}

.hm-v3-explore-grid a {
	display: flex;
	min-height: 78px;
	align-items: center;
	justify-content: space-between;
	padding: 1.25rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
	color: inherit;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.25rem;
	text-decoration: none !important;
	box-shadow: inset 0 0 0 0 var(--hm-v3-wine), 0 0 0 rgba(32,29,27,0);
	transition:
		color .28s ease,
		border-color .28s ease,
		box-shadow .38s cubic-bezier(.22,1,.36,1),
		transform .38s cubic-bezier(.22,1,.36,1);
}

.hm-v3-explore-grid a span {
	display: grid;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	border: 1px solid currentColor;
	border-radius: 50%;
	place-items: center;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .9rem;
	transition:
		color .28s ease,
		background-color .28s ease,
		transform .38s cubic-bezier(.22,1,.36,1);
}

.hm-v3-explore-grid a:hover,
.hm-v3-explore-grid a:focus-visible {
	border-color: var(--hm-v3-wine);
	box-shadow:
		inset 0 -90px 0 0 var(--hm-v3-wine),
		0 14px 28px rgba(71,29,45,.14);
	color: #fff !important;
	transform: translateY(-4px);
}

.hm-v3-explore-grid a:hover span,
.hm-v3-explore-grid a:focus-visible span {
	background: #fff;
	color: var(--hm-v3-wine);
	transform: translateX(5px) rotate(-5deg);
}

@media (max-width: 900px) {
	.hm-v3-current-grid {
		grid-template-columns: 1fr;
	}

	.hm-v3-secondary-track {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
	}

	.hm-v3-secondary-track .hm-v3-compact-card {
		flex: 0 0 min(78vw, 420px);
		scroll-snap-align: start;
	}

	.hm-v3-secondary-track .hm-v3-compact-card > .hm-card-body {
		grid-template-columns: 42% minmax(0, 1fr);
		grid-template-rows: auto;
	}

	.hm-v3-secondary-track .hm-v3-compact-media {
		aspect-ratio: auto;
		min-height: 140px;
	}

	.hm-v3-card-grid,
	.hm-v3-card-grid.is-featured-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hm-v3-card-grid .hm-v3-card:first-child {
		grid-column: 1 / -1;
	}

	.hm-v3-special-grid,
	.hm-v3-academia-grid {
		grid-template-columns: 1fr;
	}

	.hm-v3-special-card {
		min-height: 240px;
	}
}

@media (max-width: 680px) {
	.hm-home-v3 .hm-shell {
		width: min(100% - 28px, 1240px);
	}

	.hm-home-v3 section,
	.hm-home-v3 aside {
		padding: 2.25rem 0;
	}

	.hm-v3-section-head {
		align-items: flex-start;
		gap: 1rem;
	}

	.hm-v3-section-head h1,
	.hm-v3-section-head h2 {
		font-size: clamp(1.6rem, 7vw, 2rem);
	}

	/* Las bajadas de sección se muestran también en móvil, en todo el sitio:
	   dicen de qué va cada bloque. Antes se ocultaban y solo se salvaban unas
	   pocas, así que cada sección nueva nacía sin frase en el teléfono. */
	.hm-v3-section-head p {
		font-size: .85rem;
	}

	.hm-v3-more {
		min-height: 40px;
		font-size: .62rem;
	}

	.hm-v3-lead > .hm-card-body {
		grid-template-rows: auto auto;
	}

	.hm-v3-lead-media {
		min-height: 0;
		aspect-ratio: 4 / 3;
	}

	.hm-v3-lead-copy {
		padding: 1.15rem;
	}

	.hm-v3-lead-copy h2 {
		font-size: clamp(1.5rem, 6vw, 1.9rem);
		line-height: 1.15;
		-webkit-line-clamp: 4;
	}

	.hm-v3-lead-copy p {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}

	.hm-v3-secondary-track .hm-v3-compact-card {
		flex-basis: min(88vw, 380px);
	}

	.hm-v3-card-grid,
	.hm-v3-card-grid.is-featured-grid {
		display: grid;
		grid-template-columns: 1fr;
	}

	.hm-v3-card-grid .hm-v3-card:first-child {
		grid-column: auto;
	}

	.hm-v3-card-grid .hm-v3-card:not(:first-child) > a,
	.hm-v3-card-grid .hm-v3-card:not(:first-child) > .hm-card-body {
		grid-template-columns: 42% 1fr;
		grid-template-rows: auto;
	}

	.hm-v3-card-grid .hm-v3-card:not(:first-child) .hm-v3-card-media {
		aspect-ratio: 4 / 3;
	}

	.hm-v3-card-grid .hm-v3-card:not(:first-child) .hm-v3-card-copy {
		padding: .9rem;
	}

	.hm-v3-card-grid .hm-v3-card:not(:first-child) h3 {
		margin-bottom: 1rem;
		font-size: 1.08rem;
	}

	/* Desaparición y Justicia: todas las tarjetas se apilan igual que la
	 * primera (imagen completa arriba, texto abajo). El formato horizontal
	 * de miniatura chica + texto angosto solo tiene sentido en Memorias
	 * (is-editorial-grid), que ya funciona como una lista compacta. */
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:not(:first-child) > a,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:not(:first-child) > .hm-card-body {
		grid-template-columns: 1fr;
		grid-template-rows: auto 1fr;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:not(:first-child) .hm-v3-card-media {
		aspect-ratio: 16 / 10;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:not(:first-child) .hm-v3-card-copy {
		padding: 1rem;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:nth-child(2) {
		transform: none;
	}

	.hm-v3-compact-columns {
		grid-template-columns: 1fr;
	}

	.hm-v3-compact-group {
		padding: 1rem;
	}

	.hm-v3-banner .hm-shell {
		min-height: 0;
		align-items: flex-start;
		flex-direction: column;
		padding: 1.3rem;
	}

	.hm-v3-banner-primary .hm-shell {
		display: grid;
		height: auto;
		grid-template-columns: 1fr;
		gap: 0;
		padding: 0;
	}

	.hm-v3-banner-primary .hm-v3-banner-media {
		width: 100%;
		height: 135px;
		min-height: 0;
		aspect-ratio: 16 / 9;
	}

	.hm-v3-banner-primary .hm-v3-banner-copy {
		padding: 1.3rem 1.25rem 1.8rem;
	}

	.hm-v3-banner-primary .hm-v3-banner-copy strong {
		max-width: 20ch;
		font-size: clamp(1.45rem, 7vw, 1.75rem);
		line-height: 1.04;
	}

	.hm-v3-banner-primary .hm-v3-banner-copy p {
		margin: .7rem 0 1rem;
		font-size: .88rem;
		line-height: 1.45;
	}

	.hm-v3-banner-primary .hm-v3-banner-copy > a {
		width: fit-content;
		min-height: 42px;
		margin-bottom: .1rem;
		justify-content: space-between;
		gap: 2rem;
		padding: .7rem .9rem;
	}

	.hm-v3-banner strong {
		font-size: 1.25rem;
	}

	.hm-v3-podcast-track {
		grid-template-columns: none;
		grid-auto-columns: min(72vw, 260px);
		grid-auto-flow: column;
	}

	.hm-v3-explore-grid {
		grid-template-columns: 1fr 1fr;
	}

	.hm-v3-explore-grid a {
		min-height: 64px;
		padding: 1rem;
		font-size: 1rem;
	}
}

/* Ajustes editoriales: paneles recientes, libros y lateral de archivo. */
@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		position: relative;
		display: block;
		height: 100%;
		min-height: 0;
		overflow: hidden;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-media {
		position: absolute;
		inset: 0;
		height: 100%;
		transition: transform .55s cubic-bezier(.22, 1, .36, 1);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		position: absolute !important;
		z-index: 2;
		inset: auto 0 0;
		height: 55% !important;
		padding: .9rem 1rem;
		overflow: hidden;
		background: rgb(255 255 255 / 98%);
		transition: height .55s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
		display: block;
		max-height: 0;
		margin: 0;
		overflow: hidden;
		opacity: 0;
		font-size: .72rem;
		line-height: 1.4;
		transition: max-height .45s cubic-bezier(.22, 1, .36, 1), margin .35s ease, opacity .3s ease;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: 78% !important;
		box-shadow: 0 -18px 32px rgb(32 29 27 / 13%);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-media {
		transform: scale(.96);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		display: block;
		max-height: 7rem;
		margin-top: .45rem;
		opacity: 1;
	}
}

/* La portada y su título forman una sola pieza; el título aparece sobre la
 * propia cubierta y no al fondo de una columna estirada. */
.hm-v3-books-track {
	align-items: start;
}

.hm-v3-books-track .hm-v3-book-card,
.hm-v3-books-track .hm-v3-book-card > a {
	height: clamp(18rem, 30vw, 28rem);
}

.hm-v3-books-track .hm-v3-book-card .hm-v3-book-cover {
	height: 100%;
}

/* Más recientes: lista vertical de lectura rápida con miniatura 4:3. */
@media (min-width: 901px) {
	.hm-v3-archive-recent {
		display: grid;
		grid-template-rows: auto repeat(5, minmax(0, 1fr));
		gap: 0;
		padding: 1.25rem;
	}

	.hm-v3-archive-recent > a {
		position: relative;
		display: grid;
		grid-template-columns: 6.25rem minmax(0, 1fr);
		align-items: stretch;
		min-height: 0;
		overflow: hidden;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-media {
		position: relative;
		inset: auto;
		width: 100%;
		height: 100%;
		min-height: 5.6rem;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		position: relative;
		inset: auto;
		height: auto;
		min-width: 0;
		padding: .65rem .75rem;
		justify-content: center;
		background: #fff;
		transition: background-color .3s ease, transform .35s cubic-bezier(.22, 1, .36, 1);
	}

	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		height: auto;
		background: #f7f5f1;
		box-shadow: none;
		transform: translateX(-.25rem);
	}
}

@media (max-width: 620px) {
	.hm-v3-books-track .hm-v3-book-card,
	.hm-v3-books-track .hm-v3-book-card > a {
		height: 20rem;
	}
}

/* Especiales: mosaico 3+2 (ver spans en .hm-editorial-landing-card, más abajo
 * en este archivo) con foto a sangre y un color de acento propio por tarjeta
 * — antes esto forzaba 5 columnas iguales con las portadas en una caja gris
 * (letterbox), lo que aplanaba visualmente la sección entera. */

/* La lámina de las cinco historias del inicio reserva el título completo en
 * reposo. El resumen se despliega progresivamente, sin ocupar espacio oculto
 * ni provocar un salto al retirar el puntero. */
@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		height: 54% !important;
		transition:
			height 880ms cubic-bezier(.16, 1, .3, 1),
			box-shadow 720ms ease,
			padding 720ms cubic-bezier(.16, 1, .3, 1);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
		display: -webkit-box;
		max-height: 0;
		margin: 0;
		overflow: hidden;
		opacity: 0;
		transform: translate3d(0, 8px, 0);
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 5;
		transition:
			max-height 820ms cubic-bezier(.16, 1, .3, 1),
			margin 720ms cubic-bezier(.16, 1, .3, 1),
			opacity 520ms ease,
			transform 720ms cubic-bezier(.16, 1, .3, 1);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: 82% !important;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 6.5rem;
		margin: .55rem 0 0;
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

/* Mosaico: la primera historia del bloque compacto ocupa un área grande,
 * así que las tarjetas ya no deben forzarse todas a la misma altura. */
@media (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list {
		align-items: stretch;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		height: 100%;
		min-height: 0;
	}
}

.hm-pdf-home .hm-v3-lead,
.hm-pdf-home .hm-v3-lead .hm-latest-copy {
	background: #fff;
}

.hm-pdf-home .hm-latest-story h3 {
	overflow: visible;
	text-overflow: clip;
	-webkit-line-clamp: unset;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card.is-title-long h3 {
	font-size: .91rem;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card.is-title-xlong h3 {
	font-size: .84rem;
}

/* Lateral de archivos: la copia blanca asciende sobre la fotografía sin
 * cambiar la altura del panel ni recortar títulos o palabras. */
@media (min-width: 901px) {
	.hm-v3-archive-recent {
		display: flex;
		padding: 1.25rem;
		flex-direction: column;
	}

	.hm-v3-archive-recent > h2 {
		flex: 0 0 auto;
	}

	.hm-v3-archive-recent > a {
		position: relative;
		display: block;
		min-height: 0;
		padding: 0;
		flex: 1 1 0;
		overflow: hidden;
		border-top: 1px solid var(--hm-v3-line);
	}

	.hm-v3-archive-recent > a .hm-v3-recent-media {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-media img {
		width: 100%;
		height: 100%;
		object-fit: cover !important;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		position: absolute;
		z-index: 2;
		inset: auto 0 0;
		display: flex;
		height: 62%;
		width: 100%;
		padding: .65rem .75rem;
		flex-direction: column;
		aspect-ratio: auto;
		overflow: hidden;
		background: rgba(255, 255, 255, .98);
		transition: height .55s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy small {
		margin-bottom: .2rem;
		font-size: .58rem;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy strong {
		display: block;
		overflow: visible;
		font-size: clamp(.72rem, .8vw, .86rem);
		line-height: 1.05;
		-webkit-line-clamp: unset;
	}
	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		height: 100%;
		box-shadow: 0 -18px 32px rgba(32, 29, 27, .13);
	}
}

/* Especial Universidad de Antioquia: la sección de la línea de tiempo es un
   split de dos columnas — texto a la izquierda, fotografía a la derecha — que
   en móvil se apila con la imagen primero, porque es la que da contexto al
   titular antes de leer los dos párrafos. */
.hm-udea-timeline {
	padding: clamp(2.75rem, 5vw, 4.75rem) 0;
	border-bottom: 1px solid var(--hm-v3-line);
}

.hm-udea-timeline > .hm-shell {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: center;
}

.hm-udea-timeline-copy h2 {
	margin: 0 0 1.1rem;
	color: var(--hm-v3-ink);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.6rem, 2.6vw, 2.4rem);
	font-weight: 650;
	letter-spacing: -.03em;
	line-height: 1.08;
}

.hm-udea-timeline-copy p {
	margin: 0 0 .95rem;
	color: var(--hm-v3-muted);
	font-size: clamp(.95rem, 1.15vw, 1.05rem);
	line-height: 1.6;
}

.hm-udea-timeline-cta {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin-top: .6rem;
	padding: .78rem 1.4rem;
	border: 1px solid currentColor;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .72rem;
	font-weight: 600;
	/* Sin uppercase: el texto se escribe desde wp-admin (campo ACF
	 * hm_udea_timeline_link_text) y va en mayúscula sólo la inicial. El
	 * tracking baja a la mitad porque .08em está calibrado para versalitas y
	 * en minúscula abría demasiado las palabras. */
	letter-spacing: .04em;
	transition: background-color .3s ease, color .3s ease;
}

.hm-udea-timeline-cta:hover,
.hm-udea-timeline-cta:focus-visible {
	background: var(--hm-v3-orange);
	border-color: var(--hm-v3-orange);
	color: #fff;
}

.hm-udea-timeline-media {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: #eee9e2;
}

.hm-udea-timeline-media img,
.hm-udea-timeline-media .hm-v3-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 780px) {
	.hm-udea-timeline > .hm-shell {
		grid-template-columns: 1fr;
	}

	.hm-udea-timeline-media {
		order: -1;
		aspect-ratio: 16 / 10;
	}
}

/* Los cinco libros vuelven a Especiales en una escala secundaria y uniforme. */
.hm-editorial-books {
	padding: clamp(2.75rem, 5vw, 4.5rem) 0;
	border-top: 1px solid var(--hm-v3-line);
}

.hm-editorial-books .hm-v3-book-cover {
	min-height: clamp(12rem, 17vw, 16rem);
	padding: .7rem;
	background: #fff;
}

.hm-editorial-books .hm-v3-book-cover img {
	max-height: clamp(11rem, 16vw, 15rem);
}

.hm-editorial-books .hm-v3-book-card h3 {
	font-size: clamp(.88rem, 1.05vw, 1.05rem);
	line-height: 1.15;
}

@media (max-width: 620px) {
	.hm-editorial-books .hm-v3-book-cover {
		min-height: 16rem;
	}

	.hm-editorial-books .hm-v3-book-cover img {
		max-height: 15rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-home-v3 *,
	.hm-home-v3 *::before,
	.hm-home-v3 *::after {
		scroll-behavior: auto !important;
		transition-duration: .001ms !important;
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* Archivo editorial v3. */
.hm-v3-archive {
	--hm-v3-paper: #fff;
	--hm-v3-ink: #201d1b;
	--hm-v3-muted: #6f6963;
	--hm-v3-line: #d8d1c8;
	--hm-v3-orange: #e5532d;
	--hm-v3-wine: #762c43;
	background: var(--hm-v3-paper);
	color: var(--hm-v3-ink);
}

.hm-v3-archive .hm-shell,
.hm-editorial-landing .hm-shell {
	width: min(1240px, calc(100% - 48px));
}

/* Mismo degradado que la portada de Especiales
 * (.hm-editorial-landing-hero), teñido con el terracota de Actualidad: el
 * mismo acento que ya identifica al área en el menú
 * (.hm-primary-link.is-actualidad). El acento se declara aquí y no en
 * .hm-v3-archive porque search.php reutiliza esa clase junto con
 * .hm-editorial-landing, y allí el acento del área es otro.
 * --hm-flame tiñe el cursor del efecto máquina de escribir del <h1>, que
 * por omisión usa el dorado global. */
.hm-v3-archive-intro {
	--hm-archive-accent: var(--hm-color-actualidad);
	--hm-flame: var(--hm-archive-accent);
	padding: clamp(3rem, 7vw, 7rem) 0 2.4rem;
	background: linear-gradient(115deg, color-mix(in srgb, var(--hm-archive-accent) 10%, white), #fff 64%);
	border-bottom: 1px solid var(--hm-v3-line);
}

.hm-v3-breadcrumb {
	display: flex;
	gap: .55rem;
	/* 2rem y no 2,8: es lo que hace falta para que el encabezado de Actualidad,
	   que además carga las pestañas de filtro, quepa en el alto común de los
	   tres encabezados de área sin desbordarlo. */
	margin-bottom: 2rem;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .68rem;
	text-transform: uppercase;
}

/* Mismo ícono que ya identifica la subsección en las pestañas de filtro,
 * pero aquí sin la píldora/fondo — solo la imagen junto al título. */
.hm-v3-archive-title {
	display: flex;
	align-items: center;
	gap: clamp(.75rem, 2vw, 1.5rem);
	margin: .6rem 0;
}

.hm-v3-archive-title-icon {
	flex: none;
	width: clamp(2.6rem, 6vw, 5.5rem);
	height: clamp(2.6rem, 6vw, 5.5rem);
}

.hm-v3-archive-title-icon img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.hm-v3-archive-intro h1 {
	margin: 0;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(3.2rem, 8vw, 7.5rem);
	font-weight: 650;
	letter-spacing: -.055em;
	line-height: .9;
}

.hm-v3-archive-intro > .hm-shell > p {
	max-width: 100%;
	color: var(--hm-v3-muted);
	font-size: clamp(1rem, 1.7vw, 1.25rem);
	line-height: 1.55;
	white-space: nowrap;
}

@media (max-width: 700px) {
	.hm-v3-archive-intro > .hm-shell > p {
		white-space: normal;
	}
}

.hm-v3-archive-tabs {
	display: flex;
	gap: .55rem;
	margin-top: 2rem;
	padding-bottom: .45rem;
	overflow-x: auto;
	scrollbar-width: thin;
}

.hm-v3-archive-tabs a {
	flex: 0 0 auto;
	min-height: 42px;
	padding: .7rem .95rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
	color: #315f68 !important;
	font-size: .78rem;
	font-weight: 650;
	text-decoration: none !important;
}

.hm-v3-archive-tabs a.is-active,
.hm-v3-archive-tabs a:hover,
.hm-v3-archive-tabs a:focus-visible {
	border-color: var(--hm-v3-wine);
	background: var(--hm-v3-wine);
	color: #fff !important;
}

.hm-v3-archive-featured {
	padding: 1.5rem 0 clamp(3rem, 6vw, 6rem);
}

.hm-v3-archive-featured > .hm-shell {
	display: grid;
	grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr);
	gap: 1rem;
}

.hm-v3-archive-lead,
.hm-v3-archive-recent {
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-archive-lead > .hm-card-body {
	display: grid;
	height: 100%;
	grid-template-rows: auto 1fr;
	color: inherit;
}

.hm-v3-archive-lead-media {
	aspect-ratio: 16 / 8.6;
	overflow: hidden;
	background: #ddd7cf;
}

.hm-v3-archive-lead-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hm-v3-archive-lead > .hm-card-body > div:last-child {
	padding: clamp(1.4rem, 3vw, 2.4rem);
}

.hm-v3-archive-lead h2 {
	margin: .8rem 0;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.4rem, 2vw, 1.8rem);
	font-weight: 650;
	letter-spacing: -.045em;
	line-height: 1.1;
}

.hm-v3-archive-lead p {
	color: var(--hm-v3-muted);
}

.hm-v3-archive-recent {
	padding: 1.5rem;
}

.hm-v3-archive-recent > h2 {
	margin: 0 0 1.4rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.8rem;
}

.hm-v3-archive-recent > a {
	display: grid;
	grid-template-columns: 88px 1fr;
	gap: 1rem;
	align-items: center;
	padding: 1rem 0;
	border-top: 1px solid var(--hm-v3-line);
	color: var(--hm-v3-ink) !important;
	text-decoration: none !important;
}

.hm-v3-archive-recent > a > div {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #ddd7cf;
}

/* El item de texto del grid no se encoge por debajo del ancho de su
 * contenido sin esto, y el título se desborda fuera de la tarjeta.
 * No se fuerza "position" aquí a propósito: el hover que hace subir la
 * lámina blanca sobre la miniatura depende de position:absolute en
 * estados posteriores del cascade, y forzarlo lo rompería. */
.hm-v3-archive-recent > a > div:last-child,
.hm-v3-archive-recent > a .hm-v3-recent-copy {
	min-width: 0 !important;
	max-width: 100% !important;
	aspect-ratio: auto !important;
	box-sizing: border-box !important;
	background: transparent;
}

/* Medido con devtools: en reposo, .hm-v3-recent-copy tiene left:6.25rem,
 * right:0 y sin width propio, pero el navegador resuelve el ancho
 * automático mal (usa el ancho completo de la fila en vez de restarle
 * los 6.25rem de la miniatura) y el título se desborda 100px fuera de
 * la tarjeta. Forzar el ancho con calc() en vez de dejarlo en auto lo
 * arregla sin tocar el hover, que sigue expandiendo a 100% aparte.
 *
 * Va dentro de min-width:901px porque la resta solo tiene sentido en la
 * versión de escritorio, donde la copia está posicionada en absolute sobre
 * la fila completa. Por debajo de 901px la copia vive en su propio track
 * de grid (88px 1fr), que ya descontó la miniatura: restarla otra vez
 * dejaba el texto en una letra por línea. El bloque max-width:860px ya
 * corregía eso con width:100%, pero entre 861px y 900px no aplicaba
 * ninguno de los dos y la fila se rompía. */
@media (min-width: 901px) {
	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		width: calc(100% - 6.25rem) !important;
	}

	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		width: 100% !important;
	}
}

.hm-v3-archive-recent img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hm-v3-archive-recent small {
	display: block;
	margin-bottom: .35rem;
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .62rem;
	text-transform: uppercase;
}

.hm-v3-archive-recent strong {
	display: -webkit-box;
	overflow: hidden;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	line-height: 1.1;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	color: var(--hm-v3-ink);
}

/* Hay varias reglas heredadas para este bloque con distinto peso en cada
 * motor de navegador (Chrome vs Firefox resuelven el empate distinto).
 * !important fuerza el mismo resultado en todos, sin borrar las reglas
 * viejas que otros bloques (el hover de la lámina blanca) siguen usando. */
.hm-v3-archive-recent > a .hm-v3-recent-copy strong,
.hm-v3-archive-recent strong {
	display: -webkit-box !important;
	overflow: hidden !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	font-size: .85rem !important;
	line-height: 1.25 !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
	-webkit-box-orient: vertical !important;
	-webkit-line-clamp: 3 !important;
}

.hm-v3-archive-list {
	padding: 0 0 clamp(5rem, 9vw, 9rem);
}

.hm-v3-archive-list.is-search-results {
	padding-top: clamp(2.5rem, 5vw, 4.5rem);
}

/* "Resultados" toma la misma escala que los titulares de las categorías, y
   suelta el borde propio del h2: ahora el título comparte fila con el conteo
   dentro de .hm-v3-section-head, que ya trae su propia línea a todo el ancho
   — con las dos, la del h2 quedaba como un subrayado corto a media altura. */
.hm-v3-archive-list.is-search-results .hm-v3-results-head h2 {
	margin: 0;
	padding-bottom: 0;
	border-bottom: 0;
	font-size: clamp(var(--hm-text-2xl), 3vw, var(--hm-text-4xl));
	line-height: 1.2;
}

.hm-v3-archive-list h2 {
	margin: 0 0 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--hm-v3-line);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(2.2rem, 4vw, 3.7rem);
}

.hm-v3-archive-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

/* Los valores de reserva de cada var() son los que hacen que este bloque
 * funcione fuera del archivo. --hm-v3-ink, --hm-v3-wine, --hm-v3-orange y
 * --hm-v3-muted se declaran dentro de .hm-v3-archive, así que en una página
 * que no tenga ese ancestro —Formación, Investigación— no resolvían y la
 * página actual quedaba con texto blanco sobre fondo transparente: el número
 * desaparecía. Con reserva, quien tenga las variables sigue mandando y el
 * resto cae en los mismos colores. */
.hm-v3-pagination {
	margin-top: 3rem;
}

.hm-v3-pagination .nav-links {
	display: flex;
	width: fit-content;
	align-items: center;
	gap: .15rem;
	margin-inline: auto;
	padding: .45rem;
	border: 1px solid rgba(118,44,67,.28);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(32,29,27,.06);
}

.hm-v3-pagination .page-numbers {
	display: inline-flex;
	min-width: 46px;
	height: 46px;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	padding: 0;
	border-radius: 5px;
	color: var(--hm-v3-ink, #201d1b) !important;
	font-family: var(--hm-font-body);
	font-size: .82rem;
	font-weight: 600;
	line-height: 1;
	vertical-align: middle;
	text-decoration: none !important;
	transition:
		background-color .25s ease,
		color .25s ease,
		transform .3s cubic-bezier(.22,1,.36,1);
}

.hm-v3-pagination .page-numbers.current {
	background: var(--hm-v3-wine, #762c43);
	color: #fff !important;
	box-shadow: inset 0 0 0 1px rgba(229,83,45,.55);
}

.hm-v3-pagination a.page-numbers:hover,
.hm-v3-pagination a.page-numbers:focus-visible {
	background: #f4e8e4;
	color: var(--hm-v3-wine, #762c43) !important;
	transform: translateY(-2px);
}

.hm-v3-pagination .page-numbers.dots {
	color: var(--hm-v3-muted, #6f6963) !important;
}

.hm-v3-pagination .page-numbers.prev,
.hm-v3-pagination .page-numbers.next {
	color: var(--hm-v3-orange, #e5532d) !important;
}

.hm-v3-pagination-mobile {
	display: none;
}

.hm-v3-empty {
	padding: 3rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
	text-align: center;
}

@media (max-width: 860px) {
	.hm-v3-archive-featured > .hm-shell {
		grid-template-columns: 1fr;
	}

	.hm-v3-archive-recent {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: .8rem;
	}

	.hm-v3-archive-recent > h2 {
		grid-column: 1 / -1;
	}

	.hm-v3-archive-recent > a {
		grid-template-columns: 1fr;
	}

	/* La regla desktop de más arriba (width: calc(100% - 6.25rem) !important)
	 * es para el overlay absoluto de esa versión, donde la miniatura mide
	 * siempre 6.25rem. Acá la columna de texto ya vive en su propio track de
	 * grid (88px 1fr o 1fr, según el ancho), así que esa resta se aplicaba
	 * dos veces y dejaba el texto comprimido a ~1 palabra por línea. */
	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		width: 100% !important;
	}

	.hm-v3-archive-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.hm-v3-pagination-desktop {
		display: none;
	}

	.hm-v3-pagination-mobile {
		display: block;
	}

	.hm-v3-pagination .nav-links {
		max-width: 100%;
		padding: .35rem;
		overflow-x: auto;
	}

	.hm-v3-pagination .page-numbers {
		min-width: 38px;
		height: 40px;
		align-items: center;
		justify-content: center;
		padding: 0;
		line-height: 1;
	}

	.hm-v3-archive .hm-shell,
	.hm-editorial-landing .hm-shell {
		width: min(100% - 28px, 1240px);
	}

	.hm-v3-archive-tabs {
		--hm-tabs-gutter: 14px;
	}

	.hm-v3-archive-intro {
		padding-top: 2.5rem;
	}

	.hm-v3-breadcrumb {
		margin-bottom: 2rem;
	}

	.hm-v3-archive-intro h1 {
		font-size: clamp(3rem, 17vw, 5rem);
	}

	.hm-v3-archive-featured > .hm-shell,
	.hm-v3-archive-recent,
	.hm-v3-archive-grid {
		grid-template-columns: 1fr;
	}

	.hm-v3-archive-lead-media {
		aspect-ratio: 4 / 3;
	}

	.hm-v3-archive-lead h2 {
		font-size: 1.8rem;
	}

	.hm-v3-archive-recent > h2 {
		grid-column: auto;
	}

	.hm-v3-archive-recent > a {
		grid-template-columns: 88px 1fr;
	}
}

/* Publicación editorial v3. */
.hm-v3-single {
	--hm-v3-paper: #fff;
	--hm-v3-ink: #201d1b;
	--hm-v3-muted: #6f6963;
	--hm-v3-line: #d8d1c8;
	--hm-v3-orange: #e5532d;
	background: var(--hm-v3-paper);
	color: var(--hm-v3-ink);
}

.hm-v3-single .hm-shell {
	width: min(1120px, calc(100% - 48px));
}

.hm-v3-article-header {
	padding-top: clamp(3rem, 7vw, 7rem);
}

.hm-v3-article-header h1 {
	max-width: 1050px;
	margin: .8rem 0 1.3rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(3rem, 7vw, 6.7rem);
	font-weight: 650;
	letter-spacing: -.055em;
	line-height: .92;
}

/* Reproductores de audio incrustados dentro del cuerpo del articulo. */
.hm-audio-embed {
	margin: 1.75rem 0;
	border-radius: 12px;
	overflow: hidden;
	background: rgba(32, 29, 27, .04);
}

.hm-audio-embed iframe {
	display: block;
	width: 100%;
	border: 0;
}

.hm-v3-article-deck {
	max-width: 820px;
	margin: 0;
	color: var(--hm-v3-muted);
	font-size: clamp(1.1rem, 2vw, 1.45rem);
	line-height: 1.5;
}

.hm-v3-article-meta {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
	margin: 2.5rem 0;
}

.hm-v3-article-meta > div:first-child {
	display: grid;
	gap: .4rem;
}

.hm-v3-article-meta span {
	color: var(--hm-v3-muted);
	font-family: "Roboto Mono", monospace;
	font-size: .68rem;
}

.hm-v3-reading-tools {
	display: flex;
	align-items: center;
	gap: .2rem;
	padding: .35rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-reading-tools button {
	min-width: 40px;
	min-height: 40px;
	padding: .5rem;
	border: 0;
	background: transparent;
	color: var(--hm-v3-ink);
	font-size: .75rem;
	font-weight: 650;
}

.hm-v3-reading-tools button:last-child {
	width: auto;
	color: var(--hm-v3-orange);
}

.hm-v3-reading-tools button:hover,
.hm-v3-reading-tools button:focus-visible {
	background: #eee9e2;
}

.hm-v3-article-cover {
	margin-top: 1rem;
	padding: 1rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-article-cover img {
	width: 100%;
	max-height: 720px;
	object-fit: cover;
}

.hm-v3-article-cover figcaption {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding-top: .8rem;
	color: var(--hm-v3-muted);
	font-size: .68rem;
}

.hm-v3-article-layout {
	display: grid;
	grid-template-columns: 56px minmax(0, 720px);
	gap: 2rem;
	justify-content: center;
	padding: clamp(3.5rem, 7vw, 7rem) 0;
}

.hm-v3-share-rail {
	position: sticky;
	top: 120px;
	display: flex;
	height: fit-content;
	flex-direction: column;
	align-items: center;
	gap: .6rem;
	padding: .7rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-share-rail a {
	display: grid;
	width: 36px;
	height: 36px;
	place-items: center;
	color: var(--hm-v3-ink);
	font-family: "Roboto Mono", monospace;
	font-size: .7rem;
}

.hm-v3-article-body {
	--hm-reading-scale: 1;
	min-width: 0;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: calc(1.18rem * var(--hm-reading-scale));
	line-height: 1.72;
}

.hm-v3-article-body > :first-child {
	font-size: calc(1.32rem * var(--hm-reading-scale));
}

.hm-v3-article-body h2 {
	margin: 2.8rem 0 1rem;
	font-size: calc(2rem * var(--hm-reading-scale));
	line-height: 1.1;
}

.hm-v3-article-body h3 {
	margin: 2.2rem 0 .8rem;
	font-size: calc(1.5rem * var(--hm-reading-scale));
}

.hm-v3-article-body blockquote {
	margin: 2.6rem 0;
	padding: 1.8rem;
	border: 0;
	border-radius: 4px;
	background: #f1cec3;
	color: var(--hm-v3-ink);
	font-size: calc(1.45rem * var(--hm-reading-scale));
	font-weight: 620;
	line-height: 1.3;
}

.hm-v3-article-body img {
	height: auto;
	max-width: 100%;
	border-radius: 3px;
}

.hm-v3-article-footer {
	display: grid;
	max-width: 720px;
	gap: 2rem;
	padding-bottom: clamp(4rem, 8vw, 7rem);
}

.hm-v3-article-tags > div {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: .8rem;
}

.hm-v3-article-tags a {
	padding: .6rem 1rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 999px;
	background: #fff;
	color: var(--hm-v3-ink);
	font-size: .75rem;
}

.hm-v3-author-card {
	display: grid;
	grid-template-columns: 112px 1fr;
	gap: 1.5rem;
	align-items: center;
	padding: 1.5rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
}

.hm-v3-author-card img {
	border-radius: 50%;
}

.hm-v3-author-card h2 {
	margin: 0 0 .4rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.65rem;
}

.hm-v3-author-card p {
	margin: 0 0 .8rem;
	color: var(--hm-v3-muted);
}

.hm-v3-author-card a {
	color: var(--hm-v3-orange);
	font-family: "Roboto Mono", monospace;
	font-size: .68rem;
	font-weight: 600;
	text-transform: uppercase;
}

.hm-v3-related {
	padding: clamp(3rem, 6vw, 6rem) 0;
	border-top: 1px solid var(--hm-v3-line);
}

/* En móvil el encabezado de sección llega a 2rem y el h1 de la noticia se
   queda en ~1.95rem: entre 460 y 680px "Relacionados" quedaba más grande que
   el título. Se topa en 1.75rem, el mínimo que ya tiene en escritorio. */
@media (max-width: 680px) {
	.hm-v3-related .hm-v3-section-head h2 {
		font-size: clamp(1.6rem, 6vw, 1.75rem);
	}
}

@media (max-width: 680px) {
	.hm-v3-single .hm-shell {
		width: min(100% - 28px, 1120px);
	}

	.hm-v3-article-header h1 {
		font-size: clamp(2.7rem, 14vw, 4.4rem);
	}

	.hm-v3-article-meta {
		align-items: flex-start;
		flex-direction: column;
	}

	.hm-v3-reading-tools {
		width: 100%;
		justify-content: space-between;
	}

	.hm-v3-article-cover {
		padding: .6rem;
	}

	.hm-v3-article-cover img {
		aspect-ratio: 4 / 3;
		object-fit: cover;
	}

	.hm-v3-article-cover figcaption {
		flex-direction: column;
	}

	.hm-v3-article-layout {
		display: block;
		padding: 3rem 0;
	}

	.hm-v3-share-rail {
		position: static;
		flex-direction: row;
		width: fit-content;
		margin-bottom: 2rem;
	}

	.hm-v3-article-body {
		font-size: calc(1.08rem * var(--hm-reading-scale));
	}

	.hm-v3-author-card {
		grid-template-columns: 72px 1fr;
	}

	.hm-v3-author-card img {
		width: 72px;
		height: 72px;
	}
}

/* Tipografía editorial en caja natural.
 * La jerarquía se construye con peso, tamaño y ritmo, no con altas sostenidas. */.hm-header-search label,
.hm-header-search button,
.hm-eyebrow,
.hm-category-label,
.hm-news-category,
.hm-news-action,
.hm-promo-copy > span,
.hm-promo-action,
.hm-v3-meta,
.hm-v3-more,
.hm-v3-banner span,
.hm-v3-banner a,
.hm-v3-special-card > span,
.hm-v3-special-card strong,
.hm-v3-academia-grid strong,
.hm-v3-breadcrumb,
.hm-v3-archive-tabs a,
.hm-v3-archive-recent small,
.hm-v3-author-card a,
.hm-v3-reading-tools button,
.hm-v3-article-tags .hm-v3-meta {
	letter-spacing: .015em;
	text-transform: none;
}

/* Las etiquetas editoriales de las tarjetas conservan caja natural.
 * Esta regla específica evita que estilos heredados del componente las conviertan en versales. */
.hm-v3-podcast-card .hm-v3-meta,
.hm-v3-card .hm-v3-meta,
.hm-v3-compact-card .hm-v3-meta,
.hm-v3-lead .hm-v3-meta {
	letter-spacing: .015em;
	text-transform: none !important;
}

/* Memorias: una historia dominante y dos lecturas secundarias en lista. */
@media (min-width: 901px) {
	.hm-v3-card-grid.is-editorial-grid {
		grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
		grid-template-rows: repeat(3, minmax(0, 1fr));
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child {
		grid-row: 1 / 4;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child > .hm-card-body {
		grid-template-rows: minmax(320px, 1fr) auto;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child .hm-v3-card-media {
		aspect-ratio: 16 / 10;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > .hm-card-body {
		grid-template-columns: 38% minmax(0, 1fr);
		grid-template-rows: 1fr;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) .hm-v3-card-media {
		height: 100%;
		aspect-ratio: auto;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) .hm-v3-card-copy {
		padding: .8rem .9rem;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) h3 {
		margin: .4rem 0 .7rem;
		font-size: clamp(.98rem, 1.25vw, 1.22rem);
		-webkit-line-clamp: 3;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card-excerpt,
	.hm-v3-compact-list .hm-v3-compact-excerpt {
		display: block;
		max-height: 0;
		margin: 0;
		overflow: hidden;
		opacity: 0;
		color: var(--hm-v3-muted);
		font-size: .78rem;
		line-height: 1.4;
		transform: translateY(10px);
		transition:
			max-height .48s cubic-bezier(.22,1,.36,1),
			margin .35s ease,
			opacity .3s ease,
			transform .42s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:focus-within .hm-v3-card-excerpt,
	.hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 6rem;
		margin-bottom: .7rem;
		opacity: 1;
		transform: translateY(0);
	}
}

/* Los títulos editoriales se muestran completos en todos los breakpoints. */
.hm-v3-card h3,
.hm-v3-compact-card h3,
.hm-v3-podcast-card h3,
.hm-v3-archive-recent strong,
.hm-v3-lead-copy h2 {
	display: block;
	overflow: visible;
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
	-webkit-line-clamp: unset;
}

/* La entradilla de la primera tarjeta ya no se fuerza visible.
   El bloque de texto esta topado al 48% del alto de la tarjeta y con
   overflow:hidden, asi que un resumen de tres lineas (61px en vez de 41)
   desbordaba 15px y se comia la fecha. Medido en la seccion Justicia. */

@media (min-width: 901px) {
	/* Memorias mantiene una altura estable: el hover lateral no recalcula filas. */
	.hm-v3-card-grid.is-editorial-grid {
		height: clamp(720px, 64vw, 820px);
		grid-template-rows: repeat(3, minmax(0, 1fr));
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card {
		min-height: 0;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child > .hm-card-body {
		grid-template-rows: minmax(0, 1fr) auto;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child .hm-v3-card-media {
		height: 100%;
		aspect-ratio: auto;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:first-child .hm-v3-card-copy {
		padding: 1.35rem 1.5rem 1.25rem;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) {
		overflow: hidden;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > .hm-card-body {
		overflow: hidden;
		grid-template-columns: 38% minmax(0, 1fr);
		transition: grid-template-columns .5s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) .hm-v3-card-copy {
		min-width: 0;
		height: 100%;
		overflow: hidden;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):hover > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):hover > .hm-card-body,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):focus-within > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):focus-within > .hm-card-body {
		grid-template-columns: 30% minmax(0, 1fr);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):hover h3,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):focus-within h3 {
		font-size: 1.02rem;
	}
}

/* Escala adaptativa para titulares extensos: se reduce antes de recortarse. */
.hm-v3-card.is-title-long h3,
.hm-v3-compact-card.is-title-long h3 {
	font-size: clamp(.98rem, 1.45vw, 1.22rem);
	line-height: 1.08;
}

.hm-v3-card.is-title-xlong h3,
.hm-v3-compact-card.is-title-xlong h3 {
	font-size: clamp(.9rem, 1.25vw, 1.08rem);
	line-height: 1.1;
}

/* Listas homogéneas (resultados de búsqueda, "Más sobre…" de un especial):
   un solo tamaño de titular para todas las tarjetas. La escala adaptativa por
   longitud (is-title-long / is-title-xlong) tiene sentido en las portadas
   editoriales, donde cada tarjeta ocupa una posición distinta, pero en una
   retícula pareja hacía que titulares vecinos se vieran de tres tamaños
   diferentes. La especificidad extra es deliberada: debe ganarle a esas dos
   clases y a sus ajustes por breakpoint. */
.hm-v3-archive-list.is-search-results .hm-v3-card h3,
.hm-v3-archive-list.is-search-results .hm-v3-card.is-title-long h3,
.hm-v3-archive-list.is-search-results .hm-v3-card.is-title-xlong h3,
.is-uniform-titles .hm-v3-card h3,
.is-uniform-titles .hm-v3-card.is-title-long h3,
.is-uniform-titles .hm-v3-card.is-title-xlong h3 {
	font-size: clamp(.9rem, 1.25vw, 1.08rem);
	line-height: 1.15;
}

.hm-v3-card h3,
.hm-v3-compact-card h3,
.hm-v3-card-excerpt,
	.hm-v3-compact-excerpt {
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
}

@media (min-width: 901px) {
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card:focus-within .hm-v3-card-excerpt,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:hover .hm-v3-card-excerpt,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:focus-within .hm-v3-card-excerpt,
	.hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 11rem;
	}
}

@media (max-width: 900px) {
	.hm-v3-card h3,
	.hm-v3-compact-card h3 {
		height: auto;
		max-height: none;
		overflow: visible;
	}

	.hm-v3-card.is-title-long h3,
	.hm-v3-compact-card.is-title-long h3 {
		font-size: 1rem;
	}

	.hm-v3-card.is-title-xlong h3,
	.hm-v3-compact-card.is-title-xlong h3 {
		font-size: .92rem;
	}
}

@media (min-width: 901px) {
	/* Reparación y Derechos Humanos: panel ascendente sin reflujo de la grilla. */
	.hm-v3-compact-group {
		padding: 1.15rem;
	}

	.hm-v3-compact-list {
		grid-template-rows: repeat(2, clamp(300px, 26vw, 340px));
		gap: .65rem;
	}

	.hm-v3-compact-list .hm-v3-compact-card {
		height: 100%;
		overflow: hidden;
	}

	.hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		display: grid;
		height: 100%;
		overflow: hidden;
		grid-template-columns: 1fr;
		grid-template-rows: minmax(0, 58%) minmax(0, 42%);
		transition: grid-template-rows .55s cubic-bezier(.22,1,.36,1);
	}

	.hm-v3-compact-list .hm-v3-compact-media {
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
	}

	.hm-v3-compact-list .hm-v3-compact-card > .hm-card-body > div:last-child {
		position: relative;
		z-index: 2;
		height: 100%;
		overflow: hidden;
		padding: .8rem .9rem;
		background: rgba(255,255,255,.98);
		transition: box-shadow .4s ease;
	}

	.hm-v3-compact-list .hm-v3-compact-card:hover > .hm-card-body,
	.hm-v3-compact-list .hm-v3-compact-card:focus-within > .hm-card-body {
		grid-template-rows: minmax(0, 40%) minmax(0, 60%);
	}

	.hm-v3-compact-list .hm-v3-compact-card:hover > .hm-card-body > div:last-child,
	.hm-v3-compact-list .hm-v3-compact-card:focus-within > .hm-card-body > div:last-child {
		box-shadow: 0 -20px 36px rgba(32,29,27,.11);
	}

	.hm-v3-compact-list .hm-v3-compact-card:hover h3,
	.hm-v3-compact-list .hm-v3-compact-card:focus-within h3 {
		font-size: clamp(.92rem, 1.15vw, 1.08rem);
	}
}

@media (min-width: 901px) {
	/* La portada dominante de Desaparición es informativa, no interactiva. */
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child > a,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child > .hm-card-body,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:hover > a,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:hover > .hm-card-body,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:focus-within > a,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:focus-within > .hm-card-body {
		grid-template-rows: minmax(0, 52%) minmax(0, 48%);
		transition: none;
	}

	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:hover img,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:focus-within img {
		transform: none;
	}

	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:hover .hm-v3-card-copy,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:focus-within .hm-v3-card-copy {
		box-shadow: none;
	}

	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:hover h3,
	.hm-v3-card-grid.is-featured-grid .hm-v3-card:first-child:focus-within h3 {
		font-size: clamp(1.5rem, 2.3vw, 2.1rem);
	}
}

@media (min-width: 901px) {
	/* Memorias compacta: una portada y tres lecturas visibles en una pantalla. */
	.hm-v3-card-grid.is-editorial-grid {
		height: clamp(500px, 44vw, 560px);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) > .hm-card-body {
		grid-template-columns: 34% minmax(0, 1fr);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):hover > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):hover > .hm-card-body,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):focus-within > a,
	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child):focus-within > .hm-card-body {
		grid-template-columns: 22% minmax(0, 1fr);
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) h3 {
		font-size: clamp(.92rem, 1.12vw, 1.08rem);
		line-height: 1.05;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) time {
		margin-top: .5rem;
	}

	.hm-v3-card-grid.is-editorial-grid .hm-v3-card:not(:first-child) .hm-v3-card-excerpt {
		font-size: .72rem;
		line-height: 1.32;
	}
}

/* Paginación editorial: neutraliza la métrica vertical heredada de WordPress. */
.hm-v3-pagination .nav-links > .page-numbers {
	display: inline-flex !important;
	box-sizing: border-box;
	align-items: center !important;
	justify-content: center !important;
	padding-block: 0 !important;
	line-height: 1 !important;
	vertical-align: middle;
}

.hm-v3-pagination .nav-links > .page-numbers::first-line {
	line-height: 1;
}

/* Iconografía social y contraste estable sobre el footer vino. */
.hm-global-footer .hm-footer-group h2,
.hm-global-footer .hm-footer-toggle,
.hm-global-footer .hm-footer-toggle:hover,
.hm-global-footer .hm-footer-toggle:focus-visible {
	color: #fffaf3 !important;
}

.hm-footer-social-link svg {
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	overflow: visible;
	fill: currentColor;
	stroke: currentColor;
	stroke-width: 1.7;
}

.hm-footer-social-link svg rect,
.hm-footer-social-link svg circle {
	fill: none;
}

/* ================================================================
 * Medios completos, tarjetas estables y reproductor editorial
 * ================================================================ */

/* Ninguna portada editorial se recorta: el lienzo conserva la proporción
 * original y absorbe las diferencias de formato con un fondo neutro. */
.hm-v3-lead-media,
.hm-v3-card-media,
.hm-v3-compact-media,
.hm-v3-podcast-art,
.hm-v3-archive-lead-media,
.hm-v3-archive-recent > a > div:first-child,
.hm-course-card-image,
.hm-news-image {
	display: grid;
	place-items: center;
	background: #f2eee8;
}

.hm-v3-lead-media img,
.hm-v3-card-media img,
.hm-v3-compact-media img,
.hm-v3-podcast-art img,
.hm-v3-archive-lead-media img,
.hm-v3-archive-recent img,
.hm-course-card-image img,
.hm-news-image img {
	width: 100%;
	height: 100%;
	object-fit: contain !important;
	object-position: center !important;
}

.hm-v3-article-cover {
	background: #f2eee8;
}

.hm-v3-article-cover img,
.hm-v3-article-body img {
	display: block;
	width: auto;
	height: auto !important;
	max-width: 100%;
	max-height: min(78vh, 820px);
	margin-inline: auto;
	object-fit: contain !important;
	object-position: center !important;
}

@media (min-width: 901px) {
	/* El panel queda anclado abajo y crece sobre la imagen. La tarjeta nunca
	 * cambia de altura, por lo que no aparecen huecos ni saltos en la grilla. */
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card,
	.hm-v3-archive-grid .hm-v3-card {
		height: clamp(420px, 37vw, 470px);
		min-height: 0;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card > .hm-card-body {
		position: relative;
		display: block;
		height: 100%;
		overflow: hidden;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card-media,
	.hm-v3-archive-grid .hm-v3-card-media {
		position: absolute;
		inset: 0 0 auto;
		height: 54%;
		aspect-ratio: auto;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card-copy {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 2;
		height: 46%;
		min-height: 0;
		overflow: hidden;
		background: rgba(255,255,255,.985);
		transition: height .48s cubic-bezier(.22,1,.36,1), box-shadow .35s ease;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover .hm-v3-card-copy,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card:hover .hm-v3-card-copy,
	.hm-v3-archive-grid .hm-v3-card:focus-within .hm-v3-card-copy {
		height: 70%;
		box-shadow: 0 -18px 36px rgba(32,29,27,.13);
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:hover > .hm-card-body,
	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card:focus-within > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card:hover > .hm-card-body,
	.hm-v3-archive-grid .hm-v3-card:focus-within > .hm-card-body {
		grid-template-rows: none;
	}

	.hm-v3-card-grid:not(.is-editorial-grid) .hm-v3-card-excerpt,
	.hm-v3-archive-grid .hm-v3-card-excerpt {
		flex: 0 1 auto;
	}
}

/* Reproductor Spotify: marca editorial por fuera, reproductor oficial dentro. */
.hm-v3-spotify {
	margin-top: clamp(1.5rem, 3vw, 2.5rem);
	padding: clamp(1.1rem, 2.5vw, 1.8rem);
	border: 1px solid rgba(118,44,67,.24);
	border-radius: 4px;
	background: linear-gradient(120deg, #fff 0%, #f8f3ed 100%);
}

.hm-v3-spotify-header {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--hm-v3-line);
}

.hm-v3-spotify-header h2 {
	margin: .25rem 0 0;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: clamp(1.65rem, 3vw, 2.45rem);
	line-height: 1;
}

.hm-v3-spotify-header p {
	max-width: 42ch;
	margin: 0;
	color: var(--hm-v3-muted);
	font-size: .9rem;
}

.hm-v3-spotify-track {
	display: grid;
	grid-auto-columns: minmax(min(100%, 420px), 1fr);
	grid-auto-flow: column;
	gap: .9rem;
	overflow-x: auto;
	padding: 1rem .15rem .35rem;
	scroll-snap-type: x mandatory;
	scrollbar-color: var(--hm-v3-wine) #e8e0d8;
	scrollbar-width: thin;
}

.hm-v3-spotify-player {
	min-width: 0;
	padding: .75rem;
	border: 1px solid var(--hm-v3-line);
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(32,29,27,.05);
	scroll-snap-align: start;
	transition: transform .3s cubic-bezier(.22,1,.36,1), border-color .3s ease, box-shadow .3s ease;
}

.hm-v3-spotify-player:hover,
.hm-v3-spotify-player:focus-within {
	border-color: var(--hm-v3-orange);
	box-shadow: 0 14px 32px rgba(32,29,27,.1);
	transform: translateY(-3px);
}

.hm-v3-spotify-player-top {
	display: flex;
	align-items: center;
	gap: .55rem;
	padding: 0 .2rem .65rem;
	font-family: "Roboto Mono", monospace;
	font-size: .7rem;
}

.hm-v3-spotify-player-top > span {
	color: #1ed760;
	font-size: 1rem;
}

.hm-v3-spotify-player-top a {
	margin-left: auto;
	color: var(--hm-v3-wine);
	text-decoration: none;
}

.hm-v3-spotify-player iframe {
	display: block;
	border: 0;
	border-radius: 4px;
}

@media (max-width: 900px) {
	.hm-v3-card,
	.hm-v3-card > .hm-card-body {
		height: auto;
		min-height: 0;
	}

	.hm-v3-card-media,
	.hm-v3-compact-media,
	.hm-v3-podcast-art {
		aspect-ratio: 4 / 3;
	}

	.hm-v3-card-copy {
		min-height: 0;
	}

	.hm-v3-card-excerpt {
		display: block;
		max-height: none;
		margin: 0 0 1rem;
		opacity: 1;
		transform: none;
	}

	.hm-v3-spotify-header {
		align-items: flex-start;
		flex-direction: column;
		gap: .55rem;
	}

	.hm-v3-spotify-track {
		grid-auto-columns: 92%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-v3-card-copy,
	.hm-v3-card img,
	.hm-v3-compact-card img,
	.hm-v3-podcast-card img,
	.hm-v3-spotify-player {
		transition-duration: .01ms !important;
		transform: none !important;
	}
}

.hm-footer-social-link svg .is-filled {
	fill: currentColor;
	stroke: none;
}

.hm-v3-share-rail svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

@media (max-width: 900px) {
	/* El movimiento guiado sustituye las flechas/barras como pista de interacción. */
	.hm-mobile-carousel-hint {
		overscroll-behavior-inline: contain;
		scroll-behavior: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.hm-mobile-carousel-hint::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
	}

	.hm-mobile-carousel-hint.is-hinting {
		cursor: grab;
		scroll-snap-type: none !important;
	}
}

/* Static books carousel — five selected editorial publications. */
.hm-v3-books {
	padding: clamp(2.5rem, 4.5vw, 4.5rem) 0;
	background: #fff;
}

.hm-v3-books-track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: clamp(1rem, 1.8vw, 1.75rem);
	padding: 0.15rem 0 1rem;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-width: thin;
	scrollbar-color: var(--hm-v3-orange, #e5532d) #efeae2;
}

.hm-v3-books-track::-webkit-scrollbar {
	height: 0.38rem;
}

.hm-v3-books-track::-webkit-scrollbar-track {
	background: #efeae2;
}

.hm-v3-books-track::-webkit-scrollbar-thumb {
	background: var(--hm-v3-orange, #e5532d);
	border-radius: 999px;
}

.hm-v3-book-card {
	min-width: 0;
	scroll-snap-align: start;
}

.hm-v3-book-card a {
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	gap: 1rem;
	height: 100%;
	color: var(--hm-ink);
	text-decoration: none;
}

.hm-v3-book-cover {
	display: grid;
	place-items: center;
	min-height: clamp(18rem, 30vw, 28rem);
	padding: clamp(0.8rem, 1.5vw, 1.25rem);
	background: #f5f2ec;
	border: 1px solid #d9d1c7;
	border-radius: 4px;
	overflow: hidden;
}

.hm-v3-book-cover img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: clamp(17rem, 28vw, 26rem);
	object-fit: contain;
	filter: drop-shadow(0 0.8rem 0.8rem rgb(35 29 25 / 14%));
	transition: transform 320ms ease, filter 320ms ease;
}

.hm-v3-book-card h3 {
	margin: 0;
	font-family: var(--hm-font-serif);
	font-size: clamp(1rem, 1.3vw, 1.3rem);
	line-height: 1.18;
	text-wrap: balance;
}

.hm-v3-book-card a:hover .hm-v3-book-cover img,
.hm-v3-book-card a:focus-visible .hm-v3-book-cover img {
	transform: translateY(-0.35rem) scale(1.018);
	filter: drop-shadow(0 1rem 1rem rgb(35 29 25 / 20%));
}

.hm-v3-book-card a:focus-visible {
	outline: 2px solid var(--hm-v3-orange, #e5532d);
	outline-offset: 5px;
}

@media (max-width: 980px) {
	.hm-v3-books-track {
		grid-template-columns: none;
		grid-auto-columns: minmax(12rem, 38vw);
	}
}

@media (max-width: 620px) {
	.hm-v3-books {
		padding: 2.25rem 0;
	}

	.hm-v3-books-track {
		grid-auto-columns: minmax(13.25rem, 74vw);
		gap: 0.9rem;
		padding-bottom: 0.85rem;
	}

	.hm-v3-book-cover {
		min-height: 20rem;
	}

	.hm-v3-book-cover img {
		max-height: 18.5rem;
	}

	.hm-v3-book-card h3 {
		font-size: 1.08rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-v3-book-cover img {
		transition: none;
	}
}

/* Keep every home book aligned to the same cover and title rhythm. */
@media (min-width: 981px) {
	.hm-v3-book-cover {
		height: clamp(22rem, 31vw, 28rem);
		min-height: 0;
	}

	.hm-v3-book-card h3 {
		min-height: 5.65em;
	}
}

/* Editorial book detail template. */
.hm-book-single {
	background: #fff;
	color: var(--hm-ink);
}

.hm-book-breadcrumb {
	padding-top: clamp(2rem, 5vw, 4.5rem);
}

.hm-book-hero {
	display: grid;
	grid-template-columns: minmax(15rem, 0.78fr) minmax(0, 1.45fr);
	align-items: center;
	gap: clamp(3rem, 7vw, 7.5rem);
	padding: clamp(3rem, 6vw, 6rem) clamp(0rem, 2vw, 2rem) clamp(4rem, 7vw, 7rem);
}

.hm-book-hero-cover {
	display: grid;
	place-items: center;
	margin: 0;
	min-height: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
}

.hm-book-hero-cover img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: clamp(25rem, 39vw, 34rem);
	object-fit: contain;
	filter: drop-shadow(0 1.25rem 1.2rem rgb(35 29 25 / 18%));
}

.hm-book-hero-copy h1 {
	max-width: 15ch;
	margin: 0.65rem 0 1.25rem;
	font-family: var(--hm-font-sans);
	font-size: clamp(2.65rem, 5.2vw, 5.7rem);
	font-weight: 650;
	line-height: 0.98;
	letter-spacing: -0.045em;
	text-wrap: balance;
}

.hm-book-deck {
	max-width: 45rem;
	margin: 0;
	color: #625d56;
	font-size: clamp(1rem, 1.35vw, 1.22rem);
	line-height: 1.65;
}

.hm-book-download-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 2rem;
}

.hm-book-download {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;
	min-height: 3.25rem;
	padding: 0.75rem 1.2rem;
	background: var(--hm-v3-orange, #e5532d);
	color: #fff !important;
	border: 1px solid var(--hm-v3-orange, #e5532d);
	border-radius: 4px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color 200ms ease, color 200ms ease, transform 200ms ease;
}

.hm-book-download:hover,
.hm-book-download:focus-visible {
	background: #fff;
	color: var(--hm-v3-orange, #e5532d) !important;
	transform: translateY(-2px);
}

.hm-book-download-row > span {
	color: #746e67;
	font-family: var(--hm-font-mono);
	font-size: 0.75rem;
}

.hm-book-facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	margin: 2.25rem 0 0;
	padding-top: 1.25rem;
	border-top: 1px solid var(--hm-border);
}

.hm-book-facts div {
	min-width: 0;
}

.hm-book-facts dt {
	margin-bottom: 0.35rem;
	color: #746e67;
	font-family: var(--hm-font-mono);
	font-size: 0.67rem;
	font-weight: 650;
	letter-spacing: 0.08em;
	text-transform: none;
}

.hm-book-facts dd {
	margin: 0;
	font-size: 0.94rem;
	font-weight: 650;
}

.hm-book-reading {
	display: grid;
	grid-template-columns: 3.25rem minmax(0, 47rem);
	justify-content: center;
	align-items: start;
	gap: clamp(1.5rem, 3vw, 3rem);
	padding: 0 0 clamp(5rem, 9vw, 9rem);
}

.hm-book-body {
	font-size: clamp(1.08rem, 1.45vw, 1.28rem);
	line-height: 1.78;
}

.hm-book-body p {
	margin: 0 0 1.35em;
}

.hm-book-related {
	padding: clamp(4rem, 7vw, 7rem) 0;
	background: #f5f2ec;
	border-top: 1px solid var(--hm-border);
}

.hm-book-related-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.75rem);
}

.hm-book-related-grid article,
.hm-book-related-grid article > a {
	min-width: 0;
	height: 100%;
}

.hm-book-related-grid article > a {
	position: relative;
	display: block;
	height: clamp(22rem, 32vw, 29rem);
	background: #eee9e1;
	color: var(--hm-ink);
	border: 1px solid var(--hm-border);
	border-radius: 4px;
	overflow: hidden;
	text-decoration: none;
}

.hm-book-related-cover {
	position: relative;
	height: 100%;
	background: #eee9e1;
	overflow: hidden;
}

.hm-book-related-grid img {
	display: block;
	position: absolute !important;
	inset: 1rem;
	width: calc(100% - 2rem) !important;
	height: calc(100% - 2rem) !important;
	max-width: calc(100% - 2rem);
	max-height: calc(100% - 2rem);
	object-fit: contain;
	transform: scale(1);
	transition: transform 260ms ease, filter 260ms ease;
}

.hm-book-related-copy {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	display: grid;
	gap: 0.7rem;
	min-height: 7.75rem;
	padding: 1rem 1.1rem 1.15rem;
	background: rgb(255 255 255 / 96%);
	border-top: 2px solid var(--hm-v3-orange, #e5532d);
	transform: translateY(calc(100% + 2px));
	transition: transform 300ms cubic-bezier(.2, .75, .25, 1);
}

.hm-book-related-grid h3 {
	margin: 0;
	font-family: var(--hm-font-serif);
	font-size: clamp(1.1rem, 1.65vw, 1.5rem);
	line-height: 1.12;
	text-wrap: balance;
}

.hm-book-related-grid a:hover .hm-book-related-copy,
.hm-book-related-grid a:focus-visible .hm-book-related-copy {
	transform: translateY(0);
}

.hm-book-related-grid a:hover img,
.hm-book-related-grid a:focus-visible img {
	transform: translateY(-1.25rem) scale(0.94);
	filter: drop-shadow(0 0.45rem 0.55rem rgb(35 29 25 / 12%));
}

@media (max-width: 900px) {
	.hm-book-hero {
		grid-template-columns: minmax(12rem, 0.85fr) minmax(0, 1.15fr);
		gap: 2rem;
	}

	.hm-book-related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 680px) {
	.hm-book-breadcrumb {
		padding-top: 1.5rem;
	}

	.hm-book-hero {
		grid-template-columns: 1fr;
		gap: 2rem;
		padding: 2rem 0 4rem;
	}

	.hm-book-hero-cover {
		min-height: 0;
	}

	.hm-book-hero-copy h1 {
		font-size: clamp(2.35rem, 12vw, 3.6rem);
	}

	.hm-book-facts {
		grid-template-columns: 1fr;
	}

	.hm-book-reading {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.hm-book-reading .hm-v3-share-rail {
		position: static;
		display: flex;
		width: max-content;
	}

	.hm-book-related-grid {
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: minmax(15rem, 78vw);
		grid-template-columns: none;
		overflow-x: auto;
		scroll-snap-type: inline mandatory;
	}

	.hm-book-related-grid article {
		scroll-snap-align: start;
	}
}

@media (hover: none), (pointer: coarse) {
	.hm-book-related-copy {
		transform: translateY(0);
	}

	.hm-book-related-grid img {
		transform: translateY(-1rem) scale(0.92);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-book-download,
	.hm-book-related-grid img {
		transition: none;
	}
}

/* Unified editorial thumbnails: one predictable 4:3 crop everywhere this
 * compact card pattern is used. Book covers are intentionally excluded. */
.hm-v3-compact-media {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	background: #ddd7cf;
	overflow: hidden;
}

.hm-v3-compact-media img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	object-fit: cover !important;
	object-position: center !important;
}

/* Home book covers sit directly on white: no beige card, frame or padding. */
.hm-v3-book-cover {
	position: relative;
	height: clamp(18rem, 30vw, 28rem);
	min-height: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	overflow: visible;
}

.hm-v3-book-cover img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain !important;
	object-position: center !important;
	filter: drop-shadow(0 0.8rem 0.8rem rgb(35 29 25 / 14%));
}

@media (max-width: 620px) {
	.hm-v3-book-cover {
		height: 20rem;
		min-height: 0;
	}
}

/* Home books: reveal the smaller title in a compact white panel on hover. */
.hm-v3-book-card {
	position: relative;
	overflow: hidden;
}

.hm-v3-book-card > a {
	position: relative;
	display: block;
	height: 100%;
	gap: 0;
}

.hm-v3-book-card .hm-v3-book-cover {
	overflow: hidden;
}

/* Eyebrow de categoria — mismo patron que usan Especiales/Podcast/Academia
   (span "hm-v3-meta" encima del titulo), pero superpuesto a la portada
   porque el h3 de este componente vive oculto hasta el hover. */
.hm-v3-book-card .hm-v3-book-label {
	position: absolute;
	top: 0.7rem;
	left: 0.7rem;
	z-index: 2;
	padding: 0.25rem 0.55rem;
	background: rgb(255 255 255 / 92%);
	border-radius: 3px;
}

.hm-v3-book-card h3 {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	min-height: 0;
	margin: 0;
	padding: 0.85rem 0.9rem 0.95rem;
	background: rgb(255 255 255 / 97%);
	border-top: 2px solid var(--hm-v3-orange, #e5532d);
	font-family: var(--hm-font-sans, "Roboto", ui-sans-serif, system-ui, sans-serif);
	font-size: clamp(0.9rem, 1vw, 1.05rem);
	font-weight: 650;
	line-height: 1.18;
	transform: translateY(calc(100% + 2px));
	transition: transform 300ms cubic-bezier(.2, .75, .25, 1);
}

.hm-v3-book-card > a:hover h3,
.hm-v3-book-card > a:focus-visible h3 {
	transform: translateY(0);
}

.hm-v3-book-card > a:hover .hm-v3-book-cover img,
.hm-v3-book-card > a:focus-visible .hm-v3-book-cover img {
	transform: translateY(-0.85rem) scale(0.94);
}

@media (hover: none), (pointer: coarse) {
	.hm-v3-book-card h3 {
		transform: translateY(0);
	}

	.hm-v3-book-card .hm-v3-book-cover img {
		transform: translateY(-0.75rem) scale(0.92);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-v3-book-card h3 {
		transition: none;
	}
}

/* Portada de diez publicaciones: recupera la composición y el movimiento
 * editorial v3 sin volver a crear bloques temáticos independientes. */
.hm-pdf-home .hm-v3-current {
	padding: clamp(2.5rem, 4.5vw, 4.5rem) 0 clamp(1.25rem, 2.5vw, 2rem);
	background: #fff;
}

.hm-pdf-home .hm-ad-banner + .hm-v3-current {
	padding-top: clamp(1.25rem, 2.5vw, 2rem);
}

.hm-pdf-home .hm-latest-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 2rem;
}

.hm-pdf-home .hm-latest-head h1 {
	margin: .35rem 0 0;
	font-family: var(--hm-font-display, "Roboto", sans-serif);
	font-size: clamp(3rem, 6.5vw, 6.5rem);
	font-weight: 700;
	letter-spacing: -.06em;
	line-height: .9;
}

.hm-pdf-home .hm-v3-current-grid {
	grid-template-columns: minmax(0, 1.2fr) minmax(31rem, .8fr);
	align-items: stretch;
}

.hm-pdf-home .hm-v3-lead {
	min-height: 43rem;
}

.hm-pdf-home .hm-v3-lead > .hm-card-body {
	grid-template-rows: minmax(25rem, 1fr) auto;
}

.hm-pdf-home .hm-v3-lead .hm-latest-copy {
	display: block;
	padding: clamp(1.45rem, 2.6vw, 2.4rem);
}

.hm-pdf-home .hm-v3-lead .hm-latest-copy time {
	display: inline-block;
	margin-top: .8rem;
	padding-top: 0;
}

.hm-pdf-home .hm-v3-secondary-track {
	display: grid;
	height: 43rem;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 1rem) / 2);
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-color: var(--hm-brand-turquoise) transparent;
	scrollbar-width: thin;
}

.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card {
	height: auto;
	min-height: 0;
	scroll-snap-align: start;
}

.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card > .hm-card-body {
	height: 100%;
}

@media (min-width: 901px) {
	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-media {
		height: 48%;
	}

	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card > .hm-card-body > div:last-child {
		height: 52%;
		padding: .9rem;
	}

	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card:hover .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card:focus-within .hm-v3-compact-media {
		height: 28%;
	}

	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card:hover > .hm-card-body > div:last-child,
	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card:focus-within > .hm-card-body > div:last-child {
		height: 72%;
	}
}

.hm-pdf-home .hm-v3-compact-card .hm-editorial-taxonomy {
	font-size: .64rem;
}

.hm-pdf-home .hm-v3-compact-card h3 {
	font-size: clamp(.98rem, 1.2vw, 1.22rem);
}

/* Landings que el PDF exige para Especiales y Academia. */
.hm-editorial-landing {
	--hm-landing-accent: var(--hm-color-especiales);
	color: var(--hm-brand-ink);
	background: #fff;
}

.hm-editorial-landing.is-academia { --hm-landing-accent: var(--hm-color-academia); }

.hm-editorial-landing-hero {
	padding: clamp(5rem, 9vw, 9rem) 0 clamp(4rem, 7vw, 7rem);
	background:
		linear-gradient(115deg, color-mix(in srgb, var(--hm-landing-accent) 10%, white), #fff 64%);
	border-bottom: 1px solid var(--hm-v3-line);
}

/* Un solo alto para los tres encabezados de área.
 *
 * Cada uno traía su propio relleno —Actualidad 100,8/38,4px, Especiales y
 * Academia 129,6/100,8px, Nosotros 100,8/57,6px— y encima cargan contenido
 * distinto: Actualidad suma miga de pan y pestañas de filtro, Nosotros solo
 * lleva el título. Medido a 1440px daban 437, 376 y 238px: pasar de una
 * sección a otra movía la página entera.
 *
 * En vez de cuadrar tres rellenos a mano, se fija un alto mínimo común y el
 * contenido se centra dentro: el que trae poco se acomoda con aire y el que
 * trae pestañas cabe sin desbordar. Va después de las tres reglas de arriba
 * —misma especificidad— para poder pisarles el relleno.
 *
 * Es un piso, no una jaula: si en un ancho estrecho las pestañas de filtro se
 * parten en dos líneas, Actualidad crecerá. Preferible a recortarlas. */
.hm-v3-archive-intro,
.hm-editorial-landing-hero,
.hm-area-hero {
	display: flex;
	min-height: clamp(15rem, 27vw, 24rem);
	flex-direction: column;
	justify-content: center;
	padding-top: clamp(2.2rem, 4vw, 3rem);
	padding-bottom: clamp(2.2rem, 4vw, 3rem);
}

/* En Especiales el bloque se ancla arriba en vez de centrarse: centrado, la
   etiqueta subía o bajaba según si el título ocupaba una, dos o tres líneas
   (medido: entre 82px y 208px desde el borde del hero según la página) y
   saltaba al navegar de una portada a otra. Anclado, la etiqueta cae siempre
   a la misma altura y el título crece hacia abajo. El alto mínimo no cambia,
   así que ninguna página se mueve de tamaño. */
.hm-editorial-landing.is-especiales .hm-editorial-landing-hero,
.hm-area-hero.is-especiales {
	justify-content: flex-start;
	/* 3,5rem es el tope que deja caber el encabezado más alto (La Escombrera:
	   tres líneas de titular más bajada) dentro del alto mínimo común, para no
	   romper la altura pareja de las secciones. */
	padding-top: clamp(2.4rem, 4vw, 3.25rem);
}

/* En bloque, no en línea: como inline-block la etiqueta hereda el interlineado
   del contenedor y cae 8px más abajo que la miga de pan de las páginas de
   área, que es flex. Con block ambas arrancan exactamente en el borde. */
.hm-editorial-landing.is-especiales .hm-editorial-landing-hero .hm-editorial-label,
.hm-area-hero.is-especiales .hm-editorial-label {
	display: block;
}

.hm-editorial-landing-hero h1 {
	max-width: 12ch;
	margin: .5rem 0 1.2rem;
	font-family: var(--hm-font-serif);
	font-size: clamp(4rem, 10vw, 9rem);
	font-weight: 700;
	letter-spacing: -.065em;
	line-height: .82;
}

.hm-editorial-landing-hero p {
	max-width: 58ch;
	margin: 0;
	color: var(--hm-v3-muted);
	font-size: clamp(1.05rem, 1.5vw, 1.35rem);
	line-height: 1.55;
}

.hm-editorial-landing-hero .hm-search {
	margin-top: 1.75rem;
	margin-inline: 0;
	border: 2px solid var(--hm-v3-line);
	background: #fff;
	box-shadow: 0 12px 30px -18px rgba(33, 29, 27, .35);
}

.hm-editorial-landing-hero .hm-search:focus-within {
	border-color: var(--hm-v3-orange);
	background: #fff;
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--hm-v3-orange) 16%, transparent);
}

.hm-editorial-landing-hero .hm-search > span { color: var(--hm-v3-orange); }

.hm-editorial-landing-hero .hm-search input,
.hm-editorial-landing-hero .hm-search input[type="search"] {
	color: var(--hm-brand-ink) !important;
}

.hm-editorial-landing-hero .hm-search input::placeholder { color: rgba(33, 29, 27, .48); }

.hm-editorial-landing-hero .hm-search button {
	background: var(--hm-v3-orange);
	color: #fff;
}

.hm-editorial-landing-hero .hm-search button:hover {
	background: color-mix(in srgb, var(--hm-v3-orange) 85%, black);
}

.hm-editorial-landing-sections { padding: clamp(4rem, 7vw, 7rem) 0; }

/* Listado completo de libros (page-libros.php) — mismas tarjetas que la
   franja horizontal de la portada/Especiales, pero en una grilla que
   envuelve en vez de hacer scroll lateral, ya que aquí sí hace falta ver
   todos a la vez. */
.hm-books-page { padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(4rem, 7vw, 7rem); }
/* Mismo tratamiento de portada exacto que ".hm-v3-books-track" (altura
   clamp, no aspect-ratio) para que las portadas se vean igual en ambos
   lugares — antes esta grilla usaba su propio aspect-ratio y se veía
   recortada distinto que en el home. */
.hm-books-page-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: clamp(1rem, 1.8vw, 1.75rem); align-items: start; }
.hm-books-page-grid .hm-v3-book-card,
.hm-books-page-grid .hm-v3-book-card > a { height: clamp(18rem, 30vw, 28rem); }
.hm-books-page-grid .hm-v3-book-card .hm-v3-book-cover { height: 100%; }

.hm-podcast-page-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: clamp(1rem, 1.8vw, 1.75rem); }

.hm-editorial-landing-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.25rem;
}

/* Retícula de Especiales y de cualquier landing con más de dos destinos:
 * filas de tres columnas iguales. Antes era un mosaico con una destacada
 * ancha arriba y dos anchas abajo; se cambió por pedido del equipo, que
 * prefiere que todos los especiales pesen lo mismo.
 *
 * Ninguna tarjeta ocupa dos filas, y eso se mantiene a propósito: cada fila
 * calcula su alto a partir de su propio contenido, así que no hay ambigüedad
 * de tamaño entre filas (con "grid-row: span 2" el alto de la fila destacada
 * se calculaba mal y las de abajo quedaban recortadas contra el pie). */
.hm-editorial-landing-grid.is-mosaic {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hm-editorial-landing-card {
	grid-column: span 2;
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--hm-v3-line);
	border-radius: 14px;
	background: color-mix(in srgb, var(--hm-landing-accent, #337f91) 4%, #fff);
	box-shadow: 0 1px 2px rgba(20, 16, 14, .04);
	transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease;
}

/* Todas ocupan una columna: filas de tres iguales, sin destacada ni spans.
 * La destacada tampoco recibe el titular ni el relleno mayores, porque acá
 * mide lo mismo que sus vecinas y la diferencia solo se leería como un
 * descuido. */
.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card,
.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card.is-featured { grid-column: span 1; }

.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card.is-featured .hm-editorial-landing-copy {
	padding: 1.5rem;
}

.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card.is-featured .hm-editorial-landing-copy h2 {
	font-size: clamp(1.45rem, 2.15vw, 2.2rem);
}

/* Con columnas iguales el marco deja de absorber el sobrante de la fila y se
 * queda en su proporción: si crece, la tarjeta con menos texto acaba con la
 * foto más alta —medido: 300, 333 y 358px en la misma fila— y el desnivel se
 * lee como descuido. Ahora el sobrante lo toma la copia, que además alinea
 * los "Explorar" a la misma altura. */
.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-media {
	flex: none;
}

.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-copy {
	flex: 1 1 auto;
}
.hm-editorial-landing-grid.is-pair .hm-editorial-landing-card { grid-column: span 3; }

.hm-editorial-landing-card:hover,
.hm-editorial-landing-card:focus-within {
	transform: translateY(-6px);
	box-shadow: 0 20px 40px -22px rgba(20, 16, 14, .35);
}

.hm-editorial-landing-card > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

/* La relación de aspecto fija el alto *mínimo* del marco, no el definitivo.
 * Sirve de piso para que ninguna imagen dicte el alto de la fila: con spans
 * de distinto ancho y fotos de proporciones muy distintas (retrato vs.
 * paisaje), dejar que la imagen mandara inflaba una fila a casi 1000px y
 * tapaba las tarjetas de al lado.
 *
 * Pero el reparto del sobrante sí cambia. Las tarjetas de una misma fila se
 * estiran todas al alto de la más alta, y ese sobrante lo absorbía la copia
 * (que tenía flex:1), así que en las columnas angostas del mosaico la foto
 * se quedaba en su 4:3 —221px de 709— y debajo quedaban 350px de blanco.
 * Leía como una imagen recortada sobre una tarjeta vacía. Ahora crece el
 * marco y la copia se queda con lo que ocupa su texto. */
.hm-editorial-landing-media {
	position: relative;
	aspect-ratio: 4 / 3;
	flex: 1 1 auto;
	overflow: hidden;
	background: #eee9e2;
}

.hm-editorial-landing-media img,
.hm-editorial-landing-media .hm-v3-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Las portadas son cuadradas y el marco es 4:3: centrado exacto le cortaba
	   la cabeza a los retratos. Subir el punto de recorte deja el rostro (o la
	   parte alta del objeto) dentro del encuadre. */
	object-position: 50% 32%;
	transition: transform .6s cubic-bezier(.22,1,.36,1), filter .6s ease;
}

.hm-editorial-landing-copy {
	position: relative;
	display: flex;
	flex-direction: column;
	/* El sobrante de la fila se lo lleva la imagen, no el texto. */
	flex: none;
	padding: 1.5rem;
	transition: background-color .35s ease, color .35s ease;
}

.hm-editorial-landing-copy strong { margin-top: auto; padding-top: .5rem; }

.hm-editorial-landing-card.is-featured .hm-editorial-landing-copy { padding: 1.85rem; }

.hm-editorial-landing-copy h2 {
	margin: 0 0 .5rem;
	font-family: var(--hm-font-serif);
	/* Un paso por debajo de 2.4vw y con más aire: con .95 los títulos de tres
	 * líneas —"La Escombrera: Cronología de una búsqueda"— quedaban casi
	 * tocándose entre renglones. */
	font-size: clamp(1.45rem, 2.15vw, 2.2rem);
	line-height: 1.12;
}

/* La tarjeta destacada sigue mandando sobre las demás, pero se queda por
 * debajo del <h1> de la página, que la regla global de h1 fija en 3vw. Con
 * 3.6vw llegaba a 51,84px contra los 43,2px del título principal: el titular
 * de una tarjeta le ganaba al de la página. */
.hm-editorial-landing-card.is-featured .hm-editorial-landing-copy h2 { font-size: clamp(1.9rem, 2.8vw, 3rem); }

/* En la retícula de dos, las dos tarjetas ocupan el mismo ancho (span 3), así
 * que la destacada no se distingue en nada de su vecina: igualar titular y
 * relleno evita que la diferencia se lea como un descuido.
 *
 * El relleno además cambiaba el alto de la foto. Las dos tarjetas de una fila
 * miden lo mismo y el marco absorbe el sobrante (flex: 1 1 auto), así que los
 * 5,6px de más que tenía la copia de la destacada se los quitaba a su imagen
 * por arriba y por abajo: 11px de diferencia de alto entre dos fotos que
 * deberían verse iguales. */
.hm-editorial-landing-grid.is-pair .hm-editorial-landing-card.is-featured .hm-editorial-landing-copy {
	padding: 1.5rem;
}

.hm-editorial-landing-grid.is-pair .hm-editorial-landing-card.is-featured .hm-editorial-landing-copy h2 {
	font-size: clamp(1.45rem, 2.15vw, 2.2rem);
}

/* El mismo gris de la descripción de las tarjetas de Especiales en el home
 * (.hm-v3-special-card p). Iba con var(--hm-v3-muted), que aquí no está
 * definida —vive en el bloque del home—, así que la declaración se caía y el
 * párrafo heredaba el teal del enlace de la tarjeta: la descripción se veía
 * azul. Va el color literal, no la variable, para que no dependa del contexto. */
.hm-editorial-landing-copy p { color: #4f4a46; line-height: 1.5; }
.hm-editorial-landing-copy strong { color: var(--hm-landing-accent); font-family: var(--hm-font-mono); font-size: .72rem; }
.hm-editorial-landing-card:hover img,
.hm-editorial-landing-card:focus-within img { transform: scale(1.035); filter: saturate(.86); }
.hm-editorial-landing-card:hover .hm-editorial-landing-copy,
.hm-editorial-landing-card:focus-within .hm-editorial-landing-copy { background: color-mix(in srgb, var(--hm-landing-accent) 10%, white); }

@media (max-width: 1000px) {
	.hm-pdf-home .hm-v3-current-grid { grid-template-columns: 1fr; }
	.hm-pdf-home .hm-v3-lead { min-height: 0; }
	.hm-pdf-home .hm-v3-secondary-track {
		display: flex;
		height: auto;
		padding-bottom: .8rem;
	}
	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card { flex: 0 0 min(76vw, 25rem); min-height: 16rem; }
	.hm-editorial-landing-grid:not(.is-mosaic) .hm-editorial-landing-card,
	.hm-editorial-landing-grid:not(.is-mosaic) .hm-editorial-landing-card:nth-child(n),
	.hm-editorial-landing-grid.is-pair .hm-editorial-landing-card { grid-column: span 3; }
	.hm-editorial-landing-grid.is-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card.is-featured { grid-column: span 1; grid-row: span 1; }
}

@media (max-width: 680px) {
	.hm-pdf-home .hm-latest-head { align-items: flex-start; flex-direction: column; }
	.hm-pdf-home .hm-latest-head > p { display: block; }
	.hm-pdf-home .hm-v3-lead > .hm-card-body { grid-template-rows: auto auto; }
	.hm-pdf-home .hm-v3-secondary-track .hm-v3-compact-card { flex-basis: 87vw; }
	.hm-editorial-landing-grid,
	.hm-editorial-landing-grid.is-mosaic { grid-template-columns: 1fr; }
	.hm-editorial-landing-card,
	.hm-editorial-landing-card:nth-child(n),
	.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card,
	.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card.is-featured,
	.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card:nth-child(4),
	.hm-editorial-landing-grid.is-mosaic .hm-editorial-landing-card:nth-child(5),
	.hm-editorial-landing-grid.is-pair .hm-editorial-landing-card { grid-column: auto; grid-row: auto; }
	/* En una sola columna la foto se muestra entera, sin recortar. La
	 * proporción fija existe para que las tarjetas de una misma fila queden
	 * alineadas entre sí; acá no hay fila que alinear, y en cambio el recorte
	 * de object-fit:cover sí molestaba: con 16/10 sobre portadas cuadradas
	 * (768x768) se comía el 37% del alto y les cortaba la cabeza a los
	 * retratos. Dejando que el marco tome el alto natural de la imagen, la
	 * tarjeta se alarga y no se pierde nada de la foto, sea cuadrada o
	 * apaisada. */
	.hm-editorial-landing-media { aspect-ratio: auto; }
	.hm-editorial-landing-media img { height: auto; }

	/* Las tarjetas sin portada muestran el marcador, que no tiene alto
	 * propio: sin proporción el marco colapsaría a cero. */
	.hm-editorial-landing-media:not(:has(img)) { aspect-ratio: 4 / 3; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-editorial-landing-media img,
	.hm-editorial-landing-media .hm-v3-placeholder,
	.hm-editorial-landing-copy { transition: none; }
}

/* Portada 1 + 4 + 5: las cuatro secundarias comparten exactamente la caja
 * vertical de la historia principal; las cinco restantes permanecen visibles. */
.hm-pdf-home .hm-v3-secondary-grid {
	display: grid;
	height: auto;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	min-width: 0;
}

/* Mosaico: la primera nota queda alta, las dos siguientes en cuadrícula y la
 * cuarta se extiende ancha abajo, en vez de un 2x2 uniforme. */
@media (min-width: 1001px) {
	.hm-pdf-home .hm-v3-secondary-grid {
		grid-template-rows: repeat(3, minmax(0, 1fr));
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(1) {
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(2) {
		grid-column: 2;
		grid-row: 1;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(3) {
		grid-column: 2;
		grid-row: 2;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(4) {
		grid-column: 1 / span 2;
		grid-row: 3;
	}
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card,
.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card {
	height: auto;
	min-height: 0;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card > .hm-card-body {
	position: relative;
	display: block;
	height: 100%;
	overflow: hidden;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-media {
	position: absolute;
	inset: 0 0 auto;
	height: 52%;
	min-height: 0;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-latest-copy {
	position: absolute;
	z-index: 2;
	inset: auto 0 0;
	display: flex;
	height: auto;
	max-height: 100%;
	min-height: 0;
	padding: .85rem;
	flex-direction: column;
	background: #fff;
	transition: height .58s cubic-bezier(.22, 1, .36, 1), padding .58s cubic-bezier(.22, 1, .36, 1);
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-excerpt {
	display: block;
	max-height: 0;
	margin: 0;
	overflow: hidden;
	opacity: 0;
	font-size: .78rem;
	line-height: 1.42;
	transition: max-height .5s cubic-bezier(.22, 1, .36, 1), margin .4s ease, opacity .3s ease;
}

.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card h3 {
	font-size: clamp(.9rem, 1.05vw, 1.08rem);
	line-height: 1.2;
}

.hm-pdf-home .hm-v3-secondary-grid time {
	margin-top: auto;
}

.hm-pdf-home .hm-v3-compact-list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	grid-template-rows: minmax(0, auto);
	gap: 1rem;
	margin-top: 1rem;
}

/* Mosaico: la primera nota ocupa un bloque grande, tres quedan pequeñas
 * arriba a la derecha y la última se extiende ancha abajo. Escopado a
 * ".hm-v3-current" porque ".hm-v3-compact-list" también la usa el bloque
 * de Reparación/Derechos Humanos, que debe quedar en una sola columna. */
@media (min-width: 1001px) {
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
		grid-template-rows: repeat(2, 15rem);
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) {
		grid-column: 1 / span 2;
		grid-row: 1 / span 2;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) {
		grid-column: 3;
		grid-row: 1;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) {
		grid-column: 4;
		grid-row: 1;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) {
		grid-column: 5;
		grid-row: 1;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) {
		grid-column: 3 / span 3;
		grid-row: 2;
	}
}

.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
	display: grid;
	min-height: 24rem;
	grid-template-rows: 12rem minmax(0, 1fr);
}

.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-media {
	height: auto;
}

.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
	display: flex;
	height: auto;
	padding: 1rem;
	flex-direction: column;
}

.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
	display: none;
}

.hm-pdf-home .hm-v3-compact-list time {
	margin-top: auto;
}

@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: auto;
		max-height: 100%;
		padding-top: 1rem;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 8rem;
		margin-top: .55rem;
		opacity: 1;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}
}

/* Mosaico en pantallas medianas y móviles: en vez de un carrusel horizontal
 * con tarjetas idénticas, se arma una cuadrícula de 2 columnas con una nota
 * grande y el resto más pequeñas, igual que en escritorio. Los altos de fila
 * son fijos porque aquí ya no hay una columna "lead" que estire el alto. */
@media (max-width: 1000px) {
	.hm-pdf-home .hm-v3-secondary-grid {
		height: auto;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: repeat(3, 9.5rem);
	}

	/* Títulos limitados a ~2 líneas en las celdas chicas del mosaico: así la
	 * imagen no queda aplastada por textos largos y la fecha se sigue viendo
	 * siempre. flex-shrink:0 es obligatorio: dentro de un contenedor flex,
	 * "overflow: hidden" hace que el tamaño mínimo automático del título
	 * pase a ser 0, y el propio flexbox lo aplasta a nada si falta espacio. */
	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card h3 {
		display: -webkit-box;
		flex-shrink: 0;
		max-height: 2.5em;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(1) {
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(2) {
		grid-column: 2;
		grid-row: 1;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(3) {
		grid-column: 2;
		grid-row: 2;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card:nth-child(4) {
		grid-column: 1 / span 2;
		grid-row: 3;
	}

	.hm-pdf-home .hm-v3-secondary-grid .hm-v3-compact-card > .hm-card-body {
		height: 100%;
		min-height: 0;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: repeat(4, 11rem);
		gap: .75rem;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) {
		grid-column: 1 / span 2;
		grid-row: 1 / span 2;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) {
		grid-column: 1;
		grid-row: 3;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) {
		grid-column: 2;
		grid-row: 3;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) {
		grid-column: 1;
		grid-row: 4;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) {
		grid-column: 2;
		grid-row: 4;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		display: grid;
		height: 100%;
		min-height: 0;
		grid-template-rows: minmax(4.5rem, 1fr) auto;
	}

	/* El aspect-ratio 4/3 de .hm-v3-compact-media es fijo y global: con la fila
	 * de imagen comprimida a 4.5rem en el mosaico móvil, ese aspect-ratio la
	 * hacía renderizar más alta que su fila y tapaba el título de la tarjeta.
	 * Aquí se anula para que la imagen simplemente llene su fila. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-media {
		aspect-ratio: auto;
		height: 100%;
		min-height: 0;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-media img {
		height: 100%;
	}

	/* El sello de categoría se ocultaba acá: con filas de altura fija, sumarlo
	 * al título y la fecha no cabía y empujaba el título fuera del área
	 * visible. Vuelve porque ahora sus dos términos son enlaces al buscador y
	 * esconderlos deja al mosaico móvil sin esa forma de navegar. Va compacto
	 * para ocupar lo mínimo, y solo en las tarjetas verticales: las
	 * horizontales (4, 5, 9 y 10) tienen el titular al lado de una miniatura y
	 * ahí sí no cabe. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card .hm-editorial-taxonomy {
		display: flex;
		/* nowrap a propósito: con wrap, en la columna de 166px el par
		 * "Desaparición · Historia" se partía en tres líneas y se comía 42px
		 * del alto de la foto en vez de 19. Si no cabe, se abrevia. */
		flex-wrap: nowrap;
		align-items: center;
		gap: .25rem;
		margin-bottom: .3rem;
		overflow: hidden;
		font-size: .6rem;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card .hm-editorial-taxonomy a {
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card .hm-editorial-tag {
		padding: 2px 5px;
	}

	/* Las horizontales también lo llevan, con el margen justo: su copia va al
	 * lado de la miniatura y el espacio es más escaso que en las verticales. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) .hm-editorial-taxonomy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) .hm-editorial-taxonomy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) .hm-editorial-taxonomy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-editorial-taxonomy {
		margin-bottom: .2rem;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card .hm-latest-copy {
		padding: .6rem .75rem;
	}
}

@media (max-width: 680px) {
	.hm-pdf-home .hm-v3-secondary-grid {
		grid-template-rows: repeat(3, 8rem);
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
		grid-template-rows: repeat(4, 10.5rem);
	}
}

/* Overrides finales de composición para evitar que reglas históricas vuelvan
 * a separar la imagen de su panel o a horizontalizar el lateral. */
@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		position: relative;
		display: block;
		height: 100%;
		min-height: 0;
		overflow: hidden;
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-media {
		position: absolute;
		inset: 0;
		height: 100%;
		transition: transform .55s cubic-bezier(.22, 1, .36, 1);
	}
	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		position: absolute;
		z-index: 2;
		inset: auto 0 0;
		height: 55%;
		padding: .9rem 1rem;
		overflow: hidden;
		background: rgb(255 255 255 / 98%);
		transition: height .55s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease;
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
		display: block;
		max-height: 0;
		margin: 0;
		overflow: hidden;
		opacity: 0;
		font-size: .72rem;
		line-height: 1.4;
		transition: max-height .45s cubic-bezier(.22, 1, .36, 1), margin .35s ease, opacity .3s ease;
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: 78%;
		box-shadow: 0 -18px 32px rgb(32 29 27 / 13%);
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-media {
		transform: scale(.96);
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		display: block;
		max-height: 7rem;
		margin-top: .45rem;
		opacity: 1;
	}
}

.hm-v3-books-track { align-items: start; }
.hm-v3-books-track .hm-v3-book-card,
.hm-v3-books-track .hm-v3-book-card > a { height: clamp(18rem, 30vw, 28rem); }
.hm-v3-books-track .hm-v3-book-card .hm-v3-book-cover { height: 100%; }

@media (min-width: 901px) {
	.hm-v3-archive-recent {
		display: grid;
		grid-template-rows: auto repeat(5, minmax(0, 1fr));
		gap: 0;
		padding: 1.25rem;
	}
	.hm-v3-archive-recent > a {
		position: relative;
		display: grid;
		grid-template-columns: 6.25rem minmax(0, 1fr);
		align-items: stretch;
		min-height: 0;
		overflow: hidden;
	}
	.hm-v3-archive-recent > a .hm-v3-recent-media {
		position: relative;
		inset: auto;
		width: 100%;
		height: 100%;
		min-height: 5.6rem;
	}
	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		position: relative;
		inset: auto;
		height: auto;
		min-width: 0;
		padding: .65rem .75rem;
		justify-content: center;
		background: #fff;
		transition: background-color .3s ease, transform .35s cubic-bezier(.22, 1, .36, 1);
	}
	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		height: auto;
		background: #f7f5f1;
		box-shadow: none;
		transform: translateX(-.25rem);
	}
}

@media (max-width: 620px) {
	.hm-v3-books-track .hm-v3-book-card,
	.hm-v3-books-track .hm-v3-book-card > a { height: 20rem; }
}

@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		position: absolute !important;
		height: auto !important;
		max-height: 100% !important;
	}
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
	}
}

/* Iconografía oficial entregada para las subsecciones de Actualidad. */
.hm-v3-archive-tabs .hm-v3-tab-icon {
	width: 2rem;
	height: 2rem;
	flex: 0 0 2rem;
	display: grid;
	place-items: center;
	overflow: hidden;
	border-radius: 50%;
}

.hm-v3-archive-tabs .hm-v3-tab-icon img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	clip-path: circle(48% at 50% 50%);
}

/* El lateral conserva su lista vertical, pero una lámina blanca sube y cubre
 * la miniatura para revelar contexto sin modificar la altura de cada fila. */
@media (hover: hover) and (min-width: 901px) {
	.hm-v3-archive-recent > a::after {
		position: absolute;
		z-index: 1;
		inset: 0;
		content: "";
		background: #fff;
		transform: translateY(102%);
		transition: transform .58s cubic-bezier(.22, 1, .36, 1);
	}

	.hm-v3-archive-recent > a .hm-v3-recent-media {
		z-index: 0;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		z-index: 2;
		transition: left .58s cubic-bezier(.22, 1, .36, 1), padding .45s ease, background-color .3s ease;
	}
	.hm-v3-archive-recent > a:hover::after,
	.hm-v3-archive-recent > a:focus-visible::after {
		transform: translateY(0);
	}

	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		padding: .7rem .8rem;
		justify-content: center;
		background: transparent;
		transform: none;
	}
}

/* Entrada suave y acompasada de la fila inferior de publicaciones. */
.hm-pdf-home .hm-v3-compact-list .hm-motion-item {
	transform: translate3d(0, 46px, 0) scale(.985);
	transition:
		opacity 880ms var(--hm-ease) var(--hm-motion-delay),
		transform 1080ms var(--hm-ease) var(--hm-motion-delay),
		filter 920ms ease var(--hm-motion-delay);
}

.hm-pdf-home .hm-v3-compact-list .hm-motion-item.hm-enter-up {
	transform: translate3d(0, -40px, 0) scale(.985);
}

.hm-pdf-home .hm-v3-compact-list .hm-motion-item.is-motion-visible {
	opacity: 1;
	filter: blur(0);
	transform: translate3d(0, 0, 0) scale(1);
}

/* Las cinco tarjetas inferiores replican exactamente la lámina ascendente de
 * las cuatro historias secundarias superiores. La altura queda en auto para
 * que el título y la fecha nunca se recorten en las tarjetas pequeñas del
 * mosaico. */
@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
		transition: height .55s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
		padding-top: 1rem;
	}
}

/* Refinamiento final: medallones nítidos, estados estables y tarjetas
 * simétricas. Estas reglas consolidan los ajustes históricos del archivo. */
.hm-v3-archive-tabs a {
	min-height: 3.65rem;
	gap: .58rem;
	padding: .68rem .9rem;
}

.hm-v3-archive-tabs .hm-v3-tab-icon {
	width: 1.85rem;
	height: 1.85rem;
	flex-basis: 1.85rem;
	background: #fff;
	box-shadow: 0 0 0 1px rgba(31, 29, 27, .08);
	transition: transform .38s cubic-bezier(.22, 1, .36, 1), box-shadow .38s ease;
}

.hm-v3-archive-tabs a:hover .hm-v3-tab-icon,
.hm-v3-archive-tabs a:focus-visible .hm-v3-tab-icon,
.hm-v3-archive-tabs a.is-active .hm-v3-tab-icon {
	transform: scale(1.07);
	box-shadow: 0 4px 12px rgba(31, 29, 27, .12);
}

/* Los filtros internos utilizan un estado neutro para no competir con la
 * codificación cromática de las secciones principales. */
.hm-v3-archive-tabs a.is-active {
	border-color: #343331;
	background: #343331;
	color: #fff !important;
}

.hm-v3-archive-tabs a:not(.is-active):hover,
.hm-v3-archive-tabs a:not(.is-active):focus-visible {
	border-color: #8d8882;
	background: #f2f2f2;
	color: #282624 !important;
}

@media (hover: hover) and (min-width: 901px) {
	/* El enlace y cada fila permanecen inmóviles. Solo la lámina y el contenido
	 * interior cambian de estado. */
	.hm-v3-archive-recent > a {
		isolation: isolate;
		contain: layout paint;
		transform: none !important;
		transition: background-color .35s ease, box-shadow .35s ease;
	}

	.hm-v3-archive-recent > a .hm-v3-recent-copy {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 6.25rem;
		display: flex;
		height: 100%;
		min-height: 0;
		padding: .65rem .75rem;
		transform: none !important;
		transition: left .58s cubic-bezier(.22, 1, .36, 1), padding .48s ease;
	}

	.hm-v3-archive-recent > a:hover .hm-v3-recent-copy,
	.hm-v3-archive-recent > a:focus-visible .hm-v3-recent-copy {
		inset: 0;
		padding: .72rem .82rem;
		transform: none !important;
	}

	.hm-v3-archive-recent > a:hover,
	.hm-v3-archive-recent > a:focus-visible {
		transform: none !important;
		box-shadow: inset 0 0 0 1px rgba(111, 44, 63, .12);
	}
}

@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card > .hm-card-body {
		height: 100%;
		min-height: 100%;
		overflow: hidden;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-media {
		position: absolute;
		inset: 0;
		height: 54%;
		transform: none !important;
		transition: filter .65s ease, transform .72s cubic-bezier(.22, 1, .36, 1);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		position: absolute !important;
		right: 0;
		bottom: 0;
		left: 0;
		display: flex;
		height: auto !important;
		max-height: 100% !important;
		min-height: 0;
		padding: .82rem .9rem .72rem;
		overflow: hidden;
		background: rgba(255, 255, 255, .985);
		transition: height .68s cubic-bezier(.22, 1, .36, 1), box-shadow .5s ease, padding .5s ease;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card h3 {
		margin-top: .46rem;
		font-size: clamp(.98rem, 1.12vw, 1.14rem);
		line-height: 1.2;
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
		display: -webkit-box;
		max-height: none;
		margin: .55rem 0 0;
		overflow: hidden;
		opacity: 0;
		font-size: .75rem;
		line-height: 1.38;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 5;
		transition: opacity .42s ease .12s;
	}

	.hm-pdf-home .hm-v3-compact-list time {
		position: static;
		display: block;
		min-height: 1rem;
		margin-top: auto;
		padding-top: .45rem;
		line-height: 1;
		transform: none !important;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
		padding: .9rem;
		box-shadow: 0 -18px 34px rgba(31, 29, 27, .12);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-media {
		transform: scale(.985) !important;
		filter: saturate(.94);
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		opacity: 1;
	}
}

@media (max-width: 700px) {
	.hm-v3-archive-tabs a {
		min-height: 3.25rem;
		padding: .58rem .75rem;
	}

	.hm-v3-archive-tabs .hm-v3-tab-icon {
		width: 1.65rem;
		height: 1.65rem;
		flex-basis: 1.65rem;
	}
}

/* Aparición sobria: la retícula no cambia de escala ni altera la alineación
 * de fechas mientras entra en el viewport. */
.hm-pdf-home .hm-v3-compact-list .hm-motion-item {
	filter: none;
	transform: translate3d(0, 18px, 0);
	transition:
		opacity 720ms var(--hm-ease) var(--hm-motion-delay),
		transform 760ms var(--hm-ease) var(--hm-motion-delay);
}

.hm-pdf-home .hm-v3-compact-list .hm-motion-item.hm-enter-up {
	transform: translate3d(0, -18px, 0);
}

.hm-pdf-home .hm-v3-compact-list .hm-motion-item.is-motion-visible {
	filter: none;
	transform: translate3d(0, 0, 0);
}

@media (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card h3,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card.is-title-long h3,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card.is-title-xlong h3 {
		display: block;
		max-height: none;
		overflow: visible;
		font-size: clamp(.92rem, 1vw, 1.05rem);
		line-height: 1.22;
		-webkit-line-clamp: unset;
	}
}

/* La caja sigue la escala real de una portada y ya no deja una zona vacía
 * entre la imagen contenida y el panel del título. */
.hm-v3-books-track .hm-v3-book-card,
.hm-v3-books-track .hm-v3-book-card > a {
	height: clamp(16rem, 23vw, 20rem);
}

/* Mobile/touch: book titles cannot depend on hover. Keep every cover and its
 * complete title inside the card instead of translating the panel outside an
 * overflow-hidden fixed-height box. */
@media (max-width: 767px) {
	.hm-v3-books-track .hm-v3-book-card {
		height: auto;
		min-height: 22.5rem;
		overflow: hidden;
	}

	.hm-v3-books-track .hm-v3-book-card > a {
		display: grid;
		grid-template-rows: 16rem minmax(6.5rem, auto);
		height: auto;
		min-height: 22.5rem;
	}

	.hm-v3-books-track .hm-v3-book-card .hm-v3-book-cover {
		height: 16rem;
		min-height: 0;
	}

	.hm-v3-books-track .hm-v3-book-card h3 {
		position: relative;
		right: auto;
		bottom: auto;
		left: auto;
		display: flex;
		align-items: center;
		min-height: 6.5rem;
		padding: .8rem .85rem .9rem;
		font-size: .94rem;
		line-height: 1.22;
		transform: none;
	}

	.hm-v3-books-track .hm-v3-book-card .hm-v3-book-cover img,
	.hm-v3-books-track .hm-v3-book-card > a:hover .hm-v3-book-cover img,
	.hm-v3-books-track .hm-v3-book-card > a:focus-visible .hm-v3-book-cover img {
		transform: none;
	}

	/* The same touch-safe pattern is used by the related-books carousel on
	 * book detail pages. */
	.hm-book-related-grid article,
	.hm-book-related-grid article > a {
		height: auto;
		min-height: 22rem;
	}

	.hm-book-related-grid article > a {
		display: grid;
		grid-template-rows: 16rem minmax(6rem, auto);
	}

	.hm-book-related-cover {
		height: 16rem;
	}

	.hm-book-related-copy {
		position: relative;
		right: auto;
		bottom: auto;
		left: auto;
		align-content: center;
		min-height: 6rem;
		padding: .8rem .9rem .9rem;
		transform: none;
	}

	.hm-book-related-grid h3 {
		font-size: 1.05rem;
		line-height: 1.2;
	}

	.hm-book-related-grid img,
	.hm-book-related-grid a:hover img,
	.hm-book-related-grid a:focus-visible img {
		transform: none;
	}
}

/* Estado definitivo de las cinco historias compactas del inicio. La altura
 * queda en auto (con máximo del 100%) para que el título y la fecha nunca se
 * recorten en las tarjetas pequeñas del mosaico. */
@media (hover: hover) and (min-width: 1001px) {
	.hm-pdf-home .hm-v3-compact-list .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
		transition:
			height 880ms cubic-bezier(.16, 1, .3, 1),
			box-shadow 720ms ease,
			padding 720ms cubic-bezier(.16, 1, .3, 1) !important;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-excerpt {
		display: -webkit-box !important;
		max-height: 0 !important;
		margin: 0 !important;
		overflow: hidden;
		opacity: 0 !important;
		transform: translate3d(0, 8px, 0);
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 5;
		transition:
			max-height 820ms cubic-bezier(.16, 1, .3, 1),
			margin 720ms cubic-bezier(.16, 1, .3, 1),
			opacity 520ms ease,
			transform 720ms cubic-bezier(.16, 1, .3, 1) !important;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-latest-copy,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-latest-copy {
		height: auto !important;
		max-height: 100% !important;
		padding: .9rem !important;
	}

	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:hover .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-compact-list .hm-v3-compact-card:focus-within .hm-v3-compact-excerpt {
		max-height: 6.5rem !important;
		margin: .55rem 0 0 !important;
		opacity: 1 !important;
		transform: translate3d(0, 0, 0);
	}
}

/* Restored home topics: keep the two compact editorial groups independent
 * from the five-card "Historias recientes" strip, which intentionally shares
 * the legacy compact-list class. This final override must remain after the
 * latest-stories rules above. */
.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-list {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(2, minmax(18rem, 21rem));
	gap: .7rem;
	padding: 0;
	overflow: visible;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card {
	width: 100%;
	height: 100%;
	min-height: 0;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card > .hm-card-body {
	display: grid;
	grid-template-rows: minmax(0, 58%) minmax(0, 42%);
	height: 100%;
	min-height: 0;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-media {
	position: relative;
	inset: auto;
	width: 100%;
	height: 100%;
	transform: none;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card > .hm-card-body > div:last-child {
	position: relative;
	inset: auto;
	display: flex;
	flex-direction: column;
	min-width: 0;
	height: auto;
	padding: .75rem .85rem .8rem;
	background: #fff;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card h3 {
	font-size: clamp(.92rem, 1.15vw, 1.08rem);
	line-height: 1.15;
}

.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card time {
	margin-top: auto;
}

@media (max-width: 900px) {
	.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-list {
		grid-template-rows: none;
		grid-auto-rows: auto;
	}

	.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card,
	.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card > .hm-card-body {
		height: auto;
	}

	.hm-pdf-home .hm-v3-compact-group .hm-v3-compact-card > .hm-card-body {
		grid-template-rows: 12rem auto;
	}
}

/* ==========================================================================
   Actualidad (home) — mosaico único con las 10 publicaciones, con alturas
   ligadas al ancho real de cada celda (clamp() con vw, el mismo recurso que
   ya usa ".hm-v3-compact-list" en la sección de Reparación/DDHH más arriba
   en este archivo). El mosaico anterior fijaba la fila de imagen a una
   altura fija en rem/px (12rem, 11rem...) sin relación con el ancho de la
   celda: una celda ancha con esa altura fija recortaba fotos panorámicas a
   una franja delgada y perdía el contexto de la imagen. Aquí la altura de
   cada fila escala con el viewport, así que la proporción visible de la
   imagen se mantiene razonable sin importar cuán ancha sea la celda. Las 10
   tarjetas se fijan por posición explícita (no nth-child genérico ni
   auto-flow) para que cada fila tenga una altura conocida y evitar el
   colapso de grid con filas "auto" + hijos al 100%.
   ========================================================================== */
.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-template-rows:
		repeat(2, clamp(260px, 23vw, 320px))
		clamp(320px, 28vw, 400px)
		clamp(320px, 28vw, 400px);
	gap: 1rem;
	margin-top: 0;
}

.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) {
	grid-column: 1 / span 2;
	grid-row: 1 / span 2;
}

.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) { grid-column: 3; grid-row: 1; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) { grid-column: 4; grid-row: 1; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) { grid-column: 3; grid-row: 2; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) { grid-column: 4; grid-row: 2; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) { grid-column: 1 / span 2; grid-row: 3; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) { grid-column: 3 / span 2; grid-row: 3; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) { grid-column: 1; grid-row: 4; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) { grid-column: 2; grid-row: 4; }
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) { grid-column: 3 / span 2; grid-row: 4; }

@media (max-width: 1000px) {
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		/* Mismo motivo que en el bloque de 640px, y aquí era más grave. En este
		   tramo las columnas ya son anchas (~340px a 745px de viewport) pero
		   las filas cortas medían 180-220px; descontando los ~120px que ocupa
		   la copia, a la foto le quedaban 77px: un marco de 4,4:1 sobre fotos
		   de 1,47:1, con dos tercios de la imagen recortados. Las cortas suben
		   a 46vw para que a la imagen le queden ~225px y el marco ronde 1,5:1;
		   las de ancho completo (1, 4, 5 y 7) suben a 50vw. */
		grid-template-rows:
			clamp(340px, 50vw, 400px)
			clamp(330px, 46vw, 450px)
			clamp(330px, 46vw, 450px)
			clamp(340px, 50vw, 400px)
			clamp(340px, 50vw, 400px)
			clamp(330px, 46vw, 450px)
			clamp(340px, 50vw, 400px);
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) { grid-column: 1 / span 2; grid-row: 1; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) { grid-column: 1; grid-row: 2; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) { grid-column: 2; grid-row: 2; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) { grid-column: 1; grid-row: 3; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) { grid-column: 2; grid-row: 3; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) { grid-column: 1 / span 2; grid-row: 4; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) { grid-column: 1 / span 2; grid-row: 5; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) { grid-column: 1; grid-row: 6; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) { grid-column: 2; grid-row: 6; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) { grid-column: 1 / span 2; grid-row: 7; }
}

/* Punto de recorte por encima del centro en el mosaico móvil. Las fotos son
   periodísticas y el sujeto casi siempre está en la mitad de arriba; con el
   center por omisión, lo que se recorta sale de la cabeza. Es el mismo criterio
   que ya usan las tarjetas de Especiales (50% 32%).

   El !important es para ganarle a los dos resets de más arriba en este archivo
   (".hm-v3-compact-media img" y el grupo de ".hm-v3-lead-media img"), que fijan
   object-position: center !important para que ninguna regla heredada del tema
   padre mueva el encuadre. Acá se mueve a propósito y solo en móvil. */
@media (max-width: 1000px) {
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-media img {
		object-position: 50% 35% !important;
	}
}

/* Las tarjetas que ocupan 2 columnas (la grande, con span de filas también,
   y las anchas de una sola fila) heredaban un layout ambiguo entre varias
   reglas viejas del mosaico anterior (grid vs. flex según el breakpoint) y
   dejaban un hueco en blanco entre la imagen y el texto, o recortaban la
   imagen a una franja panorámica delgada. Se fuerza aquí un flex column
   explícito para todas: la imagen crece para llenar el espacio disponible y
   el texto queda pegado justo debajo, sin importar cuál otra regla gane en
   el resto de las tarjetas. */
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) > a,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) > .hm-card-body,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) > a,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) > .hm-card-body,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) > a,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) > .hm-card-body,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) > a,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) > .hm-card-body {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) .hm-v3-compact-media,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) .hm-v3-compact-media,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) .hm-v3-compact-media,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-v3-compact-media {
	flex: 1 1 auto;
	height: auto;
	min-height: 0;
	aspect-ratio: auto;
}

.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) .hm-latest-copy,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) .hm-latest-copy,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) .hm-latest-copy,
.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-latest-copy {
	flex: 0 0 auto;
	height: auto;
}

/* ===========================================================================
   MOSAICO DE ACTUALIDAD EN MÓVIL — MEDIDAS APROBADAS. NO TOCAR A OJO.

   Este bloque está aprobado por el equipo y ya se rompió una vez al hacer un
   cambio no relacionado. Antes de modificar cualquier cosa que afecte a estas
   tarjetas, medir en el navegador a 390px y comprobar que sale esto:

     tarjeta        formato        marco       foto visible
     1 y 6          destacada      345 x 214   91%
     2, 3, 7, 8     2-up           166 x 127   88%
     4, 5, 9, 10    horizontal     131 x  98   91%

   Las diez llevan el sello de categoría visible, y ninguna debe recortar el
   título más allá de sus dos líneas.

   Cómo medir (consola del navegador, viewport 390px, tras cargar las
   imágenes diferidas):

     [...document.querySelectorAll('.hm-v3-current .hm-v3-compact-list > *')]
       .map(c => { const m = c.querySelector('.hm-v3-compact-media')
                     .getBoundingClientRect(), i = c.querySelector('img');
                   const rM = m.width / m.height, rI = i.naturalWidth / i.naturalHeight;
                   return Math.round(m.width) + 'x' + Math.round(m.height) + ' ' +
                          Math.round((rI > rM ? rM / rI : rI / rM) * 100) + '%'; });

   Tres cosas de las que depende el resultado y que no son obvias:

   1. El alto de la foto es lo que sobra de la fila después del texto. Si se
      añade cualquier elemento a la copia hay que subir la fila lo mismo, o la
      foto se recorta.
   2. El sello va en una sola línea (flex-wrap: nowrap). Con wrap, en la
      columna de 166px se parte en tres líneas y se come 42px de foto.
   3. La miniatura de las horizontales lleva aspect-ratio 4/3 fijo. Con
      height:100% se vuelve cuadrada y el recorte pasa del 9% al 32%.
   =========================================================================== */

/* Mosaico de Actualidad en movil. Diez tarjetas identicas apiladas en una sola
   columna hacian una pagina larguisima y sin jerarquia: todo pesaba igual y
   nada invitaba a seguir bajando. Aqui el ritmo alterna tres formatos --
   destacado a ancho completo, par de tarjetas 2-up y filas horizontales con
   miniatura -- de modo que el ojo tenga puntos de anclaje y la seccion ocupe
   cerca de la mitad del alto anterior. Las posiciones se fijan una por una
   (no auto-flow) porque cada fila tiene una altura conocida distinta. */
@media (max-width: 640px) {
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		/* Las filas 1 y 5 son las dos destacadas a ancho completo. Van iguales
		   y más altas de lo que estaban porque su copia ocupa ~120px fijos
		   (título a dos líneas más fecha) y lo que sobra es el alto de la
		   foto: con 240px de fila quedaba un marco de 345x120, o sea 2,9:1
		   sobre fotos que son 1,47:1 — se recortaba la mitad de la imagen y
		   se perdía la cabeza del sujeto. Con estos valores el marco queda
		   cerca de 1,6:1 y la foto entra casi entera. */
		/* Las filas verticales llevan 24px más que antes: es lo que ocupa el
		   sello de categoría (19px de alto y 4,8 de margen), que volvió a
		   mostrarse. Sin ese margen la etiqueta le quitaba el alto a la foto y
		   las imágenes se recortaban de nuevo. Las horizontales no cambian:
		   ahí el sello no se muestra. */
		grid-template-rows:
			clamp(354px, 92vw, 424px)
			clamp(239px, 62vw, 279px)
			clamp(132px, 34vw, 152px)
			clamp(132px, 34vw, 152px)
			clamp(354px, 92vw, 424px)
			clamp(239px, 62vw, 279px)
			clamp(132px, 34vw, 152px)
			clamp(132px, 34vw, 152px);
		gap: .7rem;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) { grid-column: 1 / span 2; grid-row: 1; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) { grid-column: 1; grid-row: 2; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) { grid-column: 2; grid-row: 2; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) { grid-column: 1 / span 2; grid-row: 3; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) { grid-column: 1 / span 2; grid-row: 4; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) { grid-column: 1 / span 2; grid-row: 5; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) { grid-column: 1; grid-row: 6; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) { grid-column: 2; grid-row: 6; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) { grid-column: 1 / span 2; grid-row: 7; }
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) { grid-column: 1 / span 2; grid-row: 8; }

	/* Verticales (destacados y 2-up): imagen arriba, texto debajo. Las tarjetas
	   7 y 10 traen un flex column heredado de las reglas de escritorio, asi que
	   se reafirma el grid para todas las que aqui no son horizontales. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) > .hm-card-body {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: minmax(0, 1fr) auto;
		height: 100%;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(1) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(6) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) .hm-v3-compact-media {
		height: 100%;
		min-height: 0;
		aspect-ratio: auto;
	}

	/* Horizontales: miniatura a la izquierda y titular al lado, para romper la
	   sucesion de bloques y bajar el alto de la seccion. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) > .hm-card-body,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) > a,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) > .hm-card-body {
		display: grid;
		grid-template-columns: 38% minmax(0, 1fr);
		grid-template-rows: 100%;
		height: 100%;
	}

	/* La miniatura conserva su 4:3 en vez de estirarse al alto de la fila.
	   Esas filas subieron para que cupiera el sello de categoría, y con
	   height:100% la miniatura se volvía cuadrada: el recorte de la foto
	   pasaba del 17% al 32%. Centrada, el alto que sobra queda repartido. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) .hm-v3-compact-media,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-v3-compact-media {
		height: auto;
		min-height: 0;
		aspect-ratio: 4 / 3;
		align-self: center;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-latest-copy {
		height: 100%;
		justify-content: center;
		padding: .6rem .75rem;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) h3 {
		margin: 0 0 .3rem;
		font-size: .92rem;
		line-height: 1.2;
		/* max-height debe ir junto al line-clamp: la regla general del mosaico
		   recorta a 2.5em y, sin este par, el titulo queda cortado a media linea. */
		max-height: 2.45em;
		-webkit-line-clamp: 2;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) time {
		margin-top: 0;
		padding-top: 0;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(4) .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(5) .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(9) .hm-v3-compact-excerpt,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(10) .hm-v3-compact-excerpt {
		display: none;
	}

	/* Titulares mas apretados en las 2-up, que son las celdas mas angostas. */
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) h3,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) h3 {
		margin: 0 0 .35rem;
		font-size: .88rem;
		line-height: 1.18;
		max-height: 3.6em;
		-webkit-line-clamp: 3;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) time,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) time {
		margin-top: 0;
		padding-top: 0;
	}

	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(2) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(3) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(7) .hm-latest-copy,
	.hm-pdf-home .hm-v3-current .hm-v3-compact-list .hm-v3-compact-card:nth-child(8) .hm-latest-copy {
		padding: .6rem .7rem .7rem;
	}
}

/* Apertura del panel. Se anima con "animation" y no con "transition" porque el
   panel se muestra quitandole el atributo hidden (display:none -> block) y una
   transicion no arranca en ese salto. Los enlaces entran escalonados detras del
   panel para que la vista siga el orden de lectura. */
@keyframes hm-mobile-nav-in {
	from { opacity: 0; transform: translateY(-14px); }
	to { opacity: 1; transform: none; }
}

@keyframes hm-mobile-nav-item-in {
	from { opacity: 0; transform: translateY(9px); }
	to { opacity: 1; transform: none; }
}

.hm-mobile-nav:not([hidden]) {
	animation: hm-mobile-nav-in .3s cubic-bezier(.22, 1, .36, 1) both;
}

.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link,
.hm-mobile-nav:not([hidden]) .hm-mobile-nav-social {
	animation: hm-mobile-nav-item-in .36s cubic-bezier(.22, 1, .36, 1) both;
}

.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link:nth-child(1) { animation-delay: .06s; }
.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link:nth-child(2) { animation-delay: .11s; }
.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link:nth-child(3) { animation-delay: .16s; }
.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link:nth-child(4) { animation-delay: .21s; }
.hm-mobile-nav:not([hidden]) .hm-mobile-nav-social { animation-delay: .27s; }

.hm-mobile-nav:not([hidden]) .hm-mobile-nav-scrim {
	animation: hm-mobile-nav-scrim-in .32s ease both;
}

@keyframes hm-mobile-nav-scrim-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Por debajo de 768px la fila de enlaces se cambia por el boton, asi que la
   cabecera pierde su segunda fila y no necesita los 120px que fija el bloque
   de 900px. Va al final del archivo a proposito: ese bloque esta mas abajo que
   el de 767px y le ganaria por orden de cascada. */
@media (max-width: 767px) {
	:root { --hm-header-height: 86px; }

	.hm-header-inner {
		grid-template-columns: minmax(110px, 1fr) auto;
		grid-template-rows: 1fr;
	}

	.hm-header-tools { grid-row: 1; }
}

/* Cinturon: el panel movil solo existe por debajo de 768px. El JS ya lo cierra
   al cruzar ese ancho, pero esto lo cubre si el JS no llega a cargar. */
@media (min-width: 768px) {
	.hm-mobile-nav { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-mobile-nav:not([hidden]),
	.hm-mobile-nav:not([hidden]) .hm-mobile-nav-link,
	.hm-mobile-nav:not([hidden]) .hm-mobile-nav-social,
	.hm-mobile-nav:not([hidden]) .hm-mobile-nav-scrim { animation: none; }
	.hm-nav-toggle-bars::before,
	.hm-nav-toggle-bars::after { transition: none; }
}

/* ==========================================================================
   Periodismo participativo. Las piezas son de formatos distintos —un especial
   con líneas de tiempo, dos audiovisuales, un micrositio— y en el original eso
   se leía como un listado desparejo: fotos de proporciones distintas, títulos
   a veces centrados y a veces no, y un botón "Visitar" azul que no pertenece a
   la paleta. Acá el formato pasa a ser un dato explícito (la etiqueta sobre el
   título), el marco es el mismo para todas y la tarjeta entera es el enlace.
   ========================================================================== */
.hm-pp {
	--hm-pp-accent: var(--hm-color-especiales);
	/* Variante para texto pequeño. El acento del área da 4,37:1 sobre el fondo
	   de la tarjeta —por debajo del 4,5:1 que pide WCAG para texto normal—, así
	   que la etiqueta de formato y el "Visitar" usan este tono, un 4% más
	   oscuro, que llega a 4,67:1. El acento sin tocar sigue para lo que no es
	   texto. */
	--hm-pp-accent-texto: #317a8b;
	background: #fff;
	color: var(--hm-brand-ink);
}

.hm-pp-piezas {
	padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(4rem, 8vw, 7rem);
}

.hm-pp .hm-shell {
	width: min(1240px, calc(100% - 48px));
}

/* align-items: start para que cada tarjeta mida su contenido. Estirándolas
   todas al alto de la fila, el sobrante se lo llevaba el marco de la imagen, y
   como una de las piezas solo tiene título, terminaba con la foto más grande de
   la retícula siendo la que menos cuenta. */
.hm-pp-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
	gap: clamp(1.25rem, 2.2vw, 2rem);
}

.hm-pp-card {
	min-width: 0;
	overflow: hidden;
	border: 1px solid #d8d1c8;
	border-radius: 14px;
	background: color-mix(in srgb, var(--hm-pp-accent) 4%, #fff);
	transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease;
}

/* La primera pieza abre la retícula: es el especial más extenso y el que da
   contexto al resto, así que va a ancho completo y con la foto al lado del
   texto en vez de encima. */
.hm-pp-card.is-lead {
	grid-column: 1 / -1;
}

.hm-pp-card:hover,
.hm-pp-card:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 20px 40px -22px rgba(20, 16, 14, .3);
}

.hm-pp-card > a,
.hm-pp-card-inner {
	display: flex;
	height: 100%;
	flex-direction: column;
	color: inherit;
	text-decoration: none;
}

.hm-pp-card.is-lead > a {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	align-items: stretch;
}

.hm-pp-media {
	position: relative;
	aspect-ratio: 3 / 2;
	flex: none;
	overflow: hidden;
	background: #eee9e2;
}

.hm-pp-card.is-lead .hm-pp-media {
	aspect-ratio: auto;
	min-height: clamp(260px, 30vw, 380px);
}

.hm-pp-media img,
.hm-pp-media .hm-v3-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Por encima del centro: son fotos documentales y el sujeto está arriba. */
	object-position: 50% 38%;
	transition: transform .6s cubic-bezier(.22, 1, .36, 1), filter .6s ease;
}

/* Un sello no se recorta: se muestra completo y centrado sobre el fondo del
   marco. También se queda quieto en hover — el zoom es un gesto para
   fotografías, y sobre un logo solo lo desencuadra. */
.hm-pp-card.is-sello .hm-pp-media {
	background: color-mix(in srgb, var(--hm-pp-accent) 6%, #fff);
}

.hm-pp-card.is-sello .hm-pp-media img {
	object-fit: contain;
	object-position: 50% 50%;
	padding: clamp(1rem, 2vw, 1.75rem);
	box-sizing: border-box;
}

.hm-pp-card:hover img,
.hm-pp-card:focus-within img {
	transform: scale(1.03);
	filter: saturate(.9);
}

.hm-pp-card.is-sello:hover img,
.hm-pp-card.is-sello:focus-within img {
	transform: none;
	filter: none;
}

.hm-pp-copy {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: .6rem;
	padding: clamp(1.25rem, 2vw, 1.75rem);
}

.hm-pp-card.is-lead .hm-pp-copy {
	flex: 1 1 auto;
	justify-content: center;
	gap: .8rem;
}

.hm-pp-formato {
	margin: 0;
	color: var(--hm-pp-accent-texto);
	font-family: var(--hm-font-mono);
	font-size: .74rem;
	letter-spacing: .02em;
}

.hm-pp-copy h3 {
	margin: 0;
	color: var(--hm-brand-ink);
	font-family: var(--hm-font-display);
	/* Por debajo del <h1>, que la regla global fija en 3vw. */
	font-size: clamp(1.15rem, 1.7vw, 1.5rem);
	font-weight: 650;
	line-height: 1.18;
	letter-spacing: -.02em;
}

.hm-pp-card.is-lead .hm-pp-copy h3 {
	font-size: clamp(1.4rem, 2.2vw, 2rem);
}

.hm-pp-desc {
	margin: 0;
	color: #514b47;
	font-size: .95rem;
	line-height: 1.6;
}

.hm-pp-cta {
	display: inline-flex;
	align-items: center;
	/* 44px de alto mínimo: es el área de toque real del enlace en móvil. */
	min-height: 44px;
	gap: .45rem;
	margin-top: auto;
	color: var(--hm-pp-accent-texto);
	font-family: var(--hm-font-mono);
	font-size: .78rem;
	font-weight: 600;
}

.hm-pp-cta span[aria-hidden] {
	transition: transform .3s ease;
}

.hm-pp-card:hover .hm-pp-cta span[aria-hidden],
.hm-pp-card:focus-within .hm-pp-cta span[aria-hidden] {
	transform: translate(3px, -3px);
}

.hm-pp-card:not(.is-lead):hover .hm-pp-cta span[aria-hidden],
.hm-pp-card:not(.is-lead):focus-within .hm-pp-cta span[aria-hidden] {
	transform: translateX(4px);
}

/* Sin enlace todavía (una pieza del original no tiene destino publicado): la
   tarjeta se muestra igual pero sin señales de que se pueda pulsar. */
.hm-pp-card.is-sin-enlace {
	background: #fff;
}

.hm-pp-card.is-sin-enlace:hover,
.hm-pp-card.is-sin-enlace:focus-within {
	transform: none;
	box-shadow: none;
}

.hm-pp-card > a:focus-visible {
	outline: 2px solid var(--hm-pp-accent);
	outline-offset: -4px;
	border-radius: 12px;
}

@media (max-width: 900px) {
	.hm-pp-card.is-lead > a {
		grid-template-columns: 1fr;
	}

	.hm-pp-card.is-lead .hm-pp-media {
		aspect-ratio: 16 / 10;
		min-height: 0;
	}
}

@media (max-width: 680px) {
	.hm-pp .hm-shell {
		width: min(1240px, calc(100% - 28px));
	}

	.hm-pp-grid {
		grid-template-columns: 1fr;
	}

	/* Una sola columna: la foto se muestra entera, con su propio alto, igual
	   que en las tarjetas de Especiales. */
	.hm-pp-media,
	.hm-pp-card.is-lead .hm-pp-media {
		aspect-ratio: auto;
		min-height: 0;
	}

	.hm-pp-media img {
		height: auto;
	}

	.hm-pp-media:not(:has(img)) {
		aspect-ratio: 3 / 2;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hm-pp-card,
	.hm-pp-media img,
	.hm-pp-cta span[aria-hidden] {
		transition: none;
	}

	.hm-pp-card:hover,
	.hm-pp-card:focus-within {
		transform: none;
	}

	.hm-pp-card:hover img,
	.hm-pp-card:focus-within img {
		transform: none;
	}
}

/* ==========================================================================
   Etiquetas de categoría y formato enlazadas al buscador.

   Cada término lleva a /?s=<término>, así que desde cualquier listado se salta
   a todo lo que comparte esa palabra. Eso obligó a cambiar cómo se enlaza la
   tarjeta: antes un <a> envolvía el cuerpo completo, y meter estos enlaces
   dentro habría anidado un <a> en otro —marcado inválido que el navegador
   deshace cerrando el externo, partiendo la tarjeta en dos—.

   El reparto ahora es por capas dentro de .hm-card-body:
     1. .hm-card-overlay  lámina que hace clicable toda la tarjeta (z-index 2)
     2. .hm-editorial-taxonomy  por encima de la lámina (z-index 3)
   El enlace accesible es el del título; la lámina va aria-hidden y sin
   tabindex para no anunciar el mismo destino dos veces.

   La lámina va dentro de .hm-card-body y no como ::after del título porque
   .hm-v3-card-copy y .hm-latest-copy son position:absolute —el panel que sube
   sobre la imagen en hover—, así que un inset:0 desde el título se quedaba
   encerrado en la copia y la mitad de la tarjeta no respondía al clic.
   ========================================================================== */
.hm-v3-card,
.hm-latest-story,
.hm-v3-compact-card,
.hm-v3-lead,
.hm-v3-archive-lead,
.hm-card-body {
	position: relative;
}

.hm-card-overlay {
	position: absolute;
	z-index: 2;
	inset: 0;
}

/* !important por lo mismo que en las etiquetas: "a { color: ... !important }"
   vive más arriba en este archivo y, al envolver el titular en un <a>, lo
   capturó y los títulos salían del gris azulado de los enlaces en vez del
   negro de siempre. Con inherit toman el color del h2/h3 que los contiene. */
.hm-card-link {
	color: inherit !important;
	text-decoration: none;
}

.hm-editorial-taxonomy {
	position: relative;
	z-index: 3;
}

/* Los términos conservan exactamente el color que tenían cuando eran <span>.
   Hay que repetirlo con !important porque más arriba en este archivo vive
   "a { color: var(--hm-stamp-soft) !important }" —puesta para ganarle al
   global-styles-inline-css de WordPress—, y en cuanto estos términos pasaron
   de <span> a <a> esa regla los capturó: los dos salían del mismo gris
   azulado en vez del vinotinto y el turquesa que les toca. */
.hm-editorial-taxonomy a {
	text-decoration: none;
}

.hm-editorial-taxonomy .hm-editorial-category {
	color: #337f91 !important;
}

.hm-editorial-taxonomy .hm-editorial-tag {
	color: #6f2c3f !important;
}

.hm-editorial-taxonomy.is-category-highlight .hm-editorial-category {
	color: #6f2c3f !important;
}

.hm-editorial-taxonomy.is-category-highlight .hm-editorial-tag {
	color: #337f91 !important;
}

.hm-editorial-taxonomy a:hover,
.hm-editorial-taxonomy a:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.hm-editorial-taxonomy a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
	border-radius: 3px;
}

/* Los mismos términos aparecen como texto en el encabezado de la publicación,
   en el destacado del archivo y en las relacionadas. Ahí también enlazan al
   buscador, conservando el aspecto que ya tenían. */
.hm-v3-meta a {
	/* Mismo motivo que arriba: el color del contenedor, no el de "a". */
	color: inherit !important;
	text-decoration: none;
}

.hm-v3-meta a:hover,
.hm-v3-meta a:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.hm-v3-meta a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
	border-radius: 2px;
}

/* El foco del título se dibuja sobre la tarjeta entera, que es lo que se va a
   activar, y no sobre el renglón del titular. */
.hm-card-link:focus-visible {
	outline: 2px solid var(--hm-v3-orange, #d3592b);
	outline-offset: 3px;
	border-radius: 3px;
}

/* ── Página Nosotros ──────────────────────────────────────────────────────
 *
 * Reemplaza el volcado de Divi del sitio viejo (un muro de texto centrado, el
 * logotipo a tamaño gigante y varias pantallas en blanco donde iba el equipo).
 * Tres bloques: presentación a dos columnas, equipo en retícula y un cierre
 * con los dos enlaces de contacto que ya existen en el pie.
 *
 * Tono de área: el marrón de Nosotros (--hm-area-accent en .hm-area-hero), que
 * es el que ya identifica la sección en el menú. */

.hm-nosotros {
	--hm-nosotros-accent: var(--hm-color-nosotros);
	background: #fff;
	color: var(--hm-v3-ink, #201d1b);
}

.hm-nosotros-intro {
	padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(2.5rem, 5vw, 4.5rem);
}

.hm-nosotros-intro-grid {
	display: grid;
	align-items: start;
	gap: clamp(2rem, 5vw, 4rem);
	grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
}

.hm-nosotros-intro-copy h2 {
	margin: 0 0 1.2rem;
	font-family: var(--hm-font-serif, "Roboto", sans-serif);
	font-size: clamp(1.6rem, 2.6vw, 2.4rem);
	line-height: 1.15;
}

.hm-nosotros-intro-copy p {
	margin: 0 0 1.1rem;
	color: #4f4a46;
	font-size: clamp(1rem, 1.25vw, 1.12rem);
	line-height: 1.65;
}

.hm-nosotros-intro-copy p:last-child {
	margin-bottom: 0;
}

/* El logotipo acompaña, no protagoniza: en el sitio viejo salía a 600px y se
 * comía la pantalla. Se topa a 320px y se centra en su columna. */
.hm-nosotros-intro-marca {
	display: flex;
	margin: 0;
	justify-content: center;
	padding: clamp(1.25rem, 3vw, 2.25rem);
	background: linear-gradient(115deg, color-mix(in srgb, var(--hm-nosotros-accent) 8%, white), #fff 64%);
	border: 1px solid var(--hm-v3-line, #d8d1c8);
	border-radius: 4px;
}

.hm-nosotros-intro-marca img {
	width: min(100%, 320px);
	height: auto;
}

.hm-nosotros-equipo {
	padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(3rem, 6vw, 5.5rem);
	background: var(--hm-v3-paper, #f6f3ed);
	border-top: 1px solid var(--hm-v3-line, #d8d1c8);
	border-bottom: 1px solid var(--hm-v3-line, #d8d1c8);
}

.hm-nosotros-equipo-head {
	margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.hm-nosotros-equipo-head h2 {
	margin: 0 0 .35rem;
	font-family: var(--hm-font-serif, "Roboto", sans-serif);
	font-size: clamp(1.5rem, 2.4vw, 2.2rem);
	line-height: 1.15;
}

.hm-nosotros-equipo-head p {
	margin: 0;
	color: var(--hm-v3-muted, #6f6963);
}

.hm-nosotros-equipo-grid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
}

.hm-nosotros-persona {
	display: grid;
	align-items: start;
	gap: 1rem;
	grid-template-columns: auto minmax(0, 1fr);
	padding: 1.4rem;
	border: 1px solid var(--hm-v3-line, #d8d1c8);
	border-radius: 4px;
	background: #fff;
}

.hm-nosotros-persona-foto {
	display: grid;
	width: 56px;
	height: 56px;
	overflow: hidden;
	place-items: center;
	border-radius: 50%;
	background: color-mix(in srgb, var(--hm-nosotros-accent) 12%, white);
	color: var(--hm-nosotros-accent);
	font-family: var(--hm-font-mono, "Roboto Mono", monospace);
	font-size: .95rem;
	font-weight: 700;
}

.hm-nosotros-persona-foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hm-nosotros-persona h3 {
	margin: 0 0 .2rem;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1.08rem;
	line-height: 1.25;
}

.hm-nosotros-persona-cargo {
	margin: 0 0 .55rem;
	color: var(--hm-nosotros-accent);
	font-family: var(--hm-font-mono, "Roboto Mono", monospace);
	font-size: .72rem;
}

.hm-nosotros-persona-perfil {
	margin: 0;
	color: #4f4a46;
	font-size: .9rem;
	line-height: 1.55;
}

@media (max-width: 900px) {
	/* El logotipo pasa arriba del texto: en una sola columna, dejarlo debajo lo
	 * separaba de la presentación que acompaña. */
	.hm-nosotros-intro-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.hm-nosotros-intro-marca {
		order: -1;
	}
}

@media (max-width: 560px) {
	.hm-nosotros-persona {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ── Contacto ────────────────────────────────────────────────────────────
 *
 * Dos columnas: presentación y datos a la izquierda, formulario de Kadence en
 * una tarjeta a la derecha. Mismo tono marrón de Nosotros, que es el área de
 * la que cuelga la página. Los estilos del formulario se escriben aquí y no en
 * el panel de Kadence para que un cambio en wp-admin no rompa el diseño. */

.hm-contacto {
	--hm-contacto-accent: var(--hm-color-nosotros);
	background: #fff;
	color: var(--hm-brand-ink, #211d1b);
}

.hm-contacto-cuerpo {
	padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(3.5rem, 7vw, 6rem);
}

/* Mismo ancho que el título de arriba (.hm-area-hero > .hm-shell) para que
 * el texto y el formulario arranquen alineados con él. */
.hm-contacto-grid.hm-shell {
	width: min(1240px, calc(100% - 48px));
}

.hm-contacto-grid {
	display: grid;
	align-items: start;
	gap: clamp(2rem, 5vw, 4.5rem);
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
}

.hm-contacto-copy h2 {
	margin: 0 0 1.1rem;
	font-family: var(--hm-font-serif, "Roboto", sans-serif);
	font-size: clamp(1.6rem, 2.6vw, 2.4rem);
	line-height: 1.15;
}

.hm-contacto-copy p {
	margin: 0 0 1.1rem;
	color: #4f4a46;
	font-size: clamp(1rem, 1.25vw, 1.12rem);
	line-height: 1.65;
}

.hm-contacto-datos {
	display: grid;
	gap: 1.25rem;
	margin: 2rem 0 0;
	padding-top: 1.75rem;
	border-top: 1px solid var(--hm-v3-line, #d8d1c8);
}

.hm-contacto-datos dt {
	margin: 0 0 .3rem;
	color: var(--hm-contacto-accent);
	font-family: var(--hm-font-mono, "Roboto Mono", monospace);
	font-size: .75rem;
}

.hm-contacto-datos dd {
	margin: 0;
	color: #4f4a46;
	font-size: .98rem;
	line-height: 1.55;
}

.hm-contacto-datos a {
	color: var(--hm-brand-ink, #211d1b);
	text-decoration-color: color-mix(in srgb, var(--hm-contacto-accent) 45%, transparent);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.hm-contacto-form {
	padding: clamp(1.4rem, 3.2vw, 2.5rem);
	background: var(--hm-v3-paper, #f6f3ed);
	border: 1px solid var(--hm-v3-line, #d8d1c8);
	border-radius: 4px;
}

/* Kadence arma el formulario en columna con flex y su hoja se carga después
 * de esta, así que la regla necesita un selector más específico que el suyo. */
.hm-contacto .wp-block-kadence-advanced-form .kb-advanced-form {
	display: grid;
	gap: 1.15rem 1rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Todo ocupa el ancho completo menos los dos primeros campos (nombre y
 * correo), que van lado a lado. Si se agrega un campo desde wp-admin cae
 * solo a lo ancho. */
.hm-contacto .kb-advanced-form > * {
	grid-column: 1 / -1;
}

.hm-contacto .kb-advanced-form > .kb-adv-form-field:nth-child(-n+2) {
	grid-column: auto;
}

.hm-contacto .kb-adv-form-field {
	margin: 0;
}

.hm-contacto .kb-adv-form-label {
	margin: 0 0 .45rem;
	color: var(--hm-brand-ink, #211d1b);
	font-size: .88rem;
	font-weight: 600;
	line-height: 1.3;
}

.hm-contacto .wp-block-kadence-advanced-form .kb-adv-form-required {
	margin-left: .15em;
	color: var(--hm-contacto-accent);
}

.hm-contacto .kb-form-basic-style input[type=text],
.hm-contacto .kb-form-basic-style input[type=email],
.hm-contacto .kb-form-basic-style textarea {
	width: 100%;
	padding: .8rem .95rem;
	background: #fff;
	border: 1px solid #cdc4b9;
	border-radius: 4px;
	box-shadow: none;
	color: var(--hm-brand-ink, #211d1b);
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.45;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.hm-contacto .kb-form-basic-style textarea {
	min-height: 9.5rem;
	resize: vertical;
}

.hm-contacto .kb-form-basic-style ::placeholder {
	color: #9a928a;
	opacity: 1;
}

.hm-contacto .kb-form-basic-style input[type=text]:focus,
.hm-contacto .kb-form-basic-style input[type=email]:focus,
.hm-contacto .kb-form-basic-style textarea:focus {
	border-color: var(--hm-contacto-accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--hm-contacto-accent) 18%, transparent);
	outline: none;
}

/* La autorización: Kadence pinta el texto como <legend> y la casilla debajo.
 * Se pone la casilla a la izquierda del texto, como se lee un "acepto". */
.hm-contacto .kb-radio-check-item-wrap {
	position: relative;
}

/* El <legend> no respeta el padding del fieldset: el espacio de la casilla
 * va en el propio texto. */
.hm-contacto .kb-radio-check-item-wrap .kb-adv-form-label {
	float: left;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding-left: 1.9rem;
	color: #4f4a46;
	font-size: .9rem;
	font-weight: 400;
	line-height: 1.5;
}

.hm-contacto .kb-radio-check-item-wrap .kb-radio-check-item {
	position: absolute;
	top: .15rem;
	left: 0;
	margin: 0;
}

.hm-contacto .kb-form-basic-style input[type=checkbox] {
	width: 1.15rem;
	height: 1.15rem;
	margin: 0;
	border-color: #b9ae9f;
	border-radius: 3px;
}

.hm-contacto .kb-form-basic-style input[type=checkbox]:checked {
	background: var(--hm-contacto-accent);
	border-color: var(--hm-contacto-accent);
}

.hm-contacto .kb-submit-field {
	margin-top: .35rem;
}

.hm-contacto .kb-advanced-form .kb-adv-form-submit-button.kb-button {
	padding: .9rem 1.7rem;
	background: var(--hm-contacto-accent);
	border: 0;
	border-radius: 4px;
	box-shadow: none;
	color: #fff;
	font-family: "Roboto", ui-sans-serif, system-ui, sans-serif;
	font-size: .98rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.2;
	text-transform: none;
	transition: background-color .2s ease, transform .2s ease;
}

.hm-contacto .kb-advanced-form .kb-adv-form-submit-button.kb-button:hover,
.hm-contacto .kb-advanced-form .kb-adv-form-submit-button.kb-button:focus-visible {
	background: color-mix(in srgb, var(--hm-contacto-accent) 82%, black);
	color: #fff;
	transform: translateY(-1px);
}

.hm-contacto .kb-advanced-form .kb-adv-form-submit-button.kb-button:focus-visible {
	outline: 2px solid var(--hm-contacto-accent);
	outline-offset: 3px;
}

.hm-contacto .kb-adv-form-message {
	margin: 1rem 0 0;
	padding: .95rem 1.1rem;
	border-radius: 4px;
	font-size: .95rem;
	line-height: 1.5;
}

/* La respuesta es un número de una o dos cifras: el campo no necesita el
 * ancho completo. */
.hm-contacto .kb-form-basic-style .hm-form-verificacion input[type=text] {
	max-width: 9rem;
}

/* Campo trampa: fuera de la vista y del orden de tabulación. No se usa
 * display:none porque algunos robots se saltan los campos ocultos así. */
.hm-form-trampa {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.hm-contacto-sin-form {
	margin: 0;
	color: #4f4a46;
}

@media (max-width: 900px) {
	.hm-contacto-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 600px) {
	.hm-contacto-grid.hm-shell {
		width: min(1240px, calc(100% - 28px));
	}
}

@media (max-width: 560px) {
	.hm-contacto .kb-advanced-form > .kb-adv-form-field:nth-child(-n+2) {
		grid-column: 1 / -1;
	}
}