@charset "UTF-8";
/* ==========================================================================
   CriticaBits — capa de mejoras visuales sobre Mozda
   --------------------------------------------------------------------------
   Se carga después de style.css y gutenberg.css, y ANTES del CSS del
   Personalizador, de modo que cualquier ajuste manual que ya exista sigue
   teniendo la última palabra.

   ÍNDICE
     1. Tokens propios
     2. Correcciones y accesibilidad
     3. Tipografía y ritmo de lectura
     4. Animaciones base y revelado al hacer scroll
     5. Cabecera, logotipo y navegación
     6. Tarjetas de entrada y portada
     7. Contenido: enlaces, imágenes, citas, tablas
     8. Estilos de bloque de CriticaBits
     9. Barra de progreso de lectura y volver arriba
    10. Formularios, paginación y pie
    11. Movimiento reducido e impresión
   ========================================================================== */

/* ==========================================================================
   1. Tokens propios
   ========================================================================== */

:root {
	/* Neones de la marca, tomados del CSS que ya usaba el sitio. */
	--cb-neon-pink: #ff005e;
	--cb-neon-rose: #f45791;
	--cb-neon-cyan: #00d4ff;
	--cb-neon-aqua: #00ffff;
	--cb-neon-violet: #7a5cff;
	--cb-neon-amber: #ffb14f;

	/* Superficies translúcidas para tarjetas y paneles. */
	--cb-surface: rgba(34, 41, 57, 0.72);
	--cb-surface-strong: rgba(22, 27, 40, 0.92);
	--cb-hairline: rgba(255, 255, 255, 0.09);
	--cb-hairline-strong: rgba(255, 255, 255, 0.16);

	/* Sombras en tres alturas. */
	--cb-shadow-1: 0 1px 2px rgba(0, 0, 0, .28);
	--cb-shadow-2: 0 8px 24px rgba(0, 0, 0, .38);
	--cb-shadow-3: 0 18px 48px rgba(0, 0, 0, .52);

	/* Curvas y duraciones: una sola escala para todo el tema. */
	--cb-ease: cubic-bezier(.2, .7, .3, 1);
	--cb-ease-out: cubic-bezier(.16, 1, .3, 1);
	--cb-fast: 140ms;
	--cb-base: 260ms;
	--cb-slow: 520ms;
}

/* ==========================================================================
   2. Correcciones y accesibilidad
   ========================================================================== */

/* Foco visible en todo el sitio. El tema no definía ninguno, así que
   navegar con teclado era literalmente a ciegas. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--cb-neon-cyan);
	outline-offset: 3px;
	border-radius: 3px;
}

/* Enlace «saltar al contenido»: oculto hasta recibir el foco. */
.cb-skip-link {
	position: fixed;
	top: 0;
	left: 50%;
	z-index: 100000;
	transform: translate(-50%, -120%);
	padding: .85rem 1.5rem;
	background: var(--cb-neon-pink);
	color: #fff;
	font-family: var(--body-font);
	font-size: .9rem;
	font-weight: 700;
	letter-spacing: .02em;
	text-decoration: none;
	border-radius: 0 0 8px 8px;
	box-shadow: var(--cb-shadow-2);
	transition: transform var(--cb-base) var(--cb-ease-out);
}

.cb-skip-link:focus {
	transform: translate(-50%, 0);
	outline: none;
}

/* El área principal recibe el foco tras usar el enlace de salto. */
#main:focus {
	outline: none;
}

/* ==========================================================================
   3. Tipografía y ritmo de lectura
   ========================================================================== */

