/* ==========================================================================
   CLIENTS PAGE — styles scoped to /clients/ only.
   ========================================================================== */

.clients-count { text-align: center; font-size: var(--fs-sm); color: var(--text-on-light-muted); margin-bottom: var(--space-6); }

.clients-page-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--space-5); }
@media (max-width: 1024px) { .clients-page-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 700px) { .clients-page-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 440px) { .clients-page-grid { grid-template-columns: 1fr; } }

.client-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius-md); box-shadow: var(--card-light-shadow); padding: var(--space-5); display: flex; flex-direction: column; align-items: center; gap: var(--space-4); text-align: center; }
.client-card-logo { height: 64px; width: 100%; display: flex; align-items: center; justify-content: center; }
.client-card-logo img { max-height: 64px; max-width: 100%; object-fit: contain; }
.client-card h3 { font-size: var(--fs-xs); font-weight: 600; color: var(--text-on-light-muted); line-height: var(--lh-normal); }