.dept-card-container {
                         display: grid;
                         grid-template-columns: repeat(4, 1fr);
                         /* Exactly 4 columns */
                         gap: 15px;
                         margin-top: 15px;
                     }

                     /* Individual Department Card */
                     .dept-card {
                         background: #ffffff;
                         border: 1px solid #e0e0e0;
                         border-radius: 8px;
                         overflow: hidden;
                         display: flex;
                         flex-direction: column;
                         box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
                         min-height: 200px;
                     }

                     /* Card Header (The Department Name) */
                     .dept-card-header {
                         background: #f8f9fa;
                         padding: 10px;
                         font-weight: bold;
                         font-size: 0.95em;
                         color: #2c3e50;
                         border-bottom: 2px solid #3498db;
                         text-align: center;
                         text-transform: uppercase;
                     }

                     /* Card Body (The list of services) */
                     .dept-card-body {
                         padding: 10px;
                         font-size: 15px;
                         flex-grow: 1;
                         max-height: 250px;
                         /* Limits height of very long lists */
                         overflow-y: auto;
                         /* Adds scrollbar if services exceed card height */
                     }

                     /* Individual Service Checkbox Row */
                     .service-checkbox-label {
                         display: flex;
                         align-items: flex-start;
                         gap: 8px;
                         padding: 6px 4px;
                         cursor: pointer;
                         font-size: 0.85em;
                         transition: background 0.2s;
                         border-radius: 4px;
                     }

                     .service-checkbox-label:hover {
                         background: #f0f7ff;
                     }

                     .service-checkbox-label input {
                         margin-top: 2px;
                         cursor: pointer;
                     }

                     .service-checkbox-label span {
                         line-height: 1.2;
                     }

                     /* Responsive adjustment for tablets/phones */
                     @media (max-width: 1200px) {
                         .dept-card-container {
                             grid-template-columns: repeat(2, 1fr);
                         }
                     }

                     @media (max-width: 600px) {
                         .dept-card-container {
                             grid-template-columns: 1fr;
                         }
                     }