/* ══════════════════════════════════════════════════════════════════
   RECO-LAB · CORRECCIÓN FINAL ACOTADA · 16 de agosto de 2026
   ------------------------------------------------------------------
   Capa de corrección. Se carga en último lugar en las cuatro páginas.
   Retirar este único <link> devuelve el sitio al estado anterior a
   esta pasada: no reemplaza ninguna regla previa, sólo la cierra.

   No hay rediseño aquí. Cada bloque corresponde a un punto medido
   del pedido y declara qué media, no qué opina.

   Nota de sistema: en este sitio cada rótulo envuelve dos hermanos
   reales, <span class="lang-es"> y <span class="lang-en">, y el
   conmutador de idioma trabaja sobre `display`. Ninguna regla de esta
   hoja toca `display` en esos spans, y todo selector que podría
   alcanzarlos está acotado con `>` o con una clase explícita.
   ══════════════════════════════════════════════════════════════════ */


/* ══ 5 · ESCALA VISUAL ═════════════════════════════════════════════
   El contenedor medía 1360px de caja. A 85–90 % de zoom —que es como
   se abre el sitio en una pantalla de escritorio real— eso deja entre
   700 y 900px muertos a los lados y el conjunto se lee como si
   estuviera pensado para mirarse al 70 %.

   La medida sube a 1560px y el margen lateral acompaña. Sólo cambian
   los dos tokens que unify-final ya había centralizado, así que el
   ajuste llega a los cuatro contenedores del sitio —.row, .rlx-row,
   .rl-shell-row y .wrap— por una sola vía y sin tocar la tipografía.
   La medida de lectura de los párrafos sigue gobernada por sus
   propios `max-width` en ch: el ancho extra va a figuras, tablas y
   tarjetas, que es donde faltaba. */
:root{
  --rl-measure:1560px;
  --rl-gutter:clamp(20px,2.1vw,40px);
}

/* Por encima de la medida nueva el contenido ya no crece: a partir de
   ahí el margen es margen, no espacio desperdiciado. */
@media (min-width:1700px){
  :root{--rl-gutter:clamp(40px,3vw,72px);}
}


/* ══ 3 · HEADER · el nav respira entre el wordmark y los controles ══
   La grilla era simétrica —1fr auto 1fr— y por construcción centraba
   el nav sobre el eje de la página. Medido a 1280: el wordmark
   terminaba en 116,9 y el nav empezaba en 432,3 (315px de aire),
   mientras que del otro lado quedaban 16px hasta los controles. El
   centro geométrico era correcto y la lectura, no: el grupo central
   se veía pegado a Claro/Oscuro/Noche.

   Las dos columnas laterales pasan a medir su contenido y la central
   toma el sobrante, con el nav centrado dentro de ella. El nav queda
   centrado en el espacio disponible, que es lo que el ojo mide. */
@media (min-width:901px){
  .rlx-hdr-row{
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:clamp(18px,2vw,34px);
  }
  .rlx-hdr-row > .rlx-nav{
    justify-self:stretch;
    justify-content:center;
    flex-wrap:nowrap;
  }
  /* Con el nav centrado en el sobrante, los controles recuperan el
     padding que la grilla simétrica les había recortado. */
  .rlx-end{gap:12px;}
  .rlx-mood button{padding:0 11px;}
  .rlx-lang button{padding:0 11px;}
  .rlx-contact{padding:0 16px;}
}

/* Entre 901 y 1180 el sobrante central es corto: el nav aprieta su
   gap antes que salirse de su columna. */
@media (min-width:901px) and (max-width:1180px){
  .rlx-nav{gap:12px;}
  .rlx-hdr-row{gap:16px;}
}


