/* SUBSUELO · v4 · negativo + constructivismo tipográfico (referencia: Jonathan Sirit) */

:root {
  --negro: #121211;
  --negro-2: #1b1b19;
  --hueso: #e3ded3;
  --hueso-2: #b7b2a8;
  --gris: #7f7b74;
  --linea: #3b3a36;
  --acento: #4a6fc4;   /* azul cobalto, único color */
  --ancho: 1440px;
  --f-bloque: "Big Shoulders Display", "Impact", sans-serif;
  --f-bodoni: "Bodoni Moda", "Didot", serif;
  --f-geo: "Jost", "Futura", sans-serif;
  --f-texto: "Source Serif 4", Georgia, serif;
}

* { box-sizing: border-box; }
html { background: var(--negro); }
body {
  margin: 0;
  background: var(--negro);
  color: var(--hueso);
  font-family: var(--f-texto);
  font-size: 18px;
  line-height: 1.6;
  position: relative;
  overflow-x: hidden;
  box-shadow: none;
}
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 50;
  opacity: .2; mix-blend-mode: screen;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.4 -.62'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--acento); }

.contenedor { max-width: var(--ancho); margin: 0 auto; padding: 0 32px; }
.desgaste { filter: url(#desgaste); }
.punto { display: inline-block; width: .42em; height: .42em; border-radius: 50%; background: var(--acento); vertical-align: middle; }

/* ---------- franja ---------- */
.franja { font-family: var(--f-geo); font-size: 12px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--gris); border-bottom: 1px solid var(--linea); }
.franja .contenedor { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-top: 12px; padding-bottom: 12px; }
.franja b { color: var(--hueso); font-weight: 500; }

/* ---------- cabezal ---------- */
.cabezal { padding-top: 34px; }
.cabezal svg { display: block; width: 100%; height: auto; }

.regla { height: 5px; background: var(--hueso); margin-top: 14px; }

/* barra superior del artículo: logo chico + menú */
.barra-sup { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 28px; align-items: center; border-bottom: 5px solid var(--hueso); padding-top: 16px; }
.barra-sup .nav { border-bottom: none; }
.logo-chico { font-family: var(--f-bloque); font-weight: 900; font-size: 44px; line-height: 1; letter-spacing: .01em; display: inline-flex; align-items: flex-end; gap: 4px; padding-bottom: 8px; }
.logo-chico .punto { width: 10px; height: 10px; margin-bottom: 7px; }
.logo-chico:hover { color: var(--hueso); }

/* ---------- navegación ---------- */
.nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; padding: 14px 0; border-bottom: 1px solid var(--linea); font-family: var(--f-geo); font-weight: 600; font-size: 14px; letter-spacing: .2em; text-transform: uppercase; }
.nav a { padding: 4px 12px; }
.nav a + a::before { content: "/"; color: var(--gris); margin-right: 24px; margin-left: -12px; font-weight: 400; }
.nav a.activo { color: var(--acento); }

/* ---------- etiquetas ---------- */
.vertical { writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .34em; text-transform: uppercase; color: var(--gris); white-space: nowrap; }
.seccion { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--hueso-2); display: inline-flex; gap: 10px; align-items: center; }
.firma { font-family: var(--f-geo); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.num { font-family: var(--f-bloque); font-weight: 900; line-height: .8; color: var(--hueso); }

/* ---------- destacado (composición tipográfica) ---------- */
.destacado { display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 0 32px; padding: 80px 0 90px; border-bottom: 1px solid var(--linea); position: relative; }
.destacado .lado { display: flex; flex-direction: column; align-items: center; gap: 22px; border-right: 1px solid var(--linea); padding-right: 22px; }
.destacado .lado .num { font-size: 72px; }

.comp { margin: 14px 0 24px; font-family: var(--f-bloque); font-weight: 900; text-transform: uppercase; font-size: clamp(56px, 11vw, 158px); line-height: .94; letter-spacing: -.005em; text-wrap: balance; }
.comp::after { content: ""; display: inline-block; width: .15em; height: .15em; border-radius: 50%; background: var(--acento); margin-left: .07em; }
.destacado .bajada { font-family: var(--f-bodoni); font-style: italic; font-size: 27px; line-height: 1.42; color: var(--hueso-2); max-width: 1160px; text-wrap: balance; margin: 0 0 18px; }
.leer { display: inline-flex; gap: 12px; align-items: center; margin-top: 18px; font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .24em; text-transform: uppercase; border-bottom: 3px solid var(--hueso); padding-bottom: 6px; }

/* columna de artículos secundarios junto al destacado */
.segundos { align-self: start; border-top: 5px solid var(--hueso); }
.segundos article { display: grid; grid-template-columns: 64px minmax(0, 1fr); column-gap: 18px; padding: 22px 0 24px; border-bottom: 1px solid var(--linea); }
.segundos article > * { grid-column: 2; }
.segundos .num { grid-column: 1; grid-row: 1 / span 4; font-size: 60px; color: transparent; -webkit-text-stroke: 1.5px var(--hueso-2); }
.segundos h3 { font-family: var(--f-bloque); font-weight: 900; font-size: 34px; line-height: .94; text-transform: uppercase; margin: 10px 0 10px; }
.segundos p { font-size: 16px; line-height: 1.5; color: var(--hueso-2); margin: 0 0 12px; }

/* ---------- tarjetas enmarcadas ---------- */
.bloque-tit { display: flex; align-items: baseline; gap: 18px; margin: 80px 0 28px; }
.bloque-tit h2 { font-family: var(--f-geo); font-weight: 600; font-size: 19px; letter-spacing: .34em; text-transform: uppercase; margin: 0; }
.bloque-tit::after { content: ""; flex: 1; height: 1px; background: var(--hueso); align-self: center; }

.tres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.marco { display: grid; grid-template-columns: 34px minmax(0, 1fr); border: 1px solid var(--hueso-2); min-height: 250px; }
.marco .vertical { border-right: 1px solid var(--hueso-2); display: flex; align-items: center; justify-content: center; padding: 14px 0; color: var(--hueso); }
.marco .dentro { padding: 24px 24px 22px; display: flex; flex-direction: column; }
.marco .num { font-size: 56px; color: transparent; -webkit-text-stroke: 1.5px var(--hueso-2); }
.marco h3 { font-family: var(--f-bloque); font-weight: 900; font-size: 36px; line-height: .92; text-transform: uppercase; margin: 16px 0 12px; }
.marco h3 em { font-family: var(--f-bodoni); font-weight: 400; font-style: italic; text-transform: none; color: var(--hueso-2); }
.marco p { font-size: 16px; color: var(--hueso-2); line-height: 1.5; margin: 0 0 16px; }
.marco .firma { margin-top: auto; }
.marco.claro { background: var(--hueso); color: var(--negro); }
.marco.claro .vertical { border-color: var(--negro); color: var(--negro); }
.marco.claro .num { -webkit-text-stroke-color: var(--negro); }
.marco.claro p, .marco.claro h3 em { color: #45423d; }
.marco.claro .firma { color: #5c5953; }

/* ---------- índice tipo cartel de gira ---------- */
.indice { width: 100%; border-collapse: collapse; margin-bottom: 90px; }
.indice tr { border-bottom: 1px solid var(--linea); }
.indice tr:first-child { border-top: 5px solid var(--hueso); }
.indice td { padding: 20px 14px 16px 0; vertical-align: baseline; }
.indice .n { font-family: var(--f-bloque); font-weight: 900; font-size: 48px; width: 90px; line-height: 1; }
.indice .s { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--gris); width: 150px; }
.indice .t { font-family: var(--f-bloque); font-weight: 800; font-size: 38px; text-transform: uppercase; line-height: 1; }
.indice .t a:hover { color: var(--acento); }
.indice .t em { font-family: var(--f-bodoni); font-weight: 400; font-style: italic; text-transform: none; color: var(--hueso-2); font-size: .85em; }
.indice .au { font-family: var(--f-geo); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--hueso-2); text-align: right; white-space: nowrap; }
.indice .mi { font-family: var(--f-geo); font-size: 13px; color: var(--gris); text-align: right; width: 64px; white-space: nowrap; }

/* ---------- pie ---------- */
.pie { border-top: 5px solid var(--hueso); padding: 36px 0 40px; }
.pie .contenedor { display: block; }
.pie svg { max-width: 380px; }
.pie svg { width: 100%; height: auto; display: block; }

/* ---------- artículo ---------- */
.art-cab { display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 0 32px; padding: 56px 0 34px; }
.art-cab .lado { display: flex; flex-direction: column; align-items: center; gap: 22px; border-right: 1px solid var(--linea); padding-right: 22px; }
.art-cab .lado .num { font-size: 80px; }
.art-cab .comp { font-size: clamp(60px, 9.6vw, 150px); }
.art-cab .bajada { font-family: var(--f-bodoni); font-style: italic; font-size: 27px; line-height: 1.42; color: var(--hueso-2); max-width: 1160px; text-wrap: balance; margin: 0; }

.meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 5px solid var(--hueso); border-bottom: 1px solid var(--hueso); }
.meta div { padding: 12px 16px; border-right: 1px solid var(--linea); font-family: var(--f-geo); font-weight: 500; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--hueso-2); }
.meta div:last-child { border-right: none; }
.meta small { display: block; font-size: 11px; letter-spacing: .26em; color: var(--gris); margin-bottom: 3px; }

