/* ==========================================================================
   Imagen clickeable dentro del contenido enriquecido (cursos y novedades).
   Abre en una modal al hacer clic (ver assets/js/image-embeds.js y
   image-modal.js).
   ========================================================================== */

.content-image {
  display: block;
  width: 100%;
  max-width: 500px;
  height: auto;
  margin: var(--space-lg) auto;
  cursor: pointer;
  border-radius: var(--radius-md);
  transition: opacity var(--transition-fast);
}

.content-image:hover,
.content-image:focus-visible {
  opacity: 0.85;
}