/* A shorter catalogue, keeping every album and opera and their random order. */
.drex-chapters .drex-chapters-head { margin-bottom: 2rem; }
.drex-chapters-list { max-width: 68.75rem; margin: 0 auto; display: grid; gap: 1.5rem; }
.drex-chapters-list .drex-chapter {
 width: 100%; box-sizing: border-box; margin: 0; padding: 1.5rem 0;
 grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: start;
}
.drex-chapters-list .cover-col { max-width: 12rem; order: 0 !important; }
.drex-chapters-list .info-col { min-width: 0; }
.drex-chapters-list .info-col h3 { font-size: clamp(1.75rem, 2.5vw, 2.25rem); line-height: 1.1; overflow-wrap: anywhere; margin-bottom: 1rem; }
.drex-chapters-list .info-col .kind { margin-bottom: .75rem; }
.drex-chapters-list .info-col .subline { flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: 1rem; }
.drex-chapters-list .info-col .desc { margin-bottom: 1.25rem; }
.drex-chapters-list .info-col .actions { flex-wrap: wrap; gap: 1rem; }
@media (min-width: 40rem) {
 .drex-chapters-list .drex-chapter { grid-template-columns: 9rem minmax(0, 1fr); }
}
@media (min-width: 64rem) {
 .drex-chapters-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 2.5rem; }
 .drex-chapters-list .drex-chapter { grid-template-columns: 8rem minmax(0, 1fr); }
}
.skip-link { position: fixed; top: .5rem; left: .5rem; z-index: 2000; padding: .75rem 1rem; background: #fff; color: #111; transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }

/* Carátulas reducidas: el <picture> no altera la caja de la imagen y los
   atributos width/height solo reservan la proporción, no fijan el alto. */
.drex-chapter .cover-col picture { display: block; }
.drex-chapter .cover-col img { height: auto; }