/* A continuous loop with two identical groups. No motion without JavaScript. */
.home-cinematic.portfolio-refresh .client-brands { padding: 30px 0 28px; background: #eeefed; border-bottom: 1px solid #dce1e0; overflow: hidden; }
.client-brands-heading { display: flex; align-items: center; justify-content: center; gap: 22px; padding: 0 24px 22px; }
.client-brands-heading h2 { margin: 0; color: #294355; font: 500 .72rem/1.5 var(--font-mono); text-transform: uppercase; letter-spacing: .16em; }
.client-brands-toggle { border: 1px solid #b9c4c9; border-radius: 20px; color: #425b69; background: transparent; padding: 6px 12px; font: 500 .7rem/1.4 var(--font-body); cursor: pointer; }
.client-logo-window { overflow: auto; scrollbar-width: thin; }
.client-logo-track { display: flex; width: max-content; }
.client-logo-group { display: flex; align-items: center; flex-shrink: 0; gap: 64px; padding: 0 32px; }
.client-logo-group[aria-hidden] { display: none; }
.client-logo { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 185px; gap: 9px; padding: 8px 4px; flex-shrink: 0; }
.client-logo img { display: block; width: 170px; height: 60px; object-fit: contain; filter: grayscale(1); opacity: .72; }
.client-logo--2to1 img,.client-logo--city-of-praise img { filter: grayscale(1) brightness(.2); }
.client-logo span { color: #52606a; font-size: .72rem; line-height: 1.4; text-align: center; }
.client-logo:hover img,.client-logo:focus-visible img { opacity: 1; }
.client-brands.is-animated .client-logo-window { overflow: hidden; mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); }
.client-brands.is-animated .client-logo-group[aria-hidden] { display: flex; }
.client-brands.is-animated .client-logo-track { animation: client-logo-scroll 55s linear infinite; }
.client-brands.is-paused .client-logo-track,.client-brands:hover .client-logo-track,.client-brands:focus-within .client-logo-track { animation-play-state: paused; }
@keyframes client-logo-scroll { to { transform: translateX(-50%); } }
@media(max-width:660px) { .client-logo-group { gap: 28px; padding-inline: 14px; } .client-logo { width: 155px; } .client-logo img { width: 140px; } .client-brands-heading { gap: 10px; flex-wrap: wrap; } }
@media(prefers-reduced-motion:reduce) {
 .client-brands.is-animated .client-logo-track { animation: none; transform: none; width: 100%; }
 .client-brands.is-animated .client-logo-group[aria-hidden] { display: none; }
 .client-logo-group { flex-wrap: wrap; justify-content: center; width: 100%; }
 .client-brands.is-animated .client-logo-window { mask-image: none; }
 .client-brands-toggle { display: none; }
}

/* Center the logo band like the reference, directly before capabilities. */
.home-cinematic.portfolio-refresh .client-brands { padding: 36px 0 30px; }
.client-brands-heading { position: relative; max-width: 1180px; margin: 0 auto; padding-bottom: 26px; min-height: 42px; }
.client-brands-toggle { position: absolute; right: 24px; top: 0; }
.client-logo-window { max-width: 1180px; margin-inline: auto; }
.client-logo img { height: 52px; }
.client-logo span { font-size: .65rem; }
@media(max-width:660px) {
 .client-brands-heading { padding-bottom: 18px; flex-direction: column; }
 .client-brands-toggle { position: static; }
 .client-logo-window { max-width: 100%; }
}