.cuerpo { display: grid; grid-template-columns: 60px minmax(0, 1fr) minmax(0, 800px) 260px minmax(0, 1fr); column-gap: 32px; padding: 60px 0 30px; }
.cuerpo > * { grid-column: 3; }
.cuerpo p { font-size: 20.5px; line-height: 1.74; margin: 0 0 1.3em; color: #d9d4c9; }
.cuerpo > p:first-of-type::before { content: ""; display: block; width: 56px; height: 6px; background: var(--acento); margin-bottom: 22px; }
.cuerpo h2 { margin: 1.9em 0 .9em; padding-top: 14px; border-top: 5px solid var(--hueso); font-family: var(--f-bloque); font-weight: 900; text-transform: uppercase; font-size: 40px; line-height: .95; }

.nota { grid-column: 4; grid-row: span 3; align-self: start; font-family: var(--f-geo); font-size: 14.5px; line-height: 1.55; color: var(--hueso-2); border-top: 5px solid var(--hueso); padding-top: 12px; margin-top: 8px; }
.nota b { display: block; font-weight: 600; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--acento); margin-bottom: 6px; }

.cita { grid-column: 3 / 5; margin: 26px 0 50px; padding: 4px 0 4px 30px; border-left: 6px solid var(--acento); }
.cita blockquote { margin: 0; }
.cita blockquote p { margin: 0 !important; font-family: var(--f-bloque) !important; font-weight: 800; text-transform: uppercase; font-size: clamp(32px, 3.8vw, 50px) !important; line-height: 1 !important; color: var(--hueso) !important; max-width: 22ch; }
.cita figcaption { margin-top: 16px; font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--gris); }

.ficha { border-top: 5px solid var(--hueso); margin: 12px 0 46px; }
.ficha h4 { font-family: var(--f-bloque); font-weight: 900; text-transform: uppercase; font-size: 30px; line-height: 1; margin: 14px 0 10px; }
.ficha table { width: 100%; border-collapse: collapse; font-family: var(--f-geo); font-size: 14px; letter-spacing: .06em; }
.ficha td { padding: 9px 0; border-bottom: 1px solid var(--linea); color: var(--hueso-2); }
.ficha td:first-child { width: 160px; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--gris); }

.fin { font-family: var(--f-bodoni); font-style: italic; font-size: 22px; color: var(--hueso-2); margin-top: 10px !important; }
.fin .punto { margin-left: 8px; }
.autor { border-top: 1px solid var(--hueso); border-bottom: 1px solid var(--linea); padding: 18px 0; margin-top: 40px; font-family: var(--f-geo); font-size: 15px; color: var(--hueso-2); }
.autor b { display: block; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; font-size: 13px; color: var(--hueso); margin-bottom: 4px; }

.aviso-maqueta { position: fixed; bottom: 14px; left: 14px; z-index: 60; background: var(--hueso); color: var(--negro); font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; padding: 9px 14px; }
.aviso-maqueta a { text-decoration: underline; }

/* ---------- responsive ---------- */
@media (max-width: 1060px) {
  .segundos { grid-column: 2; margin-top: 50px; }
  .destacado { grid-template-columns: 50px minmax(0, 1fr); }
  .tres { grid-template-columns: 1fr 1fr; }
  .cuerpo { grid-template-columns: minmax(0, 1fr) minmax(0, 800px) minmax(0, 1fr); }
  .cuerpo > * { grid-column: 2; }
  .nota { grid-column: 2; grid-row: auto; margin: 0 0 1.5em; }
  .cita { grid-column: 2; }
  .indice .au { display: none; }
}
@media (max-width: 680px) {
  body { font-size: 17px; }
  .contenedor { padding: 0 16px; }
  .destacado, .art-cab { grid-template-columns: 1fr; }
  .destacado .lado, .art-cab .lado { display: none; }
  .segundos { grid-column: 1; }
  .barra-sup { grid-template-columns: 1fr; gap: 6px; }
  .tres { grid-template-columns: 1fr; }
  .marco { min-height: 0; }
  .indice .s, .indice .mi { display: none; }
  .indice .t { font-size: 22px; }
  .indice .n { width: 46px; font-size: 26px; }
      .nav { font-size: 12px; letter-spacing: .12em; }
  .nav a + a::before { margin-right: 12px; }
  .meta { grid-template-columns: 1fr 1fr; }
  .meta div:nth-child(2) { border-right: none; }
  .meta div:nth-child(-n+2) { border-bottom: 1px solid var(--linea); }
  .cuerpo { grid-template-columns: 16px minmax(0, 1fr) 16px; column-gap: 0; }
  .cuerpo p { font-size: 18px; }
  }
.marco h3 em, .indice .t em { padding: 0 .12em; }

/* licencia Creative Commons */
.licencia { font-family: var(--f-geo); font-size: 13px !important; line-height: 1.55 !important; color: var(--gris) !important; margin: 18px 0 0 !important; max-width: 720px; }
.licencia .cc { display: inline-block; font-weight: 600; font-size: 11px; letter-spacing: .16em; color: var(--hueso); border: 1.5px solid var(--hueso); padding: 2px 7px 1px; margin-right: 8px; vertical-align: 1px; white-space: nowrap; }
.licencia .cc:hover { color: var(--acento); border-color: var(--acento); }
.cuerpo .licencia { border-bottom: 1px solid var(--linea); padding: 0 0 18px; }
.pie .licencia { margin-top: 22px !important; }


/* oscurecimiento suave en los bordes de la ventana */
html::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 48; box-shadow: inset 0 0 220px rgba(0,0,0,.55); }

/* ---------- acentos para probar ---------- */
html[data-acento="terracota"] { --acento: #c4572b; }
html[data-acento="sodio"]   { --acento: #d9a02b; }
html[data-acento="cobalto"] { --acento: #4a6fc4; }
html[data-acento="acido"]   { --acento: #a3c23e; }
html[data-acento="hueso"]   { --acento: #e3ded3; }
.acento-fill { fill: var(--acento); }

.selector-acento { position: fixed; right: 14px; bottom: 14px; z-index: 60; display: flex; gap: 12px; align-items: center; background: var(--hueso); color: var(--negro); padding: 8px 12px; font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.selector-acento div { display: flex; gap: 6px; }
.selector-acento button { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--negro); cursor: pointer; padding: 0; }
.selector-acento button[aria-pressed="true"] { outline: 2px solid var(--negro); outline-offset: 2px; }

/* ---------- logo chico con la S ---------- */
.logo-chico .punto.s { width: 22px; height: 22px; margin-bottom: 4px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--f-bloque); font-weight: 900; font-size: 17px; line-height: 1; color: var(--negro); }

/* ---------- menú plegable en el celular ---------- */
.menu-btn { display: none; margin: 12px 0; background: none; color: var(--hueso); border: 1px solid var(--hueso-2); font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; padding: 9px 16px; cursor: pointer; }
@media (max-width: 680px) {
  .menu-btn { display: inline-block; }
  .nav { display: none; }
  .nav.abierto { display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 4px 0 12px; }
  .nav.abierto a { padding: 10px 0; }
  .nav.abierto a + a::before { display: none; }
}

/* ---------- notas y fuentes ---------- */
.cuerpo sup { line-height: 0; }
.cuerpo sup a { font-family: var(--f-geo); font-weight: 600; font-size: .62em; color: var(--acento); padding: 0 2px; }
.fuentes { margin-top: 44px; border-top: 5px solid var(--hueso); padding-top: 14px; }
.fuentes h3 { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--hueso); margin: 0 0 12px; }
.fuentes ol { margin: 0; padding-left: 22px; font-family: var(--f-geo); font-size: 15px; line-height: 1.6; color: var(--hueso-2); }
.fuentes li { padding: 6px 0; border-bottom: 1px solid var(--linea); }
.fuentes li::marker { color: var(--acento); font-weight: 600; }

/* ---------- documento de archivo ---------- */
.documento { grid-column: 2 / 5; margin: 22px 0 46px; }
.documento img, .documento .doc-img { display: block; width: 100%; filter: grayscale(1) contrast(1.15); }
.doc-img { aspect-ratio: 16 / 9; display: flex !important; align-items: center; justify-content: center; border: 1px solid var(--linea);
  background: radial-gradient(circle, rgba(227,222,211,.2) 1.2px, transparent 1.5px) 0 0 / 7px 7px, var(--negro-2);
  font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--gris); }
.documento figcaption { margin-top: 12px; font-family: var(--f-geo); font-size: 14px; line-height: 1.5; color: var(--hueso-2); max-width: 680px; }
.documento figcaption b { font-weight: 600; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--acento); margin-right: 8px; }

/* ---------- anterior y siguiente ---------- */
.ant-sig { display: grid; grid-template-columns: 1fr 1fr; border-top: 5px solid var(--hueso); border-bottom: 1px solid var(--linea); margin-top: 70px; }
.ant-sig a { padding: 18px 20px 20px 0; display: block; }
.ant-sig a + a { border-left: 1px solid var(--linea); padding: 18px 0 20px 20px; text-align: right; }
.ant-sig small { display: block; font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--gris); margin-bottom: 6px; }
.ant-sig b { font-family: var(--f-bloque); font-weight: 900; font-size: 28px; line-height: 1; text-transform: uppercase; }

/* ---------- pie con enlaces ---------- */
.pie-nav { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 22px 0 0; font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; }
.pie-nav a:hover { color: var(--acento); }

/* ---------- páginas interiores ---------- */
.pag-cab { padding: 60px 0 34px; border-bottom: 1px solid var(--linea); }
.pag-cab .comp { font-size: clamp(64px, 12vw, 176px); margin-bottom: 10px; }
.pag-cab .datos-pag { font-family: var(--f-geo); font-weight: 500; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; color: var(--gris); margin: 0; }

.edicion { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 0 48px; padding: 56px 0 70px; }
.edicion .grande { font-family: var(--f-bloque); font-weight: 900; font-size: 230px; line-height: .78; color: transparent; -webkit-text-stroke: 2px var(--hueso); }
.edicion .fecha { font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .26em; text-transform: uppercase; color: var(--hueso-2); margin: 18px 0 0; }
.edicion .fecha b { color: var(--acento); font-weight: 600; }

