/*
 * Patxi Baztarrika — tema «Cuaderno»
 * Lectura larga, sobria: papel cálido, tinta, un azul de mar profundo y ocre para las cifras.
 * Literata (lectura y titulares, con tamaño óptico) + Public Sans (rótulos y metadatos). Modo oscuro automático.
 */

:root {
  --papel: #fbf9f4;
  --papel-2: #f3efe6;
  --tinta: #1d1c1a;
  --texto: #2b2a27;
  --tenue: #66625b;
  --acento: #1f5a63;
  --acento-suave: #e1ebea;
  --ocre: #8a5d17;
  --borde: #e2ddd2;

  --ancho-texto: 38rem;
  --ancho-amplio: 72rem;
  --hueco: clamp(1rem, 2.6vw, 1.75rem);
  --radio: 2px;
  --color-texto: var(--texto);
  --color-fondo: var(--papel);
  --color-suave: var(--papel-2);
  --color-borde: var(--borde);
  --color-acento: var(--acento);
  --color-acento-texto: #fff;
  --color-tenue: var(--tenue);
  --fuente-texto: "Literata", Georgia, "Times New Roman", serif;
  --fuente-titulos: "Literata", Georgia, serif;
  --fuente-ui: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --papel: #161514;
    --papel-2: #1e1d1b;
    --tinta: #f1ede6;
    --texto: #dcd7cf;
    --tenue: #a59f95;
    --acento: #86c0c7;
    --acento-suave: #213033;
    --ocre: #dcaa5e;
    --borde: #33302c;
    --color-acento-texto: #10191a;
  }
}

/* ------------------------------------------------------------ base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--papel); color: var(--texto); font-family: var(--fuente-texto); font-size: 1.0625rem; line-height: 1.6; font-optical-sizing: auto; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
a { color: var(--acento); text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--acento); outline-offset: 3px; border-radius: 2px; }
main:focus { outline: none; }
h1, h2, h3, h4 { color: var(--tinta); text-wrap: balance; }
p { text-wrap: pretty; }
.x-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.envoltorio { width: min(100% - 2rem, var(--ancho-amplio)); margin-inline: auto; }
.envoltorio-texto { width: min(100% - 2rem, var(--ancho-texto)); margin-inline: auto; }
.envoltorio-medio { width: min(100% - 2rem, 48rem); margin-inline: auto; }
@media (min-width: 40rem) {
  .envoltorio { width: min(100% - 4rem, var(--ancho-amplio)); }
  .envoltorio-texto { width: min(100% - 4rem, var(--ancho-texto)); }
  .envoltorio-medio { width: min(100% - 4rem, 48rem); }
}
.saltar { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--tinta); color: var(--papel); padding: .6rem 1rem; font-family: var(--fuente-ui); text-decoration: none; }
.saltar:focus { top: .5rem; color: var(--papel); }
.icono { width: 1.1em; height: 1.1em; flex: none; vertical-align: -.18em; }

/* rótulos y metadatos (Public Sans) */
.rotulo { margin: 0 0 1rem; font-family: var(--fuente-ui); font-weight: 600; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tenue); }
.rotulo a { color: inherit; }
.rotulo-linea { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.rotulo-linea::after { content: ""; flex: 1; height: 1px; background: var(--borde); }
.rotulo-n { font-variant-numeric: tabular-nums; color: var(--ocre); }
.escrito-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; margin: 0; font-family: var(--fuente-ui); font-size: .8rem; color: var(--tenue); font-variant-numeric: tabular-nums; }
.idioma { display: inline-block; padding: .05em .45em; border: 1px solid var(--acento); border-radius: 2px; color: var(--acento); font-weight: 600; font-size: .68rem; letter-spacing: .08em; }
.escrito-minutos::before { content: "·"; margin-right: .9rem; color: var(--borde); }
.enlace-flecha { display: inline-flex; align-items: center; gap: .45em; min-height: 2.75rem; font-family: var(--fuente-ui); font-weight: 600; font-size: .9rem; text-decoration: none; }
.enlace-flecha:hover { text-decoration: underline; }
.enlace-flecha .icono { transition: transform .15s ease; }
.enlace-flecha:hover .icono { transform: translateX(3px); }

/* titulares escritos en mayúsculas: versalitas */
.titulo-mayus { font-variant-caps: all-small-caps; letter-spacing: .035em; font-size: 1.24em; }
.titulo-mayus.titulo-largo { font-size: 1.05em; }

/* ------------------------------------------------------------ cabecera */
.cabecera { border-bottom: 1px solid var(--borde); }
.cabecera-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 2rem; padding-block: 1.4rem; }
.marca { display: flex; flex-direction: column; gap: .2rem; color: var(--tinta); text-decoration: none; }
.marca:hover { color: var(--tinta); }
.marca-nombre { font-weight: 600; font-size: 1.55rem; line-height: 1.1; letter-spacing: -.01em; }
.marca-lema { font-family: var(--fuente-ui); font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--tenue); }
.navegacion { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; }
.menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1.4rem; }
.menu a { display: flex; align-items: center; min-height: 2.75rem; font-family: var(--fuente-ui); font-size: .92rem; color: var(--texto); text-decoration: none; border-bottom: 2px solid transparent; }
.menu a:hover { color: var(--acento); }
.menu a[aria-current] { color: var(--tinta); border-bottom-color: var(--acento); }
.menu-sub { display: none; }
.buscador-cabecera { display: flex; align-items: center; border-bottom: 1px solid var(--borde); }
.buscador-cabecera input { width: 9.5rem; min-height: 2.6rem; border: 0; background: transparent; color: var(--texto); font: .9rem var(--fuente-ui); padding: 0 .25rem; }
.buscador-cabecera input::placeholder { color: var(--tenue); }
.buscador-cabecera input:focus { outline: none; }
.buscador-cabecera:focus-within { border-bottom-color: var(--acento); }
.buscador-cabecera button { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border: 0; background: none; color: var(--texto); cursor: pointer; }
.boton-menu { display: none; align-items: center; justify-content: center; width: 2.9rem; height: 2.9rem; border: 1px solid var(--borde); border-radius: 2px; background: none; color: var(--tinta); cursor: pointer; }
.boton-menu .icono-cerrar, .boton-menu[aria-expanded="true"] .icono-menu { display: none; }
.boton-menu[aria-expanded="true"] .icono-cerrar { display: block; }
@media (max-width: 52rem) {
  .boton-menu { display: inline-flex; }
  .navegacion { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-bottom: .5rem; }
  .navegacion.abierto { display: flex; }
  .menu { flex-direction: column; gap: 0; }
  .menu a { min-height: 3rem; border-bottom: 1px solid var(--borde); font-size: 1rem; }
  .menu a[aria-current] { border-bottom-color: var(--acento); }
  .buscador-cabecera { margin-top: .75rem; }
  .buscador-cabecera input { width: 100%; flex: 1; }
}

