/**
 * "MC2 / Home 2" Comprehensive Site-Wide Design System
 * Applies the editorial identity across the entire website:
 * - Palette: Paper (#FBF9F4), Ink (#15120E), Crimson (#D2381F), Ochre (#B4842A), Line (#E6E0D4), Tint (#F4EFE4)
 * - Fonts: Archivo (Headings/Nav), Source Serif 4 (Body/Taglines), IBM Plex Mono (Meta/Dates/Stamps)
 */

:root {
	--mc2-paper: #FBF9F4;
	--mc2-ink: #15120E;
	--mc2-ink-soft: #56504A;
	--mc2-accent: #D2381F;
	--mc2-accent-ochre: #B4842A;
	--mc2-line: #E6E0D4;
	--mc2-tint: #F4EFE4;
	--td_theme_color: #D2381F !important;
}

/* ==========================================================================
   Global Base & Typography
   ========================================================================== */

html,
body,
#td-outer-wrap,
.td-main-content-wrap,
.td-container,
.tdc-zone,
.td-theme-wrap {
	background-color: var(--mc2-paper) !important;
	color: var(--mc2-ink) !important;
	font-family: 'Source Serif 4', Georgia, serif;
	-webkit-font-smoothing: antialiased;
}

a {
	color: inherit;
	transition: color 0.2s ease;
}
a:hover {
	color: var(--mc2-accent) !important;
}

::selection {
	background: var(--mc2-accent);
	color: #ffffff;
}

/* Headings Everywhere */
h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.td-module-title,
.tdb-title-text,
.td-block-title,
.td-block-title a,
.tdb-category-title .tdb-title-text {
	font-family: 'Archivo', 'Arial Narrow', sans-serif !important;
	font-weight: 800 !important;
	letter-spacing: -.4px;
	color: var(--mc2-ink) !important;
}

.entry-title a,
.td-module-title a {
	color: var(--mc2-ink) !important;
}
.entry-title a:hover,
.td-module-title a:hover {
	color: var(--mc2-accent) !important;
}

/* Metadata & Mono */
.td-post-date,
.td-post-author-name,
.td-module-date,
.td-module-meta-info,
.td-module-meta-info time,
.tdb-author-name,
.tdb-post-date,
.tdb-author-url,
time,
.mc2-ticker,
.page-nav,
.pages,
.tdb-breadcrumbs,
.tdb-breadcrumbs a {
	font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
	font-size: 11.5px;
	letter-spacing: .02em;
	color: var(--mc2-ink-soft) !important;
}

/* Category Badges.
   Ojo: `.tdb-category` NO es el chip sino el contenedor que lo envuelve (mide
   todo el ancho de la columna), así que pintarlo de acento producía una barra
   roja a toda anchura. El chip real es el enlace `.tdb-entry-category`. */
.td-post-category,
.tdb-entry-category,
.td-post-category a,
.tdb-entry-category a {
	background: var(--mc2-accent) !important;
	color: #ffffff !important;
	font-family: 'Archivo', sans-serif !important;
	font-weight: 800 !important;
	font-size: 10.5px !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	border-radius: 0 !important;
	padding: 4px 9px !important;
}

/* Section Title Flags / Ticks */
.td-block-title-wrap {
	position: relative;
	padding-left: 16px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--mc2-line);
	padding-bottom: 12px;
}

.td-block-title-wrap:before {
	content: "";
	position: absolute;
	left: 0;
	top: 4px;
	width: 10px;
	height: 10px;
	background: var(--mc2-accent) !important;
}

.td-block-title-wrap:empty:before {
	display: none;
}

/* ==========================================================================
   Cards, Grid Modules & Miniatures
   ========================================================================== */

/* Las fotos de este sitio llevan el rótulo "La opinión de: <autor>" incrustado
   en la propia imagen, así que `cover` recorta el nombre. Se usa `contain`
   sobre el fondo tinta para que la miniatura se vea entera. */
.entry-thumb.td-thumb-css {
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-color: var(--mc2-tint) !important;
	transition: transform 0.35s ease;
}