.lista-sec { margin-bottom: 80px; }
.lista-sec article { display: grid; grid-template-columns: 100px minmax(0, 1fr) 200px; gap: 0 28px; padding: 34px 0 36px; border-bottom: 1px solid var(--linea); }
.lista-sec .num { font-size: 64px; color: transparent; -webkit-text-stroke: 1.5px var(--hueso-2); }
.lista-sec h2 { font-family: var(--f-bloque); font-weight: 900; font-size: clamp(34px, 4vw, 54px); line-height: .94; text-transform: uppercase; margin: 0 0 12px; }
.lista-sec p { font-family: var(--f-bodoni); font-style: italic; font-size: 21px; line-height: 1.45; color: var(--hueso-2); margin: 0; max-width: 820px; }
.lista-sec .meta-sec { font-family: var(--f-geo); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); text-align: right; line-height: 1.8; }
.lista-sec .meta-sec b { color: var(--hueso-2); font-weight: 500; }

@media (max-width: 680px) {
  .ant-sig { grid-template-columns: 1fr; }
  .ant-sig a + a { border-left: none; border-top: 1px solid var(--linea); text-align: left; padding-left: 0; }
  .edicion { grid-template-columns: 1fr; padding: 40px 0 50px; }
  .edicion .grande { font-size: 140px; }
  .lista-sec article { grid-template-columns: 1fr; gap: 10px; }
  .lista-sec .meta-sec { text-align: left; }
  .documento { grid-column: 2 !important; }
  .selector-acento span { display: none; }
}
@media (max-width: 1060px) { .documento { grid-column: 1 / 4; } }
.barra-sup .menu-btn { justify-self: start; }

/* ---------- texto del artículo alineado al eje del título ---------- */
.cuerpo { max-width: var(--ancho); margin: 0 auto; padding: 60px 32px 30px; grid-template-columns: 60px minmax(0, 800px) 260px minmax(0, 1fr); column-gap: 32px; }
.cuerpo > * { grid-column: 2; }
.cuerpo .nota { grid-column: 3; }
.cuerpo .cita { grid-column: 2 / 4; }
.cuerpo .documento { grid-column: 2 / 5; }
@media (max-width: 1060px) {
  .cuerpo { grid-template-columns: 50px minmax(0, 800px) minmax(0, 1fr); }
  .cuerpo .nota, .cuerpo .cita { grid-column: 2; }
  .cuerpo .documento { grid-column: 2 / 4; }
}
@media (max-width: 680px) {
  .cuerpo { grid-template-columns: minmax(0, 1fr); padding: 44px 16px 24px; }
  .cuerpo > *, .cuerpo .nota, .cuerpo .cita, .cuerpo .documento { grid-column: 1 !important; }
}
.pag-cab.alineada { padding-left: 92px; }
@media (max-width: 1060px) { .pag-cab.alineada { padding-left: 82px; } }
@media (max-width: 680px) { .pag-cab.alineada { padding-left: 0; } }
/* imagen de archivo al ancho del texto */
.cuerpo .documento { grid-column: 2; margin: 18px 0 40px; }
.doc-img { aspect-ratio: 3 / 2; }
@media (max-width: 1060px) { .cuerpo .documento { grid-column: 2; } }

/* ---------- página de artículo: todo en una columna del mismo ancho ---------- */
.pag-articulo { --ancho: 1000px; }
.pag-articulo .art-cab { grid-template-columns: minmax(0, 1fr); }
.pag-articulo .art-cab .lado { display: none; }
.pag-articulo .art-cab .comp { font-size: clamp(56px, 9vw, 124px); }
.pag-articulo .art-cab .bajada { max-width: none; }
.pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr); }
.pag-articulo .cuerpo > *, .pag-articulo .cuerpo .nota, .pag-articulo .cuerpo .cita, .pag-articulo .cuerpo .documento { grid-column: 1 !important; }
.pag-articulo .cuerpo p { font-size: 21px; }
.pag-articulo .cuerpo .nota { grid-row: auto; margin: 0 0 1.6em; max-width: 520px; }
.pag-articulo .cuerpo .cita blockquote p { max-width: none; }
.pag-articulo .barra-sup .nav a { padding: 4px 8px; }
.pag-articulo .barra-sup .nav a + a::before { margin-right: 14px; margin-left: -8px; }
@media (max-width: 680px) { .pag-articulo .cuerpo p { font-size: 18px; } }
.pag-articulo .barra-sup { gap: 22px; }
.pag-articulo .barra-sup .nav { flex-wrap: nowrap; font-size: 13px; letter-spacing: .14em; }
@media (max-width: 1060px) { .pag-articulo .barra-sup .nav { flex-wrap: wrap; } }

/* ---------- un solo ancho para todo el sitio ---------- */
:root { --ancho: 1100px; }
.pag-articulo { --ancho: 1100px; }
.pag-articulo .cuerpo p { font-size: 22px; line-height: 1.72; }
.pag-articulo .art-cab .comp { font-size: clamp(56px, 9vw, 132px); }
.comp { font-size: clamp(56px, 9vw, 132px); }
@media (max-width: 680px) { .pag-articulo .cuerpo p { font-size: 18px; } }

/* notas al costado: texto + columna de notas dentro del mismo ancho */
.pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr) 250px; column-gap: 48px; }
.pag-articulo .cuerpo > * { grid-column: 1 !important; }
.pag-articulo .cuerpo .nota { grid-column: 2 !important; grid-row: span 3; margin: 6px 0 0; max-width: none; }
.pag-articulo .cuerpo .cita { grid-column: 1 / 3 !important; }
.pag-articulo .cuerpo p { font-size: 21px; }
@media (max-width: 900px) {
  .pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr); }
  .pag-articulo .cuerpo .nota, .pag-articulo .cuerpo .cita { grid-column: 1 !important; grid-row: auto; margin: 0 0 1.6em; }
}
@media (max-width: 680px) { .pag-articulo .cuerpo p { font-size: 18px; } }
/* nota más angosta */
.pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr) 200px; column-gap: 56px; }
.pag-articulo .cuerpo .nota { font-size: 14px; }
@media (max-width: 900px) {
  .pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr); }
  .pag-articulo .cuerpo .nota { max-width: 420px; }
}
/* cita dentro de la columna del texto */
.pag-articulo .cuerpo .cita { grid-column: 1 !important; margin: 20px 0 44px; }
.pag-articulo .cuerpo .cita blockquote p { font-size: clamp(28px, 3.2vw, 38px) !important; line-height: 1.02 !important; text-wrap: balance; max-width: none; }

/* franjas estructurales al ancho total: franja, menú, "en este número" y pie */
.ancho-total { --ancho: 1440px; }
/* cabecera del artículo (sección, título, bajada y datos) al ancho total */
.pag-articulo .art-cab .comp { font-size: clamp(56px, 11vw, 158px); }
.pag-articulo .art-cab .bajada { max-width: 1160px; text-wrap: balance; }
/* cierre del artículo (fuentes, autor, licencia, anterior/siguiente) al ancho total */
.cierre { padding-bottom: 10px; }
.cierre .fuentes { margin-top: 30px; }
.cierre .licencia { max-width: none; border-bottom: 1px solid var(--linea); padding: 0 0 18px; }
@media (max-width: 680px) { .cierre { padding: 0 16px; } }

/* ---------- artículo: texto alineado al borde izquierdo de la cabecera ---------- */
.pag-articulo .cuerpo { --ancho: 1440px; grid-template-columns: minmax(0, 800px) 220px minmax(0, 1fr); column-gap: 56px; }
.pag-articulo .cuerpo > * { grid-column: 1 !important; }
.pag-articulo .cuerpo .nota { grid-column: 2 !important; }
.pag-articulo .cuerpo .fin { margin: 36px 0 0 !important; }
.cierre .fuentes { margin-top: 70px; }
.como-citar b { font-weight: 600; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--hueso); margin-right: 10px; }
@media (max-width: 1060px) {
  .pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr) 200px; column-gap: 40px; }
}
@media (max-width: 900px) {
  .pag-articulo .cuerpo { grid-template-columns: minmax(0, 1fr); }
  .pag-articulo .cuerpo .nota { grid-column: 1 !important; }
}
/* letra del texto en tablets */
@media (max-width: 1060px) and (min-width: 681px) { .pag-articulo .cuerpo p { font-size: 19px; } }

/* =========================================================
   SISTEMA DE ANCHOS EDITORIAL (convención web)
   Tres anchos, todos centrados sobre el mismo eje:
   · total  1.376 px · marco del sitio: franja, menú, portada, índices, pie
   · medio  1.100 px · cabecera del artículo e imágenes
   · texto    720 px · lectura: párrafos, subtítulos, citas, ficha, cierre
   Las notas cuelgan al margen derecho del texto, dentro del ancho medio.
   ========================================================= */
.ancho-total { --ancho: 1440px; }
.ancho-medio { --ancho: 1164px; }
.ancho-texto { --ancho: 784px; }

.pag-articulo .art-cab .comp { font-size: clamp(52px, 8.4vw, 124px); }
.pag-articulo .art-cab .bajada { max-width: 900px; }

.pag-articulo article.cuerpo {
  max-width: none; margin: 0; padding: 64px 0 30px;
  grid-template-columns: [full-start] minmax(32px, 1fr) [wide-start] minmax(0, 190px) [text-start] minmax(0, 720px) [text-end] minmax(0, 190px) [wide-end] minmax(32px, 1fr) [full-end];
  column-gap: 0;
}
.pag-articulo article.cuerpo > * { grid-column: text !important; }
.pag-articulo article.cuerpo > .documento { grid-column: wide !important; }
.pag-articulo article.cuerpo > .nota { grid-column: text-end / wide-end !important; grid-row: span 3; padding-left: 28px; margin-top: 6px; max-width: none; }
.pag-articulo article.cuerpo p { font-size: 20px; line-height: 1.75; }
.pag-articulo article.cuerpo > .cita { grid-column: text !important; }
.pag-articulo article.cuerpo .cita blockquote p { font-size: clamp(28px, 3vw, 36px) !important; }

