/*!
 * blog.css — estilos del blog premium
 * @package nogal-landing-v2
 * @since   1.6.0
 *
 * Scope: single.php y archive.php (enqueue condicional en functions.php:
 *   is_single() || is_archive() || is_home() → carga blog.css).
 *
 * Depende de interior.css para variables + base typography + nav + footer.
 */

/* ========================================================================== */
/* SINGLE POST — hero + entry-content + related                               */
/* ========================================================================== */

body.single-post .hero-short .single-meta,
.single-hero .single-meta {
	margin-top: 1.5rem;
	color: rgba(255,255,255,0.85);
	font-size: .9rem;
	letter-spacing: .04em;
}

.single-article {
	background: var(--paper);
}
.single-article .entry-content {
	max-width: 720px;
	margin: 0 auto;
	padding: 5rem 2rem;
	font-family: var(--sans);
	font-size: 1.1rem;
	line-height: 1.8;
	color: var(--ink);
}
@media (max-width: 480px) { .single-article .entry-content { padding: 3rem 1.25rem; font-size: 1.05rem; } }

.single-article .entry-content > *:first-child { margin-top: 0; }

.single-article .entry-content h2 {
	font-family: var(--serif);
	font-size: clamp(1.75rem, 3.5vw, 2.4rem);
	font-weight: 400;
	line-height: 1.15;
	margin: 3rem 0 1rem;
	color: var(--ink);
	letter-spacing: -.005em;
}
.single-article .entry-content h3 {
	font-family: var(--serif);
	font-size: clamp(1.4rem, 2.8vw, 1.75rem);
	font-weight: 400;
	line-height: 1.2;
	margin: 2.5rem 0 .75rem;
	color: var(--ink);
}
.single-article .entry-content h4 {
	font-family: var(--serif);
	font-size: clamp(1.2rem, 2.2vw, 1.45rem);
	font-weight: 500;
	line-height: 1.3;
	margin: 2rem 0 .5rem;
	color: var(--ink);
}

.single-article .entry-content p { margin: 0 0 1.5rem; }
.single-article .entry-content p:last-child { margin-bottom: 0; }

.single-article .entry-content a {
	color: var(--granate);
	text-decoration: underline;
	text-decoration-color: rgba(110,2,0,.35);
	text-underline-offset: 3px;
	transition: text-decoration-color .3s;
}
.single-article .entry-content a:hover { text-decoration-color: var(--granate); }

.single-article .entry-content strong { font-weight: 600; color: var(--ink); }
.single-article .entry-content em { font-style: italic; }

.single-article .entry-content blockquote {
	border-left: 3px solid var(--granate);
	padding: .5rem 0 .5rem 1.75rem;
	margin: 2.5rem 0;
	font-style: italic;
	color: var(--ink-soft);
	font-family: var(--serif);
	font-size: 1.3rem;
	line-height: 1.5;
}
.single-article .entry-content blockquote p:last-child { margin-bottom: 0; }
.single-article .entry-content blockquote cite {
	display: block;
	margin-top: .75rem;
	font-family: var(--sans);
	font-size: .9rem;
	color: var(--ink-soft);
	font-style: normal;
	letter-spacing: .05em;
}

.single-article .entry-content ul,
.single-article .entry-content ol {
	padding-left: 1.5rem;
	margin: 1.5rem 0;
}
.single-article .entry-content li { margin-bottom: .6rem; }
.single-article .entry-content li:last-child { margin-bottom: 0; }

.single-article .entry-content img,
.single-article .entry-content figure img {
	max-width: 100%;
	height: auto;
	border-radius: 2px;
	box-shadow: 0 15px 35px rgba(20,8,6,.08);
	margin: 2.5rem auto;
	display: block;
}
.single-article .entry-content figure {
	margin: 2.5rem 0;
	text-align: center;
}
.single-article .entry-content figure img { margin: 0 auto; }
.single-article .entry-content figcaption {
	margin-top: .75rem;
	font-size: .88rem;
	color: var(--ink-soft);
	font-style: italic;
}

.single-article .entry-content code {
	background: var(--cream);
	padding: .15rem .45rem;
	border-radius: 2px;
	font-family: 'Courier New', monospace;
	font-size: .92em;
	color: var(--granate);
}
.single-article .entry-content pre {
	background: var(--cream);
	padding: 1.25rem 1.5rem;
	border-radius: 2px;
	overflow-x: auto;
	margin: 1.75rem 0;
	font-size: .92rem;
	line-height: 1.5;
	border-left: 3px solid var(--granate);
}
.single-article .entry-content pre code {
	background: transparent;
	padding: 0;
	color: var(--ink);
}

.single-article .entry-content hr {
	border: none;
	height: 1px;
	background: var(--line);
	margin: 3rem 0;
}