body {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Evita que una palabra suelta quede colgando al final de un titular. */
.entry-title,
.archive-title,
.tfm-post-block-header .title {
	text-wrap: balance;
}

/* Los párrafos largos leen mejor con la última línea equilibrada. */
.entry-content > p {
	text-wrap: pretty;
}

.entry-content > p:not(:last-child) {
	margin-bottom: 1.35em;
}

/* Guiones y viudas en pantallas estrechas. */
@media (max-width: 640px) {

	.entry-content > p {
		hyphens: auto;
		-webkit-hyphens: auto;
	}
}

/* Los títulos de sección del artículo respiran más por arriba. */
.entry-content h2,
.entry-content h3 {
	margin-top: 2.2em;
	scroll-margin-top: 6rem;
}

/* Ancla de destino para los enlaces del índice de contenidos. */
.entry-content :target {
	scroll-margin-top: 6rem;
}

/* ==========================================================================
   4. Animaciones base y revelado al hacer scroll
   ========================================================================== */

@keyframes cb-fade-up {
	from { opacity: 0; transform: translate3d(0, 18px, 0); }
	to   { opacity: 1; transform: none; }
}

@keyframes cb-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes cb-sheen {
	from { transform: translateX(-120%) skewX(-18deg); }
	to   { transform: translateX(220%) skewX(-18deg); }
}

@keyframes cb-scanline {
	from { background-position: 0 0; }
	to   { background-position: 0 100%; }
}

/*
 * Revelado al entrar en pantalla.
 *
 * El estado inicial sólo se aplica cuando hay JavaScript (.cb-js) y el
 * elemento ha sido registrado por el observador (data-cb-reveal). Así, si
 * el JS falla o está desactivado, el contenido nunca queda invisible.
 */
.cb-js [data-cb-reveal] {
	opacity: 0;
	transform: translate3d(0, 20px, 0);
	transition:
		opacity var(--cb-slow) var(--cb-ease-out),
		transform var(--cb-slow) var(--cb-ease-out);
	transition-delay: var(--cb-reveal-delay, 0ms);
	will-change: opacity, transform;
}

.cb-js [data-cb-reveal].is-revealed {
	opacity: 1;
	transform: none;
	will-change: auto;
}

/* ==========================================================================
   5. Cabecera
   --------------------------------------------------------------------------
   Vive entera en assets/css/criticabits-header.css. Lo que había aquí
   apuntaba a .site-header y .primary-menu, clases de la cabecera del
   tema que ya no se imprime.
   ========================================================================== */

/* ==========================================================================
   6. Tarjetas de entrada y portada
   ========================================================================== */

.post-grid .article {
	transition: transform var(--cb-base) var(--cb-ease-out);
}

.post-grid .article:hover {
	transform: translateY(-4px);
}

/* La miniatura hace un zoom contenido y recorta el desbordamiento. */
.post-thumbnail {
	overflow: hidden;
	border-radius: var(--post-thumbnail-border-radius, 5px);
	position: relative;
}

.post-thumbnail img {
	transition: transform var(--cb-slow) var(--cb-ease-out), filter var(--cb-base) var(--cb-ease);
	backface-visibility: hidden;
}

.article:hover .post-thumbnail img {
	transform: scale(1.045);
}

/*
 * Destello diagonal al pasar el ratón sobre la miniatura.
 *
 * Se usa ::before y no ::after porque el tema ya ocupa ::after en las
 * tarjetas «cover» para el degradado que oscurece la foto bajo el
 * titular. Se excluyen además esas tarjetas: ahí el brillo competiría
 * con el texto superpuesto.
 */
.post-grid .article:not(.cover) .post-thumbnail::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	width: 45%;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, .16) 50%,
		rgba(255, 255, 255, 0) 100%
	);
	opacity: 0;
	transform: translateX(-120%) skewX(-18deg);
}

.post-grid .article:not(.cover):hover .post-thumbnail::before {
	opacity: 1;
	animation: cb-sheen 900ms var(--cb-ease-out);
}

/* Título de la tarjeta: subrayado que crece desde la izquierda. */
.post-grid .entry-title a {
	background-image: linear-gradient(90deg, var(--cb-neon-rose), var(--cb-neon-cyan));
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 2px;
	transition: background-size var(--cb-base) var(--cb-ease-out);
}

.post-grid .article:hover .entry-title a,
.post-grid .entry-title a:focus-visible {
	background-size: 100% 2px;
}

