From eeb1242a530d60e22187940b801048cc20577d0f Mon Sep 17 00:00:00 2001
From: jae <jae@jaeswift.xyz>
Date: Sat, 4 Apr 2026 02:19:18 +0000
Subject: [PATCH] fix: awesomelist grid to 4 columns with responsive
 breakpoints

---
 css/awesomelist.css | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/css/awesomelist.css b/css/awesomelist.css
index cfb5047..7021a04 100644
--- a/css/awesomelist.css
+++ b/css/awesomelist.css
@@ -139,7 +139,7 @@
 /* ─── Sector Grid ──────────────────────────────────────── */
 .al-sector-grid {
     display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: repeat(4, 1fr);
     gap: 1rem;
     margin-bottom: 2rem;
 }
@@ -235,7 +235,7 @@
 /* ─── List Cards (inside sector) ───────────────────────── */
 .al-list-grid {
     display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: repeat(4, 1fr);
     gap: 0.8rem;
     margin-bottom: 2rem;
 }
@@ -318,7 +318,7 @@
 /* ─── Subcategory Cards (inside list detail) ───────────── */
 .al-sub-grid {
     display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: repeat(4, 1fr);
     gap: 0.6rem;
     margin-bottom: 1rem;
 }
@@ -428,16 +428,24 @@
 }
 
 /* ─── Responsive ───────────────────────────────────────── */
-@media (max-width: 900px) {
+@media (max-width: 600px) {
     .al-sector-grid,
     .al-list-grid,
     .al-sub-grid {
         grid-template-columns: 1fr;
     }
 }
-@media (min-width: 901px) and (max-width: 1100px) {
+@media (min-width: 601px) and (max-width: 900px) {
     .al-sector-grid,
-    .al-list-grid {
+    .al-list-grid,
+    .al-sub-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }
+@media (min-width: 901px) and (max-width: 1200px) {
+    .al-sector-grid,
+    .al-list-grid,
+    .al-sub-grid {
+        grid-template-columns: repeat(3, 1fr);
+    }
+}