/* ══ 4 · PIE ═══════════════════════════════════════════════════════
   4.1 · La firma de campos en una sola línea, sin invadir Navegación.

   `editorial-2026-08-16` ya la había devuelto a `nowrap` por encima
   de 1101 y le había dado a la columna de identidad un mínimo fijo de
   566px. Un mínimo fijo es una apuesta: basta con que el idioma, la
   fuente o el tracking cambien un punto para que la línea vuelva a
   cruzar. El mínimo pasa a ser `min-content`, que en una línea
   `nowrap` es exactamente su ancho: la columna no puede quedar más
   angosta que su propio contenido, así que la invasión deja de ser
   posible por construcción y no por medida. */
/* La regla vivía sólo en `editorial-2026-08-16`, que cargan nada más
   que las dos páginas de proyecto: en la home y en Métodos la firma
   seguía partiéndose en dos líneas. Sube a esta hoja, que cargan las
   cuatro, para que el pie sea el mismo pie en todo el sitio. */
@media (min-width:1101px){
  .rlx-ftr-grid{
    grid-template-columns:minmax(min-content,1.5fr) minmax(0,0.82fr) minmax(0,1.12fr);
  }
  .rlx-ftr-brand{min-width:0;}
  .rlx-ftr .rlx-fields .txt,
  .rlx-ftr-brand .rlx-fields .txt{white-space:nowrap;}
  .rlx-ftr .rlx-fields{font-size:11.6px;letter-spacing:0.055em;}
  .rlx-ftr .rlx-fields > .txt > span{white-space:nowrap;}
}

/* Por debajo de 1101 la línea vuelve a envolver, que es el
   comportamiento correcto cuando el ancho ya no alcanza. */
@media (max-width:1100px){
  .rlx-ftr .rlx-fields .txt,
  .rlx-ftr-brand .rlx-fields .txt{white-space:normal;}
}


/* ══ 1 · MÉTODOS · marco analítico progresivo ══════════════════════
   1.1 · Sin negrita dentro de las cápsulas.

   El peso 600 venía de `.rl-mx-prog-chain span` en
   corrections-2026-08, un selector de descendencia que además alcanza
   el span de idioma. Se corrige el peso en el paso y se hereda hacia
   adentro, sin volver a escribir un selector de descendencia y sin
   tocar `display`. */
.progression-chain > span,
.rl-mx-prog-chain > span{
  font-weight:400;
  letter-spacing:0.02em;
}
.progression-chain > span > span,
.rl-mx-prog-chain > span > span{
  font-weight:inherit;
  letter-spacing:inherit;
  color:inherit;
}

/* 1.2 · Una flecha limpia entre cápsulas.

   El tramo de unión corría de -30 a 0 —es decir, hasta el borde mismo
   de la cápsula siguiente— y la punta de flecha estaba clavada en
   -13, a mitad del tramo. El resultado en pantalla era una línea que
   entraba en la cápsula con una punta suelta encima: dos marcas para
   un solo vínculo.

   El tramo ahora termina donde empieza la punta, y la punta termina
   antes del borde. Una sola flecha, sin línea que atraviese nada. */
@media (min-width:761px){
  .progression-chain > span + span::before,
  .rl-mx-prog-chain > span + span::before{
    left:-28px;
    width:14px;
  }
  .progression-chain > span + span::after,
  .rl-mx-prog-chain > span + span::after{
    left:-13px;
  }
}


/* ══ 2 · MÉTODOS · tarjetas de resumen ═════════════════════════════
   Los cuatro valores de gobierno de la página —capas, resolución,
   cobertura, criterio— iban en negrita. El rótulo es lo que jerarquiza
   la tarjeta; el valor sólo tiene que leerse. Peso normal y tinta
   plena, sin tocar los rótulos. */
.methods-meta > div > .v,
.rl-mx-meta > div > .v,
.rl-mp-meta > div > .v{
  font-weight:400;
  color:var(--ink);
}
.methods-meta > div > .v > span,
.rl-mx-meta > div > .v > span,
.rl-mp-meta > div > .v > span{
  font-weight:inherit;
  color:inherit;
}
/* Los rótulos conservan su papel y su peso. */
.methods-meta > div > .k,
.rl-mx-meta > div > .k,
.rl-mp-meta > div > .k{font-weight:600;}


