/* Motion layer with a visitor-controlled accessible pause. */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:4px;background:#242b36;z-index:250;transform:scaleX(0);transform-origin:left center;pointer-events:none;will-change:transform}
.site-header{transition:box-shadow .4s ease,background .4s ease}.site-header.is-scrolled{box-shadow:0 1px 0 rgba(28,35,48,.11);background:rgba(250,250,248,.94)}
.motion-toggle{display:inline-flex;align-items:center;gap:7px;flex:none;background:transparent;color:var(--ink);border:1px solid #c2c5c4;border-radius:50px;padding:9px 12px;font:700 9px/1 var(--body);letter-spacing:.08em;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.motion-toggle:hover,.motion-toggle:focus-visible{background:#1c2330;border-color:#1c2330;color:#fff}
.motion-toggle:focus-visible{outline:2px solid #76818e;outline-offset:3px}
.motion-toggle-dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.9}
.motion-off .motion-toggle-dot{opacity:.35}
.brand-name{transition:opacity .3s ease}.brand:hover .brand-name{opacity:.6}
.hero{--scroll-a:0px;--scroll-b:0px;--scroll-c:0px}
.hero-roles{z-index:2;top:24%;gap:2px;overflow:hidden}
.role-line{display:block;width:100%;overflow:hidden;animation:none!important;transform:none!important;line-height:.99;will-change:auto}
.marquee-shift{width:max-content;transform:translate3d(var(--scroll-a),0,0);will-change:transform}
.role-line-two .marquee-shift{transform:translate3d(var(--scroll-b),0,0)}
.role-line-three .marquee-shift{transform:translate3d(var(--scroll-c),0,0)}
.marquee-track{display:flex;width:max-content;will-change:transform}
.marquee-group{display:flex;align-items:baseline;flex:none;gap:clamp(28px,3vw,52px);padding-right:clamp(28px,3vw,52px);white-space:nowrap}
.marquee-group>span{display:block;flex:none;line-height:1}
.motion-on .marquee-track{animation:marquee-left var(--marquee-duration,60s) linear infinite}
.motion-on .role-line-one .marquee-track{animation-delay:-14s}
.motion-on .role-line-two .marquee-track{animation-direction:reverse;animation-delay:-22s}
.motion-on .role-line-three .marquee-track{animation-delay:-37s}
@keyframes marquee-left{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.hero-bottom{z-index:5}
.hero-bottom a>span{display:inline-block}.motion-on .hero-bottom a>span{animation:scroll-cue 1.35s ease-in-out infinite alternate}
@keyframes scroll-cue{from{transform:translateY(-3px)}to{transform:translateY(8px)}}
.motion-on.js-enabled .reveal{opacity:0;transform:translate3d(0,78px,0) scale(.985);filter:blur(3px);transition:opacity .85s ease,transform 1.05s cubic-bezier(.19,1,.22,1),filter .9s ease}
.motion-on.js-enabled .reveal.visible{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
.motion-on.js-enabled .project .work-art{clip-path:inset(0 0 36% 0);transform:translate3d(0,86px,0) scale(.97);opacity:.22;transition:clip-path 1.15s cubic-bezier(.2,.8,.2,1),transform 1.25s cubic-bezier(.2,.8,.2,1),opacity 1.05s ease,filter .35s ease}
.motion-on.js-enabled .project.visible .work-art{clip-path:inset(0 0 0 0);transform:translate3d(0,0,0) scale(1);opacity:1}
.motion-on.js-enabled .section-heading .section-title-row h2{transform:translateY(50px);opacity:.25;transition:transform 1.15s cubic-bezier(.19,1,.22,1),opacity .9s ease}
.motion-on.js-enabled .section-heading.visible .section-title-row h2{transform:translateY(0);opacity:1}
.art-lending .lending-phone,.art-commerce .commerce-orbit,.art-banking .bank-orb,.art-campaign .campaign-graphic{translate:0 var(--art-drift,0px);transition:translate .35s ease-out;will-change:translate}
.expertise-item:nth-child(2){transition-delay:90ms}.expertise-item:nth-child(3){transition-delay:180ms}.expertise-item:nth-child(4){transition-delay:270ms}
.expertise-item .expertise-symbol{transition:transform .45s cubic-bezier(.2,.7,.2,1)}.expertise-item:hover .expertise-symbol{transform:translate(8px,-8px)}
.project-open span:not(.sr-only){display:inline-block;transition:transform .35s ease}.project-open:hover span:not(.sr-only){transform:translate(5px,-5px)}
@media(max-width:800px){.hero-roles{top:31%;gap:4px}.role-line{font-size:17.5vw}.hero-bottom{z-index:4}}
@media(max-width:800px){.motion-toggle{margin-left:auto;padding:8px 10px}}
@media(max-width:560px){.hero-roles{top:32%;gap:4px}.role-line{font-size:19vw}.motion-toggle{gap:6px;font-size:8px}.motion-on.js-enabled .reveal{transform:translate3d(0,48px,0)}.motion-on.js-enabled .reveal.visible{transform:none}}
.motion-off .marquee-track,.motion-off .hero-bottom a>span{animation:none!important;transition:none!important}
.motion-off .marquee-shift{transform:none!important}