.cierre .fuentes { margin-top: 64px; }

@media (max-width: 1180px) {
  .pag-articulo article.cuerpo { grid-template-columns: [full-start] minmax(32px, 1fr) [wide-start text-start] minmax(0, 720px) [text-end wide-end] minmax(32px, 1fr) [full-end]; }
  .pag-articulo article.cuerpo > .nota { grid-column: text !important; grid-row: auto; padding-left: 0; margin: 0 0 1.6em; max-width: 420px; }
}
@media (max-width: 800px) {
  .pag-articulo article.cuerpo { grid-template-columns: [full-start wide-start text-start] minmax(0, 1fr) [text-end wide-end full-end]; padding: 44px 32px 24px; }
}
@media (max-width: 1060px) and (min-width: 681px) { .pag-articulo article.cuerpo p { font-size: 19px; } }
@media (max-width: 680px) { .pag-articulo article.cuerpo { padding: 40px 16px 20px; } .pag-articulo article.cuerpo p { font-size: 18px; } }
/* prueba: pie con logo chico */
.pie-chico { padding: 28px 0 32px; border-top-width: 3px; }
.pie-chico svg { max-width: 190px !important; }
.pie-chico .pie-nav { margin-top: 16px; }
.cierre { padding-bottom: 70px; }

/* texto del artículo al mismo ancho que la cabecera (1.100 px) */
.pag-articulo article.cuerpo { display: block; max-width: 1164px; margin: 0 auto; padding: 64px 32px 30px; }
.pag-articulo article.cuerpo p { font-size: 22px; line-height: 1.75; }
.pag-articulo article.cuerpo > .nota { float: right; width: 240px; margin: 6px 0 24px 48px; padding-left: 0; }
.pag-articulo article.cuerpo h2, .pag-articulo article.cuerpo .cita, .pag-articulo article.cuerpo .documento, .pag-articulo article.cuerpo .ficha { clear: both; }
@media (max-width: 1060px) and (min-width: 681px) { .pag-articulo article.cuerpo p { font-size: 20px; } }
@media (max-width: 800px) { .pag-articulo article.cuerpo > .nota { float: none; width: auto; max-width: 420px; margin: 0 0 1.6em; } }
@media (max-width: 680px) { .pag-articulo article.cuerpo { padding: 40px 16px 20px; } .pag-articulo article.cuerpo p { font-size: 18px; } }
/* destacado de portada a todo el ancho */
.destacado { grid-template-columns: 60px minmax(0, 1fr) !important; }
@media (max-width: 680px) { .destacado { grid-template-columns: minmax(0, 1fr) !important; } }
.destacado .bajada { max-width: 1240px; }
.destacado .comp { font-size: clamp(56px, 10vw, 160px); }
/* cabecera del artículo al ancho total, igual que el menú */
.pag-articulo .art-cab .comp { font-size: clamp(56px, 10vw, 160px); }
.pag-articulo .art-cab .bajada { max-width: 1240px; }

/* ---------- contraste (WCAG AA ≥ 4,5:1 sobre el negro) ---------- */
:root { --gris: #948f87; --acento-texto: color-mix(in srgb, var(--acento) 70%, #ffffff); }
.nav a.activo, .cuerpo sup a, .nota b, .documento figcaption b, .fuentes li::marker, .edicion .fecha b { color: var(--acento-texto); }

/* ---------- compartir ---------- */
.compartir { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 10px; margin: 40px 0 0; padding: 16px 0; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.compartir > span { font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--hueso); margin-right: 8px; }
.compartir a, .compartir button { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--hueso-2); background: none; border: 1px solid var(--linea); padding: 8px 14px; cursor: pointer; line-height: 1; }
.compartir a:hover, .compartir button:hover { color: var(--negro); background: var(--hueso); border-color: var(--hueso); }
.compartir button.copiado { color: var(--negro); background: var(--acento); border-color: var(--acento); }
.cierre .compartir { margin-top: 0; }

/* ---------- colofón ---------- */
.colofon { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 40px; margin: 10px 0 20px; }
.colofon div { border-top: 5px solid var(--hueso); padding-top: 14px; margin-bottom: 36px; }
.colofon h3 { font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--gris); margin: 0 0 10px; }
.colofon p { font-family: var(--f-geo) !important; font-size: 16px !important; line-height: 1.6 !important; color: var(--hueso-2) !important; margin: 0 !important; }
.colofon p b { display: block; font-family: var(--f-bloque); font-weight: 900; font-size: 26px; text-transform: uppercase; color: var(--hueso); line-height: 1.05; margin-bottom: 4px; }

/* ---------- autor ---------- */
.autor-cab { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 0 40px; align-items: end; padding: 60px 0 40px; border-bottom: 1px solid var(--linea); }
.autor-cab .avatar-g { width: 150px; height: 150px; border-radius: 50%; border: 3px solid var(--hueso); background: radial-gradient(circle, var(--hueso) 1.4px, transparent 1.7px) 0 0 / 7px 7px, var(--negro-2); }
.autor-cab .comp { font-size: clamp(52px, 8vw, 120px); margin: 10px 0 14px; }
.autor-cab .bio { font-family: var(--f-bodoni); font-style: italic; font-size: 23px; line-height: 1.45; color: var(--hueso-2); max-width: 900px; margin: 0; }
.autor-cab .enlaces { margin-top: 16px; font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--gris); }
.autor-cab .enlaces a { color: var(--hueso); margin-right: 18px; }

/* ---------- 404 ---------- */
.error { padding: 80px 0 120px; }
.error .gigante { font-family: var(--f-bloque); font-weight: 900; font-size: clamp(160px, 30vw, 420px); line-height: .8; color: transparent; -webkit-text-stroke: 2px var(--hueso); display: block; }
.error h1 { font-family: var(--f-bloque); font-weight: 900; text-transform: uppercase; font-size: clamp(40px, 5vw, 72px); line-height: .95; margin: 30px 0 16px; }
.error h1::after { content: ""; display: inline-block; width: .15em; height: .15em; border-radius: 50%; background: var(--acento); margin-left: .07em; }
.error p { font-family: var(--f-bodoni); font-style: italic; font-size: 23px; color: var(--hueso-2); max-width: 700px; margin: 0 0 30px; }
.error .salidas { display: flex; flex-wrap: wrap; gap: 12px; }
.error .salidas a { font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; border: 1px solid var(--hueso-2); padding: 12px 18px; }
.error .salidas a:hover { background: var(--hueso); color: var(--negro); }

@media (max-width: 800px) {
  .colofon { grid-template-columns: 1fr; }
  .autor-cab { grid-template-columns: 1fr; gap: 20px; }
  .autor-cab .avatar-g { width: 100px; height: 100px; }
}
/* 404 centrada */
.error { text-align: center; }
.error p { margin-left: auto; margin-right: auto; }
.error .salidas { justify-content: center; }
.cabezal { padding-top: 22px; }
/* página activa en el menú: texto claro con subrayado grueso en el color de acento */
.nav a.activo { color: var(--hueso) !important; text-decoration: underline; text-decoration-color: var(--acento); text-decoration-thickness: 4px; text-underline-offset: 9px; }
.nav a + a::before { display: inline-block; text-decoration: none; }
/* retrato del editor: la G en el círculo, como la S del logo */
.avatar-g.editor { display: flex; align-items: center; justify-content: center; background: var(--acento); border-color: var(--acento); }
.avatar-g.editor span { font-family: var(--f-bloque); font-weight: 900; font-size: 104px; line-height: 1; color: var(--negro); }
@media (max-width: 800px) { .avatar-g.editor span { font-size: 70px; } }
/* S del logo chico centrada en el círculo */
.logo-chico .punto.s { line-height: 0; padding-top: 1px; font-size: 16px; }
.logo-chico .punto.s::first-letter { }

/* "En este número": un poco de color */
.marco .num { -webkit-text-stroke-color: var(--acento-texto); }
.marco .vertical { color: var(--acento-texto); }
.marco { transition: border-color .2s; }
.marco:hover { border-color: var(--acento); }
.marco:hover .vertical { border-right-color: var(--acento); }
/* espacio para tildes en mayúsculas condensadas */
.comp { margin-top: .2em !important; line-height: 1 !important; }
.marco h3, .segundos h3, .lista-sec h2, .cuerpo h2, .ant-sig b, .indice .t { line-height: 1.02 !important; }
.marco h3 { margin-top: 20px; }
.logo-chico .punto.s { transform: translateY(-1px); }
:root { --acento-texto: var(--acento); }
/* índice: un poco de color */
.indice .n { color: var(--acento); }
.indice .s { color: var(--acento); }
.indice tr { transition: background .2s; }
.indice tr:hover { background: rgba(74, 111, 196, .08); }
.indice tr:hover .t a { color: var(--hueso); }

/* preguntas de entrevista */
.cuerpo .pregunta { margin-top: 1.8em !important; }
.cuerpo .pregunta b { font-family: var(--f-geo); font-weight: 600; font-size: .92em; color: var(--hueso); }
.cuerpo .pregunta b::before { content: ""; display: inline-block; width: 18px; height: 3px; background: var(--acento); vertical-align: middle; margin-right: 12px; }