/* Etiquetas de categoría con aspecto de píldora. */
.category-meta a,
.entry-categories a {
	transition:
		color var(--cb-fast) var(--cb-ease),
		background-color var(--cb-fast) var(--cb-ease),
		transform var(--cb-fast) var(--cb-ease);
}

.category-meta a:hover,
.entry-categories a:hover {
	transform: translateY(-1px);
}

/* ==========================================================================
   7. Contenido: enlaces, imágenes, citas, tablas
   ========================================================================== */

/*
 * El sitio ya animaba el subrayado de los enlaces de párrafo. Se extiende
 * el mismo gesto a listas y pies de foto para que el contenido sea
 * coherente, y se acorta la transición: 0,6 s se percibía como retardo.
 */
.entry-content li a,
.entry-content figcaption a {
	position: relative;
	text-decoration: none;
	color: var(--cb-neon-rose);
}

.entry-content li a::after,
.entry-content figcaption a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 2px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--cb-base) var(--cb-ease-out);
}

.entry-content li a:hover::after,
.entry-content li a:focus-visible::after,
.entry-content figcaption a:hover::after {
	transform: scaleX(1);
}

/* Imágenes del artículo: elevación al pasar el ratón. */
.entry-content .wp-block-image img {
	transition: transform var(--cb-base) var(--cb-ease-out), box-shadow var(--cb-base) var(--cb-ease-out);
}

.entry-content .wp-block-image:hover img {
	transform: translateY(-3px);
	box-shadow: var(--cb-shadow-3);
}

/* Las tablas largas se desplazan dentro de su caja, no rompen la página. */
.entry-content .wp-block-table,
.entry-content table {
	max-width: 100%;
}

.entry-content .wp-block-table,
.cb-table-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.cb-table-scroll:focus-visible {
	outline: 2px solid var(--cb-neon-cyan);
	outline-offset: 2px;
}

/* Letra capital: blanca, para que no compita con el texto. */
.entry-content p.has-drop-cap::first-letter {
	color: #fff;
	line-height: .8;
}

/* Separador con degradado en lugar de la línea plana. */
.entry-content hr.wp-block-separator:not(.is-style-dots) {
	height: 2px;
	border: 0;
	background: linear-gradient(
		90deg,
		transparent,
		var(--cb-neon-violet),
		var(--cb-neon-cyan),
		transparent
	);
	opacity: .8;
}

/* ==========================================================================
   8. Estilos de bloque de CriticaBits
   --------------------------------------------------------------------------
   El sitio ya construía estos componentes a mano, escribiendo clases
   sueltas en el editor de código. Aquí quedan registrados como estilos y
   patrones de bloque (ver inc/criticabits/blocks.php), de modo que se
   apliquen con un clic y sean consistentes en todos los artículos.
   ========================================================================== */

/* --- Aviso «Guru Meditation» (pantalla de error de Amiga) --------------- */

.is-style-cb-guru,
.wp-block-verse.guru-meditation {
	position: relative;
	background: #000;
	color: #f42;
	font-family: "Press Start 2P", "Courier New", monospace;
	font-size: clamp(.8rem, 2.4vw, 1.35rem);
	line-height: 1.8;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .08em;
	padding: 2.25rem 1.25rem;
	border: 4px solid #f42;
	border-radius: 2px;
	box-shadow: 0 0 24px rgba(255, 68, 34, .45), inset 0 0 40px rgba(255, 68, 34, .1);
	overflow: hidden;
}

/* Líneas de barrido del monitor CRT. */
.is-style-cb-guru::after,
.wp-block-verse.guru-meditation::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: repeating-linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 0 2px,
		rgba(0, 0, 0, .28) 2px 4px
	);
	animation: cb-scanline 8s linear infinite;
	background-size: 100% 200%;
}

/* --- Rúbrica de análisis ------------------------------------------------ */