/* ══ 6 · TARJETAS Y CONTENEDORES ═══════════════════════════════════
   Las tiras internas de una tarjeta —cabecera, pie de fuente, nota
   técnica, cierre— heredaban un radio de 14px en las cuatro esquinas.
   Dentro de un contenedor con `overflow:hidden` eso dibuja dos
   esquinas redondeadas en mitad de una superficie plana: es la
   "card cortada" del pedido, y también el borde que parecía
   incompleto.

   Regla del sistema: una tira interna sólo redondea del lado por el
   que toca el borde de su tarjeta. Si no toca ninguno, no redondea. */
.rl-fig-block > .rl-fig-foot,
.rl-fig-block > .rl-technote,
.rl-fig-block > .rl-fai-close,
.rl-fig-block > .rl-ev,
.rl-table-wrap > .rl-ev,
.rl-matrix > .rl-matrix-foot,
.rl-matrix > .rl-ev,
.rl-fai-intro > .rl-fai-close{
  border-radius:0;
}
.rl-fig-block > :last-child,
.rl-table-wrap > :last-child,
.rl-matrix > :last-child,
.rl-embed > :last-child,
.rl-fai-intro > :last-child{
  border-radius:0 0 var(--r-card,14px) var(--r-card,14px);
}
.rl-fig-block > :first-child,
.rl-table-wrap > :first-child,
.rl-matrix > :first-child,
.rl-embed > :first-child,
.rl-fai-intro > :first-child{
  border-top-left-radius:var(--r-card,14px);
  border-top-right-radius:var(--r-card,14px);
}
/* Una tira que es a la vez la primera y la última conserva las cuatro
   esquinas: ahí sí toca los dos bordes. */
.rl-fig-block > :only-child,
.rl-table-wrap > :only-child,
.rl-matrix > :only-child,
.rl-embed > :only-child,
.rl-fai-intro > :only-child{border-radius:var(--r-card,14px);}

/* Un bloque sin plato cuyo único borde es el filete de la izquierda no
   es una tarjeta: el radio le curvaba las dos puntas del filete y lo
   dejaba leyéndose como un borde a medio dibujar. */
.proj-meta{border-radius:0;}

/* Los paneles interiores de una figura doble no son tarjetas: son
   mitades de una sola. No redondean ni dibujan borde suelto. */
.rl-fig-duo,
.rl-fig-duo > .rl-fig-panel,
.rl-pair-frame{border-radius:0;}
.rl-pair > .rl-pair-frame:first-child{border-top-left-radius:var(--r-card,14px);border-bottom-left-radius:var(--r-card,14px);}
.rl-pair > .rl-pair-frame:last-child{border-top-right-radius:var(--r-card,14px);border-bottom-right-radius:var(--r-card,14px);}

/* Ninguna esquina viva en las cajas que esta pasada toca. */
.rl-regime,
.rl-ev,
.rl-reading,
.finding,
.rl-diag,
.rl-diag-close{border-radius:var(--r-card,14px);}


/* ══ 7 · LA FUENTE VIVE DENTRO DEL BLOQUE DEL GRÁFICO ══════════════
   Medido: la línea compacta de evidencia que sigue a un .rl-embed,
   a un .rl-pair o a la matriz UPI se dibujaba como hermana suelta,
   con `margin-top:10px`, fondo transparente y sin radio. En pantalla
   quedaba flotando debajo del gráfico, separada de él.

   Donde la línea ya vivía dentro de la figura (.rl-fig-block,
   .rl-table-wrap) el comportamiento era el correcto y no se toca.

   La corrección la vuelve barra inferior pegada al gráfico: mismo
   ancho, mismo fondo de tarjeta, borde continuo con el bloque de
   arriba y las dos esquinas inferiores redondeadas. El bloque que la
   precede pierde sus esquinas inferiores para que los dos lean como
   una sola pieza. */