/* franja superior de la edición */
.franja { color: var(--hueso-2); border-bottom: 1px solid var(--linea); }
.franja .contenedor { align-items: center; padding-top: 10px; padding-bottom: 10px; }
.franja .edicion-actual { display: inline-flex; align-items: center; gap: 14px; }
.franja .nro { font-family: var(--f-bloque); font-weight: 900; font-size: 22px; letter-spacing: .02em; line-height: 1; color: var(--hueso); }
.franja .sep { width: 8px; height: 8px; border-radius: 50%; background: var(--acento); }
.franja .mes { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--hueso-2); }
.franja .archivo { font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--gris); }
.franja a:hover .nro, .franja .archivo:hover { color: var(--acento); }
@media (max-width: 680px) { .franja .archivo { display: none; } }

/* =========================================================
   COLOR SUTIL · el sangre seca solo en formas-firma:
   punto de la S, punto final de títulos, punto de sección y de la franja,
   barra de inicio del texto, barra de citas, subrayado del menú activo,
   retrato del editor y botón "copiado". Todo lo demás en hueso y grises.
   ========================================================= */
a:hover, .indice .t a:hover, .pie-nav a:hover, .franja a:hover .nro, .franja .archivo:hover { color: var(--hueso); }
.licencia .cc:hover { color: var(--hueso); border-color: var(--hueso); }
.indice .n { color: var(--hueso-2); }
.indice .s { color: var(--gris); }
.indice tr:hover { background: rgba(227, 222, 211, .04); }
.marco .num { -webkit-text-stroke-color: var(--hueso-2); }
.marco .vertical { color: var(--gris); }
.marco:hover { border-color: var(--hueso); }
.marco:hover .vertical { border-right-color: var(--hueso); }
.cuerpo sup a { color: var(--hueso-2); }
.fuentes li::marker { color: var(--gris); }
.documento figcaption b, .nota b { color: var(--hueso); }
.cuerpo .pregunta b::before { background: var(--hueso-2); height: 2px; }
.lista-sec .num { -webkit-text-stroke-color: var(--hueso-2); }
/* al pasar el cursor, vuelve el sangre seca */
a:hover, .indice .t a:hover, .pie-nav a:hover, .franja a:hover .nro, .franja .archivo:hover { color: var(--acento); }
.licencia .cc:hover { color: var(--acento); border-color: var(--acento); }
.marco:hover { border-color: var(--acento); }
.marco:hover .vertical { border-right-color: var(--acento); color: var(--acento); }
.marco:hover .num { -webkit-text-stroke-color: var(--acento); }
.indice tr:hover .n, .indice tr:hover .s { color: var(--acento); }
.indice tr:hover .t a { color: var(--acento); }
.compartir a:hover, .compartir button:hover { background: var(--acento); border-color: var(--acento); color: var(--hueso); }
.error .salidas a:hover, .leer:hover { color: var(--acento); border-color: var(--acento); }

/* "En este número": al pasar el cursor solo se colorea el título */
.marco:hover { border-color: var(--hueso-2); }
.marco:hover .vertical { border-right-color: var(--hueso-2); color: var(--gris); }
.marco:hover .num { -webkit-text-stroke-color: var(--hueso-2); }
.marco:hover h3 a { color: var(--acento); }
/* destacado de portada: título y bajada ocupan todo el ancho disponible */
.destacado .comp { font-size: clamp(56px, 12.4vw, 200px); text-wrap: balance; }
.destacado .bajada { max-width: none; font-size: 29px; text-wrap: balance; }
.destacado .comp { text-wrap: wrap; }
.destacado .bajada { text-wrap: pretty; }
.pag-articulo .art-cab .comp { text-wrap: wrap; }
.pag-articulo .art-cab .bajada { max-width: none; font-size: 29px; text-wrap: pretty; }
@media (max-width: 680px) { .pag-articulo .art-cab .bajada, .destacado .bajada { font-size: 21px; } }
.comp.sin-punto::after { display: none; }

/* =========================================================
   AUDITORÍA DE COHERENCIA (27-09-2026) · reglas únicas para todo el sitio
   ========================================================= */
/* menú idéntico en todas las páginas */
.nav, .pag-articulo .barra-sup .nav { font-size: 13px; letter-spacing: .16em; flex-wrap: wrap; }
.nav a, .pag-articulo .barra-sup .nav a { padding: 4px 10px; }
.nav a + a::before, .pag-articulo .barra-sup .nav a + a::before { margin-right: 20px; margin-left: -10px; }
.barra-sup, .pag-articulo .barra-sup { gap: 24px; }
@media (min-width: 1061px) { .nav, .pag-articulo .barra-sup .nav { flex-wrap: nowrap; } }

/* bajadas: una sola medida (título de página, perfil, 404) */
.bajada, .autor-cab .bio, .error p, .lista-sec p { font-family: var(--f-bodoni); font-style: italic; color: var(--hueso-2); }
.bajada, .autor-cab .bio, .error p { font-size: 29px; line-height: 1.4; }
.autor-cab .bio { max-width: none; }
.error p { max-width: 900px; }
@media (max-width: 680px) { .bajada, .autor-cab .bio, .error p { font-size: 21px; } }

/* colofón: columnas al ancho total */
.colofon { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 48px; }

/* ---------- pie en dos filas, sin vacío a la derecha ---------- */
.pie .contenedor { display: grid !important; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: 0 48px; }
.pie svg, .pie-chico svg { grid-column: 1; max-width: 190px !important; width: 190px; }
.pie .pie-nav { grid-column: 2; justify-self: end; margin: 0 0 6px !important; }
.pie .licencia { grid-column: 1 / -1; max-width: none; display: flex; align-items: center; gap: 16px; margin: 22px 0 0 !important; padding-top: 16px; border-top: 1px solid var(--linea); }
.pie .licencia .cc { flex: none; margin: 0; }
@media (max-width: 800px) {
  .pie .contenedor { grid-template-columns: 1fr; gap: 16px 0; }
  .pie .pie-nav { grid-column: 1; justify-self: start; }
  .pie .licencia { flex-direction: column; align-items: flex-start; }
}
/* perfiles: retrato a la derecha para que el nombre quede en el eje común */
.autor-cab { grid-template-columns: minmax(0, 1fr) 150px; }
.autor-cab .avatar-g { grid-column: 2; grid-row: 1; justify-self: end; }
.autor-cab > div:not(.avatar-g) { grid-column: 1; grid-row: 1; }
@media (max-width: 800px) { .autor-cab { grid-template-columns: 1fr; } .autor-cab .avatar-g { grid-column: 1; grid-row: auto; justify-self: start; } }

/* franja de datos del artículo: etiqueta chica + dato en la letra de titulares */
.meta { grid-template-columns: 1.2fr 1.4fr 1fr .7fr; border-top: 5px solid var(--hueso); border-bottom: 1px solid var(--hueso-2); }
.meta div { padding: 14px 22px 16px; font-family: var(--f-bloque); font-weight: 800; font-size: 26px; line-height: 1.05; letter-spacing: .01em; text-transform: uppercase; color: var(--hueso); }
.meta div:first-child { padding-left: 0; }
.meta small { font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .26em; color: var(--gris); margin-bottom: 7px; }
.meta a { color: var(--hueso); }
.meta a:hover { color: var(--acento); }
@media (max-width: 680px) {
  .meta { grid-template-columns: 1fr 1fr; }
  .meta div { font-size: 21px; padding: 12px 14px 14px; }
  .meta div:nth-child(odd) { padding-left: 0; }
}
/* datos del artículo más livianos */
.meta div { font-family: var(--f-geo); font-weight: 500; font-size: 15px; letter-spacing: .1em; line-height: 1.3; padding: 13px 22px 14px; }
.meta small { margin-bottom: 5px; }
@media (max-width: 680px) { .meta div { font-size: 14px; } }

/* ---------- cierre del artículo en dos columnas ---------- */
.cierre { padding-top: 10px; }
.cierre-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 0 64px; margin-top: 56px; padding-top: 18px; border-top: 5px solid var(--hueso); }
.cierre h3, .cierre .como-citar b { display: block; font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--gris); margin: 0 0 14px; }
.cierre .fuentes { margin: 0; border: none; padding: 0; }
.cierre .fuentes ol { font-size: 15px; line-height: 1.6; padding-left: 26px; }
.cierre .fuentes li { padding: 9px 0 10px; }
.bloque-cierre { padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid var(--linea); }
.bloque-cierre:last-child { border-bottom: none; margin-bottom: 0; }
.cierre .autor { border: none; margin: 0; padding: 0; font-family: var(--f-geo); font-size: 15px; line-height: 1.55; color: var(--hueso-2); }
.cierre .autor b { display: block; font-family: var(--f-bloque); font-weight: 800; font-size: 26px; letter-spacing: 0; line-height: 1; margin-bottom: 8px; }
.cierre .compartir { margin: 0; padding: 0; border: none; display: flex; flex-wrap: wrap; gap: 8px; }
.cierre .compartir h3 { flex-basis: 100%; margin-bottom: 6px; }
.cierre .compartir a, .cierre .compartir button { padding: 8px 12px; font-size: 11px; }
.cierre .como-citar { border: none; padding: 0; margin: 0 !important; font-family: var(--f-geo); font-size: 14px !important; line-height: 1.55 !important; color: var(--hueso-2) !important; }
.cierre .como-citar i { font-style: italic; }
.cierre .ant-sig { margin-top: 48px; }
.cierre .ant-sig b { font-size: 32px; }
@media (max-width: 900px) {
  .cierre-grid { grid-template-columns: 1fr; }
  .cierre-izq { margin-bottom: 30px; }
}
/* compartir con íconos */
.compartir a, .compartir button { display: inline-flex; align-items: center; gap: 7px; }
.compartir svg { width: 14px; height: 14px; fill: currentColor; flex: none; }
/* cierre nivelado: mismas líneas arriba y abajo en ambas columnas, sin líneas internas en las notas */
.cierre-grid { align-items: stretch; border-bottom: 1px solid var(--linea); padding-bottom: 0; }
.cierre-izq, .cierre-der { padding-bottom: 26px; }
.cierre .fuentes li { border-bottom: none; padding: 0 0 12px; }
.cierre h3 { height: 14px; line-height: 14px; margin-bottom: 16px !important; }
.bloque-cierre { padding-bottom: 20px; margin-bottom: 20px; }
.cierre .ant-sig { margin-top: 40px; }
.cierre-grid { border-bottom: none; } .cierre .ant-sig { margin-top: 24px; }