.is-style-cb-rubric,
.wp-block-verse.rubrica-final {
	position: relative;
	background:
		repeating-linear-gradient(45deg, #111 0 4px, #151515 4px 8px);
	border: 3px solid var(--cb-neon-aqua);
	border-radius: 4px;
	color: var(--cb-neon-aqua);
	font-family: "Press Start 2P", "Courier New", monospace;
	font-size: .85rem;
	line-height: 1.6;
	letter-spacing: .07em;
	text-align: center;
	text-transform: uppercase;
	padding: 5rem 1rem 2rem;
	margin-top: 3rem;
	box-shadow: 0 0 20px rgba(0, 255, 255, .55);
}

.is-style-cb-rubric::before,
.wp-block-verse.rubrica-final::before {
	content: "★ RÚBRICA DEL AUTOR ★";
	position: absolute;
	top: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1rem;
	color: var(--cb-neon-aqua);
	white-space: nowrap;
}

/* --- Panel translúcido «fondito» --------------------------------------- */

.is-style-cb-panel {
	position: relative;
	border-radius: 4px;
	padding: 2rem;
	color: rgba(255, 255, 255, .82);
	background-image: linear-gradient(135deg, rgba(34, 41, 57, .87), rgba(26, 31, 43, .84));
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .05), var(--cb-shadow-3);
	border: 1px solid var(--cb-hairline);
}

/* --- Chip de puntuación final ------------------------------------------ */

.puntuacion-final,
.cb-score-chip {
	display: inline-block;
	font-family: "Press Start 2P", monospace;
	font-size: 1.1rem;
	line-height: 1;
	padding: .75rem 1rem .6rem;
	color: #04121a;
	background: var(--cb-neon-aqua);
	border-radius: 4px;
	box-shadow: 0 0 18px rgba(0, 255, 255, .5);
}

/* --- Ficha técnica ------------------------------------------------------ */

.cb-spec-sheet {
	border: 1px solid var(--cb-hairline-strong);
	border-radius: 6px;
	overflow: hidden;
	background: var(--cb-surface);
}

.cb-spec-sheet .cb-spec-row {
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	padding: .7rem 1rem;
	border-bottom: 1px solid var(--cb-hairline);
	font-size: .95rem;
}

.cb-spec-sheet .cb-spec-row:last-child {
	border-bottom: 0;
}

.cb-spec-sheet .cb-spec-row:nth-child(odd) {
	background: rgba(255, 255, 255, .025);
}

.cb-spec-sheet .cb-spec-key {
	color: rgba(255, 255, 255, .62);
	font-family: "Major Mono Display", monospace;
	text-transform: lowercase;
}

.cb-spec-sheet .cb-spec-value {
	font-weight: 600;
	text-align: right;
}

/* --- Pros y contras ----------------------------------------------------- */