/* ------------------------------------------------------------ portada */
.banda-apertura { background: var(--papel-2); border-bottom: 1px solid var(--borde); }
.apertura { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem 5.5rem; padding-block: clamp(3.5rem, 8vw, 6.5rem) clamp(3rem, 6vw, 5rem); }
@media (min-width: 60rem) { .apertura { grid-template-columns: minmax(0, 1fr) 17rem; } }
.apertura-escrito .rotulo-linea { margin-bottom: 1.1rem; }
.apertura-escrito .escrito-meta { margin-bottom: 1.75rem; }
.apertura-titulo { margin: 0 0 2rem; max-width: 19ch; font-weight: 600; font-size: clamp(2.5rem, 5.8vw, 4.9rem); line-height: 1.03; letter-spacing: -.025em; overflow-wrap: break-word; }
.apertura-titulo.titulo-mayus { max-width: 22ch; font-size: clamp(2.9rem, 6.6vw, 5.8rem); letter-spacing: .015em; line-height: .96; }
.apertura-titulo a { color: var(--tinta); text-decoration: none; background-image: linear-gradient(var(--acento), var(--acento)); background-size: 0 2px; background-position: 0 92%; background-repeat: no-repeat; transition: background-size .3s ease, color .2s ease; }
.apertura-titulo a:hover, .apertura-titulo a:focus-visible { color: var(--acento); background-size: 100% 2px; }
.apertura-entradilla { margin: 0 0 1.75rem; max-width: 36rem; font-size: clamp(1.12rem, 1.7vw, 1.32rem); line-height: 1.68; color: var(--texto); }
.apertura-entradilla::first-letter { float: left; margin: .06em .1em 0 0; font-size: 3.4em; line-height: .84; font-weight: 600; color: var(--acento); }
.apertura-leer { margin: 0; }
.enlace-leer { padding-bottom: .15rem; border-bottom: 1px solid currentColor; min-height: 2.75rem; font-size: .95rem; letter-spacing: .02em; }
.enlace-leer:hover { text-decoration: none; border-bottom-width: 2px; }
.autor { align-self: start; padding-top: .25rem; }
@media (min-width: 60rem) { .autor { padding-left: 2rem; border-left: 1px solid var(--borde); } }
.autor-retrato { margin: 0 0 1rem; }
.autor-retrato img { display: block; width: 100%; max-width: 18rem; height: auto; border-radius: 2px; filter: saturate(.85); }
.autor-nombre { margin: 0 0 .6rem; font-size: 1.25rem; font-weight: 600; }
.autor-bio { margin: 0 0 .75rem; font-size: .93rem; line-height: 1.6; color: var(--texto); }
.autor-bio-es { color: var(--tenue); font-style: italic; }