.rl-embed + .rl-ev,
.rl-pair + .rl-ev,
.rl-matrix + .rl-ev,
.rl-fig-block + .rl-ev,
.rl-table-wrap + .rl-ev,
.cluster-viz + .rl-ev{
  margin-top:0;
  border:1px solid var(--rule-strong);
  border-top:0;
  border-radius:0 0 var(--r-card,14px) var(--r-card,14px);
  background:var(--surface);
  padding-inline:clamp(14px,1.4vw,22px);
  padding-block:9px;
}
.rl-embed:has(+ .rl-ev),
.rl-pair:has(+ .rl-ev),
.rl-matrix:has(+ .rl-ev),
.rl-fig-block:has(+ .rl-ev),
.rl-table-wrap:has(+ .rl-ev),
.cluster-viz:has(+ .rl-ev){
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  margin-bottom:0;
}

/* La barra hereda la tinta del modo, no un gris fijo: estos bloques
   son islas de papel en Claro y placas oscuras en Oscuro/Noche, y la
   fuente tiene que seguir a su bloque. */
html[data-theme="dark"] :is(.rl-embed,.rl-pair,.rl-matrix,.rl-fig-block,.rl-table-wrap,.cluster-viz) + .rl-ev,
html[data-theme="night"] :is(.rl-embed,.rl-pair,.rl-matrix,.rl-fig-block,.rl-table-wrap,.cluster-viz) + .rl-ev{
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.16);
}

/* La ficha de evidencia que cierra el diagnóstico final del Proyecto
   02 vive dentro de su propio bloque: no es una barra pegada a una
   figura, sino el alcance del bloque de cierre. */
.rl-diag-close > .rl-ev{
  margin:20px 0 0;
  border:0;
  border-top:1px solid var(--rule);
  border-radius:0;
  background:none;
  padding:12px 0 0;
}

/* El pie de la matriz UPI tenía 16px de aire por encima dentro de su
   propia tarjeta: la fuente quedaba suelta dentro del bloque en vez
   de cerrarlo. */
.rl-matrix > .rl-matrix-foot{
  margin-top:0;
  border-top:1px solid var(--rule);
  padding-block:11px;
}

/* Cuando la línea ya vive dentro de la figura, `editorial-2026-08-16`
   la dejaba con `margin:0 22px 18px`: sangrada 22px de los dos lados y
   con 18px de tarjeta vacía por debajo. Leída así es una etiqueta
   suelta apoyada dentro del bloque, no el pie del bloque.

   Pasa a barra a sangre, pegada al fondo de la tarjeta: la sangría se
   convierte en padding, el aire inferior desaparece y la barra apoya
   sobre las dos esquinas inferiores. El filete de color que codifica
   la naturaleza del dato se conserva, que es lo que hace legible la
   distinción del punto 8. */
.rl-fig-block > .rl-ev,
.rl-table-wrap > .rl-ev,
.rl-matrix > .rl-ev{
  margin:0;
  padding:9px clamp(14px,1.4vw,22px) 9px calc(clamp(14px,1.4vw,22px) - 3px);
}
.rl-fig-block > .rl-ev:last-child,
.rl-table-wrap > .rl-ev:last-child,
.rl-matrix > .rl-ev:last-child{
  border-radius:0 0 var(--r-card,14px) var(--r-card,14px);
}


/* ══ 8 · FUENTE EXTERNA · ELABORACIÓN RECO-LAB ═════════════════════
   La línea compacta ya trae los tres campos separados en el marcado
   —.ev-n naturaleza, .ev-f fuentes activas externas, .ev-e
   elaboración— pero los pintaba con la misma tinta, así que se leían
   como una sola cadena y el lector podía suponer que la elaboración
   venía de la fuente externa.

   La distinción se hace visible sin agregar texto ni cambiar ningún
   dato: la naturaleza mantiene su pastilla, las fuentes activas van
   en tinta plena porque son atribución externa, y la elaboración
   RECO-LAB va en la tinta institucional y con su propia marca. */