.cb-verdict {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.cb-verdict > * {
	border-radius: 6px;
	padding: 1.25rem 1.4rem;
	background: var(--cb-surface);
	border: 1px solid var(--cb-hairline);
}

.cb-verdict .cb-pros {
	border-left: 3px solid #2ee6a8;
}

.cb-verdict .cb-cons {
	border-left: 3px solid var(--cb-neon-pink);
}

.cb-verdict ul {
	margin: 0;
	padding-left: 1.15rem;
}

.cb-verdict li {
	line-height: 1.7;
}

/* --- Cita con aspecto de terminal --------------------------------------- */

.wp-block-quote.is-style-cb-terminal {
	position: relative;
	background: #06090f;
	border: 1px solid rgba(0, 255, 255, .3);
	border-left: 3px solid var(--cb-neon-aqua);
	border-radius: 4px;
	padding: 2.75rem 1.75rem 1.5rem;
	color: #d6faff;
	font-family: "Major Mono Display", "Courier New", monospace;
}

/* Barra de título tipo ventana de terminal. */
.wp-block-quote.is-style-cb-terminal::before {
	content: "● ● ●";
	position: absolute;
	top: .75rem;
	left: 1.25rem;
	font-size: .7rem;
	letter-spacing: .35em;
	color: rgba(0, 255, 255, .45);
}

.wp-block-quote.is-style-cb-terminal cite {
	display: block;
	margin-top: 1rem;
	color: var(--cb-neon-aqua);
	font-size: .9rem;
	font-style: normal;
	opacity: .85;
}

.wp-block-quote.is-style-cb-terminal cite::before {
	content: "> ";
}

/* --- Tabla de especificaciones ------------------------------------------ */

.wp-block-table.is-style-cb-specs table {
	width: 100%;
	border-collapse: collapse;
	font-size: .95rem;
}

.wp-block-table.is-style-cb-specs td,
.wp-block-table.is-style-cb-specs th {
	padding: .7rem 1rem;
	border: 0;
	border-bottom: 1px solid var(--cb-hairline);
}

.wp-block-table.is-style-cb-specs tr:last-child td {
	border-bottom: 0;
}

.wp-block-table.is-style-cb-specs tr:nth-child(odd) td {
	background: rgba(255, 255, 255, .025);
}

.wp-block-table.is-style-cb-specs td:first-child {
	font-family: "Major Mono Display", monospace;
	text-transform: lowercase;
	color: rgba(255, 255, 255, .66);
}

.wp-block-table.is-style-cb-specs td:last-child,
.wp-block-table.is-style-cb-specs td.score {
	text-align: right;
	font-weight: 700;
	color: var(--cb-neon-amber);
	font-variant-numeric: tabular-nums;
}

/* --- Separador de barrido ----------------------------------------------- */

.wp-block-separator.is-style-cb-scanline {
	height: 6px;
	border: 0;
	opacity: 1;
	background: repeating-linear-gradient(
		to bottom,
		var(--cb-neon-aqua) 0 1px,
		transparent 1px 3px
	);
	mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
}

/* --- Imagen con marco CRT ----------------------------------------------- */

.wp-block-image.is-style-cb-crt {
	position: relative;
}

.wp-block-image.is-style-cb-crt img {
	border: 3px solid #10131c;
	border-radius: 10px / 14px;
	box-shadow:
		0 0 0 1px rgba(0, 255, 255, .25),
		var(--cb-shadow-3),
		inset 0 0 40px rgba(0, 0, 0, .6);
}

/* Líneas de barrido superpuestas, sin tapar el contenido. */
.wp-block-image.is-style-cb-crt::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	border-radius: 10px / 14px;
	background: repeating-linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 0 2px,
		rgba(0, 0, 0, .16) 2px 4px
	);
}

/* --- Botón neón ---------------------------------------------------------- */

.wp-block-button.is-style-cb-neon .wp-block-button__link {
	position: relative;
	background: linear-gradient(90deg, var(--cb-neon-pink), var(--cb-neon-violet));
	border: 0;
	color: #fff;
	font-weight: 700;
	letter-spacing: .01em;
	box-shadow: 0 0 18px rgba(255, 0, 94, .35);
	overflow: hidden;
}

.wp-block-button.is-style-cb-neon .wp-block-button__link::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 40%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28), transparent);
	transform: translateX(-140%) skewX(-18deg);
}

.wp-block-button.is-style-cb-neon .wp-block-button__link:hover::after,
.wp-block-button.is-style-cb-neon .wp-block-button__link:focus-visible::after {
	animation: cb-sheen 800ms var(--cb-ease-out);
}

.wp-block-button.is-style-cb-neon .wp-block-button__link:hover {
	box-shadow: 0 0 26px rgba(122, 92, 255, .55);
}

/* --- Lista de verificación ---------------------------------------------- */