.td-image-wrap {
	background: var(--mc2-tint) !important;
	overflow: hidden;
}

.td-module-container:hover .entry-thumb.td-thumb-css,
.td_module_wrap:hover .entry-thumb.td-thumb-css {
	transform: scale(1.035);
}

.td_module_wrap {
	margin-bottom: 24px;
}

/* ==========================================================================
   Single Post Image & Layout Adjustments (Publicaciones)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Cabecera de entrada — "portada montada"

   Problema medido en /entre-risas-y-controversias…: la plantilla mete la
   portada del columnista (1000x551, ratio 1.81) en una caja de 1905x380
   (ratio 5.01) con `background-size: cover`, lo que recorta cerca de dos
   tercios de la imagen; encima superpone el texto en `position:absolute`,
   obligando a titulares blancos sobre fotos claras.

   Estas imágenes son láminas de autor —los archivos se llaman
   "Portada-<Autor>.jpeg"—, no fotografía ambiental. Así que se montan
   ENTERAS sobre un campo tinta, junto al titular, en vez de sangrarlas de
   fondo: ninguna se recorta sea cual sea su proporción, y el texto vuelve
   a leerse en tinta sobre papel, sin velos ni sombras.
   -------------------------------------------------------------------------- */

.mc2-site.single-post .wpb_wrapper:has(> .tdb_single_bg_featured_image) {
	display: grid;
	grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
	gap: clamp(22px, 3.2vw, 52px);
	align-items: center;
	max-width: 1240px;
	margin: 0 auto;
	padding: clamp(26px, 3.6vw, 52px) 28px clamp(18px, 2.6vw, 36px);
}

/* La lámina: contenida sobre campo tinta con filete, nunca recortada. */
.mc2-site.single-post .tdb_single_bg_featured_image {
	margin: 0 !important;
	overflow: visible !important;
	background: none !important;
}
.mc2-site.single-post .tdb_single_bg_featured_image .tdb-featured-image-bg {
	padding-bottom: 0 !important;
	max-height: none !important;
	height: auto !important;
	aspect-ratio: 16 / 10;
	background-size: contain !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-color: var(--mc2-tint) !important;
	border: 1px solid var(--mc2-line);
}

/* El bloque de texto deja de flotar sobre la foto (la plantilla lo posiciona
   en absoluto). Esta regla no depende de :has(), así que en navegadores sin
   soporte la cabecera queda apilada y legible igualmente. */
.mc2-site.single-post .tdb_single_bg_featured_image + * {
	position: static !important;
	width: auto !important;
	max-width: none !important;
}
.mc2-site.single-post .tdb_single_bg_featured_image + * .td_block_wrap {
	text-align: left !important;
}

/* Titular y datos, ya sobre papel. */
.mc2-site.single-post .tdb_title .tdb-title-text,
.mc2-site.single-post .tdb_title h1 {
	color: var(--mc2-ink) !important;
	text-align: left !important;
	font-size: clamp(27px, 3vw, 43px) !important;
	line-height: 1.08 !important;
	letter-spacing: -.5px !important;
}
.mc2-site.single-post .tdb-breadcrumbs,
.mc2-site.single-post .tdb-breadcrumbs a,
.mc2-site.single-post .tdb-breadcrumbs span,
.mc2-site.single-post .tdb_single_date,
.mc2-site.single-post .tdb_single_date time,
.mc2-site.single-post .tdb_single_post_views,
.mc2-site.single-post .tdb_single_comments_count { color: var(--mc2-ink-soft) !important; }
.mc2-site.single-post .tdb_single_author,
.mc2-site.single-post .tdb_single_author a,
.mc2-site.single-post .tdb_single_author span { color: var(--mc2-ink) !important; }
.mc2-site.single-post .tdb-breadcrumbs a:hover,
.mc2-site.single-post .tdb_single_author a:hover { color: var(--mc2-accent) !important; }

