/* One halo per visible card. Fully covered cards no longer accumulate shadows. */
.project-card{box-shadow:0 16px 44px -18px color-mix(in srgb,var(--project-color,#245bff) 30%,transparent)}
.project-card.is-covered{visibility:hidden;box-shadow:none}
.project-card:not(.is-active) .project-video-start{visibility:hidden}
.projects-heading{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(200px,300px);align-items:end;gap:30px}
.projects-heading>p{font-size:15px;max-width:300px}
.project-filters{min-width:0;overflow:auto;scrollbar-width:none;padding:5px;margin:-5px;align-self:end}
.project-filters::-webkit-scrollbar{display:none}
.project-filter-track{display:flex;position:relative;isolation:isolate;width:max-content;max-width:none;border:1px solid #dce1e7;background:#e8ebef8c;border-radius:100px;padding:4px;gap:2px}
.project-filter-track button{position:relative;z-index:1;flex:none;background:transparent;color:#626b7a;font-size:12px;line-height:1.4;padding:11px 14px;border-radius:100px;white-space:nowrap;cursor:pointer;transition:color .25s}
.project-filter-track button:hover{color:#17243a}
.project-filter-track button[aria-selected=true]{color:#fff}
.project-filter-track button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.project-filter-track button:disabled{opacity:.4;cursor:default}
.project-filter-indicator{position:absolute;left:0;top:4px;bottom:4px;border-radius:100px;background:var(--blue);box-shadow:0 3px 12px #245bff20;pointer-events:none;transition:transform .38s cubic-bezier(.2,.8,.2,1),width .38s cubic-bezier(.2,.8,.2,1)}
@media(max-width:1250px){.projects-heading{grid-template-columns:auto 1fr}.projects-heading>p{justify-self:end}.project-filters{grid-column:1/-1;grid-row:2}}
@media(max-width:800px){
 .projects-heading{display:flex;gap:20px;align-items:stretch}
 .projects-heading>p{order:2;max-width:100%;font-size:14px}
 .project-filters{order:3;align-self:stretch}
 .project-filter-track button{font-size:12px;padding:10px}
 .mobile-project-stack #project-stack{padding-bottom:min(45svh,360px)}
 .mobile-project-stack .project-card{display:contents}
 .mobile-project-stack .project-card>.project-intro,
 .mobile-project-stack .project-card>.project-info,
 .mobile-project-stack .project-card>.project-media{
  position:sticky;top:var(--mobile-sticky-top,16px);width:100%;height:var(--mobile-panel-height,560px);min-height:var(--mobile-panel-height,560px);
  margin:0 0 24px;padding:28px;border-radius:26px;overflow:hidden;box-shadow:0 12px 30px -18px color-mix(in srgb,var(--project-color,#245bff) 30%,transparent);
  grid-column:auto;grid-row:auto;
 }
 .mobile-project-stack .project-card>.project-intro{display:flex;flex-direction:column;gap:18px;height:var(--mobile-intro-height,660px);min-height:var(--mobile-intro-height,660px);z-index:calc(var(--project-depth)*3 + 1);background:var(--project-color);color:var(--project-ink)}
 .mobile-project-stack .project-card>.project-info{display:flex;flex-direction:column;gap:20px;top:calc(var(--mobile-sticky-top,16px) + var(--mobile-logo-band,86px));z-index:calc(var(--project-depth)*3 + 2);background:var(--info-color,#f8f9f9);color:var(--info-ink,#17191e)}
 .mobile-project-stack .project-intro:before,.mobile-project-stack .project-info:before{inset:0;border-radius:inherit}
 .mobile-project-stack .project-intro h3{margin:18px 0 0;font-size:30px;max-width:100%;text-wrap:balance}
 .mobile-project-stack .project-intro>p{font-size:15px;line-height:1.65;margin:0}
 .mobile-project-stack .project-info h4{font-size:27px;margin:3px 0 0}
 .mobile-project-stack .project-info .project-work{font-size:15px;line-height:1.65}
 .mobile-project-stack .project-info-bottom{margin-top:auto;padding-bottom:0;display:grid;gap:20px}
 .mobile-project-stack .project-number{top:27px;right:24px}
 .mobile-project-stack .project-client{font-size:23px;min-height:42px}
 .mobile-project-stack .project-card>.project-media{display:grid;place-items:center;padding:0;top:calc(var(--mobile-sticky-top,16px) + var(--mobile-logo-band,86px));z-index:calc(var(--project-depth)*3 + 3);background:var(--media-color);border-radius:26px}
 .mobile-project-stack .project-card .project-media>.project-image{height:100%;width:100%;max-height:none}
 .mobile-project-stack .project-card .project-media>.project-video-frame{height:100%;width:100%}
 .mobile-project-stack .project-media .project-team{bottom:18px;right:16px;max-width:calc(100% - 32px);font-size:10px}
 .mobile-project-stack .project-card .media-caption{top:16px;left:16px;bottom:auto;max-width:calc(100% - 32px)}
 .mobile-project-stack .project-media:has(.project-video-controls)>.project-team{bottom:82px}
 .mobile-project-stack .project-card .demo-screen{width:88%}
 .mobile-project-stack .project-card>.is-covered{visibility:hidden;box-shadow:none;pointer-events:none}
 .mobile-project-stack #project-stack.is-measuring .project-intro,
 .mobile-project-stack #project-stack.is-measuring .project-info{height:auto;min-height:0}
}
@media(max-width:800px) and (max-height:650px){
 .mobile-project-stack .project-card>.project-intro,.mobile-project-stack .project-card>.project-info{padding:24px;gap:16px}
 .mobile-project-stack .project-info h4{font-size:25px}
 .mobile-project-stack .project-info .project-work,.mobile-project-stack .project-intro>p{font-size:14px;line-height:1.55}
 .mobile-project-stack .project-info-bottom{gap:16px}
}

/* Use the same vector arrows on phones and desktop. */
.button>span[aria-hidden=true],.text-link>span[aria-hidden=true],.messenger-arrow,.contact-toggle-icon,.project-open>span{font-size:0!important}
.button>span[aria-hidden=true]:before,.text-link>span[aria-hidden=true]:before,.messenger-arrow:before,.contact-toggle-icon:before,.project-open>span:before{content:'';display:block;width:20px;height:20px;background:currentColor;mask:url('/assets/v5/arrow-down-right.svg') center/contain no-repeat;-webkit-mask:url('/assets/v5/arrow-down-right.svg') center/contain no-repeat}
.contact-toggle-icon,.project-open>span{position:relative}
.contact-toggle-icon:before,.project-open>span:before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.price-card>div>a{font-size:0;display:grid;place-items:center}
.price-card>div>a:before{content:'';width:20px;height:20px;background:currentColor;mask:url('/assets/v5/arrow-down-right.svg') center/contain no-repeat;-webkit-mask:url('/assets/v5/arrow-down-right.svg') center/contain no-repeat}
.contact-actions .contact-max-icon{width:22px;height:22px}
@media(max-width:500px){
 .contact-actions .contact-max-icon{width:18px;height:18px}
 .contact-actions .button>span[aria-hidden=true]{display:inline-grid;place-items:center;flex:none}
 .contact-actions .button>span[aria-hidden=true]:before{width:16px;height:16px}
 .contact-actions .button{gap:10px}
 .support-actions .button>span[aria-hidden=true]{display:inline-grid;place-items:center;min-width:14px;flex:none;opacity:0}
 .support-actions .button>span[aria-hidden=true]:before{width:14px;height:14px}
 .support-price .support-actions .button{padding-left:9px;padding-right:9px;gap:6px;--reveal-origin:16px}
 .support-price .support-actions .button.support-glitch-trigger{padding-right:36px;--reveal-origin:18px}
 .support-actions .button:focus-visible>span[aria-hidden=true],.support-actions .button:active>span[aria-hidden=true]{opacity:1}
 .hero-contact .contact-toggle-icon{display:grid;place-items:center}
}
@media(max-width:360px){.support-price .support-actions .button{font-size:11px;gap:4px;padding-left:7px;padding-right:7px;--reveal-origin:14px}.support-actions .button>span[aria-hidden=true]:before{width:12px;height:12px}}
.motion-off .project-filter-indicator{transition:none}
@media(prefers-reduced-motion:reduce){.project-filter-indicator{transition:none}}