.wp-block-list.is-style-cb-checklist {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.wp-block-list.is-style-cb-checklist li {
	position: relative;
	padding-left: 1.9rem;
	line-height: 1.75;
}

.wp-block-list.is-style-cb-checklist li::before {
	content: "▸";
	position: absolute;
	left: .25rem;
	top: 0;
	color: var(--cb-neon-aqua);
	font-weight: 700;
}

/* --- Llamada a la acción y comparativa ---------------------------------- */

.cb-cta {
	text-align: center;
	padding-block: 2.5rem;
}

.cb-versus > .wp-block-column {
	padding: 1.5rem;
}

/* ==========================================================================
   9. Barra de progreso de lectura y volver arriba
   ========================================================================== */

/*
 * El progreso de lectura ya no dibuja una barra propia: rellena el
 * haz inferior de la cabecera (ver criticabits-header.css). Un solo
 * elemento en pantalla en lugar de dos.
 */

/* El botón de volver arriba entra y sale, no parpadea. */
.goto-top {
	opacity: 0;
	transform: translateY(12px) scale(.9);
	pointer-events: none;
	transition:
		opacity var(--cb-base) var(--cb-ease-out),
		transform var(--cb-base) var(--cb-ease-out);
}

.goto-top.visible {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

.goto-top:hover {
	transform: translateY(-3px);
}

/* ==========================================================================
   10. Formularios, paginación y pie
   ========================================================================== */

/* Campos de formulario coherentes en modo oscuro. */
.entry-content input[type="text"],
.entry-content input[type="email"],
.entry-content input[type="url"],
.entry-content input[type="search"],
.entry-content textarea,
.search-field {
	transition:
		border-color var(--cb-fast) var(--cb-ease),
		box-shadow var(--cb-fast) var(--cb-ease),
		background-color var(--cb-fast) var(--cb-ease);
}

.entry-content input:focus,
.entry-content textarea:focus,
.search-field:focus {
	border-color: var(--cb-neon-cyan);
	box-shadow: 0 0 0 3px rgba(0, 212, 255, .18);
}

/* Botones: elevación y brillo contenidos. */
.wp-block-button__link,
button.search-submit,
input[type="submit"],
.read-more a,
.link-more a {
	transition:
		transform var(--cb-fast) var(--cb-ease-out),
		box-shadow var(--cb-fast) var(--cb-ease-out),
		filter var(--cb-fast) var(--cb-ease);
}

.wp-block-button__link:hover,
button.search-submit:hover,
input[type="submit"]:hover,
.read-more a:hover,
.link-more a:hover {
	transform: translateY(-2px);
	box-shadow: var(--cb-shadow-2);
	filter: saturate(115%);
}

.wp-block-button__link:active,
input[type="submit"]:active {
	transform: translateY(0);
}

/* Paginación: el número activo se distingue de verdad. */
.pagination .page-numbers,
.comments-pagination .page-numbers {
	transition:
		background-color var(--cb-fast) var(--cb-ease),
		color var(--cb-fast) var(--cb-ease),
		transform var(--cb-fast) var(--cb-ease);
}

.pagination .page-numbers:hover {
	transform: translateY(-2px);
}

.pagination .page-numbers.current {
	background: linear-gradient(90deg, var(--cb-neon-pink), var(--cb-neon-violet));
	color: #fff;
	border-color: transparent;
}

/* Iconos sociales del pie. */
.social-icons a,
.footer-social a {
	transition: transform var(--cb-fast) var(--cb-ease-out), color var(--cb-fast) var(--cb-ease);
}

.social-icons a:hover,
.footer-social a:hover {
	transform: translateY(-3px) scale(1.08);
	color: var(--cb-neon-cyan);
}

/* --- Migas de pan -------------------------------------------------------- */

.cb-breadcrumbs {
	margin: 0 0 1.75rem;
	font-size: .85rem;
	line-height: 1.6;
	color: rgba(255, 255, 255, .55);
	letter-spacing: .01em;
}

.cb-breadcrumbs a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color var(--cb-fast) var(--cb-ease), border-color var(--cb-fast) var(--cb-ease);
}

.cb-breadcrumbs a:hover,
.cb-breadcrumbs a:focus-visible {
	color: var(--cb-neon-cyan);
	border-bottom-color: currentColor;
}

.cb-breadcrumbs__sep {
	margin: 0 .5rem;
	opacity: .4;
}

.cb-breadcrumbs [aria-current="page"] {
	color: rgba(255, 255, 255, .85);
}

/* --- Página 404 ---------------------------------------------------------- */

.cb-404 {
	text-align: center;
}

.cb-404__search {
	max-width: 520px;
	margin: 1.75rem auto;
}

.cb-404-helpers {
	margin-top: 3rem;
	text-align: left;
}

.cb-404-helpers__title {
	font-size: 1.05rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var(--cb-neon-cyan);
	margin-bottom: .9rem;
}

.cb-404-helpers__cats,
.cb-404-helpers__posts {
	list-style: none;
	margin: 0 0 2.25rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
}

.cb-404-helpers__posts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: .75rem;
}