/* cuerpo del artículo al mismo ancho que la cabecera y el menú (1.376 px) */
.pag-articulo article.cuerpo { max-width: 1440px; }
.pag-articulo article.cuerpo p { font-size: 23px; line-height: 1.72; }
@media (max-width: 1060px) and (min-width: 681px) { .pag-articulo article.cuerpo p { font-size: 20px; } }
@media (max-width: 680px) { .pag-articulo article.cuerpo p { font-size: 18px; } }
/* compartir: solo íconos */
.compartir .nombre { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cierre .compartir a, .cierre .compartir button { position: relative; width: 42px; height: 42px; padding: 0; justify-content: center; }
.compartir svg { width: 18px; height: 18px; }
.compartir .copiado::after { content: attr(data-aviso); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); white-space: nowrap; background: var(--hueso); color: var(--negro); font-family: var(--f-geo); font-weight: 600; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; padding: 6px 10px; }
/* colaborar */
.ficha td:first-child { vertical-align: top; }
.ficha td { vertical-align: top; }
.nota-colaborar { font-family: var(--f-geo) !important; font-size: 13px !important; letter-spacing: .12em; text-transform: uppercase; color: var(--gris) !important; border-top: 1px solid var(--linea); padding-top: 16px; margin-top: 40px !important; }
.ficha.secciones { border-top: none; margin-top: 0; } .ficha.secciones table { font-size: 16px; } .ficha.secciones td { padding: 12px 0; } .ficha.secciones td:first-child { width: 170px; padding-top: 15px; }
/* colofón: colaboradores por número */
.colaboradores .col-nombres { font-family: var(--f-geo) !important; font-weight: 500; font-size: 17px !important; text-transform: none !important; letter-spacing: .02em; line-height: 1.6 !important; }
.colaboradores .col-nombres a { color: var(--hueso); }
.colaboradores .col-nombres a:hover { color: var(--acento); }
.colaboradores .sep-col { color: var(--gris); margin: 0 12px; }
.colaboradores .s { width: 190px; }
.colaboradores .mi::after { content: " firmas"; }
.total-col { font-family: var(--f-geo); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); margin: 18px 0 70px; }
.colaboradores { margin-bottom: 90px; }
/* colofón: redes con íconos */
.colofon .redes { display: flex; gap: 10px; }
.colofon .redes a { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--linea); color: var(--hueso-2); }
.colofon .redes a:hover { background: var(--acento); border-color: var(--acento); color: var(--hueso); }
.colofon .redes svg { width: 19px; height: 19px; fill: currentColor; }
.colofon .redes { border-top: none !important; padding-top: 0 !important; margin: 4px 0 0 !important; }
.colofon p a.flecha { display: inline-block; margin-top: 4px; font-weight: 600; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--hueso); }
.colofon .redes { margin-top: 12px !important; }
.pie .licencia { justify-content: flex-start; } .pie .licencia .anio { margin-left: auto; color: var(--gris); letter-spacing: .16em; text-transform: uppercase; font-size: 11px; }
.colofon .redes { margin-top: 4px !important; }
/* colofón: bloques parejos de tres líneas */
.colofon > div > p { min-height: 4.4em; }
.colofon .redes-txt { order: 2; margin-top: 10px !important; min-height: 0 !important; }
.colofon > div:has(.redes) { display: flex; flex-direction: column; }
.colofon > div:has(.redes) h3 { order: 0; }
.colofon > div:has(.redes) .redes { order: 1; margin-top: 2px !important; }
/* colofón: tres líneas por bloque (título, dato y detalle) */
.colofon > div > p { min-height: 0; }
.colofon .redes-txt { margin-top: 8px !important; }
.colofon .redes a { width: 34px; height: 34px; }
.colofon .redes svg { width: 16px; height: 16px; }
.colofon .redes a { width: 46px; height: 46px; } .colofon .redes svg { width: 20px; height: 20px; }
/* logo del encabezado = mismo dibujo y tamaño que el del pie */
.logo-chico { display: block; width: 190px; padding: 0 0 10px; line-height: 0; }
.logo-chico svg { display: block; width: 100%; height: auto; }
.logo-chico:hover { opacity: .85; }
@media (max-width: 680px) { .logo-chico { width: 150px; } }
/* logos chicos (encabezado y pie): punto liso, sin la S */
.logo-chico svg text[font-size="52"], .pie svg text[font-size="52"] { display: none; }
/* citas del artículo a todo el ancho de la columna */
.pag-articulo article.cuerpo .cita { padding-right: 0; margin-right: 0; }
.pag-articulo article.cuerpo .cita blockquote p { max-width: none !important; text-wrap: wrap !important; font-size: clamp(30px, 3.4vw, 46px) !important; }

/* imagen de archivo: foto en 2/3 + pie en el tercio derecho, de borde a borde */
.pag-articulo article.cuerpo .documento { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0 48px; align-items: end; margin: 30px 0 48px; }
.pag-articulo article.cuerpo .documento .doc-img, .pag-articulo article.cuerpo .documento img { aspect-ratio: 3 / 2; width: 100%; }
.pag-articulo article.cuerpo .documento figcaption { margin: 0; max-width: none; border-top: 5px solid var(--hueso); padding-top: 14px; font-size: 15px; line-height: 1.55; }
.pag-articulo article.cuerpo .documento figcaption b { display: block; margin: 0 0 8px; }
@media (max-width: 800px) {
  .pag-articulo article.cuerpo .documento { grid-template-columns: 1fr; }
  .pag-articulo article.cuerpo .documento figcaption { margin-top: 14px; border-top: none; padding-top: 0; }
}

/* ---------- tratamiento de imágenes de archivo (A): blanco y negro con grano ---------- */
.doc-foto { position: relative; overflow: hidden; background: var(--negro-2); aspect-ratio: 3 / 2; }
.doc-foto img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.3) brightness(.92); }
.doc-foto::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; opacity: .55;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.8 -.6'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }

/* ---------- enlaces dentro del texto ---------- */
.cuerpo p a:not(sup a) { color: var(--hueso); text-decoration: underline; text-decoration-color: var(--acento); text-decoration-thickness: 2px; text-underline-offset: 4px; transition: color .2s, text-decoration-thickness .2s; }
.cuerpo p a:not(sup a):hover { color: var(--acento); text-decoration-thickness: 3px; }

/* ---------- foco visible al navegar con teclado ---------- */
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--acento); outline-offset: 4px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--acento); outline-offset: 4px; background-color: transparent; }
.compartir a:focus-visible, .compartir button:focus-visible, .colofon .redes a:focus-visible { outline-offset: 2px; }
.menu-btn:focus-visible { outline-offset: 3px; }
/* enlace para saltar al contenido */
.saltar { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--hueso); color: var(--negro); font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; padding: 10px 16px; }
.saltar:focus { top: 12px; color: var(--negro); }

/* ---------- selección de texto ---------- */
::selection { background: var(--acento); color: var(--hueso); }

