/* Stable card dimensions, independent of older cached government styles. */
/* Frame the original MOTAC crest; its white horizontal wordmark is unreadable on white. */
#client-wall .client-card > img { height: auto; }

@media (min-width: 701px) {
  #client-wall {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    transform: none;
    align-items: stretch;
  }
  #client-wall .client-card {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 18px;
    row-gap: 7px;
    align-content: center;
    width: 100%;
    height: auto;
    min-height: 160px;
    padding: 20px;
    text-align: left;
    transform: none;
    border-radius: 12px;
  }
  #client-wall .client-card > img {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: center;
    width: 100px;
    height: 100px;
    min-height: 0;
    max-height: 100px;
    aspect-ratio: auto;
    object-fit: contain;
  }
  #client-wall .client-card > strong {
    grid-column: 2;
    align-self: end;
    font-size: 1rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  #client-wall .client-card > small {
    grid-column: 2;
    align-self: start;
    min-height: 0;
    margin: 0;
    font-size: .875rem;
    line-height: 1.6;
    overflow-wrap: anywhere;
  }
  #client-wall .client-card:hover,
  #client-wall .client-card[aria-pressed="true"] {
    transform: translateY(-5px);
  }
}

@media (min-width: 701px) and (max-width: 1100px) {
  #client-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  #client-wall .client-card { grid-template-columns: 85px minmax(0, 1fr); column-gap: 14px; padding: 18px; }
  #client-wall .client-card > img { width: 85px; height: 85px; max-height: 85px; }
}

#client-wall .client-card[data-client="motac"] > img,
#profile-logo[src$="/motac-official.png"] {
  width: 100px;
  height: 75px;
  min-height: 0;
  max-height: 75px;
  object-fit: cover;
  object-position: left center;
}
@media (min-width: 701px) and (max-width: 1100px) {
  #client-wall .client-card[data-client="motac"] > img { width: 84px; height: 63px; }
}