/* Alineación de la cabecera.
   La plantilla dejaba estos bloques centrados (herencia del diseño sobre la
   foto): el titular arrastraba un padding-left de 42px, la fila de datos se
   centraba —el autor empezaba en x=127 en vez de 44— y el guion separador
   venía anclado con `vertical-align: top`, flotando por encima de la fecha.
   Todo eso producía un borde izquierdo dentado y ruido visual. */

/* 1. Un único borde izquierdo para toda la cabecera. */
.mc2-site.single-post .tdb_single_bg_featured_image + * .vc_column_inner,
.mc2-site.single-post .tdb_single_bg_featured_image + * .wpb_wrapper { text-align: left !important; }
.mc2-site.single-post .tdb_title {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* 2. El filete de firma cuelga del titular, no del autor: así queda siempre
      pegado al mismo borde y no altera la altura de la fila de datos. */
.mc2-site.single-post .tdb_title::after {
	content: "";
	display: block;
	width: 44px;
	height: 2px;
	background: var(--mc2-accent);
	margin: 20px 0 16px;
}

/* 3. Autor, fecha, lecturas y comentarios comparten línea base y separación. */
.mc2-site.single-post .tdb_single_author,
.mc2-site.single-post .tdb_single_date,
.mc2-site.single-post .tdb_single_post_views,
.mc2-site.single-post .tdb_single_comments_count {
	display: inline-flex !important;
	align-items: center !important;
	vertical-align: middle !important;
	margin: 0 20px 0 0 !important;
	padding: 0 !important;
}
.mc2-site.single-post .tdb_single_comments_count { margin-right: 0 !important; }

/* 4. El guion separador de la plantilla sobra una vez hay separación regular. */
.mc2-site.single-post .tdb_single_bg_featured_image + * .tdm_block_inline_text { display: none !important; }

@media (max-width: 860px) {
	.mc2-site.single-post .wpb_wrapper:has(> .tdb_single_bg_featured_image) {
		grid-template-columns: 1fr;
		gap: 20px;
		padding-left: 18px;
		padding-right: 18px;
	}
}

/* Restos del demo original: las curvas decorativas (`tdc-row-divider`) y los
   fondos gris frío #f9f9f9 que tagDiv genera como `*_rand_style` estaban
   pensados para empalmar con la cabecera oscura. Sobre el papel cálido sólo
   ensucian las uniones entre secciones, así que se retiran. */
.mc2-site .tdc-row-divider { display: none !important; }
.mc2-site [class*="_rand_style"] { background-color: var(--mc2-paper) !important; }

/* Title & Subtitle */

/* Article Content Width & Spacing */
.tdb_single_content,
.td-post-content,
.entry-content {
	font-family: 'Source Serif 4', Georgia, serif !important;
	font-size: 18.5px !important;
	line-height: 1.8 !important;
	color: var(--mc2-ink) !important;
}

.single-post .tdb_single_content,
.single-post .tdb_single_content .tdb-block-inner {
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
}

.tdb_single_content p,
.td-post-content p,
.entry-content p {
	margin-bottom: 24px !important;
	font-size: 18.5px !important;
	line-height: 1.8 !important;
	color: var(--mc2-ink) !important;
}

.tdb_single_content strong,
.td-post-content strong,
.entry-content strong {
	font-weight: 700 !important;
	color: var(--mc2-ink) !important;
}

.tdb_single_content a,
.td-post-content a,
.entry-content a {
	color: var(--mc2-accent) !important;
	text-decoration: underline !important;
}

/* All Post Images - Clean Proportions & Shadow */
.tdb_single_content img,
.td-post-content img,
.entry-content img,
.wp-block-image img {
	max-width: 100% !important;
	height: auto !important;
	display: block !important;
	margin: 28px auto !important;
	border-radius: 2px !important;
	box-shadow: 0 4px 16px rgba(21, 18, 14, 0.08) !important;
}

/* Author Avatar Image Fix */
.saboxplugin-gravatar img {
	width: 80px !important;
	height: 80px !important;
	border-radius: 50% !important;
	margin: 0 !important;
	box-shadow: none !important;
	display: inline-block !important;
}

/* Blockquotes */
.tdb_single_content blockquote,
.td-post-content blockquote,
.entry-content blockquote {
	border-left: 3px solid var(--mc2-accent) !important;
	background: var(--mc2-tint) !important;
	color: var(--mc2-ink-soft) !important;
	font-style: italic !important;
	font-size: 1.1em !important;
	line-height: 1.7 !important;
	padding: 18px 24px !important;
	margin: 32px 0 !important;
	border-radius: 0 !important;
}

/* Author Box */
.tdb_single_author_box,
.saboxplugin-wrap {
	background: var(--mc2-tint) !important;
	border: 1px solid var(--mc2-line) !important;
	border-radius: 0 !important;
	padding: 24px !important;
	margin: 36px auto !important;
	max-width: 860px !important;
}

.saboxplugin-authorname a,
.tdb-author-name {
	font-family: 'Archivo', sans-serif !important;
	font-weight: 800 !important;
	font-size: 18px !important;
	color: var(--mc2-ink) !important;
}

.saboxplugin-desc p,
.tdb-author-descr {
	font-family: 'Source Serif 4', Georgia, serif !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	color: var(--mc2-ink-soft) !important;
}

/* Next / Prev Article Bar */
.tdb_single_next_prev {
	border-top: 1px solid var(--mc2-line) !important;
	border-bottom: 1px solid var(--mc2-line) !important;
	padding: 20px 0 !important;
	margin: 30px auto !important;
	max-width: 860px !important;
}

.tdb_single_next_prev a {
	font-family: 'Archivo', sans-serif !important;
	font-weight: 700 !important;
	font-size: 15px !important;
}

/* Tags */
.tdb_single_tags span {
	background-color: var(--mc2-ink) !important;
	font-family: 'IBM Plex Mono', monospace !important;
	font-size: 10px !important;
	letter-spacing: .06em !important;
}

.tdb_single_tags a {
	border: 1px solid var(--mc2-line) !important;
	color: var(--mc2-ink-soft) !important;
	font-family: 'IBM Plex Mono', monospace !important;
	font-size: 11px !important;
	border-radius: 0 !important;
}

.tdb_single_tags a:hover {
	background-color: var(--mc2-accent) !important;
	border-color: var(--mc2-accent) !important;
	color: #ffffff !important;
}

/* ==========================================================================
   Buttons, Pagination, Social & Comments
   ========================================================================== */

.tdm-btn,
.tdm_block_button a,
.wpcf7-submit,
input[type="submit"],
.comment-form input[type="submit"] {
	background: var(--mc2-ink) !important;
	border: 1px solid var(--mc2-ink) !important;
	color: var(--mc2-paper) !important;
	border-radius: 0 !important;
	font-family: 'Archivo', sans-serif !important;
	font-weight: 700 !important;
	letter-spacing: .05em !important;
	text-transform: uppercase !important;
	padding: 10px 22px !important;
	cursor: pointer;
}

.tdm-btn:hover,
.tdm_block_button a:hover,
input[type="submit"]:hover {
	background: var(--mc2-accent) !important;
	border-color: var(--mc2-accent) !important;
	color: #ffffff !important;
}

.page-nav,
.pages {
	font-family: 'IBM Plex Mono', monospace !important;
	border-color: var(--mc2-line) !important;
	color: var(--mc2-ink-soft) !important;
	border-radius: 0 !important;
}

.page-nav:hover {
	border-color: var(--mc2-accent) !important;
	color: var(--mc2-accent) !important;
}

.page-nav.current,
.pages.current,
.current .page-nav {
	background: var(--mc2-ink) !important;
	color: var(--mc2-paper) !important;
	border-color: var(--mc2-ink) !important;
}

.td-post-sharing {
	border-color: var(--mc2-line) !important;
}

#comments,
#respond {
	font-family: 'Source Serif 4', Georgia, serif;
	margin-top: 40px;
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
}

#comments h2,
#comments h3,
#respond h3 {
	font-family: 'Archivo', sans-serif !important;
	font-weight: 800 !important;
	color: var(--mc2-ink) !important;
}