.cb-404-helpers__cats a {
	display: inline-block;
	padding: .45rem .9rem;
	border-radius: 100px;
	background: var(--cb-surface);
	border: 1px solid var(--cb-hairline);
	text-decoration: none;
	font-size: .9rem;
	transition:
		border-color var(--cb-fast) var(--cb-ease),
		transform var(--cb-fast) var(--cb-ease-out);
}

.cb-404-helpers__cats a:hover {
	border-color: var(--cb-neon-cyan);
	transform: translateY(-2px);
}

.cb-404-helpers__posts li {
	background: var(--cb-surface);
	border: 1px solid var(--cb-hairline);
	border-radius: 6px;
	padding: .9rem 1.1rem;
	line-height: 1.5;
	transition: border-color var(--cb-fast) var(--cb-ease), transform var(--cb-fast) var(--cb-ease-out);
}

.cb-404-helpers__posts li:hover {
	border-color: var(--cb-neon-rose);
	transform: translateY(-2px);
}

.cb-404-helpers__posts a {
	text-decoration: none;
}

/* ==========================================================================
   11. Movimiento reducido e impresión
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}

	.cb-js [data-cb-reveal] {
		opacity: 1;
		transform: none;
	}

	.cb-reading-progress {
		display: none;
	}

	/* El brillo pulsante del logotipo y de la rúbrica marean a quien pide
	   menos movimiento; se dejan fijos en su estado más legible. */
	.logo-i,
	.is-style-cb-rubric,
	.wp-block-verse.rubrica-final,
	.is-style-cb-guru,
	.wp-block-verse.guru-meditation {
		animation: none !important;
	}
}

@media print {

	.cb-header,
	.site-footer,
	.cb-skip-link,
	.goto-top,
	.toggle,
	.sidebar,
	.comments-area {
		display: none !important;
	}

	.entry-content > p,
	.entry-content > ul,
	.entry-content > ol {
		max-width: none;
	}

	/* Los enlaces impresos muestran su destino. */
	.entry-content a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: .8em;
		word-break: break-all;
	}
}

/* ==========================================================================
   Aviso de cookies
   --------------------------------------------------------------------------
   Es lo primero que ve cualquier visitante y venía con el azul por
   defecto del plugin: fuera del sistema de color y, en el botón
   secundario, con texto azul sobre panel oscuro a un contraste
   insuficiente. Se alinea con la paleta del sitio.
   ========================================================================== */

.css-consent-banner {
	background: rgba(10, 8, 22, .97);
	backdrop-filter: saturate(140%) blur(14px);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	border-top: 1px solid var(--cb-hairline);
	box-shadow: 0 -12px 40px rgba(0, 0, 0, .5);
	color: rgba(255, 255, 255, .82);
}

.css-banner__text {
	color: rgba(255, 255, 255, .78);
	font-size: .92rem;
	line-height: 1.55;
}

.css-consent-banner .css-btn,
.css-prefs__dialog .css-btn {
	appearance: none;
	-webkit-appearance: none;
	border-radius: 100px;
	padding: .65rem 1.35rem;
	font-family: var(--body-font);
	font-size: .85rem;
	font-weight: 700;
	letter-spacing: .02em;
	cursor: pointer;
	transition:
		transform var(--cb-fast) var(--cb-ease-out),
		background-color var(--cb-fast) var(--cb-ease),
		border-color var(--cb-fast) var(--cb-ease),
		color var(--cb-fast) var(--cb-ease);
}

.css-consent-banner .css-btn:hover,
.css-prefs__dialog .css-btn:hover {
	transform: translateY(-2px);
}