.recientes, .mismo-anio { padding-top: clamp(2.5rem, 5vw, 3.5rem); }
.lista-escritos { list-style: none; margin: 0; padding: 0; }
.lista-escritos-columnas { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 3.5rem; }
@media (min-width: 52rem) { .lista-escritos-columnas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.escrito { border-top: 1px solid var(--borde); }
.escrito article { position: relative; display: flex; flex-direction: column; gap: .45rem; padding-block: 1.3rem 1.4rem; }
.escrito-titulo { margin: 0; font-weight: 600; font-size: 1.3rem; line-height: 1.28; letter-spacing: -.005em; }
.escrito-titulo.titulo-mayus { font-size: 1.6rem; letter-spacing: .03em; }
.escrito-titulo, .escrito-h1, .cabecera-lista-titulo, .vecino-titulo { overflow-wrap: break-word; }
@media (max-width: 40rem) {
  .escrito-titulo.titulo-mayus { font-size: 1.42rem; letter-spacing: .02em; }
  .titulo-mayus { letter-spacing: .02em; }
  .apertura-entradilla::first-letter { font-size: 3em; }
}
.escrito-titulo a { color: var(--tinta); text-decoration: none; }
.escrito-titulo a::after { content: ""; position: absolute; inset: 0; }
.escrito:hover .escrito-titulo a { color: var(--acento); }
.escrito-resumen { margin: 0; color: var(--tenue); font-size: .98rem; line-height: 1.6; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }

/* urteka: índice por años con barras */
.urteka { padding-block: clamp(3rem, 6vw, 4.5rem) 0; }
.urteka-cabecera { margin-bottom: 1rem; }
.urteka-cabecera .rotulo { margin-bottom: .6rem; }
.urteka-texto { margin: 0 0 1.5rem; color: var(--tenue); font-style: italic; }
.urteka-lista { list-style: none; margin: 0; padding: 0; columns: 2 20rem; column-gap: 4rem; }
.urteka-lista li { break-inside: avoid; }
.urteka-lista a { display: grid; grid-template-columns: 4rem minmax(0, 1fr) 2.5rem; align-items: center; gap: 1rem; min-height: 2.9rem; border-bottom: 1px solid var(--borde); color: var(--texto); text-decoration: none; }
.urteka-anio { font-weight: 500; font-size: 1.3rem; color: var(--ocre); font-variant-numeric: lining-nums tabular-nums; }
.urteka-barra { height: .45rem; background: var(--acento-suave); border-radius: 1px; overflow: hidden; }
.urteka-barra span { display: block; height: 100%; background: var(--acento); transition: opacity .15s; opacity: .8; }
.urteka-n { font-family: var(--fuente-ui); font-size: .85rem; text-align: right; color: var(--tenue); font-variant-numeric: tabular-nums; }
.urteka-lista a:hover .urteka-barra span { opacity: 1; }
.urteka-lista a:hover .urteka-anio { color: var(--acento); }
.urteka-pie { margin: 1.5rem 0 0; }

/* tira de años */
.tira-anios { margin-block: 1.5rem 0; overflow-x: auto; scrollbar-width: thin; }
.tira-anios ul { list-style: none; margin: 0; padding: 0 0 .5rem; display: flex; gap: .35rem; }
.tira-anios a { display: inline-flex; align-items: baseline; gap: .3rem; min-height: 2.75rem; padding: .55rem .7rem; border: 1px solid var(--borde); border-radius: 2px; color: var(--texto); text-decoration: none; font-family: var(--fuente-ui); font-size: .88rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tira-n { font-size: .7rem; color: var(--tenue); }
.tira-anios a:hover { border-color: var(--acento); color: var(--acento); }
.tira-anios a[aria-current] { background: var(--tinta); border-color: var(--tinta); color: var(--papel); }
.tira-anios a[aria-current] .tira-n { color: var(--papel); opacity: .7; }

/* ------------------------------------------------------------ listados */
.cabecera-lista { padding-top: clamp(2.75rem, 6vw, 4rem); }
.cabecera-lista-titulo { margin: 0; font-weight: 600; font-size: clamp(2.4rem, 6vw, 4rem); line-height: 1.05; letter-spacing: -.02em; }
.cabecera-anio { font-weight: 300; font-size: clamp(4.5rem, 14vw, 8.5rem); line-height: .95; letter-spacing: -.04em; color: var(--ocre); font-variant-numeric: lining-nums; }
.cabecera-lista-texto { margin: .9rem 0 0; max-width: 38rem; font-size: 1.1rem; color: var(--tenue); font-style: italic; }
.cabecera-lista-cuenta { margin: 1rem 0 0; font-family: var(--fuente-ui); font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tenue); }
.buscador-grande { margin-top: 1.5rem; }
.x-buscador { max-width: 36rem; }
.x-buscador input { min-height: 3rem; font: 1.05rem var(--fuente-texto); border: 1px solid var(--tenue); border-radius: 2px; background: var(--papel); color: var(--texto); }
.x-buscador button { min-height: 3rem; border-radius: 2px; font-family: var(--fuente-ui); font-weight: 600; padding-inline: 1.3em; }
.listado { padding-top: 2rem; }
.vacio { margin: 0 0 1rem; padding: 1.25rem 1.5rem; background: var(--papel-2); border-left: 2px solid var(--acento); }

.indice { padding-top: 1.5rem; }
.indice-anio { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 3rem; padding-block: 1.5rem; border-top: 1px solid var(--tinta); scroll-margin-top: 1rem; }
@media (min-width: 52rem) { .indice-anio { grid-template-columns: 10rem minmax(0, 1fr); } }
.indice-anio-titulo { margin: 0 0 .5rem; font-weight: 300; font-size: clamp(2.6rem, 6vw, 3.6rem); line-height: 1; letter-spacing: -.03em; font-variant-numeric: lining-nums; }
@media (min-width: 52rem) { .indice-anio-titulo { position: sticky; top: 1rem; align-self: start; } }
.indice-anio-titulo a { color: var(--ocre); text-decoration: none; }
.indice-anio-titulo a:hover { color: var(--acento); }
.indice-anio-titulo span { display: block; margin-top: .4rem; font-family: var(--fuente-ui); font-weight: 500; font-size: .8rem; letter-spacing: .1em; color: var(--tenue); }
.lista-indice .escrito:first-child { border-top: 0; }
.lista-indice .escrito article { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: .25rem 1.25rem; padding-block: .75rem; }
.lista-indice .escrito-meta { width: 9.5rem; flex: none; }
.lista-indice .escrito-minutos { display: none; }
.lista-indice .escrito-titulo { flex: 1 1 22rem; font-size: 1.12rem; font-weight: 500; }
.lista-indice .escrito-titulo.titulo-mayus { font-size: 1.4rem; }

.anio-mes { padding-top: 2.25rem; }
.anio-mes .rotulo a { text-decoration: none; }
.anio-mes .lista-escritos .escrito:first-child { border-top: 0; }
.anio-mes .escrito article { padding-top: .8rem; }

/* ------------------------------------------------------------ escrito */
.escrito-cabecera { padding-top: clamp(3rem, 7vw, 5rem); }
.escrito-cabecera .escrito-meta { margin-bottom: 1.5rem; }
.escrito-anio { font-weight: 600; color: var(--ocre); text-decoration: none; min-height: 2.75rem; display: inline-flex; align-items: center; }
.escrito-anio:hover { text-decoration: underline; }
.escrito-h1 { margin: 0; font-weight: 600; font-size: clamp(2.1rem, 5vw, 3.3rem); line-height: 1.1; letter-spacing: -.018em; }
.escrito-h1.titulo-mayus { letter-spacing: .025em; }
.escrito-h1::after { content: ""; display: block; width: 3rem; height: 2px; margin-top: 1.75rem; background: var(--acento); }
.escrito-imagen { margin: 2.5rem auto 0; width: min(100% - 2rem, 44rem); }
.escrito-imagen img { display: block; margin-inline: auto; border-radius: 2px; }
.escrito-cuerpo { width: min(100% - 2rem, var(--ancho-amplio)); margin: 2.5rem auto 0; font-size: 1.1875rem; line-height: 1.75; hyphens: auto; -webkit-hyphens: auto; }
.con-capitular > p:first-child::first-letter { float: left; margin: .08em .12em 0 0; font-size: 3.55em; line-height: .82; font-weight: 600; color: var(--acento); }
.escrito-pie { margin-top: 3rem; }
.temas { list-style: none; margin: 0 0 2rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1rem; font-family: var(--fuente-ui); font-size: .88rem; }
.temas a { display: inline-flex; align-items: center; min-height: 2.75rem; text-decoration: none; }
.firma { padding-top: 1.5rem; border-top: 1px solid var(--borde); }
.firma-nombre { margin: 0 0 .4rem; font-weight: 600; font-variant-caps: all-small-caps; letter-spacing: .06em; font-size: 1.2rem; color: var(--tinta); }
.firma-bio { margin: 0 0 .5rem; font-size: .92rem; line-height: 1.6; color: var(--tenue); }

/* contenido importado, afinado para lectura */
.contenido p, .contenido ul, .contenido ol, .contenido blockquote, .contenido figure, .contenido dl { margin-block: 0 1.2em; }
.contenido h2, .contenido h3, .contenido h4 { font-weight: 600; letter-spacing: -.01em; }
.contenido h2 { font-size: 1.5rem; }
.contenido h3 { font-size: 1.28rem; }
.contenido h5, .contenido h6 { font-family: var(--fuente-texto); font-weight: 650; font-size: 1.08rem; line-height: 1.45; letter-spacing: 0; color: var(--tinta); margin-top: 2em; }
.contenido strong { font-weight: 650; color: var(--tinta); }
.contenido blockquote { border-left: 2px solid var(--acento); padding: .1em 0 .1em 1.4em; font-style: italic; color: var(--texto); }
.contenido blockquote p:last-child { margin-bottom: 0; }
.contenido address { font-style: italic; text-align: right; color: var(--tenue); }
.contenido figcaption { font-family: var(--fuente-ui); font-size: .8rem; line-height: 1.5; color: var(--tenue); }
.contenido figure.imagen img { border-radius: 2px; }
.contenido dl.imagen { text-align: center; }
.contenido dl.imagen dt img { display: block; margin-inline: auto; border-radius: 2px; }
.contenido dl.imagen dd { margin: .5em 0 0; font-family: var(--fuente-ui); font-size: .8rem; color: var(--tenue); }
.contenido ul li::marker { color: var(--acento); }
.contenido ol li::marker { color: var(--acento); font-variant-numeric: tabular-nums; }
.contenido li { margin-bottom: .35em; }
.contenido hr, .contenido .separador { width: 4rem; margin-inline: auto; border-top-color: var(--tenue); }
.contenido .centrado { text-align: center; }

/* comentarios */
.comentarios { margin-top: 3.5rem; }
.comentarios-lista { list-style: none; margin: 0; padding: 0; }
.comentarios-lista .comentarios-lista { margin-left: 1.5rem; }
.comentario article { padding: 1.1rem 0 1.1rem 1.25rem; border-left: 2px solid var(--borde); margin-bottom: 1.25rem; }
.comentario-cabecera { display: flex; flex-wrap: wrap; gap: .2rem 1rem; align-items: baseline; margin-bottom: .4rem; }
.comentario-cabecera strong { font-weight: 600; color: var(--tinta); }
.comentario-cabecera time { font-family: var(--fuente-ui); font-size: .78rem; color: var(--tenue); }
.comentario-texto { font-size: .98rem; line-height: 1.65; overflow-wrap: anywhere; }
.comentario-texto p { margin: 0 0 .7em; }

/* vecinos */
.vecinos { display: grid; gap: 1rem; margin-top: 3.5rem; }
@media (min-width: 40rem) { .vecinos { grid-template-columns: 1fr 1fr; } }
.vecino { display: flex; flex-direction: column; gap: .4rem; padding: 1.1rem 0; border-top: 1px solid var(--tinta); color: var(--tinta); text-decoration: none; }
.vecino:hover .vecino-titulo { color: var(--acento); }
.vecino-sig { grid-column: -2; text-align: right; align-items: flex-end; }
.vecino-etiqueta { display: inline-flex; align-items: center; gap: .4em; font-family: var(--fuente-ui); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tenue); }
.vecino-titulo { font-weight: 600; line-height: 1.3; }
.vecino-titulo.titulo-mayus { font-size: 1.1em; }
.vecino-anio { font-weight: 300; font-size: 2rem; color: var(--ocre); }
.vecinos-anio { margin-top: 3rem; }

