.work-case-study{--case-ink:#172b42;--case-muted:#526277;--case-line:#dce4ed;--case-accent:#1c63ef;width:min(1120px,100%);color:var(--case-ink);margin:64px auto}.work-case-heading{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.work-case-study .work-case-kicker{color:var(--case-accent);letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px;font-size:12px;font-weight:650;line-height:1.5}.work-case-heading h2{letter-spacing:-.035em;max-width:760px;margin:0;font-size:clamp(28px,3.7vw,46px);font-weight:550;line-height:1.2}.work-case-kind{color:#174c9c;background:#edf4ff;border:1px solid #c6d7f1;border-radius:30px;flex-shrink:0;padding:8px 12px;font-size:12px;line-height:1.5}.work-case-study p{font-size:15px;line-height:1.85}.work-case-study .work-case-disclosure{max-width:780px;color:var(--case-muted);margin:20px 0;font-size:13px}.work-case-nav{border-top:1px solid var(--case-line);border-bottom:1px solid var(--case-line);flex-wrap:wrap;gap:12px 26px;margin:0 0 36px;padding:20px 0;display:flex}.work-case-study a{color:inherit;text-underline-offset:4px}.work-case-nav a{font-size:13px;text-decoration:none}.work-case-study a:hover{color:var(--case-accent)}.work-case-study a:focus-visible,.work-case-scroll:focus-visible{outline:3px solid var(--case-accent);outline-offset:4px}.work-case-study section[id]{scroll-margin-top:110px}.work-case-study h3{letter-spacing:-.02em;margin:0 0 14px;font-size:21px;font-weight:550;line-height:1.4}.work-case-gallery>p{max-width:760px;color:var(--case-muted);margin:0 0 26px}.work-case-screens{border:1px solid var(--case-line);background:#eaf0f5;border-radius:6px;grid-template-columns:minmax(0,1fr) minmax(220px,.34fr);align-items:start;gap:24px;padding:28px;display:grid}.work-case-screen{background:#fff;border:1px solid #cbd7e3;border-radius:7px;min-width:0;margin:0;overflow:hidden;box-shadow:0 12px 24px #172b420b}.work-case-browser{border-bottom:1px solid var(--case-line);color:var(--case-muted);background:#f7f9fb;justify-content:space-between;align-items:center;gap:10px;padding:12px;font-size:11px;display:flex}.work-case-browser>span:first-child{color:#9eafbe;letter-spacing:3px;white-space:nowrap;font-size:8px}.work-case-scroll{overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#a2b6cb #edf2f7;background:#fff;height:480px;overflow-y:auto}.work-case-study .work-case-scroll img{object-fit:initial;border-radius:0;width:100%;height:auto;display:block;transform:none}.work-case-screen figcaption{border-top:1px solid var(--case-line);color:var(--case-muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0;padding:12px;font-size:11px;line-height:1.6;display:flex}.work-case-screen figcaption a{color:#174c9c}.work-case-study .work-case-capture-meta{overflow-wrap:anywhere;margin:16px 0 0;font-size:12px}.work-case-architecture{padding:48px 0 32px}.work-case-flow{flex-wrap:wrap;gap:8px;margin:24px 0 32px;padding:0;list-style:none;display:flex}.work-case-flow li{background:#f5f8fb;border-top:1px solid #b6c8dc;flex:135px;align-items:center;gap:12px;min-width:0;padding:16px 12px;font-size:13px;line-height:1.6;display:flex}.work-case-flow li>span{color:#4d6785;font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}.work-case-decisions{grid-template-columns:1fr 1fr;gap:40px;display:grid}.work-case-decisions p{color:var(--case-muted);margin:0}.work-case-study .work-case-note{color:var(--case-muted);margin:20px 0 0;font-size:12px}.work-case-implementation,.work-case-results{border-top:1px solid var(--case-line);grid-template-columns:1fr 2fr;gap:40px;padding:32px 0;display:grid}.work-case-stack{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.work-case-stack li{border:1px solid var(--case-line);background:#f0f4f8;border-radius:3px;padding:8px 12px;font-size:13px;line-height:1.5}.work-case-results{border:1px solid var(--case-line);background:#f6f8fa;border-radius:6px;padding:32px}.work-case-results p{margin:0}.work-case-demo{background:#172b42;border-radius:3px;justify-content:space-between;align-items:center;gap:30px;margin-top:24px;padding:13px 18px;font-size:13px;text-decoration:none;display:inline-flex;color:#fff!important}.work-case-demo:hover{background:#1c63ef}.jp-article-body .work-case-study{margin:40px 0}@media (max-width:800px){.work-case-heading{flex-direction:column;align-items:flex-start;gap:16px}.work-case-screens{grid-template-columns:minmax(0,1fr) minmax(155px,.42fr);gap:14px;padding:16px}.work-case-scroll{height:380px}.work-case-decisions{gap:24px}.work-case-implementation,.work-case-results{grid-template-columns:1fr;gap:20px}}@media (max-width:600px){.work-case-study{margin:40px auto}.work-case-nav{gap:12px 20px;margin-bottom:28px}.work-case-nav a{font-size:12px}.work-case-screens{grid-template-columns:minmax(0,1fr);gap:24px;padding:14px}.work-case-screen-mobile{justify-self:center;width:min(260px,100%)}.work-case-screen-desktop .work-case-scroll{height:280px}.work-case-screen-mobile .work-case-scroll{height:420px}.work-case-decisions{grid-template-columns:1fr;gap:28px}.work-case-flow{grid-template-columns:1fr 1fr;gap:8px;display:grid}.work-case-flow li{padding:12px 10px;font-size:12px}.work-case-results{padding:24px 18px}.work-case-architecture{padding-top:36px}}.work-case-scroll{scroll-behavior:auto;overflow-anchor:none}.work-case-motion-controls{border-top:1px solid var(--case-line);background:#f7f9fb;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:10px 12px;display:flex}.work-case-motion-status{color:#526277;align-items:center;gap:6px;font-size:10px;line-height:1.6;display:inline-flex}.work-case-motion-dot{background:#718298;border-radius:50%;flex-shrink:0;width:5px;height:5px}.work-case-motion-controls[data-motion=playing] .work-case-motion-dot{background:#1c63ef}.work-case-motion-controls[data-motion=complete] .work-case-motion-dot{background:#23704c}.work-case-motion-actions{flex-wrap:wrap;gap:5px;display:flex}.work-case-motion-actions button{color:#214a78;min-height:32px;font:inherit;cursor:pointer;background:#fff;border:1px solid #c6d4e4;border-radius:3px;justify-content:center;align-items:center;gap:5px;padding:5px 8px;font-size:11px;line-height:1.4;display:inline-flex}.work-case-motion-actions button:hover{color:#174c9c;background:#edf4ff;border-color:#1c63ef}.work-case-motion-actions button:focus-visible{outline:3px solid var(--case-accent);outline-offset:2px}.work-case-motion-actions button:disabled{opacity:.5;cursor:default}.work-case-motion-actions button>span{font-size:10px}.work-case-motion-progress{background:#dde7f2;height:2px;overflow:hidden}.work-case-motion-progress>span{transform-origin:0;background:#1c63ef;width:100%;height:100%;display:block;transform:scaleX(0)}.work-case-screen-mobile .work-case-motion-controls{flex-direction:column;align-items:flex-start}@media (max-width:600px){.work-case-motion-actions button{min-height:40px;padding:7px 10px}}
