/* Scroll is the timeline. Nothing plays on a loop. */
.page-progress{position:fixed;z-index:100;top:0;left:0;width:100%;height:3px;background:var(--coral);transform:scaleX(0);transform-origin:left;pointer-events:none}
.motion-tools{position:fixed;right:18px;bottom:18px;z-index:40;display:flex;align-items:center;gap:10px;padding:7px 7px 7px 14px;background:#f3f2edf2;border:1px solid #bbc3bb;border-radius:30px;box-shadow:0 4px 18px #18222116;font-size:11px;color:var(--ink)}
.motion-tools button{border:0;background:var(--ink);color:var(--paper);padding:8px 13px;border-radius:25px;font-size:11px;min-height:34px}
.footer{padding-bottom:100px}
.scroll-scene{perspective:1200px}
.js-motion .scroll-scene.static-film.hero-film{height:calc(76svh + 620px)!important}
.js-motion .scroll-scene.static-film.mini-film{height:calc(420px + 440px)!important}
.js-motion .scroll-scene.static-film .film-pin{position:sticky;top:24px}
.js-motion .hero-film .film-pin{height:76svh;min-height:460px;max-height:850px}
.js-motion .scroll-scene .film-poster{will-change:transform}
.scroll-scene .film-shade{background:linear-gradient(90deg,#101b19bb,transparent 85%)}
.scroll-scene.static-film .film-progress{display:block}
.scroll-scene .film-caption{top:8%;bottom:auto;max-width:85%}
.scroll-scene .film-caption p{font-size:clamp(36px,4.2vw,68px)}
.scroll-hint{position:absolute;z-index:5;left:5%;bottom:30px;font-size:12px;color:white;display:flex;align-items:center;gap:12px}
.scroll-hint:before{content:'↓';display:grid;place-items:center;width:28px;height:38px;border:1px solid #ffffff80;border-radius:20px;font-size:16px}
.story-stack{position:absolute;z-index:5;inset:45% 6% 16% auto;width:min(410px,42%);perspective:1000px;pointer-events:none}
.story-card{position:absolute;inset:0 auto auto 0;width:100%;padding:21px 24px;border:1px solid #ffffffba;border-radius:12px;background:#f3f2edf5;box-shadow:0 18px 55px #0d20193b;color:var(--ink);transform-origin:center;backface-visibility:hidden}
.story-card:nth-child(2){background:#e7ebff}.story-card:nth-child(3){background:#2439bc;color:white;border-color:#6477e5}
.story-card small{display:flex;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;margin-bottom:16px;opacity:.8}
.story-card strong{display:block;font-size:clamp(21px,2.4vw,34px);font-weight:500;letter-spacing:-.04em;line-height:1.15;margin-bottom:10px}
.story-card p{font-size:13px;line-height:1.5}.story-card b{font-size:12px;font-weight:500}
.story-caption{position:absolute;z-index:5;left:5%;bottom:87px;color:white;font-size:14px;max-width:40%}
.mini-film .story-stack{inset:36% 7% auto;width:86%;height:190px}.mini-film .story-card{padding:18px 20px}.mini-film .story-card strong{font-size:26px}.mini-film .scroll-hint{bottom:65px}.mini-film .story-caption{display:none}
.workflow-scroll-track{position:relative;margin-bottom:26px}
.workflow-scroll-label{display:none;font-size:12px;color:var(--blue);padding:15px 0 0;border-top:1px solid var(--line)}
.js-motion .workflow-scroll-track{height:auto;padding-bottom:65svh}
.js-motion .workflow-scroll-track .workflow-demo{position:sticky;top:70px}
.js-motion .workflow-scroll-label{display:flex;justify-content:space-between;gap:15px}
.workflow-path li:before{content:'';position:absolute;inset:-14px -10px;border-radius:12px;background:#e3e8fb;opacity:0;transform:scale(.96);transition:opacity 240ms ease,transform 240ms var(--ease-out)}
.workflow-path li>*{position:relative}.workflow-path li.is-current:before{opacity:1;transform:scale(1)}
.workflow-path .node-symbol{transition:transform 240ms var(--ease-out),background-color 240ms ease,color 240ms ease}
.workflow-path li.is-current .node-symbol{transform:translateY(-8px) rotate(-5deg);background:var(--blue);color:white}
.workflow-path li.is-done .node-symbol{background:#e2e9dc;color:#426036}
.workflow-rail{height:3px;background:#ccd3c7;margin-top:22px;overflow:hidden}.workflow-rail i{display:block;width:100%;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left}
.motion-reveal{opacity:1;transform:none;transition:opacity 650ms var(--ease-out),transform 750ms var(--ease-out);transition-delay:var(--reveal-delay,0ms)}
.js-motion .motion-reveal:not([data-visible]){opacity:0;transform:translateY(32px)}
.js-motion .motion-reveal[data-reveal="art"]:not([data-visible]){transform:translateY(38px) rotate(-4deg) scale(.97)}
.js-motion .hero h1{animation:hero-enter 950ms var(--ease-out) both}.js-motion .hero-intro{animation:hero-enter 850ms 120ms var(--ease-out) both}
@keyframes hero-enter{from{opacity:0;transform:translateY(30px);clip-path:inset(0 0 22% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
.static-scene img,.workspace-photo img{scale:1.08;will-change:transform}
.button{position:relative;overflow:hidden;isolation:isolate;transition:transform 160ms var(--ease-out),background-color 180ms ease,color 180ms ease}
.button:after{content:'';position:absolute;inset:0;z-index:-1;background:#ffffff14;transform:translateX(-101%);transition:transform 240ms var(--ease-out)}
.button span,.service-index b,.evidence-grid a span{display:inline-block;transition:transform 220ms var(--ease-out)}
.service-index>a{transition:color 180ms ease}.service-index h3{transition:transform 220ms var(--ease-out)}
.header nav a{position:relative}.header nav a:after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform 220ms var(--ease-out)}
.chat-options button{transition:transform 160ms var(--ease-out),background-color 180ms ease,color 180ms ease}.chat-options button:active{transform:scale(.96)}
.benefits-five article{perspective:800px}.benefits-five article img{transition:transform 240ms var(--ease-out),opacity 500ms var(--ease-out)}
.source-chip{transition:color 180ms ease}.document-excerpt:target{outline:2px solid var(--blue);outline-offset:7px}
@media(hover:hover) and (pointer:fine){
 .button:hover:after{transform:translateX(0)}.button:hover span,.evidence-grid a:hover span{transform:translate(3px,-3px)}
 .button:active{transform:scale(.97)}.header nav a:hover:after,.header nav a:focus-visible:after{transform:scaleX(1)}
 .service-index>a:hover{padding-left:0}.service-index>a:hover h3{transform:translateX(10px)}.service-index>a:hover b{transform:rotate(45deg)}
 .benefits-five article:hover img{transform:translateY(-12px) rotateY(-16deg) rotateZ(-6deg) scale(1.06)}
 .chat-options button:hover{transform:translateY(-2px)}.chat-options button:active{transform:scale(.96)}
 .faq summary:hover,.workflow-detail summary:hover{color:var(--blue)}
}
@media(max-width:800px){
 .js-motion .scroll-scene.static-film.hero-film{height:calc(78svh + 420px)!important}
 .js-motion .hero-film .film-pin{height:78svh;min-height:510px;max-height:740px;top:12px}
 .scroll-scene .film-caption{top:7%;left:7%}.scroll-scene .film-caption p{font-size:clamp(34px,6.6vw,48px)}
 .story-stack{inset:47% 7% auto;width:86%;height:190px}.story-card{padding:19px 21px}.story-card strong{font-size:28px}
 .story-caption{display:none}.scroll-hint{left:7%;bottom:27px}.film-controls{bottom:30px;right:6%}.film-step{display:none}
 .js-motion .scroll-scene.static-film.mini-film{height:calc(420px + 320px)!important}.mini-film .film-pin{height:420px}
 .js-motion .workflow-scroll-track{height:auto;padding-bottom:55svh}.js-motion .workflow-scroll-track .workflow-demo{top:20px}
 .hero-film .film-poster{object-position:65% center}
 .workflow-scroll-label{font-size:11px}.motion-tools>span{display:none}.motion-tools{padding:5px;right:12px;bottom:12px}
 .static-scene img,.workspace-photo img{scale:1.06}
}
@media(max-width:390px){.story-card strong{font-size:25px}.story-card p{font-size:12px}.scroll-hint{font-size:10px;gap:6px}.scroll-hint:before{width:23px;height:31px}.film-controls{right:5%}.motion-toggle{font-size:11px;padding:8px 10px}}
/* An explicit pause and the OS preference both give a readable static page. */
body.motion-paused .motion-reveal{opacity:1!important;transform:none!important;transition:none!important}
body.motion-paused .motion-tools span{display:none}
body.motion-paused .scroll-scene{height:auto!important}
body.motion-paused .scroll-scene .film-pin{position:relative;top:0}
body.motion-paused .story-stack,body.motion-paused .story-caption,body.motion-paused .scroll-hint{display:none}
body.motion-paused .film-poster,body.motion-paused .film-caption,body.motion-paused .static-scene img,body.motion-paused .workspace-photo img{transform:none!important;opacity:1!important}
body.motion-paused .workflow-scroll-track{height:auto;padding-bottom:0}body.motion-paused .workflow-demo{position:relative;top:0}
body.motion-paused .workflow-scroll-label,body.motion-paused .workflow-rail{display:none}
body.motion-paused *,body.motion-paused *:before,body.motion-paused *:after{animation:none!important;transition:none!important}
body.motion-paused .button:hover,body.motion-paused .button:active,body.motion-paused .button:hover span,body.motion-paused .service-index>a:hover h3,body.motion-paused .service-index>a:hover b,body.motion-paused .chat-options button,body.motion-paused .workflow-path .node-symbol{transform:none!important}
@media(prefers-reduced-motion:reduce){
 .motion-reveal{opacity:1!important;transform:none!important}.story-stack,.story-caption,.scroll-hint,.page-progress,.motion-tools{display:none!important}
 .workflow-scroll-track{height:auto!important;padding-bottom:0!important}.workflow-scroll-track .workflow-demo{position:relative!important;top:0!important}.workflow-scroll-label,.workflow-rail{display:none!important}
 .scroll-scene{height:auto!important}.film-poster,.film-caption,.static-scene img,.workspace-photo img{transform:none!important;opacity:1!important;scale:1!important}
 .button:hover,.button:active,.button:hover span,.service-index>a:hover h3,.service-index>a:hover b,.chat-options button,.workflow-path .node-symbol,.benefits-five article img{transform:none!important}
}
@media(max-width:450px){.workflow-demo{padding:18px 16px 0}.workflow-path{gap:25px 14px;padding:26px 0}.workflow-path b{font-size:14px}.workflow-path small{font-size:11px}.workflow-path .node-symbol{width:55px;height:50px;margin-bottom:13px}.workflow-note{padding:15px 0}.workflow-note p{font-size:12px}.workflow-scroll-label{padding-top:10px}.workflow-rail{margin-top:14px}}
@media(max-height:650px){.js-motion .workflow-scroll-track{padding-bottom:0}.js-motion .workflow-scroll-track .workflow-demo{position:relative;top:0}.js-motion .workflow-scroll-label{display:none}}
