.client-marquee{--logo-box-width:clamp(150px,13vw,245px);--logo-height:clamp(72px,7.5vw,120px);--logo-canvas-width:var(--logo-box-width);--box-gap:clamp(22px,3.2vw,64px);--marquee-gap:calc(var(--box-gap) + var(--logo-box-width) - var(--logo-canvas-width) * 0.620454545455);position:absolute;z-index:1;top:13%;left:0;width:100%;overflow:hidden;padding:20px 0;background:rgba(187,225,235,.6);clip-path:inset(0 0 0 100%);opacity:0;transition:clip-path 1.15s cubic-bezier(.16,1,.3,1),opacity .45s ease;mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 100%)}
.client-marquee.is-visible{clip-path:inset(0);opacity:1}
.client-marquee__track{display:flex;width:max-content;will-change:transform;animation:client-marquee-scroll 36s linear infinite;animation-play-state:paused;backface-visibility:hidden;transform:translate3d(0,0,0);contain:layout paint}
.client-marquee.is-ready .client-marquee__track{animation-play-state:running}
.client-marquee__group{display:flex;align-items:center;gap:var(--marquee-gap);padding-right:var(--marquee-gap)}
.client-logo{position:relative;width:calc(var(--logo-canvas-width) * var(--art-width));height:var(--logo-height);flex:none;opacity:.5}
.client-logo img{position:absolute;top:50%;left:calc(var(--logo-canvas-width) * var(--art-left) * -1);display:block;width:var(--logo-canvas-width);max-width:none;height:max(var(--logo-height),calc(var(--logo-canvas-width) / 2));object-fit:contain;filter:none;backface-visibility:hidden;transform:translate3d(0,-50%,0)}
/* Explicit sibling layers inside the footer: ribbon 1, portrait 2, copy 3.
   The portrait is prepended by journey.js; equal layers paint it underneath. */
footer#contact{isolation:isolate}
footer#contact>.eyebrow,footer#contact>.contact-title{position:relative;z-index:3}
footer#contact>.footer-bottom{z-index:3}
footer#contact>.return-portrait,.horizontal footer#contact>.return-portrait{z-index:2}
@media(min-width:900px){.client-marquee{top:calc(13% + 10px)}footer#contact>.footer-bottom>*{translate:none!important;rotate:none!important;scale:1!important}}
@keyframes client-marquee-scroll{to{transform:translate3d(-50%,0,0)}}
@media(max-width:899px){footer#contact{position:relative;min-height:calc(444px + 106.8vw)}footer#contact .return-portrait{top:auto;bottom:calc(100% - 372px - 106.8vw);height:auto;aspect-ratio:927/1269}footer#contact .return-portrait img{object-position:right top}.client-marquee{position:absolute;top:calc(312px + 106.8vw);bottom:auto;width:calc(100% + 12vw);margin:0 -6vw;padding:16px 0;--box-gap:28px;--logo-box-width:136px;--logo-height:67.2px;clip-path:none;transition:opacity .2s ease;mask-image:linear-gradient(90deg,transparent 0,#000 13%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 13%,#000 100%)}.client-marquee__group{min-height:84px}.client-marquee__track{animation-duration:29s}}
@media(prefers-reduced-motion:reduce){.client-marquee{clip-path:none;opacity:1}.client-marquee__track{animation:none;transform:none}.client-marquee__group[aria-hidden="true"]{display:none}}

/* Use each original PNG's full nontransparent horizontal bounds.
   Keep the original image scale; redistribute transparent side padding into
   equal artwork gaps. Group length and 36s/29s loop speeds stay unchanged. */
.client-logo:has(img[src$="/ea.png"]){--art-left:0.15312500;--art-width:0.69375000}
.client-logo:has(img[src$="/relic.png"]){--art-left:0.06250000;--art-width:0.87500000}
.client-logo:has(img[src$="/nike.png"]){--art-left:0.06250000;--art-width:0.87500000}
.client-logo:has(img[src$="/lego.png"]){--art-left:0.34375000;--art-width:0.31250000}
.client-logo:has(img[src$="/moon-rock.png"]){--art-left:0.17187500;--art-width:0.65625000}
.client-logo:has(img[src$="/orbiiit.png"]){--art-left:0.06250000;--art-width:0.87500000}
.client-logo:has(img[src$="/ufc.png"]){--art-left:0.06250000;--art-width:0.87500000}
.client-logo:has(img[src$="/fifa.png"]){--art-left:0.06250000;--art-width:0.87500000}
.client-logo:has(img[src$="/nba.png"]){--art-left:0.42500000;--art-width:0.15000000}
.client-logo:has(img[src$="/nhl.png"]){--art-left:0.35000000;--art-width:0.30000000}
.client-logo:has(img[src$="/g-shock.png"]){--art-left:0.33125000;--art-width:0.33750000}