/* Get Involved hub (/get-involved/). Three-up card grid built on the shared
   .give-card look, plus a small icon treatment. Scoped to .gi-grid / .gi-card. */

.gi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}

.gi-card { text-align: center; align-items: center; }
.gi-card p { text-align: center; }
/* .give-card pins its link to the start edge; the hub cards centre it. */
.gi-card .link-arrow { align-self: center; }

/* Card grounds follow the section they sit in: white cards on the gray
   "Through Contribution" band, light gray cards on the white "Unite" band. */
.gi-grid--white .gi-card { background: var(--color-white); }
.gi-grid--gray .gi-card { background: var(--color-light); }

.gi-card-icon {
  width: 64px;
  height: 64px;
  object-fit: contain;
  margin: 0 auto 16px;
}

@media (max-width: 900px) {
  .gi-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
  .gi-grid { grid-template-columns: 1fr; }
}