/*
 * insumiso.es — tema «Panfleto»
 * Columna de opinión con descaro: blanco roto, tinta negra y rojo protesta. Bodoni Moda (titulares, mancheta)
 * + Albert Sans (texto e interfaz). Fotos en tinta roja y negra, sellos girados, subrayados de rotulador rosa.
 */
:root {
  --papel: #faf9f6;
  --tinta: #121212;
  --gris: #5a5a5a;
  --linea: #121212;
  --linea-suave: #dcd8cf;
  --rojo: #d4231a;
  --rojo-oscuro: #a3150e;
  --rojo-claro: #ff6b5d;
  --rosa: #f8d9d2;
  --negro: #111;
  --hueso: #f1eee7;
  --didona: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --sans: "Albert Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --ancho-texto: 42rem;
  --ancho-amplio: 74rem;
  --hueco: clamp(1rem, 2.5vw, 2rem);
  --radio: 0;
  --color-texto: var(--tinta);
  --color-fondo: var(--papel);
  --color-suave: var(--hueso);
  --color-borde: var(--linea-suave);
  --color-acento: var(--rojo);
  --color-acento-texto: #fff;
  --color-tenue: var(--gris);
  --fuente-texto: var(--sans);
  --fuente-titulos: var(--didona);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; background: var(--papel); color: var(--tinta); font: 400 1.0625rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--rojo); outline-offset: 2px; }