/* paginación */
.paginacion { margin-block: 2.5rem 0; font-family: var(--fuente-ui); }
.paginacion a, .paginacion span[aria-current] { min-width: 2.75rem; min-height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 2px; font-variant-numeric: tabular-nums; }
.paginacion a:hover { border-color: var(--acento); color: var(--acento); }

/* página y 404 */
.pagina-cuerpo .imagen, .pagina-cuerpo dl.imagen { margin-top: 0; }
.error { padding-top: clamp(3rem, 7vw, 5rem); }
.error-codigo { margin: 0 0 .5rem; font-weight: 300; font-size: clamp(4.5rem, 14vw, 8rem); line-height: 1; letter-spacing: -.04em; color: var(--ocre); }
.error-texto { margin-top: 1.25rem; color: var(--tenue); font-size: 1.1rem; }

/* ------------------------------------------------------------ pie */
.pie { margin-top: clamp(4rem, 8vw, 6rem); background: var(--papel-2); border-top: 1px solid var(--borde); font-family: var(--fuente-ui); font-size: .9rem; }
.pie a { color: var(--texto); text-decoration: none; }
.pie a:hover { color: var(--acento); text-decoration: underline; }
.pie-rejilla { display: grid; gap: 2rem 3rem; padding-block: 3rem 2rem; }
@media (min-width: 52rem) { .pie-rejilla { grid-template-columns: 1fr 1.4fr 1fr; } }
.pie-nombre { margin: 0; font-family: var(--fuente-texto); font-weight: 600; font-size: 1.35rem; color: var(--tinta); }
.pie-lema { margin: .3rem 0 0; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--tenue); }
.pie-anios { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .1rem .9rem; }
.pie-anios a { display: inline-flex; align-items: center; min-height: 2.5rem; font-variant-numeric: tabular-nums; }
.pie-lista { list-style: none; margin: 0; padding: 0; }
.pie-lista a { display: inline-flex; align-items: center; min-height: 2.5rem; }
.pie-base { padding-block: 1rem 1.5rem; border-top: 1px solid var(--borde); font-size: .8rem; color: var(--tenue); }
.pie-base p { margin: 0; }

