/* Organizations Grid Spacing - Equal Vertical and Horizontal Gaps */

/* Mobile (< 768px) - 2 columns */
@media (max-width: 767px) {
  .home-organizations-card {
    /* Horizontal padding is 15px per side = 30px gap between cols */
    /* Vertical spacing should match */
  }
  
  .col-6.col-sm-6.col-md-3 {
    padding: 15px !important;
  }
  
  .col-6.col-sm-6.col-md-3.mb-30 {
    margin-bottom: 30px !important;
  }
  
  /* Row negative margins to balance padding */
  .row.mt-20 {
    margin-right: -15px !important;
    margin-left: -15px !important;
    margin-bottom: -15px !important;
  }
}

/* Tablet and up */
@media (min-width: 768px) {
  .col-6.col-sm-6.col-md-3 {
    padding: 15px !important;
  }
  
  .col-6.col-sm-6.col-md-3.mb-30 {
    margin-bottom: 30px !important;
  }
}

/* Ensure consistent spacing */
.col-6,
.col-sm-6,
.col-md-3 {
  padding-right: 15px !important;
  padding-left: 15px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

/* Bottom padding for last row items */
@media (max-width: 767px) {
  .col-6.col-sm-6.col-md-3:nth-child(2n) {
    margin-bottom: 30px !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .col-6.col-sm-6.col-md-3:nth-child(2n) {
    margin-bottom: 30px !important;
  }
}

@media (min-width: 992px) {
  .col-6.col-sm-6.col-md-3:nth-child(4n) {
    margin-bottom: 30px !important;
  }
}