/*======================================================
BLOG Y ARTÍCULOS
======================================================*/

.blog-page{
	background:#fff;
}

.blog-hero,
.post-hero{
	padding:3.75rem 0 3rem;
	text-align:center;
	background:linear-gradient(180deg,var(--surface),#fff);
}

.blog-hero .container,
.post-hero .container{
	max-width:900px;
}

.blog-hero h1,
.post-hero h1{
	max-width:17ch;
	margin:0 auto 1rem;
	font-size:clamp(2.7rem,4.5vw,4.4rem);
	line-height:1.03;
	letter-spacing:-.025em;
	text-wrap:balance;
}

.blog-hero__eyebrow,
.post-hero__eyebrow{
	color:var(--color-secondary-dark);
	font-weight:var(--weight-semibold);
	text-transform:uppercase;
	letter-spacing:.07em;
	font-size:.82rem;
	margin-bottom:.65rem;
}

.blog-hero__lead,
.post-hero__meta{
	max-width:700px;
	margin-inline:auto;
	font-size:1rem;
	line-height:1.7;
	color:var(--text-light);
}

.blog-hero__lead p{
	margin:0;
}

.post-hero__eyebrow a{
	color:inherit;
	text-decoration:none;
}

.post-hero__eyebrow a:hover,
.post-hero__eyebrow a:focus-visible{
	text-decoration:underline;
	text-underline-offset:.2em;
}

.post-hero__tags{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	gap:.45rem;
	margin-top:1rem;
	font-size:.82rem;
}

.post-hero__tags-label{
	color:var(--text-light);
	font-weight:var(--weight-semibold);
}

.post-hero__tags a{
	padding:.35rem .7rem;
	border:1px solid var(--gray-300);
	border-radius:var(--radius-pill);
	color:var(--heading-color);
	text-decoration:none;
	transition:var(--transition-fast);
}

.post-hero__tags a:hover,
.post-hero__tags a:focus-visible{
	background:var(--color-primary);
	border-color:var(--color-primary);
	color:#fff;
}

.blog-categories{
	dis:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:.65rem;
	max-width:1100px;
	margin:2rem auto 0;
}

.blog-categories__item{
	padding:.55rem 1rem;
	border-radius:var(--radius-pill);
	border:1px solid var(--gray-300);
	font-size:.84rem;
	font-weight:var(--weight-semibold);
	color:var(--heading-color);
	text-decoration:none;
	transition:var(--transition-fast);
}

.blog-categories__item:hover,
.blog-categories__item:focus-visible{
	background:var(--color-primary);
	color:#fff;
	border-color:var(--color-primary);
}

.posts-archive{
	padding:3.5rem 0 5rem;
}

.posts-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:1.5rem;
	margin-top:0;
}

.post-card{
	dis:flex;
	flex-direction:column;
	min-width:0;
	background:#fff;
	border:1px solid var(--gray-200);
	border-radius:var(--radius-lg);
	overflow:hidden;
	text-decoration:none;
	color:inherit;
	transition:var(--transition);
}

.post-card:hover{
	transform:translateY(-4px);
	box-shadow:var(--shadow-md);
	border-color:var(--color-secondary);
}

.post-card__media{
	position:relative;
	aspect-ratio:16/10;
	background:linear-gradient(135deg,var(--surface),var(--gray-100));
}

.post-card__media img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.post-card__badge{
	position:absolute;
	bottom:.75rem;
	left:.75rem;
	background:rgba(22,21,19,.86);
	color:#fff;
	font-size:.73rem;
	font-weight:var(--weight-semibold);
	padding:.32rem .72rem;
	border-radius:var(--radius-pill);
}

.post-card__body{
	dis:flex;
	flex-direction:column;
	flex:1;
	padding:1.35rem;
}

.post-card__date{
	display:block;
	font-size:.78rem;
	color:var(--text-light);
	margin-bottom:.45rem;
}

.post-card__title{
	font-size:1.08rem;
	line-height:1.35;
	margin-bottom:.6rem;
	text-wrap:balance;
}

.post-card__excerpt{
	font-size:.9rem;
	color:var(--text-light);
	margin:0;
	line-height:1.65;
}

