/* Inicio al estilo Disney+: filas de portadas GRANDES (verticales) intercaladas
   con filas de portadas PEQUENAS (horizontales 16:9). La fila de destacados
   numerados (.highlights-row) conserva su propio diseno. */

/* Pequenas: horizontales 16:9, compactas */
#cards .catalog-row:not(.rail-grande):not(.highlights-row) .event{
  flex:0 0 280px!important;width:280px!important;min-height:0!important;height:auto!important}
#cards .catalog-row:not(.rail-grande):not(.highlights-row) .card-art{height:158px!important}

/* Grandes: verticales 2:3 con la imagen protagonista */
#cards .rail-grande .event-rail{gap:22px}
#cards .rail-grande .event{flex:0 0 300px!important;width:300px!important;max-width:none!important;min-height:0!important;height:auto!important}
#cards .rail-grande .card-art{width:100%!important;height:430px!important;margin:0!important;border-radius:12px}
#cards .rail-grande .event-cover-photo{width:100%;height:100%;object-fit:cover}
#cards .rail-grande .team-duel{bottom:16%}
#cards .rail-grande>h2{font-size:26px}

@media (max-width:760px){
 #cards .catalog-row:not(.rail-grande):not(.highlights-row) .event{flex-basis:220px!important;width:220px!important}
 #cards .catalog-row:not(.rail-grande):not(.highlights-row) .card-art{height:124px!important}
 #cards .rail-grande .event{flex-basis:200px!important;width:200px!important}
 #cards .rail-grande .card-art{height:290px!important}
}