Added previous execomm

src/styles/executive-committee.scss

@@ -92,6 +92,108 @@
   }
 }
 
+/* Past Committees Accordion Styles */
+.past-committees-wrapper {
+  margin-top: 6rem;
+  max-width: 900px;
+  margin-inline: auto;
+
+  h2 {
+    text-align: center;
+    color: $primary;
+    font-size: 2.5rem;
+    margin-bottom: 3rem;
+  }
+
+  .accordion-container {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+  }
+
+  .committee-accordion {
+    background-color: $background-accent;
+    border-radius: 0.5rem;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
+    overflow: hidden;
+
+    &[open] {
+      summary {
+        border-bottom: 1px solid rgba(0,0,0,0.1);
+        &::after {
+          content: '−'; /* Minus sign when open */
+        }
+      }
+    }
+
+    summary {
+      padding: 1.5rem 2rem;
+      font-size: 1.25rem;
+      font-weight: 700;
+      color: $dark;
+      cursor: pointer;
+      list-style: none; /* Hides the default browser arrow */
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      transition: background-color 0.2s ease;
+
+      /* Custom plus sign */
+      &::after {
+        content: '+';
+        font-size: 1.5rem;
+        color: $primary;
+        font-weight: 400;
+      }
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.02);
+      }
+
+      /* Safari fix to hide the default arrow */
+      &::-webkit-details-marker {
+        display: none;
+      }
+    }
+
+    .accordion-content {
+      padding: 1.5rem 2rem;
+      background-color: #fff;
+
+      ul {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+
+        li {
+          display: flex;
+          justify-content: space-between;
+          padding-block: 0.75rem;
+          border-bottom: 1px dashed rgba(0,0,0,0.1);
+
+          &:last-child {
+            border-bottom: none;
+            padding-bottom: 0;
+          }
+
+          .role {
+            font-weight: 700;
+            color: $primary;
+            font-size: 0.95rem;
+            max-width: 50%;
+          }
+
+          .name {
+            color: #4a4a4a;
+            font-size: 1rem;
+            text-align: right;
+          }
+        }
+      }
+    }
+  }
+}
+
 /* --- Responsive Adjustments --- */
 
 @media screen and (max-width: 1024px) {
@@ -123,6 +225,31 @@
     right: 25px;
     font-size: 50px;
   }
+
+  /* Mobile fix for the accordion (Put this inside your existing @media max-width: 768px block) */
+  .past-committees-wrapper {
+    margin-top: 4rem;
+
+    h2 { font-size: 1.75rem; }
+
+    .committee-accordion summary {
+      padding: 1rem 1.25rem;
+      font-size: 1.1rem;
+    }
+
+    .committee-accordion .accordion-content {
+      padding: 1rem 1.25rem;
+
+      ul li {
+        flex-direction: column; /* Stacks the Role above the Name on small phones */
+        align-items: flex-start;
+        gap: 0.25rem;
+
+        .role { max-width: 100%; }
+        .name { text-align: left; }
+      }
+    }
+  }
 }
 
 @media screen and (max-width: 480px) {