::selection { background: var(--rojo); color: #fff; }
.icono { width: 1.2rem; height: 1.2rem; flex: none; }
.envoltorio { width: min(100% - 2.5rem, var(--ancho-amplio)); margin-inline: auto; }
.saltar { position: absolute; left: -999px; top: .5rem; z-index: 100; background: var(--rojo); color: #fff; padding: .6rem 1rem; font-weight: 700; text-decoration: none; }
.saltar:focus { left: .5rem; }
main { outline: 0; }

/* ------------------------------------------------------------ cabecera */
.franja { background: var(--negro); color: #e9e6df; font: 600 .74rem/1.5 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.franja-fila { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.4rem; }
.franja-texto { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.franja-rss { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; padding: .55rem 0; }
.franja-rss .icono { width: 1rem; height: 1rem; color: var(--rojo-claro); }
.franja-rss:hover { color: var(--rojo-claro); }

.cabecera { border-bottom: 3px solid var(--linea); box-shadow: 0 3px 0 var(--papel), 0 4px 0 var(--linea); margin-bottom: 4px; }
.mancheta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 2rem; padding-block: 1.1rem; }
.marca { margin: 0; font: italic 900 2.3rem/1 var(--didona); letter-spacing: -.02em; }
.marca a { text-decoration: none; }
.marca-dominio { color: var(--rojo); }
.marca a:hover .marca-raiz { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: .12em; text-decoration-color: var(--rojo); }

.cabecera-portada .mancheta { flex-direction: column; justify-content: center; text-align: center; padding-block: clamp(1.75rem, 4vw, 3rem) 0; gap: 0; }
.marca-grande { font-size: clamp(3.4rem, 13.5vw, 10.5rem); line-height: .82; letter-spacing: -.035em; font-variation-settings: "opsz" 96; }
.mancheta-lema { margin: 1.1rem 0 0; font: italic 400 clamp(1.15rem, 2.4vw, 1.65rem)/1.3 var(--didona); }
.mancheta-datos { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem 0; margin: 1.4rem 0 0; padding: .7rem 0; width: 100%; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); font: 600 .74rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.mancheta-datos span + span::before { content: "✶"; color: var(--rojo); margin: 0 1rem; letter-spacing: 0; }

.navegacion { display: flex; align-items: center; gap: 1.75rem; }
.navegacion .menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.6rem; }
.navegacion .menu a { display: inline-block; padding: .7rem 0; font: 700 .8rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; border-bottom: 3px solid transparent; }
.navegacion .menu a:hover { color: var(--rojo); }
.navegacion .menu a[aria-current] { border-bottom-color: var(--rojo); }
.buscador-cabecera { display: flex; align-items: center; border-bottom: 1px solid var(--linea); }
.buscador-cabecera input { width: 11rem; min-width: 0; border: 0; background: transparent; font: 400 .95rem/1.2 var(--sans); color: inherit; padding: .55rem 0; min-height: 44px; }
.buscador-cabecera input::placeholder { color: var(--gris); opacity: 1; }
.buscador-cabecera input:focus { outline: 0; }
.buscador-cabecera:focus-within { border-bottom-color: var(--rojo); box-shadow: 0 1px 0 var(--rojo); }
.buscador-cabecera button { width: 44px; height: 44px; display: grid; place-items: center; background: none; border: 0; color: inherit; cursor: pointer; }
.buscador-cabecera button:hover { color: var(--rojo); }
.cabecera-portada .navegacion { width: 100%; justify-content: center; padding: .35rem 0; }

.menu-boton { display: none; align-items: center; gap: .5rem; min-height: 44px; padding: .45rem .9rem; background: var(--negro); color: #fff; border: 0; font: 700 .8rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.menu-boton .icono { width: 1.1rem; height: 1.1rem; }
.menu-boton .icono-cerrar, .menu-boton[aria-expanded="true"] .icono-abrir { display: none; }
.menu-boton[aria-expanded="true"] .icono-cerrar { display: block; }

@media (max-width: 52rem) {
  .menu-boton { display: inline-flex; }
  .mancheta, .cabecera-portada .mancheta { flex-direction: row; flex-wrap: wrap; justify-content: space-between; text-align: left; padding-block: 1rem; }
  .cabecera-portada .marca-grande { font-size: clamp(3rem, 15vw, 5rem); }
  .cabecera-portada .mancheta-lema { order: 3; width: 100%; margin-top: .75rem; }
  .cabecera-portada .mancheta-datos { order: 4; justify-content: flex-start; }
  .navegacion, .cabecera-portada .navegacion { display: none; order: 5; width: 100%; flex-direction: column; align-items: stretch; gap: .5rem; padding: .5rem 0 1rem; }
  .navegacion.abierto { display: flex; }
  .navegacion .menu { flex-direction: column; }
  .navegacion .menu a { display: block; padding: .9rem 0; border-bottom: 1px solid var(--linea-suave); font-size: .9rem; }
  .buscador-cabecera input { width: 100%; flex: 1; font-size: 1rem; }
  .franja-texto { font-size: .68rem; }
}

/* ------------------------------------------------------------ piezas y bloques */
.sello {
  display: inline-block; margin: 0 0 1.25rem; padding: .35em .75em .3em; transform: rotate(-2.5deg);
  border: 2px solid var(--rojo); color: var(--rojo); font: 800 .74rem/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase;
}
.portada { padding-block: clamp(2rem, 5vw, 3.5rem) 0; }
.bloque { margin-top: clamp(3rem, 6vw, 4.5rem); }
.bloque-titulo { margin: 0 0 1.75rem; padding-top: .55rem; border-top: 3px solid var(--linea); font: italic 800 clamp(1.6rem, 3vw, 2.1rem)/1.1 var(--didona); letter-spacing: -.01em; display: flex; align-items: baseline; gap: 1rem; }
.bloque-titulo::after { content: ""; flex: 1; border-top: 1px solid var(--linea); transform: translateY(-.3em); }

.pieza-fecha { margin: 0 0 .5rem; font: 700 .72rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
.pieza-titulo { margin: 0; font-family: var(--didona); font-weight: 700; letter-spacing: -.012em; text-wrap: balance; }
.pieza-titulo a { text-decoration: none; background-image: linear-gradient(var(--rojo), var(--rojo)); background-size: 0 3px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .3s ease; }
.pieza-titulo a:hover { background-size: 100% 3px; }
.pieza-extracto { margin: .7rem 0 0; color: #333; }
.pieza-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1rem; margin: .9rem 0 0; font: 500 .8rem/1.4 var(--sans); color: var(--gris); }
.pieza-comentarios { display: inline-flex; align-items: center; gap: .3rem; color: var(--rojo); font-weight: 700; }
.pieza-comentarios .icono { width: 1rem; height: 1rem; }

.foto-tinta { position: relative; display: block; overflow: hidden; background: var(--rojo); }
.foto-tinta img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.15) brightness(1.08); mix-blend-mode: multiply; transition: filter .45s ease, transform .6s ease; }
.foto-tinta::after { content: ""; position: absolute; inset: 0; background: radial-gradient(rgba(0,0,0,.18) 1px, transparent 1.2px) 0 0 / 4px 4px; mix-blend-mode: multiply; pointer-events: none; transition: opacity .45s ease; }
.pieza:hover .foto-tinta img { filter: none; mix-blend-mode: normal; transform: scale(1.02); }
.pieza:hover .foto-tinta::after { opacity: 0; }

/* apertura */
.apertura { position: relative; }
.pieza-apertura { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; }
.pieza-apertura.sin-foto { grid-template-columns: minmax(0, 1fr); max-width: 60rem; }
.pieza-apertura .pieza-foto { order: 2; }
.pieza-apertura .pieza-foto img { height: auto; }
.pieza-apertura .pieza-titulo { font-size: clamp(2.5rem, 5.6vw, 5rem); line-height: .98; font-weight: 800; letter-spacing: -.03em; }
.pieza-apertura .pieza-extracto { font: italic 400 clamp(1.15rem, 1.8vw, 1.4rem)/1.45 var(--didona); color: var(--tinta); margin-top: 1.25rem; max-width: 36rem; }

/* columnas */
.rejilla-columnas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.75rem clamp(1.5rem, 3vw, 2.75rem); }
.pieza-columna { border-top: 1px solid var(--linea); padding-top: 1rem; display: flex; flex-direction: column; }
.pieza-columna .pieza-foto { aspect-ratio: 16 / 10; margin-bottom: 1rem; }
.pieza-columna .pieza-titulo { font-size: 1.5rem; line-height: 1.12; }
.pieza-columna .pieza-extracto { font-size: .97rem; line-height: 1.55; }
.pieza-columna.sin-foto .pieza-titulo { font-size: 1.75rem; }

/* líneas del archivo */
.lista-lineas { list-style: none; margin: 0; padding: 0; columns: 2 24rem; column-gap: 3rem; }
.pieza-linea { break-inside: avoid; display: grid; grid-template-columns: 6.2rem minmax(0, 1fr) auto; gap: .25rem 1rem; align-items: baseline; padding: .85rem 0; border-bottom: 1px solid var(--linea-suave); }
.pieza-linea time { font: 700 .72rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--rojo); font-variant-numeric: tabular-nums; }
.pieza-linea .pieza-titulo { font-size: 1.2rem; line-height: 1.2; font-weight: 600; }
.mas-entradas { margin: 2rem 0 0; }
.boton-tinta { display: inline-flex; align-items: center; gap: .6rem; min-height: 48px; padding: .8rem 1.4rem; background: var(--negro); color: #fff; text-decoration: none; font: 700 .82rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; transition: background-color .15s ease; }
.boton-tinta:hover { background: var(--rojo); }
.boton-tinta .icono { width: 1.1rem; height: 1.1rem; }
.enlace-flecha { display: inline-flex; align-items: center; gap: .45rem; font: 700 .8rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; min-height: 44px; }
.enlace-flecha .icono { width: 1.05rem; height: 1.05rem; transition: transform .2s ease; }
.enlace-flecha:hover .icono { transform: translateX(4px); }

/* banda negra */
.banda { background: var(--negro); color: #eceae4; margin-top: clamp(4rem, 8vw, 6rem); padding-block: clamp(3rem, 6vw, 4.5rem); }
.banda-rejilla { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); }
.banda h2 { margin: 0 0 1.25rem; font: italic 800 1.7rem/1.1 var(--didona); color: #fff; }
.banda h2::after { content: ""; display: block; width: 2.5rem; height: 3px; background: var(--rojo); margin-top: .6rem; }
.banda a { text-decoration: none; }
.anios { list-style: none; margin: 0; padding: 0; }
.anios a { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .3rem 0; border-bottom: 1px solid #333; }
.anio { font: 700 1.55rem/1.15 var(--didona); font-variant-numeric: lining-nums; }
.anio-n { font: 600 .8rem/1 var(--sans); color: #b6b2a8; }
.anios a:hover .anio { color: var(--rojo-claro); }
.nube { margin: 0; display: flex; flex-wrap: wrap; gap: .3rem .9rem; align-items: baseline; }
.nube a { font-family: var(--sans); font-weight: 600; color: #e7e3da; line-height: 1.3; }
.nube a:hover { color: var(--rojo-claro); }
.nube .peso-1 { font-size: .88rem; color: #bdb8ad; }
.nube .peso-2 { font-size: 1.05rem; }
.nube .peso-3 { font-size: 1.3rem; font-family: var(--didona); font-style: italic; font-weight: 700; }
.nube .peso-4 { font-size: 1.7rem; font-family: var(--didona); font-style: italic; font-weight: 800; color: #fff; }
.debate { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.debate a { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: .8rem; align-items: start; }
.debate-n { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50% 50% 50% 0; background: var(--rojo); color: #fff; font: 800 .85rem/1 var(--sans); }
.debate-titulo { font: 600 1.08rem/1.3 var(--didona); padding-top: .2rem; }
.debate a:hover .debate-titulo { color: var(--rojo-claro); }
.banda-autor p { margin: 0 0 .75rem; color: #d3cfc6; font-size: .97rem; }
.autor-foto { float: right; width: 5.5rem; margin: 0 0 .5rem 1rem; }
.autor-foto img { display: block; width: 5.5rem; height: 5.5rem; object-fit: cover; border-radius: 50%; filter: grayscale(1) contrast(1.1); }
.banda .enlace-flecha { color: var(--rojo-claro); }

/* ------------------------------------------------------------ artículo */
.articulo-cabecera { max-width: 58rem; text-align: center; padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(1.5rem, 3vw, 2.25rem); }
.articulo-antetitulo { margin: 0 0 1.25rem; font: 700 .76rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem .6rem; }
.articulo-antetitulo a { text-decoration: none; }
.articulo-antetitulo a:hover { text-decoration: underline; text-underline-offset: .25em; }
.articulo-titulo { margin: 0; font: 800 clamp(2.3rem, 5.6vw, 4.6rem)/1.02 var(--didona); letter-spacing: -.028em; text-wrap: balance; }
.articulo-entradilla { margin: 1.5rem auto 0; max-width: 38rem; font: italic 400 clamp(1.15rem, 2vw, 1.4rem)/1.45 var(--didona); }
.articulo-meta { margin: 1.5rem 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem 0; font: 500 .85rem/1.4 var(--sans); color: var(--gris); }
.articulo-meta > * + *::before { content: "/"; margin: 0 .8rem; color: var(--linea-suave); }
.articulo-meta a { display: inline-flex; align-items: center; gap: .35rem; color: var(--rojo); font-weight: 700; text-decoration: none; }
.articulo-meta a .icono { width: 1rem; height: 1rem; }
.firma strong { color: var(--tinta); }
.articulo-cabecera::after { content: ""; display: block; width: 5rem; height: 3px; background: var(--rojo); margin: 2rem auto 0; }
.articulo-foto { max-width: 58rem; margin: .5rem auto 2.5rem; }
.articulo-foto img { display: block; width: 100%; }
.articulo-cuerpo { max-width: var(--ancho-texto); padding-bottom: 1rem; }

.articulo-texto { font-size: 1.15rem; line-height: 1.75; }
.articulo-texto > * { max-width: none; }
.articulo-texto > p:first-of-type { font-size: 1.24rem; }
.tipo-entrada .articulo-texto > p:first-of-type::first-letter { float: left; font: 900 4.6em/.8 var(--didona); color: var(--rojo); margin: .06em .1em 0 -.03em; }
.articulo-texto a { color: var(--rojo-oscuro); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.articulo-texto a:hover { color: var(--rojo); text-decoration-thickness: 2px; }
.articulo-texto strong, .articulo-texto b { font-weight: 700; background: linear-gradient(transparent 62%, var(--rosa) 62%); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.articulo-texto h2, .articulo-texto h3, .articulo-texto h4 { font-family: var(--didona); font-weight: 800; letter-spacing: -.01em; line-height: 1.15; }
.articulo-texto h2 { font-size: 1.85rem; margin-top: 2em; }
.articulo-texto h3 { font-size: 1.45rem; }
.articulo-texto h2 strong, .articulo-texto h3 strong { background: none; }
.articulo-texto blockquote { margin: 2rem 0; padding: 0 0 0 1.5rem; border-left: 3px solid var(--rojo); font: italic 400 1.4rem/1.45 var(--didona); }
.articulo-texto blockquote p:last-child { margin-bottom: 0; }
.articulo-texto figure.imagen img, .articulo-texto p > img, .articulo-texto p > a > img { border-radius: 0; }
.articulo-texto figcaption { font: 500 .82rem/1.4 var(--sans); color: var(--gris); text-align: left; }
.articulo-texto ul li::marker, .articulo-texto ol li::marker { color: var(--rojo); font-weight: 700; }
.articulo-foto-lateral { float: right; width: min(var(--ancho-foto, 18rem), 45%); margin: .35rem 0 1rem 1.75rem; }
.articulo-foto-lateral img { display: block; width: 100%; }
@media (min-width: 76rem) { .articulo-foto-lateral { margin-right: -9rem; } }
@media (max-width: 34rem) { .articulo-foto-lateral { float: none; width: auto; max-width: var(--ancho-foto, 100%); margin: 0 auto 1.5rem; } }
.articulo-texto::after { content: ""; display: table; clear: both; }

/* vídeos bajo demanda (botón .x-video del motor) con la estética del tema */
.articulo-texto figure.video { margin: 2rem 0; }
.contenido .x-video { border-radius: 0; background: var(--negro) radial-gradient(circle at 28% 22%, #4a0d09 0, transparent 62%); font-family: var(--sans); }
.contenido .x-video::before { background: radial-gradient(rgba(255, 255, 255, .06) 1px, transparent 1.3px) 0 0 / 5px 5px; opacity: 1; }
.contenido .x-video-icono { display: grid; place-items: center; width: 4.6rem; height: 4.6rem; border-radius: 50%; background: var(--rojo); color: transparent; transition: transform .2s ease, background-color .2s ease; }
.contenido .x-video-icono svg { width: 3.2rem; height: auto; }
.contenido .x-video-icono svg path:first-child { fill: transparent; }
.contenido .x-video-icono svg path:last-child { fill: #fff; }
.contenido .x-video:hover .x-video-icono { background: #ee3527; }
.contenido .x-video:active .x-video-icono { transform: scale(.96); }
.contenido .x-video-texto { bottom: 1.4rem; font: italic 700 1.3rem/1.2 var(--didona); text-shadow: none; }
.contenido .x-video-texto small { margin-top: .35rem; font: 600 .7rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #bdb8ad; opacity: 1; }
.contenido .x-video:focus-visible { outline: 3px solid var(--rojo); outline-offset: 3px; }
.articulo-texto figure.video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }

.etiquetas { list-style: none; margin: 2.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.etiquetas a { display: inline-block; padding: .45rem .8rem; border: 1.5px solid var(--linea); font: 700 .85rem/1.2 var(--sans); text-decoration: none; min-height: 36px; }
.etiquetas a:hover { background: var(--rojo); border-color: var(--rojo); color: #fff; }

.autor-caja { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1.25rem; align-items: start; margin-top: 3rem; padding-top: 1.25rem; border-top: 3px solid var(--linea); }
.autor-caja-foto { display: block; width: 5.5rem; height: 5.5rem; object-fit: cover; border-radius: 50%; filter: grayscale(1) contrast(1.1); }
.autor-caja-nombre { margin: 0 0 .3rem; font: italic 800 1.4rem/1.2 var(--didona); }
.autor-caja p { margin: 0 0 .4rem; color: #333; font-size: .98rem; }
.autor-caja .enlace-flecha { color: var(--rojo); }

/* comentarios */
.comentarios { margin-top: 3.5rem; }
.comentarios-lista { list-style: none; margin: 0; padding: 0; }
.comentario { padding: 1.25rem 0; border-bottom: 1px solid var(--linea-suave); }
.comentarios-lista.respuestas { margin: 1rem 0 0 1.25rem; padding-left: 1.25rem; border-left: 3px solid var(--rojo); }
.comentarios-lista.respuestas .comentario { border-bottom: 0; padding-bottom: 0; }
.comentario-cabeza { margin: 0 0 .5rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .75rem; font: 400 .85rem/1.4 var(--sans); color: var(--gris); }
.comentario-cabeza strong { color: var(--tinta); font-size: 1rem; }
.comentario-sello { display: inline-block; padding: .1em .5em; background: var(--rojo); color: #fff; font-weight: 700; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; }
.comentario-texto { font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere; }
.comentario-texto p { margin: 0 0 .7em; }
.comentario-texto p:last-child { margin-bottom: 0; }
.comentario-autor > .comentario-texto { padding: .9rem 1.1rem; background: var(--hueso); }
.comentarios-cerrados { margin: 1.5rem 0 0; font: italic 400 1.05rem/1.4 var(--didona); color: var(--gris); }

/* anterior / siguiente y relacionadas */
.vecinos { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: clamp(3rem, 6vw, 4.5rem); padding-top: 1.25rem; border-top: 3px solid var(--linea); }
.vecino { display: flex; flex-direction: column; gap: .45rem; text-decoration: none; }
.vecino-sig { text-align: right; align-items: flex-end; }
.vecino-rotulo { display: inline-flex; align-items: center; gap: .4rem; font: 700 .74rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
.vecino-rotulo .icono { width: 1rem; height: 1rem; }
.vecino-titulo { font: 700 clamp(1.15rem, 2vw, 1.45rem)/1.2 var(--didona); text-wrap: balance; }
.vecino:hover .vecino-titulo { text-decoration: underline; text-decoration-color: var(--rojo); text-decoration-thickness: 3px; text-underline-offset: .15em; }
.relacionadas { margin-bottom: 1rem; }

/* ------------------------------------------------------------ listados */
.listado { padding-block: clamp(2.5rem, 6vw, 4rem) 1rem; }
.listado-cabecera { margin-bottom: clamp(2rem, 4vw, 3rem); }
.listado-titulo { margin: 0; font: italic 900 clamp(2.6rem, 7vw, 5.5rem)/.95 var(--didona); letter-spacing: -.03em; text-wrap: balance; overflow-wrap: anywhere; }
.listado-descripcion { max-width: 40rem; margin: 1rem 0 0; font: italic 400 1.25rem/1.45 var(--didona); }
.listado-cuenta { margin: 1rem 0 0; font: 700 .76rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.anios-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.5rem; }
.anios-chips a { display: inline-block; min-width: 4rem; padding: .5rem .7rem; text-align: center; border: 1.5px solid var(--linea); font: 700 1.05rem/1.1 var(--didona); text-decoration: none; }
.anios-chips a:hover { background: var(--hueso); }
.anios-chips a[aria-current] { background: var(--negro); color: #fff; }
.aviso-vacio { font: italic 400 1.3rem/1.45 var(--didona); color: var(--gris); }
.buscador-grande { margin-top: 1.75rem; }
.x-buscador { max-width: 36rem; gap: 0; }
.x-buscador input { border: 1.5px solid var(--linea); border-right: 0; border-radius: 0; font: 400 1.05rem/1.3 var(--sans); padding: .8rem 1rem; min-height: 50px; background: #fff; }
.x-buscador button { border-radius: 0; background: var(--negro); border-color: var(--negro); color: #fff; font: 700 .82rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; padding: 0 1.4rem; min-height: 50px; }
.x-buscador button:hover { background: var(--rojo); border-color: var(--rojo); transform: none; box-shadow: none; }
.x-buscador input:focus { outline: 3px solid var(--rojo); outline-offset: -1px; }

.paginacion { font: 700 .82rem/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; border-top: 3px solid var(--linea); padding-top: 1.25rem; margin-top: 3.5rem; }
.paginacion a, .paginacion span[aria-current] { border-radius: 0; border: 1.5px solid var(--linea); min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.paginacion a:hover { background: var(--rojo); border-color: var(--rojo); color: #fff; }
.paginacion span[aria-current] { background: var(--negro); border-color: var(--negro); color: #fff; }

/* error */
.error-404 { padding-block: clamp(2.5rem, 6vw, 4rem) 1rem; }
.error-cifra { margin: 0 0 .25em; padding-top: .05em; font: italic 900 clamp(6rem, 22vw, 15rem)/.9 var(--didona); color: var(--rojo); letter-spacing: -.04em; }
.error-404 .articulo-entradilla { margin-left: 0; }

/* páginas y contacto */
.pagina .articulo-cuerpo { padding-bottom: 3rem; }
.x-contacto { gap: 1.25rem; margin-top: 1rem; }
.x-contacto label { font: 700 .74rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.x-contacto label span { text-transform: none; letter-spacing: 0; }
.x-contacto .x-acepto label { text-transform: none; letter-spacing: 0; font: 400 .92rem/1.45 var(--sans); color: var(--gris); }
.x-contacto input:not([type=checkbox]), .x-contacto textarea { border: 1.5px solid var(--linea); border-radius: 0; background: #fff; font: 400 1rem/1.4 var(--sans); min-height: 48px; }
.x-contacto input:focus, .x-contacto textarea:focus { outline: 3px solid var(--rojo); outline-offset: -1px; }
.x-contacto input[type=checkbox] { accent-color: var(--rojo); width: 1.15rem; height: 1.15rem; }
.x-contacto .boton { border-radius: 0; background: var(--negro); border-color: var(--negro); text-transform: uppercase; letter-spacing: .12em; font: 700 .85rem/1 var(--sans); min-height: 50px; padding: 0 1.6rem; }
.x-contacto .boton:hover { background: var(--rojo); border-color: var(--rojo); transform: none; box-shadow: none; }

/* ------------------------------------------------------------ pie */
.pie { background: var(--negro); color: #d9d5cc; padding-top: clamp(3rem, 6vw, 4.5rem); margin-top: clamp(4rem, 8vw, 6rem); font-size: .95rem; }
.banda + .pie, main:has(> .banda:last-child) + .pie { margin-top: 0; border-top: 1px solid #2c2c2c; }
.pie a { text-decoration: none; }
.pie-rejilla { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; padding-bottom: 2.5rem; }
.marca-pie { font-size: clamp(2.6rem, 5vw, 3.6rem); color: #fff; }
.marca-pie .marca-dominio { color: var(--rojo-claro); }
.pie-lema { margin: .75rem 0 0; font: italic 400 1.2rem/1.35 var(--didona); color: #fff; }
.pie-texto { margin: .6rem 0 0; color: #b6b2a8; }
.pie-columna h2 { margin: .4rem 0 .9rem; font: 700 .74rem/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--rojo-claro); }
.pie-menu, .pie-anios { list-style: none; margin: 0; padding: 0; }
.pie-menu a { display: inline-block; padding: .4rem 0; }
.pie-menu a:hover, .pie-anios a:hover { color: var(--rojo-claro); }
.pie-anios { display: grid; grid-template-columns: repeat(3, max-content); gap: .2rem 1.4rem; }
.pie-anios a { display: inline-block; padding: .4rem 0; font: 700 1.15rem/1.2 var(--didona); }
.pie-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; padding-block: 1.25rem 1.6rem; border-top: 1px solid #333; font-size: .85rem; color: #b6b2a8; }
.pie-legal p { margin: 0; }
.pie-arriba:hover { color: var(--rojo-claro); }

/* ------------------------------------------------------------ adaptación */
@media (max-width: 64rem) {
  .rejilla-columnas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banda-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pie-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pie-marca { grid-column: 1 / -1; }
}
@media (max-width: 44rem) {
  body { font-size: 1rem; }
  .envoltorio { width: min(100% - 2rem, var(--ancho-amplio)); }
  .pieza-apertura { grid-template-columns: minmax(0, 1fr); }
  .pieza-apertura .pieza-foto { order: -1; }
  .rejilla-columnas { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .pieza-columna .pieza-titulo, .pieza-columna.sin-foto .pieza-titulo { font-size: 1.45rem; }
  .pieza-linea { grid-template-columns: minmax(0, 1fr) auto; }
  .pieza-linea time { grid-column: 1 / -1; }
  .banda-rejilla { grid-template-columns: minmax(0, 1fr); }
  .articulo-cabecera { text-align: left; }
  .articulo-antetitulo, .articulo-meta { justify-content: flex-start; }
  .articulo-cabecera::after { margin-left: 0; }
  .articulo-texto { font-size: 1.08rem; }
  .articulo-texto > p:first-of-type { font-size: 1.14rem; }
  .vecinos { grid-template-columns: minmax(0, 1fr); }
  .vecino-sig { text-align: left; align-items: flex-start; }
  .pie-rejilla { grid-template-columns: minmax(0, 1fr); }
  .lista-lineas { columns: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .foto-tinta img, .pieza-titulo a { transition: none; }
}

@media print {
  .franja, .navegacion, .menu-boton, .banda, .pie, .vecinos, .relacionadas, .etiquetas, figure.video, .buscador-grande { display: none !important; }
  body { background: #fff; font-size: 11pt; }
  .cabecera { box-shadow: none; border-bottom: 2px solid #000; }
  .articulo-cabecera { padding-top: 1rem; }
  .articulo-texto strong { background: none; }
  .articulo-texto a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; color: #555; }
  .comentario-autor > .comentario-texto { background: none; padding: 0; }
}

/* ------------------------------------------------------------ ajustes finos */
.articulo-titulo, .pieza-titulo, .listado-titulo, .vecino-titulo, .debate-titulo { font-variation-settings: "opsz" 36; }
.articulo-texto blockquote.destacado { position: relative; margin: 2.5rem 0; padding: 1.75rem 0 1.5rem; border: 0; border-top: 3px solid var(--linea); border-bottom: 1px solid var(--linea); text-align: left; font: italic 600 clamp(1.4rem, 2.6vw, 1.85rem)/1.3 var(--didona); }
.articulo-texto blockquote.destacado::before { content: "«"; display: block; margin-bottom: .2rem; font: 900 3rem/1 var(--didona); color: var(--rojo); }
.articulo-texto blockquote.destacado p { margin: 0; }
.tipo-entrada .articulo-texto > p:first-of-type::first-letter { margin-right: .14em; }
@media (max-width: 30rem) {
  .cabecera-portada .marca-grande { font-size: 12.5vw; }
  .cabecera-portada .menu-boton { padding: 0; width: 44px; justify-content: center; }
  .cabecera-portada .menu-boton span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mancheta-datos span + span::before { margin: 0 .55rem; }
}

/* ------------------------------------------------------------ afinado */
.articulo-texto p, .pieza-extracto, .comentario-texto p, .banda-autor p, .autor-caja p { text-wrap: pretty; }
.pieza-fecha, .pieza-linea time, .anio-n, .listado-cuenta, .mancheta-datos, .debate-n { font-variant-numeric: tabular-nums; }
.boton-tinta:active { transform: translateY(1px); }
.etiquetas a:active, .anios-chips a:active { background: var(--rojo-oscuro); border-color: var(--rojo-oscuro); color: #fff; }
.navegacion .menu a:active { color: var(--rojo-oscuro); }
.pieza-titulo a:focus-visible { outline-offset: 4px; }
@media (max-width: 44rem) {
  .pieza-columna .pieza-extracto, .pieza-extracto, .autor-caja p, .banda-autor p { font-size: 1rem; }
  .pieza-linea .pieza-titulo { font-size: 1.15rem; }
}

/* ------------------------------------------------------------ ronda 2 */
/* barra de progreso de lectura (solo con CSS; sin soporte, no aparece) */
.progreso-lectura { display: none; }
@supports (animation-timeline: scroll()) {
  .progreso-lectura { display: block; position: fixed; z-index: 80; top: 0; left: 0; right: 0; height: 4px; background: var(--rojo); transform-origin: 0 50%; transform: scaleX(0); animation: progreso-lectura linear both; animation-timeline: scroll(root); pointer-events: none; }
  @keyframes progreso-lectura { to { transform: scaleX(1); } }
}
@media (prefers-reduced-motion: reduce) { .progreso-lectura { display: none !important; } }
/* copiar enlace */
.acciones-articulo { margin: 1.5rem 0 0; }
.boton-copiar { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem 1rem; background: transparent; border: 1.5px solid var(--linea); color: var(--tinta); font: 700 .78rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.boton-copiar .icono { width: 1.05rem; height: 1.05rem; }
.boton-copiar:hover { background: var(--negro); color: #fff; }
.boton-copiar:active { transform: translateY(1px); }
.boton-copiar.hecho { background: var(--rojo); border-color: var(--rojo); color: #fff; }
/* 404 */
.error-anios { margin-top: 1.75rem; }
@media print { .progreso-lectura, .acciones-articulo { display: none !important; } }

/* ============================================================ ronda 3: sistema visual y acabado */
:root {
  --esp-1: .25rem; --esp-2: .5rem; --esp-3: .75rem; --esp-4: 1rem; --esp-5: 1.5rem; --esp-6: 2rem; --esp-7: 3rem; --esp-8: 4rem; --esp-9: 6rem;
  --t-s: .9375rem; --t-m: 1.0625rem; --t-l: 1.25rem; --t-xl: 1.5rem; --t-2xl: clamp(1.75rem, 3vw, 2.25rem);
  --filete-grueso: 3px; --filete: 1px;
  accent-color: var(--rojo);
  scrollbar-color: var(--negro) var(--hueso);
}
a, button { -webkit-tap-highlight-color: rgba(212, 35, 26, .18); }

/* franja: legible (cursiva de la didona en caja baja); en móvil solo el RSS */
.franja-texto { font: italic 500 var(--t-s)/1.4 var(--didona); letter-spacing: 0; text-transform: none; }
.franja-rss { min-height: 44px; }

/* fotos de los listados: blanco y negro de periódico con filete rojo; el color vuelve al pasar */
.foto-tinta { background: var(--negro); border-top: var(--filete-grueso) solid var(--rojo); }
.foto-tinta img { filter: grayscale(1) contrast(1.08) brightness(1.02); mix-blend-mode: normal; }
.foto-tinta::after { background: radial-gradient(rgba(0, 0, 0, .12) 1px, transparent 1.2px) 0 0 / 3px 3px; mix-blend-mode: multiply; }
.pieza:hover .foto-tinta img, .pieza:focus-within .foto-tinta img { filter: grayscale(0) contrast(1); }
.pieza-apertura .pieza-foto { aspect-ratio: 16 / 10; }
.pieza-apertura .pieza-foto img { height: 100%; object-fit: cover; }

/* tarjetas sin foto: una comilla roja como ancla visual, extracto algo más largo */
.pieza-columna.sin-foto .pieza-texto::before { content: ""; display: block; width: 2.5rem; height: var(--filete-grueso); margin: var(--esp-2) 0 var(--esp-4); background: var(--rojo); }
.rejilla-columnas { align-items: start; }

/* didona a tamaños pequeños: óptica de texto (más robusta) */
.pieza-linea .pieza-titulo, .vecino-titulo, .debate-titulo, .pieza-columna .pieza-titulo, .anio, .pie-anios a, .anios-chips a { font-variation-settings: "opsz" 14; }
.pieza-linea .pieza-titulo { font-weight: 600; }

/* índice de temas (sustituye a la nube) */
.temas-indice { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: var(--esp-5); }
.temas-indice li { break-inside: avoid; }
.temas-indice a { display: flex; align-items: baseline; justify-content: space-between; gap: var(--esp-3); min-height: 44px; padding: var(--esp-2) 0; border-bottom: var(--filete) solid #333; font: 600 var(--t-s)/1.3 var(--sans); color: #ece9e2; }
.temas-indice a:hover { color: var(--rojo-claro); }
.temas-n { font: 600 .8125rem/1 var(--sans); color: #b6b2a8; font-variant-numeric: tabular-nums; }

/* metadatos y botones con la misma familia */
.articulo-meta { font-size: var(--t-s); color: #4f4f4f; }
.pieza-meta { font-size: .875rem; color: #555; }
.boton-tinta, .boton-copiar, .x-contacto .boton, .x-buscador button { min-height: 48px; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.etiquetas a { min-height: 44px; display: inline-flex; align-items: center; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.pie-arriba, .pie-menu a, .pie-anios a { display: inline-flex; align-items: center; min-height: 44px; }
.paginacion a, .paginacion span[aria-current] { transition: background-color .15s ease, color .15s ease; }

/* ritmo vertical común */
.bloque { margin-top: var(--esp-8); }
.bloque-titulo { margin-bottom: var(--esp-6); }
.articulo-cabecera { padding-block: var(--esp-8) var(--esp-6); }
.vecinos, .relacionadas { margin-top: var(--esp-8); }
.comentarios { margin-top: var(--esp-8); }

/* menú: panel a pantalla completa con su propio botón de cierre */
.navegacion-cabeza { display: none; }
@media (max-width: 52rem) {
  .franja-texto { display: none; }
  .franja-fila { justify-content: flex-end; }
  .franja-fila { min-height: 2.25rem; }
  .mancheta, .cabecera-portada .mancheta { padding-block: var(--esp-3); min-height: 4rem; }
  .marca { font-size: 2rem; }
  .cabecera-portada .marca-grande { font-size: clamp(2.6rem, 12vw, 3.6rem); }
  .cabecera-portada .mancheta-lema { font-size: 1.05rem; margin-top: var(--esp-2); }
  .cabecera-portada .mancheta-datos { margin-top: var(--esp-3); padding: var(--esp-2) 0; font-size: .75rem; }
  .menu-boton { min-height: 44px; min-width: 44px; }
  .navegacion, .cabecera-portada .navegacion {
    display: flex !important; position: fixed; inset: 0; z-index: 90; order: initial; width: auto; flex-direction: column; align-items: stretch; justify-content: flex-start !important; gap: var(--esp-4);
    padding: 0 var(--esp-5) calc(var(--esp-7) + env(safe-area-inset-bottom)); background: var(--papel); overflow-y: auto; overscroll-behavior: contain;
    visibility: hidden; opacity: 0; transition: opacity .2s ease, visibility 0s linear .2s;
  }
  .navegacion.abierto { visibility: visible; opacity: 1; transition: opacity .2s ease; }
  html.menu-abierto, html.menu-abierto body { overflow: hidden; }
  .navegacion-cabeza { display: flex; align-items: center; justify-content: space-between; gap: var(--esp-4); min-height: 4rem; border-bottom: var(--filete-grueso) solid var(--linea); box-shadow: 0 3px 0 var(--papel), 0 4px 0 var(--linea); margin-bottom: var(--esp-3); }
  .menu-cerrar { display: inline-flex; align-items: center; gap: var(--esp-2); min-height: 44px; padding: var(--esp-2) var(--esp-4); background: var(--negro); color: #fff; border: 0; font: 700 .8rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
  .menu-cerrar .icono { width: 1.1rem; height: 1.1rem; }
  .navegacion .menu a { font: 800 clamp(1.6rem, 7vw, 2rem)/1.1 var(--didona); letter-spacing: -.01em; text-transform: none; padding: var(--esp-4) 0; }
  .buscador-cabecera input { font-size: 1rem; }
  .pieza-apertura .pieza-titulo { font-size: clamp(2.1rem, 9vw, 2.8rem); }
  .articulo-cabecera { padding-block: var(--esp-6) var(--esp-5); }
  .bloque { margin-top: var(--esp-7); }
  .temas-indice { columns: 1; }
  .x-contacto .boton { width: 100%; justify-content: center; }
  .articulo-texto p, .pieza-extracto { hyphens: auto; }
}
@media (prefers-reduced-motion: reduce) { .navegacion { transition: none !important; } }
.x-contacto .x-acepto label { font-size: var(--t-s); }
.listado-cuenta { font: 600 var(--t-s)/1.4 var(--sans); letter-spacing: 0; text-transform: none; }
.buscador-cabecera input { font-size: 1rem; }

/* ============================================================ ronda 4: cita y hemeroteca en imágenes */
.cita-banda { margin-top: var(--esp-8); padding-block: var(--esp-8); background: var(--rojo); color: #fff; }
.cita-banda blockquote { margin: 0 auto; max-width: 62rem; }
.cita-banda blockquote::before { content: "\00AB"; display: block; margin-bottom: var(--esp-2); font: 900 7rem/.55 var(--didona); color: rgba(255, 255, 255, .55); }
.cita-banda p { margin: 0; font: italic 800 clamp(2rem, 5vw, 4.2rem)/1.05 var(--didona); letter-spacing: -.02em; text-wrap: balance; font-variation-settings: "opsz" 72; }
.cita-banda footer { margin-top: var(--esp-6); padding-top: var(--esp-4); border-top: 1px solid rgba(255, 255, 255, .45); font: 600 var(--t-s)/1.5 var(--sans); }
.cita-banda footer a { color: #fff; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.cita-banda footer cite { font-style: italic; }
.cita-banda :focus-visible { outline-color: #fff; }

.mosaico-fotos .mosaico { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 12rem; gap: var(--esp-2); }
.mosaico-fotos .mosaico-grande { grid-column: span 2; grid-row: span 2; }
.mosaico-fotos .mosaico li { position: relative; }
.mosaico-fotos .foto-tinta { display: block; height: 100%; text-decoration: none; color: #fff; }
.mosaico-fotos .foto-tinta img { height: 100%; }
.mosaico-fotos .foto-tinta::before { content: ""; position: absolute; inset: 45% 0 0 0; z-index: 1; background: linear-gradient(transparent, rgba(0, 0, 0, .82)); pointer-events: none; }
.mosaico-pie { position: absolute; z-index: 2; left: var(--esp-3); right: var(--esp-3); bottom: var(--esp-3); display: flex; flex-direction: column; gap: var(--esp-1); }
.mosaico-pie time { font: 700 .72rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rojo-claro); }
.mosaico-pie strong { font: 700 1.05rem/1.2 var(--didona); font-variation-settings: "opsz" 14; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mosaico-grande .mosaico-pie strong { font-size: clamp(1.4rem, 2.4vw, 2rem); line-height: 1.1; }
@media (max-width: 44rem) {
  .cita-banda { margin-top: var(--esp-7); padding-block: var(--esp-7); }
  .cita-banda blockquote::before { font-size: 5rem; }
  .mosaico-fotos .mosaico { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 10rem; }
  .mosaico-pie strong { font-size: .95rem; }
}