/* ------------------------------------------------------------ movimiento e impresión */
@media (prefers-reduced-motion: reduce) { .enlace-flecha:hover .icono { transform: none; } }
@media print {
  .cabecera .navegacion, .boton-menu, .vecinos, .mismo-anio, .pie, .tira-anios, .saltar, .comentarios { display: none !important; }
  :root { --papel: #fff; --texto: #000; --tinta: #000; }
  body { font-size: 11pt; }
  .escrito-cuerpo { font-size: 11pt; }
  .contenido a::after { content: " (" attr(href) ")"; font-size: .8em; color: #555; overflow-wrap: anywhere; }
}
.anio > *, .listado > * { max-width: 48rem; }
.comentario-texto blockquote { margin: .6em 0; padding-left: 1rem; border-left: 2px solid var(--borde); font-style: italic; color: var(--tenue); }

/* ------------------------------------------------------------ afinado */
.titulo-mayus { line-height: 1.16; }
.escrito-meta, .tira-anios a, .urteka-n, .cabecera-lista-cuenta, .pie-anios a { font-variant-numeric: tabular-nums lining-nums; }
@media (max-width: 40rem) {
  .escrito-resumen, .autor-bio, .firma-bio, .comentario-texto, .vacio, .cabecera-lista-texto { font-size: 1rem; }
  .escrito-cuerpo { font-size: 1.125rem; line-height: 1.72; }
  .apertura { gap: 2.5rem; }
}
/* vídeo bajo demanda (motor: .x-video) */
.contenido .x-video { border-radius: 2px; background: var(--papel-2); color: var(--tinta); box-shadow: inset 0 0 0 1px var(--borde); }
.contenido .x-video::before { background: repeating-linear-gradient(0deg, transparent 0 23px, var(--borde) 23px 24px); opacity: .45; }
.contenido .x-video-icono { color: var(--acento); }
.contenido .x-video-icono path:last-child { fill: var(--papel); }
.contenido .x-video-texto { font-family: var(--fuente-ui); font-size: .9rem; text-shadow: none; color: var(--tinta); }
.contenido .x-video-texto small { color: var(--tenue); opacity: 1; }
.contenido .x-video:hover { box-shadow: inset 0 0 0 1px var(--acento); }
/* estados */
.tira-anios a:active, .enlace-flecha:active, .vecino:active { transform: translateY(1px); }
a.escrito-anio:focus-visible, .escrito-titulo a:focus-visible { outline-offset: 4px; }
.escrito-titulo a:focus-visible::after { outline: 2px solid var(--acento); outline-offset: 2px; }
@media print {
  .banda-apertura { background: none; }
  .apertura-entradilla::first-letter, .con-capitular > p:first-child::first-letter { color: #000; }
  .x-video { display: none; }
}
/* casilla de privacidad: el texto con enlace fluye como un párrafo (la etiqueta del motor es flex) */
.x-contacto .x-acepto label { display: block; position: relative; padding-left: 2em; line-height: 1.5; }
.x-contacto .x-acepto input { position: absolute; left: 0; top: .1em; margin: 0; width: 1.25rem; height: 1.25rem; }
/* figuras anidadas (columnas, grupos): sin el margen lateral de 40px del navegador; vídeos a medida de lectura */
.contenido figure { margin-inline: 0; }
.contenido > figure { margin-inline: auto; }
.contenido figure.video { max-width: 48rem; margin-inline: auto; }
.contenido .seccion:has(> .fila > .columna > figure.video:only-child) { max-width: 48rem; }
@media (max-width: 30rem) { .contenido .x-video-texto { bottom: .6rem; font-size: .8rem; } }


/* ------------------------------------------------------------ ronda 2 */
/* índice de apartados en escritos largos */
.indice-escrito { margin-top: 2.25rem; border-block: 1px solid var(--borde); font-family: var(--fuente-ui); }
.indice-escrito summary { display: flex; align-items: center; gap: .6rem; min-height: 3rem; cursor: pointer; font-size: .78rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tenue); list-style: none; }
.indice-escrito summary::-webkit-details-marker { display: none; }
.indice-escrito summary::after { content: "+"; margin-left: auto; font-size: 1.2rem; font-weight: 400; color: var(--acento); transition: transform .2s ease; }
.indice-escrito[open] summary::after { transform: rotate(45deg); }
.indice-escrito ol { margin: 0 0 1.25rem; padding-left: 1.4rem; font-family: var(--fuente-texto); font-size: 1rem; line-height: 1.45; }
.indice-escrito li { margin-bottom: .45rem; }
.indice-escrito li::marker { color: var(--acento); font-variant-numeric: tabular-nums; }
.indice-escrito li.nivel-3, .indice-escrito li.nivel-4, .indice-escrito li.nivel-5 { margin-left: 1rem; font-size: .95rem; }
.indice-escrito a { color: var(--texto); text-decoration: none; }
.indice-escrito a:hover { color: var(--acento); text-decoration: underline; }
.escrito-cuerpo :is(h2, h3, h4, h5)[id] { scroll-margin-top: 1.5rem; }
/* barra de progreso de lectura (solo CSS, en los navegadores que la admiten) */
@supports (animation-timeline: scroll()) {
  .vista-entrada::before { content: ""; position: fixed; z-index: 60; inset: 0 0 auto 0; height: 3px; background: var(--acento); transform: scaleX(0); transform-origin: 0 50%; animation: pb-progreso linear both; animation-timeline: scroll(root); pointer-events: none; }
  @keyframes pb-progreso { to { transform: scaleX(1); } }
}
@media (prefers-reduced-motion: reduce) { .vista-entrada::before { display: none; } }
/* filtro por idioma en los índices (botones de opción + :has, sin JavaScript) */
.filtro-idioma { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1.25rem; margin: 1rem 0 0; padding: 0; border: 0; font-family: var(--fuente-ui); font-size: .9rem; }
.filtro-idioma legend { float: left; margin-right: .5rem; padding: 0; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tenue); }
.filtro-idioma label { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.75rem; cursor: pointer; }
.filtro-idioma input { width: 1.05rem; height: 1.05rem; margin: 0; accent-color: var(--acento); }
body:has(#idioma-eu:checked) .escrito:not([data-eu]),
body:has(#idioma-es:checked) .escrito:not([data-es]) { display: none; }
body:has(#idioma-eu:checked) :is(.indice-anio, .anio-mes):not(:has(.escrito[data-eu])),
body:has(#idioma-es:checked) :is(.indice-anio, .anio-mes):not(:has(.escrito[data-es])) { display: none; }
@media print { .indice-escrito, .filtro-idioma, .vista-entrada::before { display: none !important; } }

/* tablas anchas: se desplazan dentro de su marco, nunca columnas de una letra */
.contenido figure.tabla { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.contenido figure.tabla table { min-width: 34rem; }
.contenido figure.tabla td, .contenido figure.tabla th { min-width: 6ch; }

/* =====================================================================================================
   RONDA 3 · sistema visual y móvil
   ===================================================================================================== */
:root {
  --e-1: .25rem; --e-2: .5rem; --e-3: .75rem; --e-4: 1rem; --e-5: 1.5rem; --e-6: 2rem; --e-7: 3rem; --e-8: 4rem; --e-9: 5rem;
  --seccion: clamp(var(--e-7), 6vw, var(--e-9));
  --gutter: 1.25rem;
  --alto-cabecera: 4rem;
}
@media (min-width: 40rem) { :root { --gutter: 2rem; } }
::selection { background: var(--acento); color: var(--papel); }
html { scrollbar-color: var(--acento) var(--papel-2); accent-color: var(--acento); }
a { transition: color 180ms ease, text-decoration-color 180ms ease; }
.envoltorio { width: min(100% - 2 * var(--gutter), var(--ancho-amplio)); }
.envoltorio-texto { width: min(100% - 2 * var(--gutter), var(--ancho-texto)); }
.envoltorio-medio { width: min(100% - 2 * var(--gutter), 48rem); }
.escrito-cuerpo { width: min(100% - 2 * var(--gutter), var(--ancho-amplio)); }
.escrito-imagen { width: min(100% - 2 * var(--gutter), 44rem); }

/* ritmo vertical común */
.recientes, .mismo-anio, .urteka { padding-top: var(--seccion); }
.escrito-cabecera, .cabecera-lista, .error { padding-top: var(--seccion); }
.pie { margin-top: var(--seccion); }

/* rótulos: 13 px es el mínimo; en móvil, 15 px (también los de dos idiomas, que son largos) */
.rotulo { font-size: .8125rem; letter-spacing: .12em; }
@media (max-width: 40rem) {
  .rotulo { font-size: .9375rem; letter-spacing: .06em; text-transform: none; font-weight: 600; color: var(--tinta); }
  .enlace-flecha { font-size: .9375rem; }
  .escrito-titulo.titulo-mayus { font-size: 1.32rem; }
  .x-buscador { flex-direction: column; }
  .x-buscador button { width: 100%; justify-content: center; }
}
.urteka-pie .enlace-flecha { font-size: .9375rem; }
.x-buscador input, .buscador-cabecera input { font-size: 1rem; }
.escrito-titulo a { display: block; padding-block: .15rem; min-height: 1.75rem; }

/* ---------------------------------------------------------------- cabecera y menú en móvil */
@media (max-width: 52rem) {
  .cabecera { position: sticky; top: 0; z-index: 40; background: var(--papel); }
  .cabecera-fila { min-height: var(--alto-cabecera); padding-block: .5rem; }
  .marca-nombre { font-size: 1.3rem; }
  .marca-lema { font-size: .68rem; }
  .boton-menu { width: 2.75rem; height: 2.75rem; }
  .navegacion, .navegacion.abierto { display: flex; }
  .navegacion {
    position: fixed; inset: var(--alto-cabecera) 0 0 0; z-index: 39; overflow-y: auto; overscroll-behavior: contain;
    background: var(--papel); border-top: 1px solid var(--borde); padding: var(--e-5) var(--gutter) calc(var(--e-7) + env(safe-area-inset-bottom));
    visibility: hidden; opacity: 0; transition: opacity 200ms ease, visibility 0s linear 200ms;
  }
  .navegacion.abierto { visibility: visible; opacity: 1; transition: opacity 200ms ease, visibility 0s; }
  html.menu-abierto { overflow: hidden; }
  .menu a { min-height: 3.5rem; font-family: var(--fuente-texto); font-size: 1.5rem; font-weight: 500; }
  .buscador-cabecera { margin-top: var(--e-6); }
  .buscador-cabecera input { min-height: 3rem; font-size: 1.0625rem; }
}
/* rótulos de sección en cursiva de lectura: más editorial y legibles a cualquier tamaño (antes, versalitas de 12 px) */
.rotulo, .rotulo-linea { font-family: var(--fuente-texto); font-style: italic; font-weight: 400; font-size: 1rem; letter-spacing: 0; text-transform: none; color: var(--tenue); }
.rotulo-n { font-style: normal; font-family: var(--fuente-ui); font-size: .85em; }
.indice-escrito summary { font-family: var(--fuente-texto); font-style: italic; font-size: 1rem; letter-spacing: 0; text-transform: none; font-weight: 400; }
.filtro-idioma legend { font-family: var(--fuente-texto); font-style: italic; font-size: .95rem; letter-spacing: 0; text-transform: none; font-weight: 400; }
@media (max-width: 40rem) { .rotulo { font-size: 1rem; color: var(--tenue); } }
/* índice: los títulos nunca empujan el ancho de la página */
.lista-indice .escrito-titulo { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 30rem) {
  .lista-indice .escrito article { flex-direction: column; gap: .2rem; }
  .lista-indice .escrito-meta { width: auto; }
  .lista-indice .escrito-titulo.titulo-mayus { font-size: 1.2rem; }
}
.mismo-anio .rotulo a { display: inline-flex; align-items: center; min-height: 2.75rem; padding-inline: .5rem; font-style: normal; font-family: var(--fuente-ui); color: var(--acento); }

/* =====================================================================================================
   RONDA 4 · portada con retrato, imágenes y bloques
   ===================================================================================================== */
/* presentación */
.presenta { background: var(--papel-2); border-bottom: 1px solid var(--borde); overflow: hidden; }
.presenta-rejilla { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-7) var(--e-9); align-items: end; padding-top: var(--seccion); }
@media (min-width: 52rem) { .presenta-rejilla { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }
.presenta-texto { padding-bottom: var(--seccion); }
.presenta-nombre { margin: 0 0 var(--e-5); font-weight: 300; font-size: clamp(3.2rem, 9vw, 7.25rem); line-height: .92; letter-spacing: -.035em; color: var(--tinta); }
.presenta-lema { margin: 0 0 var(--e-6); max-width: 34rem; font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.5; color: var(--texto); font-style: italic; }
.ficha { margin: 0 0 var(--e-6); max-width: 36rem; border-top: 1px solid var(--tinta); }
.ficha-fila { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: var(--e-1) var(--e-5); padding-block: var(--e-3); border-bottom: 1px solid var(--borde); }
.ficha dt { font-family: var(--fuente-ui); font-size: .9375rem; font-weight: 600; color: var(--ocre); font-variant-numeric: tabular-nums lining-nums; }
.ficha dd { margin: 0; font-size: 1rem; line-height: 1.45; }
.ficha-cifra dd { font-family: var(--fuente-ui); font-weight: 600; }
@media (max-width: 30rem) { .ficha-fila { grid-template-columns: minmax(0, 1fr); } }
.presenta-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-3) var(--e-6); margin: 0; }
.boton-sobrio { display: inline-flex; align-items: center; gap: .6em; min-height: 3rem; padding: 0 1.3rem; background: var(--tinta); color: var(--papel); border-radius: 2px; font-family: var(--fuente-ui); font-weight: 600; font-size: .95rem; text-decoration: none; transition: background-color 180ms ease; }
.boton-sobrio:hover { background: var(--acento); color: var(--papel); }
.boton-sobrio .icono { transition: transform 180ms ease; }
.boton-sobrio:hover .icono { transform: translateX(3px); }
.presenta-retrato { position: relative; margin: 0; align-self: end; justify-self: center; width: min(100%, 26rem); }
.presenta-retrato::before { content: ""; position: absolute; inset: 12% -18% 0 18%; background: var(--acento); opacity: .12; border-radius: 2px; }
.presenta-retrato img { position: relative; display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; object-position: 50% 20%; filter: saturate(.9) contrast(1.02); }
@media (max-width: 51.99rem) { .presenta-retrato { width: min(80%, 22rem); } .presenta-texto { padding-bottom: 0; } }

/* último escrito: tipográfico grande (sin imagen) o con imagen */
.destacado { padding-top: var(--seccion); }
.destacado .rotulo-linea { margin-bottom: var(--e-5); }
.destacado-rejilla { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-6) var(--e-8); align-items: start; }
@media (min-width: 52rem) { .destacado-con-imagen .destacado-rejilla { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.destacado-imagen { display: block; background: var(--papel-2); }
.destacado-imagen img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: top; }
.destacado:not(.destacado-con-imagen) .destacado-texto { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 var(--e-8); }
@media (min-width: 60rem) {
  .destacado:not(.destacado-con-imagen) .destacado-texto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .destacado:not(.destacado-con-imagen) .destacado-texto .escrito-meta { grid-column: 1 / -1; margin-bottom: var(--e-5); }
  .destacado:not(.destacado-con-imagen) .apertura-titulo { margin: 0; max-width: none; }
  .destacado:not(.destacado-con-imagen) .apertura-leer { grid-column: 2; }
}
.destacado .escrito-meta { margin-bottom: var(--e-4); }

/* rejilla de escritos con imagen */
.tarjetas { display: grid; gap: var(--e-7) var(--e-6); grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.tarjeta { position: relative; display: flex; flex-direction: column; gap: var(--e-2); }
.tarjeta-imagen { margin-bottom: var(--e-2); aspect-ratio: 4 / 3; overflow: hidden; background: var(--papel-2); border-radius: 2px; }
.tarjeta-imagen img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform 250ms ease; }
.tarjeta:hover .tarjeta-imagen img { transform: scale(1.03); }
.tarjeta-letra { display: grid; place-items: center; background: var(--acento-suave); }
.tarjeta-letra span { font-size: 6rem; font-weight: 300; line-height: 1; color: var(--acento); }
.tarjeta .escrito-titulo { font-size: 1.25rem; }
.tarjeta .escrito-titulo.titulo-mayus { font-size: 1.35rem; }
.tarjeta .escrito-titulo a::after { content: ""; position: absolute; inset: 0; }
.tarjeta:hover .escrito-titulo a { color: var(--acento); }
.tarjeta .escrito-resumen { -webkit-line-clamp: 3; }

/* citas */
.citas { margin-top: var(--seccion); background: var(--acento); color: #fff; padding-block: var(--seccion); }
.citas-rejilla { display: grid; gap: var(--e-7) var(--e-8); grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); }
.cita { margin: 0; }
.cita blockquote { margin: 0; padding: 0; border: 0; }
.cita blockquote p { margin: 0; font-size: clamp(1.5rem, 2.8vw, 2.2rem); line-height: 1.3; font-weight: 400; font-style: italic; text-wrap: balance; color: #fff; }
.cita blockquote p::before { content: "\201C"; display: block; height: .55em; margin-bottom: .1em; font-size: 2.6em; line-height: 1; font-style: normal; color: rgba(255, 255, 255, .45); }
.cita figcaption { margin-top: var(--e-4); font-family: var(--fuente-ui); font-size: .9375rem; }
.cita figcaption a { color: #fff; display: inline-flex; align-items: center; min-height: 2.75rem; }
.cita figcaption a::before { content: "\2014\00a0"; }
@media (prefers-color-scheme: dark) { .citas { background: #1b3235; } }

/* publicaciones */
.publicaciones { padding-top: var(--seccion); }
.seccion-cabecera { margin-bottom: var(--e-6); }
.seccion-cabecera .rotulo-linea { margin-bottom: var(--e-2); }
.seccion-texto { margin: 0; max-width: 40rem; color: var(--tenue); }
.estante { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-6) var(--e-5); grid-template-columns: repeat(auto-fill, minmax(min(100%, 9.5rem), 1fr)); }
@media (max-width: 30rem) { .estante { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.libro a { display: flex; flex-direction: column; gap: var(--e-2); color: var(--tinta); text-decoration: none; }
.libro-portada { display: block; overflow: hidden; border-radius: 2px; box-shadow: 0 1px 2px rgba(0, 0, 0, .12), 0 12px 24px -12px rgba(0, 0, 0, .35); transition: transform 200ms ease, box-shadow 200ms ease; }
.libro-portada img { display: block; width: 100%; height: auto; }
.libro a:hover .libro-portada { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 18px 30px -14px rgba(0, 0, 0, .45); }
.libro-titulo { margin-top: var(--e-2); font-weight: 600; font-size: 1rem; line-height: 1.3; }
.libro a:hover .libro-titulo { color: var(--acento); text-decoration: underline; text-underline-offset: .2em; }
.libro-detalle { font-family: var(--fuente-ui); font-size: .8125rem; line-height: 1.4; color: var(--tenue); }

/* los dos idiomas */
.idiomas-portada { padding-top: var(--seccion); }
.idiomas-columnas { display: grid; gap: var(--e-6) var(--e-8); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 52rem) { .idiomas-columnas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.idioma-titulo { margin: 0 0 var(--e-2); font-weight: 300; font-size: clamp(2rem, 3.6vw, 2.75rem); line-height: 1.1; color: var(--acento); }
.idioma-columna .escrito-titulo { font-size: 1.15rem; }

/* imágenes de actos */
.fotos { margin-top: var(--seccion); padding-block: var(--seccion); background: var(--tinta); color: var(--papel); }
.fotos .rotulo, .fotos .rotulo-linea { color: rgba(251, 249, 244, .75); }
.fotos .rotulo-linea::after { background: rgba(251, 249, 244, .2); }
.fotos-mosaico { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.foto-1 { grid-column: 1 / -1; }
@media (min-width: 52rem) {
  .fotos-mosaico { grid-template-columns: 2fr 1fr 1fr; }
  .foto-1 { grid-column: auto; grid-row: span 2; }
  .foto-4 { grid-column: 2 / span 2; }
}
.foto figure { position: relative; margin: 0; height: 100%; overflow: hidden; border-radius: 2px; }
.foto img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.foto-1 img { aspect-ratio: 3 / 2; }
@media (min-width: 52rem) { .foto-1 img { aspect-ratio: auto; min-height: 100%; } .foto-4 img { aspect-ratio: 21 / 9; } }
.foto figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: var(--e-6) var(--e-4) var(--e-3); background: linear-gradient(transparent, rgba(0, 0, 0, .72)); font-family: var(--fuente-ui); font-size: .875rem; color: #fff; }
@media (prefers-color-scheme: dark) { .fotos { background: #0d0c0b; } }

/* pie */
.pie-autor { display: flex; gap: var(--e-4); align-items: flex-start; }
.pie-retrato { flex: none; width: 4.5rem; height: 4.5rem; border-radius: 50%; overflow: hidden; background: var(--borde); }
.pie-retrato img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 30% 30%; }
.pie-bio { margin: var(--e-3) 0 0; max-width: 24rem; font-family: var(--fuente-texto); font-size: 1rem; line-height: 1.5; color: var(--texto); }
.pie-titulo { margin: 0 0 var(--e-2); font-family: var(--fuente-texto); font-style: italic; font-size: 1rem; color: var(--tenue); }
@media print { .presenta-retrato, .fotos, .citas, .estante { display: none !important; } .presenta { background: none; } }
.ficha-fila { grid-template-columns: 13.5rem minmax(0, 1fr); }
.ficha dt { white-space: nowrap; }
@media (max-width: 30rem) { .ficha-fila { grid-template-columns: minmax(0, 1fr); } .ficha dt { white-space: normal; } }
.presenta-retrato img { aspect-ratio: 2 / 3; object-position: 50% 0; }
.presenta-retrato { width: min(100%, 24rem); }
.presenta-retrato::before { inset: 18% -14% 0 22%; }
@media (max-width: 51.99rem) {
  .presenta-rejilla { gap: var(--e-6); padding-top: var(--e-6); }
  .presenta-retrato { order: -1; width: 100%; justify-self: stretch; }
  .presenta-retrato::before { display: none; }
  .presenta-retrato img { aspect-ratio: 4 / 3; object-position: 50% 32%; border-radius: 2px; }
  .presenta-texto { padding-bottom: var(--e-7); }
}
@media (max-width: 40rem) {
  .tarjetas { gap: 0; }
  .tarjeta { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); column-gap: var(--e-4); row-gap: var(--e-1); padding-block: var(--e-4); border-top: 1px solid var(--borde); }
  .tarjeta > .tarjeta-imagen { grid-row: 1 / span 3; aspect-ratio: 1; margin: 0; }
  .tarjeta-letra span { font-size: 3rem; }
  .tarjeta .escrito-resumen { display: none; }
  .tarjeta .escrito-titulo, .tarjeta .escrito-titulo.titulo-mayus { font-size: 1.12rem; }
}
.libro-detalle { font-size: .9375rem; line-height: 1.35; }