.single-article .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 2rem 0;
	font-size: .98rem;
}
.single-article .entry-content th,
.single-article .entry-content td {
	padding: .75rem 1rem;
	border-bottom: 1px solid var(--line);
	text-align: left;
}
.single-article .entry-content th {
	background: var(--cream);
	font-weight: 500;
	color: var(--ink);
}

/* Entry tags al pie del artículo */
.entry-tags {
	max-width: 720px;
	margin: 0 auto;
	padding: 0 2rem 3rem;
	font-size: .88rem;
	color: var(--ink-soft);
}
.entry-tags .tag-label {
	font-weight: 500;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--granate);
	margin-right: .5rem;
}
.entry-tags a {
	color: var(--ink-soft);
	text-decoration: underline;
	text-decoration-color: rgba(0,0,0,.2);
	text-underline-offset: 3px;
}
.entry-tags a:hover { color: var(--granate); }

/* CTA post-artículo */
.single-cta { background: var(--cream); }
.single-cta-buttons {
	display: flex;
	gap: 1rem;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 1rem;
}
.single-cta-buttons .btn { min-width: 220px; }

/* Posts relacionados */
.related-posts { background: var(--paper); border-top: 1px solid var(--line); }
.related-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; max-width: 1280px; margin: 0 auto; }
.related-card { background: var(--paper); overflow: hidden; transition: transform .35s ease, box-shadow .35s ease; }
.related-card:hover { transform: translateY(-4px); box-shadow: 0 15px 35px rgba(20,8,6,.08); }
.related-link { display: block; color: inherit; }
.related-img { aspect-ratio: 16/10; overflow: hidden; background: #3a2818; }
.related-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.related-card:hover .related-img img { transform: scale(1.05); }
.related-body { padding: 1.5rem 0 0; }
.related-date { display: block; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--granate); font-weight: 500; margin-bottom: .6rem; }
.related-title { font-family: var(--serif); font-size: 1.35rem; font-weight: 400; line-height: 1.2; color: var(--ink); margin-bottom: .75rem; }
.related-more { font-size: .85rem; letter-spacing: .08em; color: var(--granate); font-weight: 500; }

@media (min-width: 860px) { .related-grid { grid-template-columns: repeat(3, 1fr); gap: 2.5rem; } }

/* ========================================================================== */
/* ARCHIVE — grid de posts + paginación                                       */
/* ========================================================================== */

.archive-grid-section { background: var(--paper); }
.archive-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	max-width: 1280px;
	margin: 0 auto;
}
.archive-card { background: var(--paper); overflow: hidden; transition: transform .35s ease, box-shadow .35s ease; }
.archive-card:hover { transform: translateY(-4px); box-shadow: 0 20px 45px rgba(20,8,6,.1); }
.archive-link { display: block; color: inherit; }
.archive-img { aspect-ratio: 16/10; overflow: hidden; background: #3a2818; }
.archive-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.archive-card:hover .archive-img img { transform: scale(1.05); }
.archive-body { padding: 1.75rem 0 0; }
.archive-cat { display: inline-block; font-size: .68rem; letter-spacing: .22em; text-transform: uppercase; color: var(--granate); font-weight: 600; margin-bottom: .75rem; }
.archive-title { font-family: var(--serif); font-size: clamp(1.35rem, 2.4vw, 1.6rem); font-weight: 400; line-height: 1.2; color: var(--ink); margin-bottom: .85rem; }
.archive-excerpt { color: var(--ink-soft); font-size: .98rem; line-height: 1.6; margin-bottom: 1.25rem; }
.archive-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .85rem; }
.archive-date { color: var(--ink-soft); letter-spacing: .02em; }
.archive-more { color: var(--granate); font-weight: 500; letter-spacing: .05em; }

@media (min-width: 640px) { .archive-grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 2rem; } }
@media (min-width: 860px) { .archive-grid { grid-template-columns: repeat(3, 1fr); gap: 3rem 2.5rem; } }

/* Paginación */
.archive-pagination { margin-top: 4rem; display: flex; justify-content: center; }
.archive-pagination .page-numbers { list-style: none; display: flex; gap: .4rem; padding: 0; margin: 0; }
.archive-pagination .page-numbers li a,
.archive-pagination .page-numbers li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	padding: .6rem .85rem;
	border: 1px solid var(--line);
	font-size: .88rem;
	letter-spacing: .05em;
	color: var(--ink-soft);
	transition: all .3s ease;
}
.archive-pagination .page-numbers li a:hover { border-color: var(--granate); color: var(--granate); }
.archive-pagination .page-numbers li .current {
	background: var(--granate);
	color: var(--paper);
	border-color: var(--granate);
}

/* Archive empty state */
.archive-empty { text-align: center; padding: 3rem 1rem; max-width: 560px; margin: 0 auto; }
.archive-empty h2 { font-family: var(--serif); font-size: 2rem; font-weight: 400; color: var(--ink); margin-bottom: 1rem; }
.archive-empty p { color: var(--ink-soft); margin-bottom: 2rem; }