/**
 * Plantillas Rocha alineadas con Base/blog.html y Base/services.html.
 * Requiere rocha-design.css (tokens, .blog-layout, .services-grid, .mini-hero, .sidebar).
 */

/* Mini-hero: misma pila visual que Base (imagen vía Customizer → --rocha-hero-image). */
.rocha-template-blog .mini-hero-bg,
.rocha-template-blog-archive .mini-hero-bg,
.rocha-template-services .mini-hero-bg {
	background-image: linear-gradient(
			135deg,
			rgba(0, 0, 0, 0.94) 0%,
			rgba(0, 0, 0, 0.7) 50%,
			rgba(0, 0, 0, 0.9) 100%
		),
		var(--rocha-hero-image);
	background-size: cover; 
	background-position: center;
}

/* Tarjetas del índice: mismo alcance que Base (solo .post-card + hijos). */
.rocha-template-blog .blog-grid .post-card,
.rocha-template-blog-archive .blog-grid .post-card {
	background: var(--dark-card, #141414);
	border: 1px solid rgba(238, 115, 26, 0.06);
}

.rocha-template-blog .sidebar .widget-title,
.rocha-template-blog-archive .sidebar .widget-title {
	font-family: var(--fh, 'Oswald', sans-serif);
	font-size: 0.95rem;
	font-weight: 800;
	color: var(--white, #fff);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-bottom: 1rem;
}

.rocha-blog-empty {
	color: var(--text-muted, #7a7a7a);
	font-size: 0.95rem;
	line-height: 1.6;
}