/* Aceptar: el único botón sólido. */
.css-btn--primary {
	background: linear-gradient(90deg, var(--cb-neon-pink), var(--cb-neon-violet));
	border: 1px solid transparent;
	color: #fff;
	box-shadow: 0 0 18px rgba(255, 0, 94, .3);
}

.css-btn--primary:hover {
	box-shadow: 0 0 26px rgba(122, 92, 255, .45);
}

/* Rechazar y gestionar: fantasma, con texto blanco legible. */
.css-btn--secondary,
.css-btn--outline {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .28);
	color: rgba(255, 255, 255, .92);
}

.css-btn--secondary:hover,
.css-btn--outline:hover {
	border-color: var(--cb-neon-cyan);
	background: rgba(0, 212, 255, .1);
	color: #fff;
}

/* Panel de preferencias */
.css-prefs__dialog {
	background: linear-gradient(180deg, rgba(16, 14, 36, .99), rgba(9, 8, 22, .99));
	border: 1px solid var(--cb-hairline);
	border-radius: 8px;
	color: rgba(255, 255, 255, .85);
}

.css-prefs__header,
.css-prefs__footer {
	border-color: var(--cb-hairline);
}

.css-pref-category__label { color: #fff; font-weight: 600; }
.css-pref-category__desc  { color: rgba(255, 255, 255, .6); font-size: .88rem; }

.css-prefs__overlay { background: rgba(4, 3, 10, .8); }

.css-prefs__close {
	color: rgba(255, 255, 255, .7);
	background: none;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 6px;
}

.css-prefs__close:hover {
	color: #fff;
	border-color: var(--cb-neon-pink);
}

.css-toggle__slider { background: rgba(255, 255, 255, .18); }

.css-toggle input:checked + .css-toggle__slider,
.css-toggle-wrap input:checked + .css-toggle__slider {
	background: var(--cb-neon-cyan);
}

/* En móvil el aviso ocupaba media pantalla. */
@media (max-width: 640px) {

	.css-banner__inner {
		padding: 1rem 1.1rem 1.15rem;
		gap: .75rem;
	}

	.css-banner__text {
		font-size: .84rem;
		line-height: 1.45;
		text-align: left;
	}

	.css-banner__actions {
		display: flex;
		flex-wrap: wrap;
		gap: .5rem;
	}

	.css-consent-banner .css-btn {
		flex: 1 1 auto;
		padding: .6rem 1rem;
		font-size: .8rem;
	}
}

/* Un <section class="widget"> que se queda sin contenido no debe dejar
   hueco ni borde en la barra lateral. */
.widget:empty { display: none; }

/* El hero del artículo en móvil necesita algo más de aire: con el alto
   anterior la imagen y el titular se peleaban por el mismo espacio. */
@media (max-width: 767px) {

	body .single-hero.cover .cover-wrapper {
		min-height: clamp(20rem, 46vh, 25rem);
	}
}

/* --- Retoques de la página 404 --------------------------------------------
   El contador de la categoría salía pegado al nombre («Videojuegos12
   artículos») porque el tema envuelve el número sin separador, y el
   botón de buscar quedaba suelto debajo del campo en vez de dentro.
   -------------------------------------------------------------------------- */

.cb-404-helpers__cats .tfm-count {
	margin-left: .45rem;
	color: var(--cb-ink-4, rgba(255, 255, 255, .46));
	font-size: .8em;
}

.cb-404 .page-title.title-404 {
	text-align: center;
}

.cb-404__search .search-form {
	position: relative;
	display: flex;
	align-items: stretch;
	gap: 0;
}

.cb-404__search .search-field {
	flex: 1 1 auto;
	min-width: 0;
	border-radius: 100px 0 0 100px;
}

.cb-404__search .search-submit {
	flex: none;
	width: 3.25rem;
	margin: 0;
	border-radius: 0 100px 100px 0;
	background: linear-gradient(90deg, var(--cb-neon-pink), var(--cb-neon-violet));
	color: #fff;
	border: 0;
	cursor: pointer;
}

.cb-404__search .search-submit:hover {
	filter: saturate(120%);
}