diff --git a/_data/navigation.yml b/_data/navigation.yml
index 8ae5f710..ef759632 100644
--- a/_data/navigation.yml
+++ b/_data/navigation.yml
@@ -18,7 +18,7 @@ main:
       - title: "Peer review guide"
         url: "https://www.pyopensci.org/software-peer-review/"
         icon: "fas fa-external-link-alt"
-  - title: "Python Packaging"
+  - title: "Packaging"
     icon: "fas fa-fw fa-envelope-square"
     url:
     sub-nav:
@@ -52,7 +52,7 @@ main:
       - title: "Handbook"
         icon: "fas fa-external-link-alt"
         url: "https://www.pyopensci.org/handbook/"
-  - title: "Get Involved"
+  - title: "Support Us"
     sub-nav:
       - title: "Volunteer"
         url: "/volunteer.html"
diff --git a/_sass/minimal-mistakes/_footer.scss b/_sass/minimal-mistakes/_footer.scss
index b02cba47..ba67e8ff 100644
--- a/_sass/minimal-mistakes/_footer.scss
+++ b/_sass/minimal-mistakes/_footer.scss
@@ -67,7 +67,6 @@
     margin: 0;
     padding: 0;
     list-style-type: none;
-    text-align: center;
   }
 
   li {
@@ -85,7 +84,7 @@
 
   a {
     padding-right: 10px;
-    font-weight: normal;
+    font-weight: bold;
   }
 }
 
diff --git a/_sass/minimal-mistakes/_pyos-cards.scss b/_sass/minimal-mistakes/_pyos-cards.scss
index a3fc169c..35e7f67e 100644
--- a/_sass/minimal-mistakes/_pyos-cards.scss
+++ b/_sass/minimal-mistakes/_pyos-cards.scss
@@ -1,3 +1,94 @@
+/* ==========================================================================
+   BASE CARD STYLES
+   ========================================================================== */
+
+// Base card styles - shared by both people and package cards
+.cards {
+  top: 0px;
+  position: relative;
+  background-color: #fff;//#fcfbf5;
+  text-decoration: none;
+  z-index: 1;
+  overflow: hidden;
+  font-size: .8em;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
+  margin: .5em;
+
+  &__image {
+    max-height: calc($small / 3);
+    overflow: hidden;
+    border-radius: 10px;
+  }
+
+  &:hover {
+    transition: all 0.2s ease-out;
+    transform: translateY(-3px);
+    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);
+    top: -4px;
+    border: 1px solid #cccccc;
+    background-color: white;
+    cursor: pointer;
+  }
+
+  &:hover:before {
+    transform: scale(2.15);
+  }
+
+  p {
+    font-size: 1em;
+    line-height: 1.8;
+  }
+
+  h2 {
+    font-size: 1.5rem;
+    margin-bottom: 1rem!important;
+
+    a {
+      text-decoration: none;
+      font-size: 1.2em;
+    }
+
+    &.archive__item-title {
+      font-size: 1.1em !important;
+    }
+  }
+
+  h3.card__title.no_toc,
+  .card__title.no_toc {
+    margin-top: 1.2em;
+    font-size: 1.9em;
+    color: $pyos-darkpurple;
+  }
+
+  .page__meta.contributors {
+    font-size: .95rem;
+    line-height: 1.3rem;
+  }
+
+  .contributors a {
+    text-decoration: none;
+  }
+
+  .package_description {
+    font-size: .95rem;
+    line-height: 1.5rem;
+  }
+
+  ul {
+    list-style-type: none;
+    margin-left: 0;
+    padding: .2em;
+
+    li {
+      font-size: 1rem;
+      a {
+        text-decoration: none;
+        //font-size: 1.2em
+      }
+    }
+  }
+}
+
 .cards-image figure {
   margin: 0;
 }
@@ -17,8 +108,16 @@
 
 .tutorial__container {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); // Adjust the minmax values as needed
     grid-gap: 20px;
+    grid-template-columns: 1fr; // Mobile: 1 column
+
+    @media (min-width: $small) {
+      grid-template-columns: repeat(2, 1fr); // Small: 2 columns
+    }
+
+    @media (min-width: $medium) {
+      grid-template-columns: repeat(3, 1fr); // Medium: 3 columns
+    }
 
     // Ensure all cards have the height of the tallest card
     align-items: stretch;