.blog-empty{
	max-width:720px;
	margin:0 auto;
	padding:2rem;
	text-align:center;
	background:var(--surface);
	border:1px solid var(--gray-200);
	border-radius:var(--radius-lg);
}

.blog-empty h2{
	font-size:clamp(1.7rem,3vw,2.4rem);
	margin-bottom:.75rem;
}

.blog-empty p{
	margin:0;
	line-height:1.7;
	color:var(--text-light);
}

.post-content{
	padding:3.75rem 0;
}

.post-content .container,
.single-post .entry-content{
	max-width:780px;
	margin-inline:auto;
}

.post-content section,
.single-post .entry-content section{
	padding:0;
	margin:0 0 3rem;
}

.post-content h2,
.single-post .entry-content h2{
	margin:2.5rem 0 1rem;
	font-size:clamp(2rem,3.5vw,3rem);
	line-height:1.12;
	text-wrap:balance;
}

.post-content h3,
.single-post .entry-content h3{
	margin:2rem 0 .75rem;
	font-size:clamp(1.35rem,2vw,1.8rem);
}

.post-content p,
.post-content li,
.single-post .entry-content p,
.single-post .entry-content li{
	line-height:1.75;
}

.post-content ul,
.post-content ol,
.single-post .entry-content ul,
.single-post .entry-content ol{
	margin:1rem 0 1.75rem;
	padding-left:1.35rem;
}

.post-content li + li,
.single-post .entry-content li + li{
	margin-top:.6rem;
}

.post-related-service{
	margin-top:2rem;
	padding:1.25rem 1.5rem;
	background:var(--surface);
	border-left:4px solid var(--color-secondary);
	border-radius:0 var(--radius-md) var(--radius-md) 0;
	font-size:.95rem;
}

.author-box{
	max-width:780px;
	margin:0 auto 3rem;
	padding:1.5rem;
	background:#fff;
	border:1px solid var(--gray-200);
	border-radius:var(--radius-md);
}

.author-box__name{
	font-size:1rem;
	margin-bottom:.4rem;
}

.author-box__bio{
	color:var(--text-light);
	font-size:.88rem;
	margin:0;
}

.related-posts{
	padding:4rem 0;
}

.related-posts .section-header{
	max-width:760px;
	margin:0 auto 2.5rem;
	text-align:center;
}

@media (min-width:993px){
	/*
	 * Mantiene una jerarquía legible en escritorio incluso cuando el título
	 * del artículo es largo. Estas reglas no alteran tablet ni móvil.
	 */
	.single-post .post-hero .container{
		max-width:1040px;
	}

	.single-post .post-hero h1{
		max-width:24ch;
		font-size:clamp(2.6rem,3.4vw,3.55rem);
		line-height:1.08;
	}

	.single-post .post-content{
		font-size:1rem;
	}

	.single-post .post-content h2,
	.single-post .entry-content h2{
		font-size:clamp(1.85rem,2.4vw,2.45rem);
		line-height:1.18;
	}
}

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

@media (max-width:600px){
	.blog-hero,
	.post-hero{
		padding:2.75rem 0 2.25rem;
	}

	.blog-hero h1,
	.post-hero h1{
		font-size:clamp(2.2rem,11vw,3rem);
	}

	.blog-categories{
		justify-content:flex-start;
		overflow-x:auto;
		flex-wrap:nowrap;
		padding-bottom:.5rem;
	}

	.blog-categories__item{
		flex:0 0 auto;
	}

	.posts-archive,
	.post-content,
	.related-posts{
		padding:3rem 0;
	}

	.posts-grid{
		grid-template-columns:1fr;
	}

	.blog-empty{
		padding:1.5rem;
	}

	.post-content h2,
	.single-post .entry-content h2{
		font-size:clamp(1.8rem,9vw,2.4rem);
	}
}

/*
 * Los artículos conservan en su contenido una cabecera editorial con otro H1.
 * El título visible y semántico ya lo imprime .post-hero; ocultar únicamente
 * esa copia evita dos H1 y restaura el flujo tipográfico en ES y EN.
 */
.single-post .post-content article h1{
	display:none;
}