.modern-news-grid .news-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 24px;
}

.modern-news-grid .news-grid .col-span-1 { grid-column: span 1; }
.modern-news-grid .news-grid .col-span-2 { grid-column: span 2; }
.modern-news-grid .news-grid .col-span-3 { grid-column: span 3; }
.modern-news-grid .news-grid .col-span-4 { grid-column: span 4; }
.modern-news-grid .news-grid .col-span-5 { grid-column: span 5; }
.modern-news-grid .news-grid .col-span-6 { grid-column: span 6; }
.modern-news-grid .news-grid .col-span-7 { grid-column: span 7; }
.modern-news-grid .news-grid .col-span-8 { grid-column: span 8; }
.modern-news-grid .news-grid .col-span-9 { grid-column: span 9; }
.modern-news-grid .news-grid .col-span-10 { grid-column: span 10; }
.modern-news-grid .news-grid .col-span-11 { grid-column: span 11; }
.modern-news-grid .news-grid .col-span-12 { grid-column: span 12; }

@media (max-width: 991.98px) {
  .modern-news-grid .news-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .modern-news-grid .news-grid > [class*="col-span-"] { grid-column: span 12 !important; }
}