@@ -264,3 +363,89 @@
         width: 40%;
     }
 }
+
+/* ==========================================================================
+   PEOPLE CARDS
+   ========================================================================== */
+
+// Base people card styles - semantic nesting approach
+.people-card {
+    padding: 0;
+  .people-card__content {
+    // Ensure content wrapper has no padding (overrides div > div rule)
+    padding: 0;
+    overflow: hidden; // Ensures image doesn't overflow card boundaries
+
+    // Image: full width, no padding - breaks out to card edges
+    .person_img {
+      filter: drop-shadow(3px 3px 3px #999);
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      display: block;
+      overflow: hidden;
+
+      img {
+        width: 100%;
+        aspect-ratio: 1;
+        object-fit: cover;
+        display: block;
+        margin: 0;
+        padding: 0;
+      }
+    }
+
+    // Text elements: semantic selectors with padding
+    h4.person_name {
+      padding: 0 1em;
+      margin-top: 0.6em;
+      margin-bottom: 0;
+      font-size: 1.4rem;
+
+      a {
+        text-decoration: none;
+      }
+    }
+
+    p.page__meta {
+      padding: 0 1em;
+      // Inherits other styles from _page.scss
+    }
+
+    p.contrib_org {
+      padding: 0 1em;
+      font-size: 0.875rem;
+      font-weight: normal;
+      margin-bottom: 0 !important;
+    }
+
+    .ppl_social {
+      padding: 0 1em 1em 1em; // includes bottom padding
+      font-size: 0.875rem;
+      font-weight: normal;
+      margin-bottom: 0 !important;
+
+      a {
+        margin-right: 10px;
+        text-decoration: none !important;
+      }
+
+      // Font Awesome icons inherit font-size from parent
+      .fa-brands,
+      .fa-solid {
+        font-size: inherit;
+      }
+    }
+  }
+}
+
+// Responsive adjustments for people cards
+@media screen and (max-width: $mobile) {
+  .people-card {
+    .people-card__content {
+      .ppl_social {
+        font-size: 0.9em !important;
+      }
+    }
+  }
+}
diff --git a/_sass/minimal-mistakes/_pyos-grid.scss b/_sass/minimal-mistakes/_pyos-grid.scss
index fdcb4461..4969a723 100644
--- a/_sass/minimal-mistakes/_pyos-grid.scss
+++ b/_sass/minimal-mistakes/_pyos-grid.scss
@@ -24,12 +24,7 @@ $colors: (
 // Include the mixin
 //@include generate-color-styles($colors);
 
-// Shared mixin for auto-responsive grid behavior
-@mixin responsive-grid($min-width, $gap: 8px) {
-  display: grid;
-  grid-gap: $gap;
-  grid-template-columns: repeat(auto-fit, minmax($min-width, 1fr));
-}
+// Shared mixin removed - using fixed breakpoints throughout for consistent behavior
 
 .clearfix::after {
   content: "";
@@ -38,41 +33,98 @@ $colors: (
 }
 
 /* Create & style a 3x3 grid wrapper */
-/* Adjust grid side for the flowing layout */
+/* Adjust grid side for the flowing layout - fixed breakpoints */
 .flowing .grid {
-  grid-template-columns: repeat(auto-fit, minmax(calc($small/4), 1fr));
+  display: grid;
+  grid-gap: 10px;
+  grid-template-columns: 1fr; // Mobile: 1 column
+
+  @media (min-width: $small) {
+    grid-template-columns: repeat(2, 1fr); // Small: 2 columns
+  }
+
+  @media (min-width: $medium) {
+    grid-template-columns: repeat(3, 1fr); // Medium: 3 columns
+  }
+
+  @media (min-width: $large) {
+    grid-template-columns: repeat(4, 1fr); // Large: 4 columns
+  }
 }
 
 .grid {
     display: grid;
-    // minmax can be used to modify width
-    grid-template-columns: repeat(auto-fit, minmax(calc($small/2), 1fr));
     grid-gap: 10px;
+    grid-template-columns: 1fr; // Mobile: 1 column
 
-    // Executive council section - smaller cards
+    @media (min-width: $small) {
+      grid-template-columns: repeat(2, 1fr); // Small: 2 columns
+    }
+
+    @media (min-width: $medium) {
+      grid-template-columns: repeat(3, 1fr); // Medium: 3 columns
+    }
+
+    @media (min-width: $large) {
+      grid-template-columns: repeat(4, 1fr); // Large: 4 columns
+    }
+
+    // Executive council section - fixed breakpoints
     &.executive-council-grid {
-      grid-template-columns: repeat(auto-fit, minmax(calc($small/3.5), 1fr));
+      grid-template-columns: repeat(4, 1fr);
+      grid-gap: 8px;
       max-width: 1000px;
       margin: 0 auto;
+
+      @media screen and (max-width: $x-large) {
+        grid-template-columns: repeat(3, 1fr);
+      }
+
+      @media screen and (max-width: $medium) {
+        grid-template-columns: repeat(2, 1fr);
+      }
+
+      @media screen and (max-width: $mobile) {
+        grid-template-columns: 1fr;
+      }
     }
 
-    // Advisory council and editorial board sections - 4 columns
+    // Advisory council and editorial board sections - fixed breakpoints
     &.advisory-council-grid {
       grid-template-columns: repeat(4, 1fr);
       grid-gap: 8px;
+
       @media screen and (max-width: $x-large) {
         grid-template-columns: repeat(3, 1fr);
       }
+
       @media screen and (max-width: $medium) {
         grid-template-columns: repeat(2, 1fr);
       }
+
+      @media screen and (max-width: $mobile) {
+        grid-template-columns: 1fr;
+      }
     }
 
-    // Emeritus council section - smaller cards
+    // Emeritus council section - fixed breakpoints
     &.emeritus-council-grid {
-      grid-template-columns: repeat(auto-fit, minmax(calc($small/3.5), 1fr));
+      grid-template-columns: repeat(4, 1fr);
+      grid-gap: 8px;
       max-width: 1000px;
       margin: 0 auto;
+
+      @media screen and (max-width: $x-large) {
+        grid-template-columns: repeat(3, 1fr);
+      }
+
+      @media screen and (max-width: $medium) {
+        grid-template-columns: repeat(2, 1fr);
+      }
+
+      @media screen and (max-width: $mobile) {
+        grid-template-columns: 1fr;
+      }
     }
 
     h4.grid_title {
@@ -124,9 +176,23 @@ $colors: (
     }
   }
 
-// Home page packages section - auto-responsive
+// Home page packages section - fixed breakpoints
 .packages-grid {
-  @include responsive-grid(350px, 10px);
+  display: grid;
+  grid-gap: 10px;
+  grid-template-columns: 1fr; // Mobile: 1 column
+
+  @media (min-width: $small) {
+    grid-template-columns: repeat(2, 1fr); // Small: 2 columns
+  }
+
+  @media (min-width: $medium) {
+    grid-template-columns: repeat(3, 1fr); // Medium: 3 columns
+  }
+
+  @media (min-width: $large) {
+    grid-template-columns: repeat(4, 1fr); // Large: 4 columns
+  }
 }
 
 .grid-item {
@@ -199,89 +265,7 @@ $colors: (
 // do not adjust the display or structure of the cards element.
 /* Package cards splash */
 
-// Base card styles - shared by both people and package cards
-.cards {
-  top: 0px;
-  position: relative;
-  background-color: #fff;//#fcfbf5;
-  text-decoration: none;
-  z-index: 1;
-  overflow: hidden;
-  font-size: .8em;
-  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
-  margin-right: auto!important;
-  margin-left: auto!important;
-
-  &__image {
-    max-height: calc($small / 3);
-    overflow: hidden;
-    border-radius: 10px;
-  }
-
-  &:hover {
-    transition: all 0.2s ease-out;
-    transform: translateY(-3px);
-    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);
-    top: -4px;
-    border: 1px solid #cccccc;
-    background-color: white;
-    cursor: pointer;
-  }
-
-  &:hover:before {
-    transform: scale(2.15);
-  }
-
-  p {
-    font-size: 1em;
-    line-height: 1.8;
-  }
-
-  h2 {
-    font-size: 1.5rem;
-    margin-bottom: 1rem!important;
-
-    a {
-      text-decoration: none;
-      font-size: 1.2em;
-    }
-
-    &.archive__item-title {
-      font-size: 1.1em !important;
-    }
-  }
-
-  h3.card__title.no_toc,
-  .card__title.no_toc {
-    margin-top: 1.2em;
-    font-size: 1.9em;
-    color: $pyos-darkpurple;
-  }
-
-  .page__meta.contributors {
-    font-size: .95rem;
-    line-height: 1.3rem;
-  }
-
-  .contributors a {
-    text-decoration: none;
-  }
-
-  ul {
-    list-style-type: none;
-    margin-left: 0;
-    padding: .2em;
-
-    li {
-      font-size: 1rem;
-      a {
-        text-decoration: none;
-        //font-size: 1.2em
-      }
-    }
-  }
-
-}
+// Base card styles moved to _pyos-cards.scss
 
 .grid h3.card-title a {
   margin-top: .3em;
@@ -449,46 +433,7 @@ $colors: (
   display: flex;
 }
 
-.cards {
-  h2 a {
-  text-decoration: none;
-  font-size: 1.2em;
-  }
-  // Card listing fonts
-  h4.person_name {
-    margin-top: 0.6em;
-    margin-bottom: 0;
-    font-size: 1.4rem;
-
-    a {
-      text-decoration: none;
-      }
-    }
-
-  .contrib_org,.ppl_social {
-    font-size: 0.875rem;
-    font-weight:normal;
-    margin-bottom: 0!important;
-  }
-
-  // Social links in people cards
-  .ppl_social {
-    a {
-      margin-right: 10px;
-      text-decoration: none !important;
-    }
-
-    // Font Awesome icons inherit font-size from parent
-    .fa-brands,
-    .fa-solid {
-      font-size: inherit;
-    }
-  }
-  .package_description {
-    font-size: .95rem;
-    line-height: 1.5rem;
-  }
-}
+// Base card styles moved to _pyos-cards.scss
 
 // Adjust cards within a notice block
 .notice .cards p {
@@ -557,11 +502,6 @@ $colors: (
       }
     }
 
-    // Responsive social links in people cards
-    .ppl_social {
-      font-size: .9em !important;
-    }
-
     // the home page has this grid in a notice block
     .notice {
       .card-body p, .card-body h2 {
@@ -594,23 +534,6 @@ $colors: (
     }
 }
 
-// Isotope grid cards - override base .cards auto margins that break isotope layout
-.grid-isotope .element-item.cards {
-  margin-left: 0 !important;
-  margin-right: 0 !important;
-}
-
-// People cards in isotope grid - specific styling
-.grid-isotope .element-item.cards.people-card {
-  padding: 0;
-  margin: 8px;
-
-  // Remove padding from top for person images
-  .person_img {
-    margin-top: 0;
-    margin-left: 0;
-    margin-right: 0;
-  }
-}
 
+// People cards in isotope grid - styles are now in _pyos-cards.scss
 // Package cards in isotope grid - styles are now in _pyos-isotope.scss
diff --git a/_sass/minimal-mistakes/_pyos-isotope.scss b/_sass/minimal-mistakes/_pyos-isotope.scss
index b85567de..415490b3 100644
--- a/_sass/minimal-mistakes/_pyos-isotope.scss
+++ b/_sass/minimal-mistakes/_pyos-isotope.scss
@@ -144,11 +144,12 @@ input[type="text"] {
   opacity: 1;
 
   // People cards - override isotope defaults
+  // Base styles are in _pyos-cards.scss
   &.people-card {
     padding: 0 !important;
     margin: 20px;
-    // Account for 25px margins on each side (50px total)
-    width: calc(#{$isotope-column-width} - 50px);
+    // Account for 20px margins on each side (40px total)
+    width: calc(#{$isotope-column-width} - 40px);
   }
 }
 
diff --git a/_sass/minimal-mistakes/_pyos-main.scss b/_sass/minimal-mistakes/_pyos-main.scss
index ae6a4d3b..b64051ca 100644
--- a/_sass/minimal-mistakes/_pyos-main.scss
+++ b/_sass/minimal-mistakes/_pyos-main.scss
@@ -25,29 +25,12 @@ img {
 }
 
 
-.person_img {
-  filter: drop-shadow(3px 3px 3px #999);
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  display: block;
-  overflow: hidden;
-
-  img {
-    width: 100%;
-    aspect-ratio: 1;
-    object-fit: cover;
-    display: block;
-    margin: 0;
-    padding: 0;
-  }
-}
-
 div > div {
   padding: 10px;
 }
 
 // Override div > div padding for person_img with higher specificity
+// Person image styles are now in _pyos-cards.scss
 .cards .person_img,
 .archive__item .person_img {
   padding: 0;