From f7afe8b77f0e36b4e33d6b8ad348494de0b84c88 Mon Sep 17 00:00:00 2001
From: Rishav Raj <rishavraj.rr1234@gmail.com>
Date: Wed, 18 Mar 2026 06:40:52 +0530
Subject: [PATCH 1/2] 2nd

---
 assets/css/gambit.css | 124 +++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 123 insertions(+), 1 deletion(-)

diff --git a/assets/css/gambit.css b/assets/css/gambit.css
index 7d24c4c..6103b1d 100644
--- a/assets/css/gambit.css
+++ b/assets/css/gambit.css
@@ -9,7 +9,7 @@
 }
 
 .hero-subtitle {
-   color: #442020;
+   color: #770505;
    font-size: 3em;
    font-family: "Computer Modern", serif;
    max-width: 100%;
@@ -315,6 +315,7 @@
 
    .what-item {
       max-width: 350px;
+      padding: 0;
    }
 
    .what-icon {
@@ -891,4 +892,125 @@ td {
    border: 1px solid var(--pst-color-border);
    padding: 0.5rem;
    text-align: left;
+}
+
+
+
+
+/* Edits */
+
+@media (max-width: 1165px) {
+   .hero-info-section {
+      margin: 30px 0;
+      padding: 0 15px;
+   }
+   
+   .info-content {
+      flex-direction: column;
+      text-align: center;
+      max-width: 95%;
+      gap: 1.5rem;
+   }
+}
+
+
+
+@media (max-width: 1100px) {
+
+   .info-content{
+      margin-top: 10px;
+      padding: 0;
+   }
+
+  .what-icons {
+   margin: 40px -10px;
+   text-align: center;
+}
+
+.what-grid {
+   display: flex;
+   gap: 20px;
+   max-width: 500px;
+   margin: 0 100px;
+   text-align: center;
+   padding-bottom: 30px;
+}
+}
+
+@media (max-width: 900px) {
+   .what-icons {
+      margin: 40px 0;
+      text-align: center;
+   }
+
+   .what-grid {
+      grid-template-columns: 1fr !important;
+      display: grid;
+      gap: 40px;
+      max-width: 400px;
+      margin: 0 auto;
+   }
+
+   .what-item {
+      max-width: 350px;
+      padding: 0;
+   }
+
+   .what-icon {
+      width: 75px;
+      height: 75px;
+   }
+
+   .what-icon-fallback {
+      width: 75px;
+      height: 75px;
+      font-size: 1.5em;
+   }
+
+   .what-name {
+      font-size: 1.5em;
+   }
+
+   .what-description {
+      font-size: 1.2em;
+   }
+
+   /* Remove column separators on small screens */
+   .what-item:not(:first-child) {
+      border-left: none;
+      padding-left: 0;
+   }
+}
+
+@media (max-width: 890px) {
+   .hero-title{
+      font-size: 90px;
+      line-height: 100px;
+   }
+   .hero-subtitle{
+      font-size: 30px;
+   }
+
+   .software-grid{
+      gap: 20px;
+   }
+}
+
+@media (max-width: 640px) {
+.hero-title{
+      font-size: 50px;
+      line-height: 70px;
+   }
+}
+
+@media (max-width: 470px) {
+   .hero-info-section{
+      padding: 0;
+      justify-content: center;
+      align-items: center;
+   }
+   .info-content{
+      padding: 0;
+      margin: auto;
+   }
 }
\ No newline at end of file

From ca381355a1a02621a9a283f7327a1e64d7d114c0 Mon Sep 17 00:00:00 2001
From: Rishav Raj <rishavraj.rr1234@gmail.com>
Date: Thu, 6 Aug 2026 14:39:17 +0530
Subject: [PATCH 2/2] Improve media queries for better screen breaks and
 responsiveness

---
 assets/css/gambit.css | 122 +++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 120 insertions(+), 2 deletions(-)

diff --git a/assets/css/gambit.css b/assets/css/gambit.css
index 1c5fdf1..77ab7ef 100644
--- a/assets/css/gambit.css
+++ b/assets/css/gambit.css
@@ -1,6 +1,6 @@
 :root {
    --color-primary: #1a9e7e;
-   --color-subtitle: #442020;
+   --color-subtitle: #770505;
    --color-text-dark: #333;
    --color-text-medium: #666;
    --color-text-light: #888;
@@ -28,7 +28,7 @@
 }
 
 .hero-subtitle {
-   color: #442020;
+   color: #770505;
    font-size: 3em;
    font-family: "Computer Modern", serif;
    max-width: 100%;
@@ -1079,4 +1079,122 @@ td {
    border: 1px solid var(--color-table-border);
    padding: 0.5rem;
    text-align: left;
+}
+
+/* Edits */
+
+@media (max-width: 1165px) {
+   .hero-info-section {
+      margin: 30px 0;
+      padding: 0 15px;
+   }
+   
+   .info-content {
+      flex-direction: column;
+      text-align: center;
+      max-width: 95%;
+      gap: 1.5rem;
+   }
+}
+
+
+
+@media (max-width: 1100px) {
+
+   .info-content{
+      margin-top: 10px;
+      padding: 0;
+   }
+
+  .what-icons {
+   margin: 40px -10px;
+   text-align: center;
+}
+
+.what-grid {
+   display: flex;
+   gap: 20px;
+   max-width: 500px;
+   margin: 0 100px;
+   text-align: center;
+   padding-bottom: 30px;
+}
+}
+
+@media (max-width: 900px) {
+   .what-icons {
+      margin: 40px 0;
+      text-align: center;
+   }
+
+   .what-grid {
+      grid-template-columns: 1fr !important;
+      display: grid;
+      gap: 40px;
+      max-width: 400px;
+      margin: 0 auto;
+   }
+
+   .what-item {
+      max-width: 350px;
+      padding: 0;
+   }
+
+   .what-icon {
+      width: 75px;
+      height: 75px;
+   }
+
+   .what-icon-fallback {
+      width: 75px;
+      height: 75px;
+      font-size: 1.5em;
+   }
+
+   .what-name {
+      font-size: 1.5em;
+   }
+
+   .what-description {
+      font-size: 1.2em;
+   }
+
+   /* Remove column separators on small screens */
+   .what-item:not(:first-child) {
+      border-left: none;
+      padding-left: 0;
+   }
+}
+
+@media (max-width: 890px) {
+   .hero-title{
+      font-size: 90px;
+      line-height: 100px;
+   }
+   .hero-subtitle{
+      font-size: 30px;
+   }
+
+   .software-grid{
+      gap: 20px;
+   }
+}
+
+@media (max-width: 640px) {
+.hero-title{
+      font-size: 50px;
+      line-height: 70px;
+   }
+}
+
+@media (max-width: 470px) {
+   .hero-info-section{
+      padding: 0;
+      justify-content: center;
+      align-items: center;
+   }
+   .info-content{
+      padding: 0;
+      margin: auto;
+   }
 }
\ No newline at end of file