.hero{padding-right:32%;min-height:740px}.hero h1{font-size:clamp(90px,12vw,185px)}.client-panel{position:absolute;right:7%;top:115px;width:235px;text-align:center}.client-heading{font-size:10px;letter-spacing:2px;font-weight:500;margin-bottom:22px;color:var(--muted)}.client-window{height:345px;overflow:hidden;mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent)}.client-track{animation:client-scroll 24s linear infinite}.client-group{display:flex;flex-direction:column}.client-logo{height:115px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}.client-logo img{width:95px;height:75px;object-fit:contain;mix-blend-mode:multiply}.client-logo span{font-size:10px;color:var(--muted)}.client-audira img{border-radius:12px;mix-blend-mode:normal;width:70px;height:65px;object-fit:cover}.client-panel:hover .client-track,.client-panel:focus-within .client-track,.logos-paused .client-track{animation-play-state:paused}#client-motion{border:0;background:none;color:var(--muted);font-size:10px;padding:12px;min-height:44px;margin-top:8px}html[data-theme=dark] .client-logo:not(.client-audira) img{filter:grayscale(1) invert(1);mix-blend-mode:screen}html[data-theme=dark] .client-audira img{mix-blend-mode:screen}.hero-bottom{width:100%;flex-wrap:wrap}.q-hint{left:43%;bottom:145px}.scroll-link{white-space:nowrap}@keyframes client-scroll{to{transform:translateY(-50%)}}@media(max-width:950px){.hero{padding-right:30%}.client-panel{right:4%;width:170px;top:125px}.hero h1{font-size:12vw}.q-hint{left:35%;bottom:155px;font-size:11px}.hero-bottom{display:block}.scroll-link{display:block;margin-top:22px}}@media(max-width:600px){.hero{padding:45px 6% 35px;min-height:0}.hero h1{font-size:24vw;margin-top:25px}.client-panel{position:relative;right:auto;top:auto;width:100%;margin:36px 0 0;display:grid;grid-template-columns:1fr 1fr;align-items:center;text-align:left;gap:0 16px}.client-heading{font-size:9px;line-height:1.7;max-width:100px;margin:0}.client-window{height:160px;grid-column:2;grid-row:1 / 3}.client-logo{height:100px}.client-logo img{height:60px;width:80px}.client-audira img{width:60px;height:55px}#client-motion{text-align:left;padding:10px 0;margin:0;width:max-content}.hero-bottom{margin-top:45px}.q-hint{position:static;transform:rotate(-5deg);margin:24px 0}.client-logo span{font-size:9px}.scroll-link{margin-top:22px}}@media(prefers-reduced-motion:reduce){.client-track{animation:none}}

/* Transparent client assets: no blending against rectangular image backgrounds. */
.client-logo img{mix-blend-mode:normal;background:transparent}.client-audira img{object-fit:contain;border-radius:0}html[data-theme=dark] .client-logo img{mix-blend-mode:normal}html[data-theme=dark] .client-dsentosa img,html[data-theme=dark] .client-audira img{filter:none}html[data-theme=dark] .client-daynisco img,html[data-theme=dark] .client-bumitech img{filter:brightness(0) invert(1)}


.q-wrap{display:inline-block;position:relative}.hero .q-wrap .q-hint{position:absolute;left:0;top:100%;bottom:auto;width:max-content;max-width:260px;margin:8px 0 0;transform:rotate(-5deg);font-size:12px;line-height:1.4;font-family:Georgia,serif;font-weight:400;letter-spacing:0}.hero h1{margin-bottom:65px}@media(max-width:600px){.hero .q-wrap .q-hint{font-size:10px;max-width:180px;margin-top:8px}.hero h1{margin-bottom:55px}}


/* Faster project previews, without the long hold at each end. */
.viewport img{animation-duration:10s;animation-timing-function:linear}@keyframes preview{from{transform:translateY(0)}to{transform:translateY(var(--travel))}}

