/* Customer marks supplied by ZONYEA; brand colours are declared in the static source. */
.client-showcase{background:#f7f5ef;color:#272923}
.client-showcase-inner{width:min(1480px,100%);margin:auto;display:grid;grid-template-columns:1fr}
.client-story{min-height:260px;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);grid-template-rows:auto 1fr auto;column-gap:80px;align-items:end;padding:44px clamp(38px,4.2vw,76px) 40px;background:#c8baa4}
.client-story .eyebrow{color:#4e564f}
.client-story h2{grid-column:1;grid-row:2;font:400 clamp(39px,3.5vw,58px)/1.35 var(--serif);letter-spacing:-.065em;margin:25px 0 0}
.client-story p{grid-column:2;grid-row:2;max-width:460px;font-size:14px;line-height:2;color:#4b4e47;margin:0}
.client-story-link{grid-column:2;grid-row:3;display:inline-flex;align-items:center;justify-self:start;gap:48px;margin-top:18px;padding-bottom:10px;border-bottom:1px solid #474a42;font-size:12px;letter-spacing:.08em;transition:gap .2s}
.client-story-link:hover{gap:57px}
.client-story-index{grid-column:1;grid-row:3;font:10px Arial,sans-serif;letter-spacing:.2em;color:#5e6159}
.client-logo-wall{min-width:0;display:flex;flex-direction:column;padding:41px 43px 24px;background:#f8f7f2}
.client-selected-grid{flex:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,138px);gap:1px;padding:1px;background:#dcd9d0}
.client-mark{min-width:0;display:flex;align-items:center;justify-content:center;padding:18px;background:#fbfaf7;transition:background-color .22s}
.client-mark:hover{background:#f2eee4}
.client-mark img{display:block;width:auto;height:auto;max-width:88%;max-height:70px;object-fit:contain;opacity:.88;transition:opacity .22s}
.client-mark:hover img{opacity:1}
.client-selected-grid .client-official-logo{opacity:1;mix-blend-mode:multiply}
.client-brandmark{display:block;width:88%;height:70px;background:var(--brand-ink);-webkit-mask-image:var(--brand-mask);mask-image:var(--brand-mask);-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.client-selected-grid .client-mark{padding:12px 10px}
.client-logo-box{width:100%;height:70px;min-width:0;display:flex;align-items:center;justify-content:center;flex:none}
.client-logo-box img{max-width:min(82%,220px);max-height:58px}
.client-logo-box .client-brandmark{width:min(82%,var(--brand-w),220px);height:min(var(--brand-h),58px)}
.client-mark--compact .client-logo-box img{max-width:min(68%,175px);max-height:49px}
.client-mark--symbol .client-logo-box img{max-width:145px;max-height:54px}
.client-mark--wide .client-logo-box img{max-width:92%;max-height:60px}
.client-mark--wide .client-logo-box .client-brandmark{width:min(92%,var(--brand-w))}
.client-mark--nio .client-logo-box img{filter:brightness(0);opacity:.82}
.client-more{display:none}
.client-caption{margin:18px 0 0;text-align:right;font-size:11px;letter-spacing:.03em;color:#76786f}

.client-directory{background:#f3f1eb}
.client-directory-head{display:grid;grid-template-columns:1fr minmax(260px,390px);gap:90px;align-items:end;margin-bottom:66px}
.client-directory-head .display{margin:18px 0 0}
.client-directory-head p{font-size:14px;line-height:2;color:#6a6b62;margin:0 0 10px}
.client-groups{border-top:1px solid #cbc8bd}
.client-group{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;padding:32px 0;border-bottom:1px solid #cbc8bd}
.client-group-heading{padding:13px 16px 0 0}
.client-group-heading span,.client-group-heading small{font:10px Arial,sans-serif;letter-spacing:.16em;color:#87877c}
.client-group-heading h3{font:400 27px/1.45 var(--serif);letter-spacing:-.05em;margin:29px 0 9px}
.client-group-heading small{display:block;line-height:1.5}
.client-group-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:#dcd9d0;padding:1px}
.client-group-grid .client-mark{min-height:118px;padding:18px 12px}
.client-group-grid .client-mark img{max-width:92%;max-height:60px}
.client-directory-note{margin:25px 0 0;font-size:11px;color:#797b72}

@media(max-width:1180px){
  .client-showcase-inner{grid-template-columns:1fr}
  .client-story{padding-left:38px;padding-right:38px}
  .client-story h2{font-size:42px}
  .client-logo-wall{padding:30px 28px 20px}
  .client-selected-grid{grid-template-rows:repeat(5,138px)}
  .client-group{grid-template-columns:180px minmax(0,1fr)}
  .client-group-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:800px){
  .client-showcase-inner{grid-template-columns:1fr}
  .client-story{min-height:0;display:flex;flex-direction:column;align-items:flex-start;padding:56px 30px 48px}
  .client-story h2{font-size:clamp(37px,9vw,52px);margin:38px 0 22px}
  .client-story p{font-size:13px}
  .client-story-index{display:none}
  .client-story-link{margin-top:28px}
  .client-logo-wall{padding:24px 19px 26px}
  .client-selected-grid{min-width:0;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:138px}
  .client-selected-grid .client-mark{min-height:0;padding:11px 9px}
  .client-logo-box{height:68px}
  .client-more{display:flex;align-items:center;justify-content:center;background:#ebe5d9;padding:14px}
  .client-more a{font-size:13px;letter-spacing:.04em;border-bottom:1px solid currentColor;padding:0 0 7px}
  .client-more a span{margin-left:22px}
  .client-caption{text-align:left;line-height:1.7}
  .client-directory-head{grid-template-columns:1fr;gap:15px;margin-bottom:38px}
  .client-directory-head p{font-size:13px}
  .client-group{display:block;padding:28px 0}
  .client-group-heading{display:flex;align-items:baseline;gap:15px;padding:0 0 20px}
  .client-group-heading h3{font-size:23px;margin:0}
  .client-group-heading small{margin-left:auto;text-align:right}
  .client-group-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .client-group-grid .client-mark{min-height:105px}
}
@media(max-width:560px){
  .client-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .client-selected-grid{grid-template-columns:1fr;grid-auto-rows:128px}
  .client-selected-grid .client-mark{min-height:0}
  .client-logo-box{height:60px}
  .client-group-heading{display:grid;grid-template-columns:60px 1fr;column-gap:10px;row-gap:2px}
  .client-group-heading h3{grid-column:2;grid-row:1/3}
  .client-group-heading small{grid-column:2;text-align:left;margin:0}
  .client-group-grid .client-mark{min-height:107px}
}