.clients { background: var(--white); }
.partner-block { margin-bottom: 3rem; }
.client-logos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; overflow: hidden; margin-bottom: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--line); }
.client-group-title { margin: 0 0 .85rem; color: var(--ink); font: 700 .72rem var(--font-mono); letter-spacing: .1em; text-transform: uppercase; }
.client-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.8rem; }
.client-group { padding-top: 1.2rem; border-top: 1px solid var(--line); }
.client-group-logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--line); }
.client-logo { display: grid; place-items: center; min-height: 10.6rem; padding: 1.7rem; background: var(--paper); transition: background var(--transition); }
.client-group-logos .client-logo { min-height: 8.6rem; padding: 1.25rem; }
.client-logo:hover { background: var(--white); }
.client-logo-link:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--blue); outline-offset: -3px; }
.client-logo img { width: min(100%, 12rem); max-height: 6rem; object-fit: contain; mix-blend-mode: multiply; filter: grayscale(1); opacity: .72; transition: filter var(--transition), opacity var(--transition), transform var(--transition); }
.client-logo:hover img { filter: grayscale(0); opacity: 1; transform: scale(1.04); }

@media (max-width: 700px) {
  .client-logos, .client-group-logos { grid-template-columns: repeat(2, 1fr); }
  .client-groups { grid-template-columns: 1fr; gap: 1.45rem; }
}

@media (max-width: 390px) {
  .client-logos, .client-group-logos { grid-template-columns: 1fr; }
  .client-logo, .client-group-logos .client-logo { min-height: 8rem; }
}