/* Campus Cognitionis · demo r9 · Páginas de producto del agente B
   revistas.html (W06) · quiosco.html (W14) · publicar.html (W15) · heptaclasificacion.html (W16) · medios-y-cursos.html (W23)
   Ilustración: no es código del proyecto. Se carga después de escaparate.css y usa su kit (§5 de Arquitectura_web_r9.md):
   .producto, .producto-heroe, .producto-seccion, .rasgos, .comparativa, .faq, .cta-banda, .lorem, .tesela__boton/__enlace.
   Aquí solo van las piezas propias de estas cinco páginas (prefijo rv-). Colores: las variables --t-* del kit
   (contraste AA ya medido en escaparate.css) y los colores de categoría del Registro §6.4 vía data-seccion (r8.css).
   Sin cristal anidado: el único cristal propio es el botón de reproducir, sobre un marco opaco. Sin estilos en línea (CSP). */

/* ---------- Comunes ---------- */
.rv-nota { max-width: 60ch; margin: 22px 0 0; font-size: 0.9rem; line-height: 1.5; color: var(--t-suave); }
.rv-cifra { margin: clamp(32px, 4vw, 48px) 0 0; font: 800 clamp(3rem, 7vw, 5rem)/1 var(--f-titular); letter-spacing: -0.02em; }
.rv-cifra small { margin-left: 6px; font: 600 clamp(1rem, 1.6vw, 1.3rem)/1 var(--f-interfaz); letter-spacing: 0; color: var(--t-suave); }
.producto-seccion .lorem, .cta-banda .lorem { margin-top: 18px; }   /* sitio para la etiqueta «pendiente» del kit */

