@font-face{font-family:Noto Sans HK Clients;src:url(/assets/fonts/noto-sans-hk-clients.woff2)format("woff2");font-style:normal;font-weight:600 900;font-display:swap;unicode-range:U+2B-2C,U+30-31,U+4F5C,U+53CA,U+5408,U+54C1,U+591A,U+5BA2,U+6236,U+672A,U+69CB,U+6A5F,U+724C,U+7684,U+76E1,U+773E,U+7A4D,U+7D2F,U+80FD,U+904E,U+9304}.client-section{--client-display:"Noto Sans HK Clients", "PingFang HK", "PingFang TC", "Noto Sans TC", sans-serif;--client-paper:#eee9dc;--client-ink:#171715;--client-beam:#d4bc18;isolation:isolate;color:var(--client-ink);background-color:var(--client-paper);background-image:radial-gradient(circle at 8% 16%,#ffffff80,#0000 34%),radial-gradient(circle at 76% 84%,#60522a1a,#0000 38%),repeating-linear-gradient(104deg,#5e513009 0 1px,#0000 1px 5px);border-top:1px solid #17171538;position:relative;overflow:hidden}.client-section:before{z-index:0;background:var(--client-beam);clip-path:polygon(72% 0,91% 0,66% 100%,34% 100%);content:"";position:absolute;inset:0}.client-section:after{z-index:1;content:"";mix-blend-mode:multiply;opacity:.18;pointer-events:none;background-image:radial-gradient(#1717152e .45px,#0000 .65px),repeating-linear-gradient(0deg,#0000 0 3px,#ffffff14 3px 4px);background-size:5px 5px,100% 4px;position:absolute;inset:0}.client-section__halftone{z-index:1;mix-blend-mode:multiply;opacity:.34;pointer-events:none;background:image-set("/assets/images/backgrounds/hong-kong-halftone-reverse.webp" 1x type("image/webp"),"/assets/images/backgrounds/hong-kong-halftone-reverse.png" 1x type("image/png")) top/max(100%,1536px) no-repeat;position:absolute;inset:0}.client-intro{z-index:2;padding-top:clamp(82px,7.4vw,126px);padding-bottom:clamp(64px,5.4vw,92px);position:relative}.client-intro__copy{max-width:min(100%,940px)}.client-intro__copy :is(h1,h2){max-width:9.7em;font-family:var(--client-display);letter-spacing:-.075em;text-wrap:balance;flex-wrap:wrap;align-items:baseline;gap:0 .18em;margin:0;font-size:clamp(66px,7.4vw,126px);font-weight:900;line-height:.9;display:flex}.client-intro__copy :is(h1,h2) span{white-space:nowrap}.client-intro__copy :is(h1,h2) em{color:#9e8710;white-space:nowrap;font-style:normal}.client-intro__copy>p{color:#171715d1;max-width:52rem;font-family:var(--client-display);letter-spacing:.025em;margin:clamp(28px,2.5vw,42px) 0 0;font-size:clamp(16px,1.25vw,20px);font-weight:700;line-height:1.7}.client-intro__actions{flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:clamp(30px,3vw,48px);display:flex}.client-action{min-height:58px;color:var(--client-ink);font-family:var(--client-display);letter-spacing:.025em;border:1px solid #0000;align-items:center;padding:14px 22px;font-size:15px;font-weight:850;text-decoration:none;transition:background-color .18s,border-color .18s,color .18s,transform .18s;display:inline-flex}.client-action:hover{transform:translateY(-3px)}.client-action--primary{color:var(--white);background:var(--client-ink)}.client-action--primary:hover{color:var(--client-ink);background:var(--client-beam)}.client-action--outline{border-color:#a58c0a}.client-action--outline:hover{color:var(--client-ink);background:#d4bc1838}.client-action--gold{color:var(--client-ink);background:var(--client-beam);border-color:var(--client-beam)}.client-action--gold:hover{color:var(--white);background:var(--client-ink);border-color:var(--client-ink)}.client-ticker{z-index:3;transform-origin:50%;width:108%;margin:0 0 clamp(62px,6vw,104px) -4%;position:relative;transform:rotate(-2.4deg)}.client-ticker__viewport{background:#f7f3e9e6;border-top:1px solid #171715b8;border-bottom:1px solid #171715b8;height:clamp(138px,10vw,178px);position:relative;overflow:hidden;box-shadow:0 9px #17171517}.client-ticker__viewport--spotlight{clip-path:polygon(43% 0,74% 0,67% 100%,35% 100%);pointer-events:none;position:absolute;inset:0}.client-ticker__track{will-change:transform;width:max-content;height:100%;animation:34s linear infinite client-ticker;display:flex}.client-ticker:hover .client-ticker__track,.client-ticker:focus-within .client-ticker__track{animation-play-state:paused}.client-logo{cursor:default;background:#f7f3e9bd;border-right:1px solid #1717154d;flex:0 0 clamp(174px,12vw,230px);place-items:center;height:100%;margin:0;padding:clamp(22px,2vw,36px);transition:background-color .18s,box-shadow .18s,transform .18s;display:grid}.client-logo img{object-fit:contain;filter:grayscale()saturate(0)opacity(.62);width:min(84%,168px);max-height:90px;transition:filter .18s,transform .18s}.client-logo:hover,.client-logo:focus-within{z-index:1;box-shadow:inset 0 0 0 2px var(--client-ink), 7px 9px 0 #17171529;background:#fffdf7;position:relative;transform:translateY(-7px)}.client-logo:hover img,.client-logo:focus-within img{filter:none;transform:scale(1.055)}.client-ticker__viewport--spotlight .client-logo{background:0 0;border-color:#0000}.client-ticker__viewport--spotlight .client-logo img{filter:none}@keyframes client-ticker{to{transform:translate(-50%)}}@media (width<=900px){.client-section:before{clip-path:polygon(76% 0,100% 0,78% 100%,17% 100%)}.client-intro{padding-top:76px;padding-bottom:64px}.client-intro__copy :is(h1,h2){max-width:8.6em;font-size:clamp(58px,10.8vw,88px)}.client-action--gold{border-color:var(--client-ink)}}@media (width<=600px){.client-section:before{clip-path:polygon(82% 0,118% 0,83% 100%,6% 100%)}.client-section:after{opacity:.24}.client-section__halftone{opacity:.3;background-position:62% 0;background-size:auto 100%}.client-intro{padding-top:60px;padding-bottom:52px}.client-intro__copy :is(h1,h2){gap:.06em;font-size:clamp(54px,16vw,78px);line-height:.94;display:grid}.client-intro__copy :is(h1,h2) em{margin-left:.46em}.client-intro__copy>p{font-size:15px}.client-intro__copy>p br{display:none}.client-intro__actions{align-items:stretch;gap:12px;display:grid}.client-action{width:100%;min-height:52px}.client-ticker{width:118%;margin-left:-9%;transform:rotate(-1.8deg)}.client-logo{flex-basis:148px;height:128px;padding:22px}.client-ticker__viewport--spotlight{clip-path:polygon(25% 0,82% 0,69% 100%,10% 100%)}}@media (prefers-reduced-motion:reduce){.client-ticker__viewport{scrollbar-width:none;overflow-x:auto}.client-ticker__viewport::-webkit-scrollbar{display:none}.client-ticker__track{will-change:auto;animation:none}.client-ticker__viewport--spotlight{display:none}}
