/* =================================================================
   JRI Core — contenido de la página

   Solo la medida. La tipografía de texto largo la pone `.jri-post-body`,
   que vive en `blog.css` y esta sección declara también.
   ================================================================= */

/* 860 px, los mismos que `.jri-post-inner` del blog: en el contenedor de
   1400 una línea de texto legal pasa de 200 caracteres y se pierde el
   renglón al volver. */
.jri-page-content .jri-container { max-width: 860px; }

/* Botones dentro del texto de una página (SaviHome, 14/10/2026). `.jri-post-body a`
   (0,1,1) le ganaba a `.jri-btn-dark` (0,1,0): el «Descargar» de los catálogos salía con
   la letra oscura y subrayada sobre el fondo carbón, casi invisible. */
.jri-post-body a.jri-btn { text-decoration: none; width: auto; margin-top: 0; padding: 12px 28px; }
.jri-post-body a.jri-btn-dark { color: var(--white); }
.jri-post-body a.jri-btn-dark:hover { color: var(--near-black); }

/* Catálogos en PDF (savihome.pe, /catalogo/): una tarjeta por catálogo —portada, nombre
   y botón—, en rejilla. En Divi era una fila de columnas por catálogo. */
.jri-catalogos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: var(--space-7) var(--space-5);
  margin-top: var(--space-6);
}
.jri-catalogo { display: flex; flex-direction: column; align-items: center; text-align: center; }
.jri-catalogo-portada { display: block; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.jri-post-body .jri-catalogo-portada img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; transition: transform .4s; }
.jri-catalogo-portada:hover img { transform: scale(1.04); }
.jri-post-body .jri-catalogo-titulo { margin: var(--space-4) 0 var(--space-3); font-size: 15px; line-height: 1.25; letter-spacing: .3px; text-transform: uppercase; }