.rl-ev > .ev-f{
  color:var(--ink);
  font-weight:500;
}
.rl-ev > .ev-p,
.rl-ev > .ev-s{
  color:var(--muted);
  font-weight:400;
}
/* Sobre papel el acento medio da 4,15:1 a 10px, por debajo del piso.
   La elaboración usa el paso oscuro del mismo azul, que es el mismo
   color de la familia y sí pasa. */
.rl-ev > .ev-e{
  color:var(--accent-700,#416180);
  font-weight:600;
}
html[data-theme="dark"] .rl-ev > .ev-e,
html[data-theme="night"] .rl-ev > .ev-e{color:var(--accent-panel,#8fb2d4);}

/* Por el mismo motivo, la pastilla DERIVADA sobre papel baja un paso:
   #5980A6 a 10px daba 4,15:1. Las otras tres naturalezas ya pasaban y
   no se tocan. El filete izquierdo conserva su tono original, que es
   donde el color codifica sin tener que leerse. */
.rl-ev.is-derivada > .ev-n{color:#416180;}

/* ── Islas de papel ────────────────────────────────────────────────
   `.rl-embed` y `.rl-table-wrap` son placas blancas en los tres modos
   por diseño. Las tintas de naturaleza, en cambio, conmutan por modo,
   así que en Oscuro y Noche la línea aclaraba sus colores sobre un
   fondo que seguía siendo blanco: DERIVADA quedaba en 1,81:1, es
   decir ilegible. La barra que vive dentro de una isla de papel se
   pinta con la paleta del papel, no con la del modo. */
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev{
  color:#5a6672;
  border-top-color:rgba(20,30,40,0.14);
}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > span + span::before,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > span + span::before{
  color:rgba(20,30,40,0.28);
}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > .ev-f,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > .ev-f{color:#26303a;}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > .ev-e,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev > .ev-e{color:#416180;}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-observada > .ev-n,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-observada > .ev-n{color:#2F6D69;}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-modelada > .ev-n,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-modelada > .ev-n{color:#41627F;}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-derivada > .ev-n,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-derivada > .ev-n{color:#416180;}
html[data-theme="dark"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-proxy > .ev-n,
html[data-theme="night"] :is(.rl-embed,.rl-table-wrap) > .rl-ev.is-proxy > .ev-n{color:#8C4527;}

/* Un filete corto antes de la elaboración separa lo que aporta la
   fuente de lo que aporta el laboratorio. El separador es decorativo
   y queda fuera del árbol de accesibilidad. */
.rl-ev > .ev-e::before{
  content:"";
  display:inline-block;
  width:1px;
  height:0.95em;
  margin-right:0.62em;
  vertical-align:-0.14em;
  background:var(--rule-strong);
}

/* Los spans de idioma dentro de cada campo heredan; nunca se les fija
   `display`, que es el conmutador ES/EN. */
.rl-ev > span > span{
  color:inherit;
  font-weight:inherit;
  background:none;
  border:0;
  padding:0;
}


/* ══ 10 · PROYECTO 02 · corte analítico ════════════════════════════
   Un punto más de cuerpo sobre el `.rl-fig-sub` del bloque, que es lo
   que fija año, línea base y sobre qué se calcula el ratio. El resto
   de las bajadas de esa figura miden 11,75px; ésta mide 12,75. */
.rl-table-wrap .rl-fig-sub.is-cut,
.rl-fig-block .rl-fig-sub.is-cut{font-size:12.75px;}


/* ══ 9 · PROYECTO 02 · frase de pivote ═════════════════════════════
   La frase cierra el bloque de retornos y abre el de destino: es un
   giro de argumento, no una cifra jerarquizada. Cursiva, no negrita.

   El `!important` no es pereza. `system-2.9` declara
   `main em, section em, .project-block em … {font-style:normal
   !important}` porque en este sitio <em> es un acento tipográfico
   —el "-LAB" del wordmark, el énfasis de los títulos— y nunca una
   cursiva. Para que esta frase sí sea cursiva hay que ganarle a esa
   declaración, y se le gana en el ámbito más chico posible: sólo
   dentro de .rl-pivot. */
.rl-pivot > span > em,
.rl-pivot em{
  font-style:italic !important;
  font-weight:400;
  color:var(--ink);
}


/* ══ 12 · UPI · TARJETAS DE RÉGIMEN ════════════════════════════════
   Lo que estaba mal, medido a 1280 sobre las seis tarjetas:

     · `.rq` (cuadrante) y `.ri` (implicación) caían en la misma fila
       de la grilla heredada pero en columnas distintas, así que la
       implicación se dibujaba en una columna de 74,8px de ancho por
       394px de alto: el texto quedaba partido letra a letra. Es la
       "columna estrecha que rompe el texto" del pedido.
     · el filete de Orientación arrancaba en 350 / 370,8 / 391,5 /
       392,9 / 474,4 según la tarjeta: cinco alturas distintas.
     · los tags territoriales empezaban en 475, 507 o 557,9.
     · en la última tarjeta el nombre envolvía a dos líneas y empujaba
       la pastilla de color 21px hacia abajo respecto de las otras.

   La tarjeta se rehace como una columna de seis filas compartidas por
   `subgrid`: las seis tarjetas de una misma banda toman las mismas
   alturas de fila, así que el filete cae al mismo nivel en todas y
   los tags apoyan en la misma base. No cambia ningún contenido, ni un
   color, ni un territorio. */
.rl-regimes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(14px,1.4vw,20px);
  row-gap:clamp(14px,1.4vw,20px);
  align-items:stretch;
}
.rl-regime{
  grid-row:span 6;
  display:grid;
  grid-template-rows:subgrid;
  grid-template-columns:minmax(0,1fr);
  row-gap:0;
  padding:clamp(18px,1.5vw,22px) clamp(18px,1.6vw,24px);
  min-width:0;
}
/* Cada pieza a su fila, en el orden en que ya vive en el marcado.
   Una sola columna: nada vuelve a compartir fila con nada.

   `grid-column` se declara en cada regla, no una sola vez con `> *`:
   corrections-2026-08 manda `.rl-regime .rn{grid-column:2}` con
   especificidad (0,2,0), que le gana a un `.rl-regime > *` de (0,1,0).
   Sin esto el nombre se iba a una segunda columna implícita y arrastraba
   a la implicación a una columna de 53px de ancho.

   `align-self:stretch` en las dos tiras con filete: es el borde
   superior lo que tiene que caer al mismo nivel en toda la banda, y
   con `end` una tira corta se descolgaba hacia abajo dentro de su
   fila y subía su propio filete. */
.rl-regime > *{min-width:0;}
.rl-regime > .sw{grid-column:1;grid-row:1;align-self:start;justify-self:start;}
.rl-regime > .rq{grid-column:1;grid-row:2;align-self:start;}
.rl-regime > .rn{grid-column:1;grid-row:3;align-self:start;justify-self:stretch;}
.rl-regime > .ri{grid-column:1;grid-row:4;align-self:start;}
.rl-regime > .ro{grid-column:1;grid-row:5;align-self:stretch;}
.rl-regime > .rt{grid-column:1;grid-row:6;align-self:stretch;}

.rl-regime > .sw{
  display:block;
  width:26px;height:4px;
  border-radius:2px;
  margin:0 0 12px;
}
.rl-regime > .rq{
  display:block;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:10.6px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  /* --muted, no --muted-2: a 10px en versalitas el gris más claro cae
     a 3,07:1 en Claro y 4,12:1 en Noche, por debajo del piso. */
  color:var(--muted);
  margin:0 0 6px;
  line-height:1.5;
}
.rl-regime > .rn{
  display:block;
  font-size:17px;
  line-height:1.28;
  margin:0 0 10px;
  text-wrap:balance;
}
.rl-regime > .ri{
  display:block;
  font-size:13.4px;
  line-height:1.62;
  color:var(--muted);
  margin:0 0 14px;
  max-width:none;
  hyphens:none;
}
/* El filete de Orientación: mismo nivel en toda la banda porque la
   fila 5 es la misma fila para las tres tarjetas. */
.rl-regime > .ro{
  display:block;
  border-top:1px solid var(--rule);
  padding-top:11px;
  margin:0 0 12px;
}
.rl-regime > .ro > .rok{
  display:block;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:10.2px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  /* --muted, no --muted-2: a 10px en versalitas el gris más claro cae
     a 3,07:1 en Claro y 4,12:1 en Noche, por debajo del piso. */
  color:var(--muted);
  margin-bottom:4px;
}
.rl-regime > .ro > .rov{
  display:block;
  font-size:13px;
  line-height:1.58;
  color:var(--ink);
}
/* Los tags apoyan abajo, sobre su propio filete. */
.rl-regime > .rt{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  border-top:1px solid var(--rule);
  padding-top:11px;
  margin:0;
}
.rl-regime > .rt > b.cap{
  min-width:0;
  flex:0 0 auto;
  font-size:11.6px;
  line-height:1.5;
  padding:3px 9px;
  border-radius:999px;
  white-space:nowrap;
}

@media (max-width:1080px){
  .rl-regimes{grid-template-columns:repeat(2,minmax(0,1fr));}
}
/* En una sola columna `subgrid` deja de aportar —cada tarjeta es su
   propia banda— y la tarjeta vuelve a una columna flexible, con los
   tags empujados abajo por la implicación. */
@media (max-width:720px){
  .rl-regimes{grid-template-columns:minmax(0,1fr);}
  .rl-regime{
    grid-row:auto;
    display:flex;
    flex-direction:column;
  }
  .rl-regime > .ri{flex:1 1 auto;}
}


/* ══ 13 · PROYECTO 02 · sección 08 ═════════════════════════════════
   Bloque de cierre analítico del proyecto. Tres hallazgos en tarjetas
   de igual estructura y un cierre integrador de ancho completo, que
   se lee como conclusión y no como una cuarta tarjeta suelta.

   Sin cajas cuadradas, sin reducción de cuerpo para hacer entrar el
   texto y sin columnas angostas: las tarjetas bajan a dos columnas
   antes de que la medida de lectura se rompa. */
.rl-diag{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.4vw,20px);
  align-items:stretch;
  margin-bottom:clamp(18px,1.8vw,26px);
}
.rl-diag > .rl-diag-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  background:var(--surface);
  border:1px solid var(--rule-strong);
  border-radius:var(--r-card,14px);
  padding:clamp(20px,1.7vw,26px) clamp(20px,1.8vw,28px);
  box-shadow:0 20px 40px -34px rgba(14,20,24,0.30);
}
html[data-theme="dark"] .rl-diag > .rl-diag-card,
html[data-theme="night"] .rl-diag > .rl-diag-card{
  background:rgba(255,255,255,0.045);
  border-color:rgba(255,255,255,0.14);
  box-shadow:0 22px 44px -34px rgba(0,0,0,0.7);
}
.rl-diag-card > .n{
  font-family:var(--mono,ui-monospace,monospace);
  font-size:10.6px;
  letter-spacing:0.12em;
  /* Paso oscuro del acento: el medio da 4,15:1 a este cuerpo. */
  color:var(--accent-700,#416180);
}
html[data-theme="dark"] .rl-diag-card > .n,
html[data-theme="night"] .rl-diag-card > .n{color:var(--accent-panel,#8fb2d4);}
.rl-diag-card > h4{
  margin:0;
  font-size:17.5px;
  line-height:1.3;
  color:var(--ink);
  font-weight:600;
  text-wrap:balance;
}
.rl-diag-card > h4 em{font-style:italic;font-weight:600;}
.rl-diag-card > p{
  margin:0;
  font-size:14.2px;
  line-height:1.68;
  color:var(--muted);
  max-width:none;
}
.rl-diag-card > p strong{color:var(--ink);font-weight:600;}

/* El cierre integrador: ancho completo, plato propio y filete de
   acento a la izquierda. No es una cuarta tarjeta y no debe leerse
   como tal. */
.rl-diag-close{
  position:relative;
  overflow:hidden;
  background:var(--surface);
  border:1px solid var(--rule-strong);
  border-radius:var(--r-card,14px);
  padding:clamp(24px,2.2vw,34px) clamp(24px,2.4vw,38px) clamp(24px,2.2vw,34px) clamp(28px,2.8vw,44px);
}
html[data-theme="dark"] .rl-diag-close,
html[data-theme="night"] .rl-diag-close{
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.14);
}
.rl-diag-close::before{
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:4px;
  background:linear-gradient(180deg,#1d2d3d 0%,#5980a6 38%,#3f7d84 72%,#a2705a 100%);
}
.rl-diag-close > h4{
  margin:0 0 14px;
  font-size:clamp(19px,1.7vw,23px);
  line-height:1.26;
  color:var(--ink);
  font-weight:600;
  text-wrap:balance;
}
.rl-diag-close > p{
  margin:0 0 14px;
  font-size:15px;
  line-height:1.72;
  color:var(--muted);
  max-width:82ch;
}
.rl-diag-close > p:last-of-type{margin-bottom:0;}
.rl-diag-close > p strong{color:var(--ink);font-weight:600;}
/* La implicación de política cierra el bloque y se separa por aire y
   tinta, no por otra caja. */
.rl-diag-close > p.is-implication{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--rule);
  color:var(--ink);
}

@media (max-width:1080px){
  .rl-diag{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:720px){
  .rl-diag{grid-template-columns:minmax(0,1fr);}
}


/* ══ 14 · PROYECTO 01 · fuente del ranking IVUB ════════════════════
   El ranking es elaboración RECO-LAB sobre fuentes activas externas,
   no un dato leído de una fuente. La barra queda dentro del bloque,
   pegada al ranking, con el mismo tratamiento que el resto de las
   fuentes del sitio. */
.rl-rank-src{
  display:block;
  margin:0;
  border-top:1px solid var(--rule);
  padding:11px clamp(14px,1.4vw,22px);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:11.4px;
  line-height:1.55;
  letter-spacing:0.03em;
  color:var(--muted);
}
.rl-rank-src > span > b{
  color:var(--accent-700,#416180);
  font-weight:600;
}
html[data-theme="dark"] .rl-rank-src > span > b,
html[data-theme="night"] .rl-rank-src > span > b{color:var(--accent-panel,#8fb2d4);}


/* ══ 15 · QA · rótulo de banda del ranking IVUB ════════════════════
   Encontrado al verificar el bloque del ranking en los tres modos:
   el rótulo de banda se pintaba con el color de la propia banda sobre
   el plato de la tarjeta y daba 2,65:1 en Oscuro, 3,08 en Noche y
   3,81 en Claro. Ilegible en versalitas de 12,4px.

   `unify-final` ya lo había llevado a `--ink`, pero con
   `.cluster-viz .cv-col .cv-tag` (0,3,0), y `system-2.9` lo fija por
   banda con `.cluster-viz .cv-col.resilient .cv-tag` (0,4,0), que le
   gana. Se repite el patrón de cuatro clases para las tres bandas.

   El color de banda no se pierde: sigue en la pastilla `.sw` y en el
   filete del rótulo, que es donde codifica sin tener que leerse. */
.cluster-viz .cv-col.critical .cv-tag,
.cluster-viz .cv-col.monitor .cv-tag,
.cluster-viz .cv-col.resilient .cv-tag{color:var(--ink);}