/* Manuales (Manualcura, ManualDreno, Manualvendaje): reglas comunes + diferencias por página con :where(body.pg-<pagina>). */

.manual-book-container { max-width: 1100px; margin: 50px auto; padding: 40px; background: linear-gradient(120deg,#ffeaf3,#fff); box-shadow: 0 0 15px rgba(0,0,0,0.10); border-radius: 8px; }
.manual-book-container p, .manual-book-container li { text-align: justify; line-height: 1.6; color: #333; margin-bottom: 15px; }
.manual-book-container h1 { text-align: center; color: var(--color-primario); }
.manual-book-container h2, .manual-book-container h3 { text-align: justify; color: var(--color-primario); margin-top: 30px; }
:where(body.pg-Manualcura) .manual-book-container img { display: block; margin: 20px auto; max-width: 100%; height: auto; border-radius: 5px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
:where(body.pg-ManualDreno) .manual-book-container img { display: block; margin: 10px auto; max-width: 50%; height: auto; border-radius: 5px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
:where(body.pg-Manualvendaje) .paso-bloque img { display: block; margin: 50px auto; max-width: 60%; height: auto; border-radius: 5px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.btn-descargar { display: inline-block; margin: 20px 0; padding: 12px 25px; background-color: #f50057; color: white; text-decoration: none; border-radius: 4px; font-weight: bold; transition: background-color 0.3s; }
.btn-descargar:hover { background-color: #c51162; }
.descripcion-descarga { font-size: 1.1rem; color: var(--color-secundario); margin-bottom: 10px; font-style: italic; }
.btn-volver { display: inline-block; margin: 20px 0; padding: 8px 15px; background-color: var(--color-primario); color: white; text-decoration: none; border-radius: 4px; }
.btn-volver:hover { background-color: #4a0e6e; }
.manual-book-container ul, .manual-book-container ol { padding-left: 20px; }
:where(body.pg-Manualcura) .imagenes-fila { display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; margin: 20px 0; }
:where(body.pg-ManualDreno) .imagenes-fila { display: flex; flex-wrap: wrap; gap: 15px; justify-content:center; margin: 20px 0; }
:where(body.pg-Manualvendaje) .imagenes-fila { display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; margin: 10px 0; }
.imagenes-fila img { flex: 1 1 0px; max-width: 30%; height: auto; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); object-fit: cover; }
@media (max-width: 600px) {
  .imagenes-fila img { max-width: 100%; }
}