/* ---------- paginación ---------- */
.paginacion { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; border-top: 5px solid var(--hueso); border-bottom: 1px solid var(--linea); padding: 16px 0; margin: -40px 0 90px; font-family: var(--f-geo); font-weight: 600; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; }
.paginacion .pag-sig { justify-self: end; }
.paginacion .off { color: var(--linea); }
.pag-nums { display: flex; gap: 6px; }
.pag-nums a, .pag-nums span { font-family: var(--f-bloque); font-weight: 900; font-size: 24px; letter-spacing: 0; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--linea); color: var(--hueso-2); }
.pag-nums .actual { background: var(--hueso); color: var(--negro); border-color: var(--hueso); }
.pag-nums a:hover { color: var(--acento); border-color: var(--acento); }
@media (max-width: 680px) { .paginacion { grid-template-columns: 1fr 1fr; } .pag-nums { grid-column: 1 / -1; grid-row: 1; justify-content: center; } }
html[data-acento="sangre"] { --acento: #a3262a; }

/* =========================================================
   IMPRESIÓN · el artículo sale como una fotocopia en blanco y negro
   ========================================================= */
@page { size: A4; margin: 18mm 18mm 20mm; }
@media print {
  html, body { background: #fff !important; color: #000 !important; box-shadow: none !important; }
  body::before, html::after, body::after { display: none !important; }
  * { color: #000 !important; background: transparent !important; box-shadow: none !important; text-shadow: none !important; -webkit-text-stroke-color: #000 !important; }
  .franja, .nav, .menu-btn, .selector-acento, .aviso-maqueta, .saltar, .compartir, .ant-sig, .paginacion, .pie-nav, .redes { display: none !important; }
  .barra-sup { border-bottom: 2pt solid #000 !important; padding: 0 0 6pt !important; grid-template-columns: 1fr !important; }
  .logo-chico { width: 42mm !important; }
  .logo-chico svg text, .pie svg text { fill: #000 !important; }
  .logo-chico svg g, .pie svg g { fill: #000 !important; filter: none !important; }
  .logo-chico svg circle, .pie svg circle { fill: #000 !important; }
  .desgaste, .comp .desgaste { filter: none !important; }
  .contenedor, .pag-articulo article.cuerpo { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; margin: 0 !important; }
  .art-cab { padding: 10mm 0 5mm !important; grid-template-columns: 1fr !important; }
  .art-cab .lado { display: none !important; }
  .art-cab .comp { font-size: 34pt !important; line-height: 1 !important; margin: 3mm 0 !important; }
  .comp::after { background: #000 !important; }
  .art-cab .bajada { font-size: 13pt !important; line-height: 1.4 !important; }
  .meta { border-top: 2pt solid #000 !important; border-bottom: .5pt solid #000 !important; }
  .meta div { font-size: 8pt !important; padding: 2mm 3mm !important; border-right: .5pt solid #000 !important; }
  .meta div:first-child { padding-left: 0 !important; }
  .pag-articulo article.cuerpo { padding-top: 6mm !important; display: block !important; }
  .pag-articulo article.cuerpo p { font-size: 10.5pt !important; line-height: 1.55 !important; orphans: 3; widows: 3; }
  .cuerpo > p:first-of-type::before, .punto, .cita, .comp::after { border-color: #000 !important; }
  .cuerpo > p:first-of-type::before { background: #000 !important; }
  .cuerpo h2 { font-size: 16pt !important; border-top: 2pt solid #000 !important; break-after: avoid; page-break-after: avoid; }
  .cita { border-left: 3pt solid #000 !important; break-inside: avoid; }
  .pag-articulo article.cuerpo .cita blockquote p { font-size: 17pt !important; }
  .documento, .ficha { break-inside: avoid; }
  .pag-articulo article.cuerpo .documento { grid-template-columns: 2fr 1fr !important; }
  .doc-foto img { filter: grayscale(1) contrast(1.35) !important; }
  .doc-foto::after { opacity: .35 !important; }
  .doc-img { border: .5pt solid #000 !important; }
  .cuerpo p a { text-decoration: underline !important; }
  .cuerpo sup a { text-decoration: none !important; }
  .cierre-grid { grid-template-columns: 1fr !important; border-top: 2pt solid #000 !important; margin-top: 8mm !important; }
  .cierre-der { break-inside: avoid; }
  .cierre .fuentes ol, .cierre .autor { font-size: 9pt !important; }
  .pie { border-top: 1pt solid #000 !important; padding: 5mm 0 0 !important; }
  .pie .contenedor { display: flex !important; align-items: center; justify-content: space-between; }
  .pie svg { width: 30mm !important; }
  .pie .licencia { border: none !important; margin: 0 !important; padding: 0 !important; font-size: 7.5pt !important; }
  .pie .licencia .cc { display: inline-block !important; border: .5pt solid #000 !important; }
  }
@media print { .pag-articulo article.cuerpo .cita blockquote p, .cuerpo p, .cuerpo h2, .cita figcaption { color: #000 !important; } }

/* descarga del fanzine en PDF */
.descarga { display: inline-flex; flex-direction: column; gap: 4px; margin: -50px 12px 90px 0; padding: 16px 22px 16px 58px; border: 1px solid var(--hueso-2); position: relative; font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--hueso); }
.descarga span { font-weight: 400; font-size: 12px; letter-spacing: .08em; text-transform: none; color: var(--gris); }
.descarga::before { content: ""; position: absolute; left: 20px; top: 50%; width: 20px; height: 24px; transform: translateY(-50%); background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M11 3h2v10.2l3.6-3.6 1.4 1.4-6 6-6-6 1.4-1.4 3.6 3.6zM5 19h14v2H5z'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M11 3h2v10.2l3.6-3.6 1.4 1.4-6 6-6-6 1.4-1.4 3.6 3.6zM5 19h14v2H5z'/></svg>") center / contain no-repeat; }
.descarga:hover { border-color: var(--acento); color: var(--acento); }
.descarga.mini { margin: 16px 0 0; padding: 10px 14px 10px 40px; font-size: 11px; }
.descarga.mini::before { left: 14px; width: 16px; height: 18px; }
@media print { .descarga { display: none !important; } }
.edicion .descarga.mini { display: flex; width: 100%; max-width: 240px; margin: 10px 0 0; }
.edicion .descarga.mini:first-of-type { margin-top: 22px; }

/* editorial de cada número (portada) */
.editorial-web .ed-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 0 56px; margin-bottom: 20px; }
.editorial-web .ed-titulo { font-family: var(--f-bloque); font-weight: 900; font-size: clamp(40px, 4.6vw, 68px); line-height: .95; text-transform: uppercase; margin: 0; }
.editorial-web .ed-titulo::after { content: ""; display: inline-block; width: .15em; height: .15em; border-radius: 50%; background: var(--acento); margin-left: .07em; }
.editorial-web .ed-cuerpo p { font-size: 20px; line-height: 1.7; color: #d9d4c9; margin: 0 0 1.1em; }
.editorial-web .ed-cuerpo p:first-child { font-family: var(--f-bodoni); font-style: italic; font-size: 24px; line-height: 1.45; color: var(--hueso); }
.editorial-web .ed-firma { font-family: var(--f-geo) !important; font-weight: 600; font-size: 13px !important; letter-spacing: .22em; text-transform: uppercase; }
@media (max-width: 900px) { .editorial-web .ed-grid { grid-template-columns: 1fr; gap: 20px; } .editorial-web .ed-cuerpo p { font-size: 18px; } }
@media print { .editorial-web { display: none; } }

/* ---------- títulos más contenidos en todo el sitio ---------- */
.pag-cab .comp { font-size: clamp(44px, 6vw, 92px) !important; }
.autor-cab .comp { font-size: clamp(40px, 5vw, 78px) !important; }
.error .gigante { font-size: clamp(120px, 20vw, 250px); }
.error h1 { font-size: clamp(30px, 3.4vw, 50px); }
.editorial-web .ed-titulo { font-size: clamp(32px, 3.4vw, 50px); }
.pag-articulo article.cuerpo h2 { font-size: 30px; }
.lista-sec h2 { font-size: clamp(26px, 2.8vw, 38px); }
.marco h3 { font-size: 28px; }
.indice .t { font-size: 30px; }
.edicion .grande { font-size: 170px; }

/* ---------- cita web: recortada en franjas (opción G) ---------- */
.pag-articulo article.cuerpo .cita, .cuerpo .cita { border: none !important; padding: 0 !important; margin: 34px 0 40px !important; background: none; }
.cuerpo .cita blockquote p { font-family: var(--f-bloque) !important; font-weight: 800 !important; text-transform: uppercase !important; font-size: clamp(26px, 2.6vw, 36px) !important; line-height: 1.5 !important; color: var(--negro) !important; text-wrap: wrap !important; max-width: none; margin: 0 !important; }
.cuerpo .cita blockquote p .franja-cita { background: var(--hueso); padding: 2px 10px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.cuerpo .cita figcaption { margin-top: 14px; }

/* ---------- menos líneas horizontales en los artículos: solo menú, bajo el título, fin del texto y pie ---------- */
.pag-articulo article.cuerpo h2 { border-top: none !important; padding-top: 0 !important; }
.pag-articulo .meta { border-bottom: none !important; }
.pag-articulo .documento figcaption { border-top: none !important; padding-top: 0 !important; }
.pag-articulo .nota { border-top: none !important; }
.cierre .fuentes { border-top: none !important; }
.bloque-cierre { border-bottom: none !important; }
.cierre .compartir { border: none !important; }
.cierre .ant-sig { border-top: none !important; border-bottom: none !important; }
.cierre .ant-sig a + a { border-left: none !important; }

/* ---------- texto del artículo en columna de lectura (~75 letras), centrada ----------
   título, datos, cierre y pie siguen al ancho total; citas y fotos se salen de la columna */
.pag-articulo article.cuerpo { display: grid !important; max-width: none !important; margin: 0 !important; padding: 64px 32px 30px !important;
  grid-template-columns: [full-start] minmax(0, 1fr) [wide-start] minmax(0, 170px) [text-start] minmax(0, 720px) [text-end] minmax(0, 170px) [wide-end] minmax(0, 1fr) [full-end]; column-gap: 0; }
.pag-articulo article.cuerpo > * { grid-column: text !important; float: none !important; }
.pag-articulo article.cuerpo > .cita, .pag-articulo article.cuerpo > .documento, .pag-articulo article.cuerpo > .ficha { grid-column: wide !important; }
.pag-articulo article.cuerpo > .nota { width: auto !important; margin: 0 0 1.6em !important; max-width: 520px; }
.pag-articulo article.cuerpo p { font-size: 21px; line-height: 1.72; }
@media (max-width: 1100px) {
  .pag-articulo article.cuerpo > .cita, .pag-articulo article.cuerpo > .documento, .pag-articulo article.cuerpo > .ficha { grid-column: text !important; }
}
@media (max-width: 680px) { .pag-articulo article.cuerpo { padding: 40px 16px 20px !important; } .pag-articulo article.cuerpo p { font-size: 18px; } }
.pag-articulo .meta { border-bottom: 1px solid var(--hueso-2) !important; }

/* ---------- pulido del artículo web ---------- */
/* foto centrada en el ancho grande, pie debajo alineado con el texto */
.pag-articulo article.cuerpo .documento { display: block !important; margin: 36px 0 40px !important; }
.pag-articulo article.cuerpo .documento .doc-foto, .pag-articulo article.cuerpo .documento .doc-img { width: 100%; aspect-ratio: 16 / 9; }
.pag-articulo article.cuerpo .documento figcaption { max-width: 720px; margin: 12px auto 0; border: none !important; padding: 0 !important; font-size: 15px; }
.pag-articulo article.cuerpo .documento figcaption b { display: inline; margin-right: 10px; }
/* preguntas de entrevista más visibles */
.cuerpo .pregunta b { font-family: var(--f-geo) !important; font-weight: 600 !important; font-size: 19px !important; line-height: 1.45; color: var(--hueso) !important; }
.cuerpo .pregunta { margin-top: 2.2em !important; }
/* fuentes y notas un punto más grandes */
.cierre .fuentes ol { font-size: 16.5px !important; line-height: 1.6; }
.cierre .fuentes li { padding-bottom: 8px; }
.pag-articulo article.cuerpo .documento .doc-foto img { object-position: 50% 28%; }
.cuerpo .pregunta b { font-size: 22px !important; letter-spacing: .005em; }
/* citas al ancho del texto; las fotos siguen más anchas */
.pag-articulo article.cuerpo > .cita { grid-column: text !important; }
/* cabecera y cita proporcionadas a la columna de texto */
.pag-articulo .art-cab .bajada { max-width: 900px !important; }
.cuerpo .cita blockquote p { font-size: clamp(24px, 2.2vw, 32px) !important; }
body.pag-articulo article.cuerpo .cita blockquote p { font-size: clamp(24px, 2.2vw, 32px) !important; }

/* ---------- celular: columna del artículo y colofón ---------- */
@media (max-width: 900px) {
  .pag-articulo article.cuerpo { grid-template-columns: [full-start wide-start text-start] minmax(0, 1fr) [text-end wide-end full-end] !important; padding: 44px 24px 24px !important; }
  .pag-articulo article.cuerpo > *, .pag-articulo article.cuerpo > .cita, .pag-articulo article.cuerpo > .documento { grid-column: text !important; }
  .colofon { grid-template-columns: 1fr 1fr !important; gap: 0 24px !important; }
}
@media (max-width: 680px) {
  .pag-articulo article.cuerpo { padding: 36px 16px 20px !important; }
  .pag-articulo article.cuerpo p { font-size: 18px !important; }
  body.pag-articulo article.cuerpo .cita blockquote p { font-size: 22px !important; }
  .pag-articulo .documento .doc-foto { aspect-ratio: 4 / 3 !important; }
}
@media (max-width: 460px) { .colofon { grid-template-columns: 1fr !important; } }

/* ---------- portada: foto de tapa de borde a borde después del destacado (opción D) ---------- */
.destacado { padding-bottom: 36px !important; border-bottom: none !important; }
.pausa-tapa { margin: 0 calc(50% - 50vw) 0; width: 100vw; }
.pausa-tapa .ft { position: relative; overflow: hidden; height: 520px; }
.pausa-tapa .ft img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; display: block; filter: grayscale(1) contrast(1.4) brightness(.82); }
.pausa-tapa .ft::after { content: ""; position: absolute; inset: 0; mix-blend-mode: multiply; opacity: .45;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.8 -.6'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.pausa-tapa .ft-cred { max-width: 1440px; margin: 10px auto 0; padding: 0 32px; font-family: var(--f-geo); font-size: 12px; color: var(--gris); }
@media (max-width: 680px) { .pausa-tapa .ft { height: 300px; } .pausa-tapa .ft-cred { padding: 0 16px; } }
@media print { .pausa-tapa { display: none; } }

/* ---------- final de la portada: fanzine y carta del editor lado a lado ---------- */
.cierre-portada { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 0 64px; margin: 20px 0 90px; align-items: start; }
.bajar-fanzine .descarga { display: flex; width: 100%; margin: 0 0 12px !important; }
.carta-editor .ed-titulo { font-family: var(--f-bloque); font-weight: 900; font-size: clamp(30px, 3vw, 44px); line-height: .98; text-transform: uppercase; margin: 0 0 18px; }
.carta-editor .ed-titulo::after { content: ""; display: inline-block; width: .15em; height: .15em; border-radius: 50%; background: var(--acento); margin-left: .07em; }
.carta-editor .ed-cuerpo { max-width: 720px; }
.carta-editor .ed-cuerpo p { font-size: 19px; line-height: 1.7; color: #d9d4c9; margin: 0 0 1em; }
.carta-editor .ed-cuerpo p:first-child { font-family: var(--f-bodoni); font-style: italic; font-size: 22px; line-height: 1.45; color: var(--hueso); }
.carta-editor .ed-firma { font-family: var(--f-geo) !important; font-weight: 600; font-size: 13px !important; letter-spacing: .22em; text-transform: uppercase; }
@media (max-width: 900px) { .cierre-portada { grid-template-columns: 1fr; } .bajar-fanzine { margin-bottom: 40px; } }
/* carta del editor con letra más pequeña */
.carta-editor .ed-titulo { font-size: clamp(24px, 2.2vw, 32px) !important; margin-bottom: 14px !important; }
.carta-editor .ed-cuerpo p { font-size: 16px !important; line-height: 1.65 !important; }
.carta-editor .ed-cuerpo p:first-child { font-size: 18px !important; line-height: 1.45 !important; }
.carta-editor .ed-firma { font-size: 12px !important; }
/* la carta ocupa todo su ancho, en dos columnas para que las líneas no queden largas */
.carta-editor .ed-cuerpo { max-width: none !important; column-count: 2; column-gap: 40px; }
.carta-editor .ed-cuerpo p { break-inside: avoid-column; }
.carta-editor .ed-firma { column-span: none; }
@media (max-width: 1100px) { .carta-editor .ed-cuerpo { column-count: 1; } }
/* ritmo vertical parejo: 80 px entre secciones de la portada */
body:not(.pag-articulo) .indice { margin-bottom: 80px; }
.cierre-portada { margin: 0 0 80px !important; }
.tres { margin-bottom: 0; }
.tres { margin-bottom: 80px !important; }
/* carta del editor en una sola columna */
.carta-editor .ed-cuerpo { column-count: 1 !important; max-width: none !important; }
.tres { margin-bottom: 0 !important; }
.tres + .bloque-tit { margin-top: 80px; }

/* ---------- tarjetas de "En este número" con foto a todo el ancho ---------- */
.marco.con-foto { grid-template-rows: auto 1fr; }
.marco .tarjeta-foto { grid-column: 1 / -1; display: block; position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-bottom: 1px solid var(--hueso-2); }
.marco .tarjeta-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; display: block; filter: grayscale(1) contrast(1.4) brightness(.85); transition: filter .3s; }
.marco .tarjeta-foto::after { content: ""; position: absolute; inset: 0; mix-blend-mode: multiply; opacity: .45;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.8 -.6'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.marco:hover .tarjeta-foto img { filter: grayscale(1) contrast(1.4) brightness(1); }
.marco.con-foto .vertical { grid-row: 2; }
.marco.con-foto .dentro { grid-row: 2; }
.marco.con-foto .num { display: none; }
.marco.con-foto h3 { margin-top: 4px; }

/* Editorial en letra chica bajo el número (página Números) */
.edicion .ed-mini { margin: 22px 0 4px; max-width: 260px; }
.edicion .ed-mini h3 { font-family: var(--f-geo); font-weight: 600; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--hueso); margin: 0 0 8px; line-height: 1.35; }
.edicion .ed-mini p { font-size: 14px; line-height: 1.55; color: var(--hueso-2); margin: 0 0 9px; }
.edicion .ed-mini .ed-firma { font-family: var(--f-geo); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; margin-top: 10px; }
.edicion .ed-mini .ed-firma a { color: var(--hueso); text-decoration: none; }
@media (max-width: 760px) { .edicion .ed-mini { max-width: 600px; } }

/* Carta del director en portada · letra más chica (28-09-2026) */
.carta-editor .ed-titulo { font-size: clamp(20px, 1.7vw, 24px) !important; margin-bottom: 12px !important; }
.carta-editor .ed-cuerpo p { font-size: 14.5px !important; line-height: 1.6 !important; margin-bottom: .8em !important; }
.carta-editor .ed-cuerpo p:first-child { font-size: 16px !important; line-height: 1.45 !important; }
.carta-editor .ed-firma { font-size: 11px !important; }
@media (max-width: 900px) { .edicion > div:first-child { margin-bottom: 32px; } }

/* Listado de sección (28-09-2026): agrupado por número; el número grande calado va una vez por grupo, a la izquierda */
.lista-sec article.opC { display: block !important; padding: 28px 0 30px !important; }
.lista-sec .ls-datos { font-family: var(--f-geo) !important; font-style: normal !important; font-size: 12px !important; letter-spacing: .16em; text-transform: uppercase; color: var(--gris) !important; margin: 12px 0 0 !important; }
.lista-sec .ls-datos a { color: var(--hueso-2); text-decoration: none; }
.lista-sec .ls-bajada { font-size: 19px !important; }
.bloque-num { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 0 56px; border-top: 2px solid var(--hueso); padding-top: 6px; margin-bottom: 40px; }
.bloque-num .gran { position: sticky; top: 24px; align-self: start; text-decoration: none; padding-top: 22px; }
.bloque-num .gran span { display: block; font-family: var(--f-bloque); font-weight: 900; font-size: 150px; line-height: .8; color: transparent; -webkit-text-stroke: 1.5px var(--hueso-2); margin: 6px 0 12px; }
.bloque-num .gran small { display: block; font-family: var(--f-geo); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--gris); }
.bloque-num .gran:hover span { -webkit-text-stroke-color: var(--acento-texto); }
.bloque-num .arts article.opC:last-child { border-bottom: none; }
@media (max-width: 760px) {
  .bloque-num { grid-template-columns: 1fr; }
  .bloque-num .gran { position: static; display: flex; align-items: baseline; gap: 10px; padding-top: 14px; }
  .bloque-num .gran span { font-size: 64px; margin: 0; }
}

/* Celular (28-09-2026): la franja de datos del artículo pasa a una línea corrida, liviana */
@media (max-width: 760px) {
  .meta { display: flex !important; flex-wrap: wrap; gap: 4px 0; padding: 12px 0 14px; border-top-width: 3px !important; }
  .meta div { padding: 0 !important; border: none !important; font-family: var(--f-geo) !important; font-weight: 500 !important; font-size: 12px !important; letter-spacing: .14em !important; text-transform: uppercase; color: var(--hueso-2) !important; }
  .meta div small { display: none !important; }
  .meta div + div::before { content: "·"; margin: 0 8px; color: var(--gris); }
  .meta div:first-child::before { content: "Por "; }
}