/* Icon Label Grid
   Optional heading + a centered, wrapping row of unboxed icons, each with an
   optional label and text, + optional body copy below. Settable section background.
   Per-row count comes from an inline --per-row var on the section; media queries
   override it on .ilg-grid (a descendant, so no inline-specificity clash).
   Column gap is 20px (must match the calc below). Brand: $darkblue #023769 / $blue #03a1e2. */

.icon-label-grid {
  position: relative;
  padding-top: 70px;
  padding-bottom: 70px;
  --per-row: 7;
}

.icon-label-grid .ilg-heading {
  text-align: center;
  margin-bottom: 44px;
}

.icon-label-grid .ilg-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 36px 20px;
}

.icon-label-grid .ilg-item {
  flex: 0 0 calc((100% - (var(--per-row) - 1) * 20px) / var(--per-row));
  max-width: calc((100% - (var(--per-row) - 1) * 20px) / var(--per-row));
  text-align: center;
}

.icon-label-grid .ilg-icon {
  margin-bottom: 14px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 56px;
}
.icon-label-grid .ilg-icon img {
  max-height: 56px;
  max-width: 100%;
  width: auto;
  object-fit: contain;
}
.icon-label-grid .ilg-item h3 {
  font-size: 15px;
  line-height: 1.3;
  color: #023769;
  margin: 0;
}
.icon-label-grid .ilg-item p {
  font-size: 13px;
  line-height: 1.5;
  color: rgba(2, 55, 105, 0.7);
  margin: 6px 0 0;
}

/* Optional body copy below the grid */
.icon-label-grid .ilg-body {
  text-align: center;
  max-width: 820px;
  margin: 44px auto 0;
}
.icon-label-grid .ilg-body p {
  font-size: 16px;
  line-height: 1.6;
  color: rgba(2, 55, 105, 0.75);
  margin: 0 0 14px;
}
.icon-label-grid .ilg-body p:last-child {
  margin-bottom: 0;
}

/* Responsive step-down (overrides the inline --per-row on the grid element) */
@media (max-width: 991.98px) {
  .icon-label-grid .ilg-grid {
    --per-row: 4;
  }
}
@media (max-width: 767.98px) {
  .icon-label-grid {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .icon-label-grid .ilg-grid {
    --per-row: 3;
  }
}
@media (max-width: 479.98px) {
  .icon-label-grid .ilg-grid {
    --per-row: 2;
  }
}