/* ---------- Tarjetas en rejilla (con foto arriba) ---------- */
.rv-rejilla {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 12px;
  width: min(1120px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none; text-align: left;
}
.rv-rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rv-tarjeta { display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); }
.rv-tarjeta__foto { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.rv-tarjeta__hueco {          /* imagen que todavía no existe */
  display: grid; place-items: center; aspect-ratio: 4 / 3; margin: 0; font-size: 0.92rem; color: var(--t-suave);
  background: repeating-linear-gradient(135deg, transparent 0 12px, rgba(127, 127, 127, 0.14) 12px 13px);
}
.rv-tarjeta__hueco.lorem { outline-offset: -10px; }
.rv-tarjeta__hueco.lorem::after { top: 22px; right: 22px; }
.rv-tarjeta__cuerpo { display: flex; flex: 1; flex-direction: column; gap: 6px; padding: 20px 22px 18px; }
.rv-tarjeta__etiqueta { margin: 0; font: 700 0.74rem/1.2 var(--f-interfaz); letter-spacing: 0.12em; text-transform: uppercase; color: var(--t-marca); }
.rv-tarjeta__nombre { margin: 0; font: 800 clamp(1.45rem, 2.2vw, 1.9rem)/1.1 var(--f-titular); }
.rv-tarjeta__texto { margin: 0; font-size: 0.98rem; line-height: 1.5; color: var(--t-suave); }
.rv-tarjeta__texto.lorem { margin: 14px 0 4px; }
.rv-tarjeta__datos { display: grid; gap: 2px; margin: 6px 0 0; padding: 0; list-style: none; font-size: 0.94rem; line-height: 1.45; color: var(--t-suave); }
.rv-tarjeta__datos strong { font-weight: 600; color: var(--t-texto); }
.rv-tarjeta__datos .tesela__enlace { min-height: 32px; font-size: inherit; }
.rv-tarjeta__pie { display: flex; flex-wrap: wrap; gap: 0 20px; margin: auto 0 0; padding-top: 6px; }

/* ---------- Siete categorías: isotipo, nombre y lema ---------- */
.rv-siete {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px;
  width: min(1180px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-siete a {
  display: grid; justify-items: center; align-content: start; gap: 8px; height: 100%; padding: 22px 10px 20px; border-radius: 18px;
  background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); color: var(--t-texto); text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rv-siete a:hover { transform: translateY(-4px); box-shadow: var(--sombra-3); }
.rv-siete img { width: 56px; height: 56px; border-radius: 50%; }
.rv-siete__nombre { font: 800 1.12rem/1.15 var(--f-titular); }
.rv-siete__lema { font-size: 0.86rem; line-height: 1.35; color: var(--t-suave); }

/* ---------- Revistas externas: solo nombres en texto (sin logotipos ajenos) ---------- */
.rv-cabeceras {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px;
  width: min(1120px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-cabecera {
  display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; min-height: 210px; padding: 24px; border-radius: 18px;
  background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); text-align: left;
}
.rv-cabecera__nombre { margin: 0; font: 800 clamp(1.6rem, 2.6vw, 2.2rem)/1.05 var(--f-titular); letter-spacing: -0.01em; }
.rv-cabecera__logo { width: 64px; height: 64px; margin-bottom: auto; border-radius: 14px; object-fit: contain; background: var(--c-blanco); }
.rv-cabecera__tipo { margin: 0; font-size: 0.92rem; line-height: 1.45; color: var(--t-suave); }
.rv-cabecera__tipo.lorem { margin-top: 18px; }
.rv-cabecera .tesela__enlace { min-height: 32px; font-size: 0.98rem; }
.rv-cabecera__folios { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.rv-cabecera__folios a { font-size: 0.92rem; line-height: 1.35; color: var(--t-enlace); }

/* ---------- Autores ---------- */
.rv-autores {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 12px;
  width: min(980px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-autor { display: grid; justify-items: center; align-content: start; gap: 6px; padding: 28px 22px; border-radius: 18px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); }
.rv-autor img { width: 76px; height: 76px; margin-bottom: 6px; border-radius: 50%; }
.rv-autor__nombre { margin: 0; font: 800 1.3rem/1.2 var(--f-titular); }
.rv-autor__nombre a { color: inherit; text-decoration: none; }
.rv-autor__nombre a:hover { text-decoration: underline; text-underline-offset: 4px; }
.rv-autor__dato { margin: 0; font-size: 0.92rem; color: var(--t-suave); }
.rv-etiquetas { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 6px 0 0; padding: 0; list-style: none; }
.rv-etiquetas li { padding: 4px 11px; border-radius: 999px; background: var(--sec-fuerte); color: var(--c-blanco); font-size: 0.82rem; font-weight: 600; }
.rv-etiquetas li[data-seccion="deportiva"], [data-seccion="deportiva"] .rv-etiquetas li { background: #5E6016; }   /* 6,6:1; el fuerte #7C7F1E no llega a 4,5:1 (Recap C13) */

/* ---------- Pasos numerados ---------- */
.rv-pasos {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px;
  width: min(1120px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none; counter-reset: paso; text-align: left;
}
.rv-paso { counter-increment: paso; display: flex; flex-direction: column; gap: 8px; padding: 26px 24px; border-radius: 18px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); }
.rv-paso::before {
  content: counter(paso); display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 4px; border-radius: 50%;
  background: var(--t-boton-fondo); color: var(--t-boton-texto); font: 700 1rem/1 var(--f-interfaz);
}
.rv-paso__titulo { margin: 0; font: 800 1.3rem/1.2 var(--f-titular); }
.rv-paso__texto { margin: 0; font-size: 0.98rem; line-height: 1.5; color: var(--t-suave); }
.rv-paso__texto.lorem { margin-top: 14px; }
.rv-paso .tesela__enlace { min-height: 32px; margin-top: auto; font-size: 0.98rem; }

/* ---------- Precios ---------- */
.rv-precios {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 12px;
  width: min(980px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-precio { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 22px; border-radius: 18px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); }
.rv-precio__plan { margin: 0; font: 800 1.3rem/1.2 var(--f-titular); }
.rv-precio__cifra { margin: 8px 0 0; font: 800 clamp(2.4rem, 4vw, 3.2rem)/1 var(--f-titular); letter-spacing: -0.02em; }
.rv-precio__cifra small { margin-left: 4px; font: 600 1rem/1 var(--f-interfaz); letter-spacing: 0; color: var(--t-suave); }
.rv-precio__texto { margin: 6px 0 0; font-size: 0.95rem; line-height: 1.45; color: var(--t-suave); }
.rv-precio .lorem { margin-top: 18px; }

/* ---------- Dos columnas: texto y muestra ---------- */
.rv-dos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; width: min(1120px, 100%); text-align: left; }
.rv-dos .producto-seccion__acciones { justify-content: flex-start; }
.rv-lista {
  margin: 0; padding: 8px 22px; border-radius: 20px; list-style: none;
  background: var(--c-blanco); color: var(--c-azul); box-shadow: 0 1px 3px rgba(30, 32, 37, 0.08), 0 18px 40px rgba(30, 32, 37, 0.12);
}
.rv-lista li { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid #E3E1E2; }
.rv-lista li:last-child { border-bottom: 0; }
.rv-lista img { flex: none; width: 48px; height: 48px; border-radius: 12px; }
.rv-lista__nombre { margin: 0; font: 800 1.1rem/1.2 var(--f-titular); }
.rv-lista__fecha { margin: 2px 0 0; font-size: 0.88rem; color: #4A4D55; }   /* 8,6:1 sobre blanco */
.rv-lista__estado { margin-left: auto; padding: 4px 12px; border-radius: 999px; background: #E7F0EF; color: #2C4F4E; font-size: 0.8rem; font-weight: 600; white-space: nowrap; }   /* 8,4:1 */
.rv-lista__estado--no { background: #ECE9EA; color: #4A4D55; }
.rv-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.rv-chips li { padding: 6px 14px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--t-linea); font-size: 0.92rem; font-weight: 600; }

/* ---------- Categorías grandes (heptaclasificacion.html) y líneas editoriales (publicar.html) ---------- */
.rv-categorias {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px;
  width: min(1180px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none; text-align: left;
}
.rv-categoria {
  position: relative; display: flex; flex-direction: column; gap: 10px; overflow: hidden; padding: 30px 26px 24px; border-radius: 20px;
  background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde);
}
.rv-categoria::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--sec-portada-a), var(--sec-portada-b)); }
.rv-categoria__icono { width: 72px; height: 72px; border-radius: 50%; box-shadow: var(--sombra-3); }
.rv-categoria__nombre { margin: 6px 0 0; font: 800 clamp(1.6rem, 2.4vw, 2rem)/1.1 var(--f-titular); color: var(--sec-titulo); }
.producto-seccion--clara .rv-categoria__nombre { color: var(--t-texto); }
.rv-categoria__lema { margin: 0; font: italic 400 1.1rem/1.4 var(--f-titular); }
.rv-categoria .rv-etiquetas { justify-content: flex-start; }
.rv-categoria__pie { margin: auto 0 0; padding-top: 6px; }
.rv-categoria__pie .tesela__enlace { min-height: 36px; font-size: 1rem; }

/* ---------- Miradas: «Una mirada ___ sobre X» ---------- */
.rv-mirada { margin: clamp(32px, 4vw, 48px) 0 0; font: 800 clamp(1.6rem, 3.4vw, 2.6rem)/1.25 var(--f-titular); }
.rv-mirada__hueco { display: inline-block; min-width: 3.5ch; border-bottom: 3px solid currentColor; }
.rv-miradas { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: min(900px, 100%); margin: 22px 0 0; padding: 0; list-style: none; }
.rv-miradas li { display: inline-flex; align-items: center; gap: 8px; padding: 5px 14px 5px 5px; border-radius: 999px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-linea); font-weight: 600; }
.rv-miradas img { width: 28px; height: 28px; border-radius: 50%; }

/* ---------- Revista de cada categoría: foto, velo y nombre ---------- */
.rv-revistas {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(220px, auto); gap: 12px;
  width: min(1180px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-revistas li:first-child { grid-column: span 2; grid-row: span 2; }
.rv-revista {
  position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 4px; height: 100%;
  padding: 20px 22px; overflow: hidden; border-radius: 18px; color: var(--c-blanco); text-align: left; text-decoration: none;
  background: linear-gradient(160deg, var(--sec-portada-a), var(--sec-portada-b));
}
.rv-revista__foto { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.rv-revista::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(23, 25, 29, 0.08) 15%, rgba(23, 25, 29, 0.9) 100%); }
.rv-revista:hover .rv-revista__foto { transform: scale(1.04); }
.rv-revista__icono { width: 40px; height: 40px; margin-bottom: 6px; border-radius: 50%; }
.rv-revista__nombre { font: 800 clamp(1.3rem, 2vw, 1.75rem)/1.1 var(--f-titular); }
.rv-revista__lema { font-size: 0.9rem; line-height: 1.35; color: #E2E2E6; }   /* ≥ 7:1 sobre el velo */
.rv-revista:focus-visible { outline-offset: 3px; }

/* ---------- Confluencias: círculos solapados, nunca degradados entre colores (Registro §6.4) ---------- */
.rv-confluencias {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 196px), 1fr)); gap: 12px;
  width: min(1120px, 100%); margin: clamp(36px, 5vw, 56px) 0 0; padding: 0; list-style: none;
}
.rv-confluencia { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 26px 16px; border-radius: 18px; background: var(--t-caja); box-shadow: inset 0 0 0 1px var(--t-borde); }
.rv-confluencia__circulos { display: flex; margin: 0 0 6px; padding: 0; list-style: none; }
.rv-confluencia__circulos li + li { margin-left: -14px; }
.rv-confluencia__circulos img { display: block; width: 52px; height: 52px; border-radius: 50%; box-shadow: 0 0 0 3px var(--t-caja); }
.rv-confluencia__x {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 2px dashed currentColor;
  background: var(--t-caja); font: 800 1.3rem/1 var(--f-titular); color: var(--t-suave);
}
.rv-confluencia__tema { margin: 0; font: 800 1.15rem/1.2 var(--f-titular); }
.rv-confluencia__cats { margin: 0; font-size: 0.88rem; line-height: 1.4; color: var(--t-suave); }

/* ---------- Heptágono del héroe (usa .hepta de escaparate.css) ---------- */
.rv-hepta { display: grid; justify-items: center; width: 100%; margin-top: auto; padding: clamp(40px, 5vw, 64px) 0; }
.rv-hepta .hepta { --radio-hepta: clamp(96px, 12vw, 160px); --lado: clamp(52px, 6vw, 80px); }
.rv-hepta .hepta__centro { font-size: clamp(3.4rem, 6vw, 5.4rem); }

/* ---------- Mosaico de fotos del héroe (medios-y-cursos.html) ---------- */
.rv-mosaico { display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: end; gap: 12px; width: min(1040px, 100%); margin: 0; padding: 0; list-style: none; }
.rv-mosaico img { display: block; width: 100%; height: clamp(150px, 20vw, 280px); object-fit: cover; border-radius: 16px 16px 0 0; box-shadow: var(--sombra-3); }
.rv-mosaico li:nth-child(2) img { height: clamp(190px, 26vw, 350px); }

/* ---------- Vídeos de muestra ---------- */
.rv-video__marco { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(160deg, #3A3D45, #17191D); }
.rv-video__marco img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rv-video__play {
  position: relative; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
  background: rgba(30, 32, 37, 0.62); color: var(--c-blanco); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(var(--desenfoque-fino)); backdrop-filter: blur(var(--desenfoque-fino));
}
.rv-video__play svg { width: 22px; height: 22px; margin-left: 3px; }
.rv-video__play svg path { fill: currentColor; }

/* ---------- Móvil ---------- */
@media (max-width: 1100px) {
  .rv-siete { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rv-revistas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rv-revistas li:first-child { grid-row: auto; }
}
@media (max-width: 833.98px) {
  .rv-rejilla--3, .rv-dos { grid-template-columns: minmax(0, 1fr); }
  .rv-dos { text-align: center; }
  .rv-dos .producto-seccion__acciones, .rv-dos .rv-chips { justify-content: center; }
  .rv-dos .producto-seccion__texto { margin-inline: auto; }
  .rv-siete { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .rv-siete { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rv-revistas { grid-template-columns: minmax(0, 1fr); grid-auto-rows: minmax(200px, auto); }
  .rv-revistas li:first-child { grid-column: auto; }
  .rv-mosaico { grid-template-columns: 1fr 1fr; }
  .rv-mosaico li:nth-child(3) { display: none; }
  .rv-lista { padding-inline: 14px; }
  .rv-lista li { gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .rv-siete a, .rv-revista__foto { transition: none; }
  .rv-siete a:hover, .rv-revista:hover .rv-revista__foto { transform: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .rv-video__play { background: #1E2025; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ---------- Foto del héroe: recorte apaisado ---------- */
.producto-heroe__imagen img.rv-heroe-foto { height: auto; aspect-ratio: 16 / 7; object-fit: cover; }
@media (max-width: 560px) { .producto-heroe__imagen img.rv-heroe-foto { aspect-ratio: 4 / 3; } }

/* ---------- Ajustes de composición ---------- */
.rv-categorias > li:last-child:nth-child(odd) { grid-column: 1 / -1; }            /* la séptima no se queda sola en una celda */
.rv-revistas > li:nth-child(6), .rv-revistas > li:nth-child(7) { grid-column: span 2; }   /* 4 + 4 + 2 + 2: rejilla completa de 4 × 3 */
.rv-dos .producto-seccion__titular { font-size: clamp(2rem, 3.6vw, 3rem); }
@media (max-width: 560px) { .rv-revistas > li:nth-child(6), .rv-revistas > li:nth-child(7) { grid-column: auto; } }
@media (max-width: 833.98px) { .rv-siete > li:last-child { grid-column: 1 / -1; } }   /* 3 + 3 + 1 y 2 + 2 + 2 + 1: la séptima ocupa la fila */
.producto-heroe__nombre.rv-nombre-largo { font-size: clamp(2.2rem, 7.4vw, 6.2rem); }   /* «HeptaClasificación» cabe a 375 px */
