/* Shared by the portfolio, component sheet, and WordPress help page. */
.client-logo-strip { padding: 0 var(--gutter, 4vw) clamp(2rem, 5vw, 4rem); background: var(--chapter-work, transparent); }
[data-client-logo-carousel] { width: 100%; padding: 0; scroll-margin-top: 14rem; }
[data-client-logo-carousel] .logo-carousel { overflow: hidden; mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent); }
[data-client-logo-carousel] .logo-track { display: flex; width: max-content; animation: client-logo-scroll 36s linear infinite; }
[data-client-logo-carousel] .logo-group { display: flex; flex: none; flex-wrap: nowrap; align-items: center; width: auto; gap: 48px; margin: 0; padding: 0 48px 0 0; list-style: none; }
[data-client-logo-carousel] .logo-group[aria-hidden="true"] { display: flex; }
[data-client-logo-carousel] .client-logo { display: flex; align-items: center; justify-content: center; flex: 0 0 176px; height: 88px; }
[data-client-logo-carousel] .client-logo img { display: block; width: 144px; height: 48px; max-width: none; max-height: none; object-fit: contain; filter: grayscale(1) brightness(0); opacity: .58; }
[data-client-logo-carousel] .logo-wenmark img { width: 76px; height: 76px; }
[data-client-logo-carousel] .logo-five-channels img { width: 116px; height: 54px; }
[data-client-logo-carousel] .logo-bloop img { width: 112px; }
[data-client-logo-carousel] .logo-floorspace img,
[data-client-logo-carousel] .logo-sessionwise img { width: 154px; }
[data-client-logo-carousel] .logo-coach-pages img { width: 112px; height: 66px; }
[data-theme="dark"] [data-client-logo-carousel] .client-logo img { filter: grayscale(1) brightness(0) invert(1); opacity: .65; }
@keyframes client-logo-scroll { to { transform: translateX(-50%); } }
@media (max-width: 760px) {
 [data-client-logo-carousel] .logo-group { gap: 32px; padding-right: 32px; }
 [data-client-logo-carousel] .client-logo { flex-basis: 160px; }
}
@media (prefers-reduced-motion: reduce) {
 [data-client-logo-carousel] .logo-carousel { overflow: visible; mask-image: none; }
 [data-client-logo-carousel] .logo-track { width: 100%; animation: none; }
 [data-client-logo-carousel] .logo-group { width: 100%; padding: 0; gap: 24px; justify-content: center; flex-wrap: wrap; }
 [data-client-logo-carousel] .logo-group[aria-hidden="true"] { display: none; }
}

/* Testimonials use a quiet, fully visible logo grid instead of another moving strip. */
.client-logo-strip--static { padding: 0; background: transparent; }
.client-logo-strip--static [data-client-logo-carousel] .logo-carousel { overflow: visible; mask-image: none; }
.client-logo-strip--static [data-client-logo-carousel] .logo-track { width: 100%; animation: none; }
.client-logo-strip--static [data-client-logo-carousel] .logo-group { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: min(100%, 56rem); gap: .5rem 1.5rem; padding: 0; margin-inline: auto; }
.client-logo-strip--static [data-client-logo-carousel] .logo-group[aria-hidden="true"] { display: none; }
.client-logo-strip--static [data-client-logo-carousel] .client-logo { width: 100%; min-width: 0; height: 76px; }
.client-logo-strip--static [data-client-logo-carousel] .client-logo img { max-width: 100%; }
@media (max-width: 600px) {
 .client-logo-strip--static [data-client-logo-carousel] .logo-group { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1.5rem; }
 .client-logo-strip--static [data-client-logo-carousel] .client-logo { height: 68px; }
}