:root{color-scheme:light;--paper:#f8f7f3;--card:#f5f3eb;--ink:#262720;--muted:#74756b;--line:#d4d3c9;--grid:#aead9e;--neutral:#c9c7b7;--human:#d8876f;--assist:#9f86e9;--handle:#6baadb;--new:#edc66f;--accent:#be735d;--profit:#4e9866;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;--paper:#1d201e;--card:#252823;--ink:#eeeee4;--muted:#abae9f;--line:#505548;--grid:#888d7c;--neutral:#939783;--human:#e6a08a;--assist:#ac9ae7;--handle:#80b5d9;--new:#e7c576;--accent:#d7977f;--profit:#80c694}}
:root[data-theme="dark"]{color-scheme:dark;--paper:#1d201e;--card:#252823;--ink:#eeeee4;--muted:#abae9f;--line:#505548;--grid:#888d7c;--neutral:#939783;--human:#e6a08a;--assist:#ac9ae7;--handle:#80b5d9;--new:#e7c576;--accent:#d7977f;--profit:#80c694}
*{box-sizing:border-box}html{scroll-behavior:auto;scrollbar-width:thin;scrollbar-color:var(--line) var(--paper)}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button:disabled{opacity:.25;cursor:default}a{color:inherit}#stage{position:fixed;inset:0;width:100%;height:100%;display:block}header{position:fixed;z-index:3;top:0;left:0;width:100%;height:82px;padding:0 4.7%;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(var(--paper) 50%,transparent)}.wordmark{font-family:var(--serif);font-size:24px;letter-spacing:-.9px;display:flex;align-items:center;gap:11px;text-decoration:none}.mark{display:grid;grid-template-columns:7px 7px;grid-template-rows:7px 7px;gap:3px;transform:rotate(-5deg)}.mark i:nth-child(1){background:var(--human)}.mark i:nth-child(2){background:var(--assist)}.mark i:nth-child(3){background:var(--handle)}.mark i:nth-child(4){background:var(--new);transform:translate(1px,1px)}.header-right{display:flex;align-items:center;gap:23px}.descriptor{font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}.theme{width:30px;height:30px;border:1px solid var(--line);border-radius:50%;background:var(--paper);display:grid;place-items:center}.theme-icon{width:11px;height:11px;border:1px solid var(--ink);border-radius:50%;background:linear-gradient(90deg,var(--ink) 50%,transparent 50%)}.top-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);z-index:5;width:100%;transform:scaleX(0);transform-origin:left}
.caption-area{position:fixed;left:5%;top:52%;width:315px;z-index:2;pointer-events:none}.caption{border:1px solid var(--line);border-radius:5px;background:var(--card);padding:20px 21px 21px;box-shadow:0 7px 25px #15170e06;pointer-events:auto;opacity:1;transform:translateY(0)}.eyebrow{font-size:9px;letter-spacing:1.7px;text-transform:uppercase;color:var(--muted);margin:0 0 12px}.caption h1{font-family:var(--serif);font-size:30px;font-weight:400;line-height:1.09;letter-spacing:-.9px;margin:0 0 13px;text-wrap:balance}.caption h2{font-size:16px;line-height:1.3;letter-spacing:-.25px;margin:0 0 12px;font-weight:600;text-wrap:balance}.caption p{font-family:var(--serif);font-size:17px;line-height:1.43;margin:0}.caption .end-title{font-family:var(--serif);font-size:29px;line-height:1.12;font-weight:400;letter-spacing:-.75px}.caption .action{display:inline-flex;gap:18px;align-items:center;font-size:10px;margin-top:19px;border-bottom:1px solid var(--ink);padding-bottom:5px;text-decoration:none}.caption .scroll-hint{display:flex;align-items:center;gap:10px;margin-top:22px;font-family:var(--sans);font-size:9px;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted)}.caption .scroll-hint i{font-style:normal;font-size:17px}.caption-note{font-size:9px;letter-spacing:.2px;color:var(--muted);margin:11px 1px 0;line-height:1.5;opacity:0}
.legend{position:fixed;z-index:2;bottom:75px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:21px;white-space:nowrap;opacity:0;pointer-events:none}.legend-item{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted)}.swatch{width:13px;height:14px;display:block;background:var(--neutral);clip-path:polygon(3% 3%,95% 0,100% 94%,0 100%);transform:rotate(-3deg)}.legend-item:nth-child(2) .swatch{background:var(--assist);transform:rotate(2deg)}.legend-item:nth-child(3) .swatch{background:var(--handle)}.legend-item:nth-child(4) .swatch{background:var(--new);transform:rotate(4deg)}.footer{position:fixed;bottom:0;left:0;right:0;height:57px;padding:0 4.7%;display:flex;align-items:center;justify-content:space-between;z-index:4;background:linear-gradient(transparent,var(--paper) 50%)}.step{font-size:10px;font-variant-numeric:tabular-nums;color:var(--muted);letter-spacing:1.3px;min-width:120px}.step b{color:var(--ink);font-weight:400}.chapters{display:flex;gap:3px;align-items:center}.chapters button{width:23px;height:26px;border:0;background:none;padding:10px 0}.chapters button:before{content:"";display:block;height:2px;background:var(--line);transition:background .2s}.chapters button[aria-current="step"]:before{background:var(--accent);height:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;left:20px;top:-60px;z-index:20;padding:12px;background:var(--card)}.skip:focus{top:20px}#story{position:relative;pointer-events:none}noscript{position:relative;display:block;padding:130px 6% 80px;max-width:650px;background:var(--paper)}
@media(min-width:1500px){.caption-area{left:7%;width:350px}.caption{padding:24px}.caption p{font-size:18px}.caption h2{font-size:17px}}
@media(max-width:900px){.caption-area{left:4%;width:268px}.caption{padding:17px}.caption p{font-size:15px}.caption h2{font-size:15px}.caption h1{font-size:27px}.descriptor{font-size:8px}.legend{gap:15px}}
@media(max-width:820px){header{height:69px;padding:0 6%}.wordmark{font-size:22px}.descriptor{display:none}.caption-area{left:6%;right:6%;width:auto;top:auto;bottom:113px}.caption{padding:16px 18px;max-width:470px}.eyebrow{font-size:8px;margin-bottom:9px}.caption h1{font-size:27px;max-width:265px;margin-bottom:10px}.caption h2{font-size:15px;margin-bottom:8px}.caption p{font-size:15px;line-height:1.36}.caption .end-title{font-size:27px}.caption .scroll-hint{margin-top:14px;font-size:8px}.caption .action{margin-top:12px}.caption-note{position:absolute;top:100%;font-size:8px;margin-top:6px}.legend{bottom:69px;gap:11px;width:88%;justify-content:center}.legend-item{font-size:8px;gap:4px}.swatch{width:9px;height:10px}.footer{height:51px;padding:0 6%}.step{min-width:57px;font-size:9px}.chapters{gap:2px}.chapters button{width:9px}}
@media(max-height:590px) and (min-width:651px){header{height:65px}.caption-area{width:270px;top:47%}.caption{padding:16px}.caption h1{font-size:26px}.caption p{font-size:15px}.legend{bottom:57px}.footer{height:43px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* The product story shares the animation's paper, ink and painted task squares. */
html{scroll-padding-top:96px}body{--muted:#64685d}header{z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}.header-right{gap:25px}.header-right a{font-size:14px;text-decoration:none}.header-right a:hover{text-decoration:underline;text-underline-offset:5px}.header-right .nav-demo{border:1px solid var(--line);padding:10px 15px;border-radius:3px}.theme{width:36px;height:36px}.wordmark{font-size:26px}.hero{position:relative;z-index:2;min-height:100svh;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:5%;padding:135px 7% 110px;background:var(--paper)}.hero:before{content:'';position:absolute;inset:82px 0 0;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:28px 28px;opacity:.18;mask-image:linear-gradient(to right,transparent,black)}.hero-copy,.hero-figure{position:relative}.kicker{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin:0 0 24px;line-height:1.5}.hero h1{font-family:var(--serif);font-size:clamp(54px,6.1vw,96px);line-height:.99;letter-spacing:-3.5px;font-weight:400;margin:0 0 26px}.hero h1 em{font-style:normal;color:var(--handle)}.intro-copy{font-size:18px;line-height:1.65;max-width:465px;margin:0 0 26px}.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;gap:23px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);border-radius:3px;padding:15px 21px;text-decoration:none;font-size:14px;line-height:1.3;min-height:48px}.text-link{font-size:14px;line-height:1.5;text-underline-offset:6px}.hero-proof{margin:35px 0 0;padding-top:20px;border-top:1px solid var(--line);max-width:460px;font-size:13px;line-height:1.8;color:var(--muted)}.hero-proof a{display:block;color:var(--ink);text-decoration:none}.hero-proof strong{font-weight:500;color:var(--profit)}.hero-bottom{position:absolute;bottom:30px;left:7%;right:7%;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted)}.hero-bottom a{text-decoration:none}.hero-figure{padding:20px 0}.diagram-eyebrow{text-align:center;font-size:12px;color:var(--muted);letter-spacing:1px;margin:0 0 29px}.source-row{display:flex;justify-content:space-around;gap:14px}.source-cell{text-align:center;font-size:12px;line-height:1.8;color:var(--muted)}.tile-group{display:grid;grid-template-columns:repeat(3,16px);gap:4px;justify-content:center;margin:0 auto 10px}.tile{width:16px;height:17px;background:var(--neutral);opacity:.85;clip-path:polygon(3% 4%,97% 0,100% 96%,0 100%);transform:rotate(-3deg)}.tile:nth-child(3n){transform:rotate(3deg)}.tile-group.blue .tile{background:var(--handle)}.tile-group.green .tile{background:var(--profit)}.flow-stems{width:68%;height:48px;margin:auto;border-left:1px dashed var(--line);border-right:1px dashed var(--line);border-bottom:1px dashed var(--line);position:relative}.flow-stems:before,.flow-stems:after{content:'';position:absolute;left:50%;height:48px;border-left:1px dashed var(--line)}.flow-stems:after{top:48px;height:24px}.state-card{margin:24px auto 0;width:90%;background:var(--card);border:1px solid var(--line);padding:27px;box-shadow:0 12px 45px #00000008}.state-card .tile-group{grid-template-columns:repeat(3,12px);justify-content:start}.state-card .tile{width:12px;height:13px}.state-card h2{font:400 30px/1.15 var(--serif);letter-spacing:-.6px;margin:10px 0 21px}.state-row{display:flex;justify-content:space-between;gap:10px;font-size:13px;border-top:1px solid var(--line);padding:13px 0}.state-row:last-child{padding-bottom:0}.state-row span:last-child{color:var(--muted);text-align:right}.state-row.attention span:last-child{color:var(--accent)}.diagram-foot{text-align:center;font-size:12px;color:var(--muted);margin-top:20px}.caption-area,.legend,.footer,.top-progress{visibility:hidden}.caption-area{top:auto;bottom:150px}.caption h2{font:400 29px/1.12 var(--serif);letter-spacing:-.6px}.caption p{font-size:17px}.caption .eyebrow{font-size:11px}.caption .action{font-size:13px}.caption .scroll-hint{font-size:10px}.caption-note{font-size:11px}.footer{z-index:12}.step{font-size:12px}.legend-item{font-size:12px}.chapters button{height:38px}body[data-phase="story"] .caption-area,body[data-phase="story"] .legend,body[data-phase="story"] .footer,body[data-phase="story"] .top-progress{visibility:visible}body:not([data-phase="story"]) .caption{pointer-events:none}#story{scroll-margin-top:0}.details{position:relative;z-index:6;background:var(--paper);border-top:1px solid var(--line)}.section{max-width:1280px;margin:auto;padding:105px 7%;scroll-margin-top:0}.section+.section{border-top:1px solid var(--line)}.section h2{font:400 clamp(36px,4.1vw,60px)/1.06 var(--serif);letter-spacing:-1.6px;margin:0 0 25px;text-wrap:balance}.lead{font-size:18px;line-height:1.7;max-width:635px;color:var(--muted);margin:0 0 36px}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:start;margin-bottom:42px}.section-head .lead{margin:5px 0 0}.workflow{display:grid;grid-template-columns:1fr 1.1fr;gap:60px}.workflow-tabs{display:flex;flex-direction:column}.workflow-tab{padding:21px 0;display:grid;grid-template-columns:32px 1fr;gap:16px;border:0;border-top:1px solid var(--line);background:transparent;text-align:left;color:var(--muted)}.workflow-tab:last-child{border-bottom:1px solid var(--line)}.workflow-tab[aria-selected="true"]{color:var(--ink)}.workflow-tab .num{font-size:12px;padding-top:5px}.workflow-tab strong{font-size:19px;font-weight:500;display:block;margin-bottom:9px}.workflow-tab small{font-size:16px;line-height:1.6;display:block}.workflow-tab[aria-selected="true"] .num{color:var(--handle)}.workflow-example{background:var(--card);border:1px solid var(--line);padding:28px 30px;align-self:start;min-height:355px}.example-top{display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:18px}.status{font-size:12px;color:var(--accent)}.workflow-example h3{font:400 29px/1.15 var(--serif);margin:28px 0 16px}.workflow-example p{font-size:16px;line-height:1.65;margin:0 0 23px}.evidence{border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:13px;line-height:1.7}.approval-note{font-size:14px;line-height:1.6;max-width:740px;color:var(--muted);margin:28px 0 0}.case-section{background:var(--card);max-width:none}.case-inner{max-width:1100px;margin:auto}.case-title{max-width:720px}.case-top{display:flex;justify-content:space-between;gap:25px;align-items:center;margin-bottom:34px}.case-top .kicker{margin:0}.case-top a{font-size:13px;text-underline-offset:5px}.case-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:start}.case-intro{font-size:17px;line-height:1.65;color:var(--muted);max-width:520px}.quote{margin:36px 0 0;padding:0 0 0 22px;border-left:2px solid var(--handle)}.quote blockquote{font:400 23px/1.45 var(--serif);margin:0 0 20px}.quote figcaption{font-size:13px;line-height:1.7;color:var(--muted)}.quote figcaption strong{display:block;font-weight:500;color:var(--ink)}.result-main{border-top:1px solid var(--line);padding-top:25px}.result-numbers{display:flex;align-items:center;gap:18px;font:400 clamp(52px,5.7vw,78px)/1 var(--serif);letter-spacing:-3px;white-space:nowrap}.result-numbers .before{color:var(--muted)}.result-numbers .after{color:var(--profit)}.result-numbers .arrow{font:300 30px var(--sans);color:var(--muted)}.result-label{font-size:16px;line-height:1.55;margin:16px 0 8px}.source-note{font-size:12px;line-height:1.65;color:var(--muted);margin:0}.result-secondary{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:29px;padding-top:24px;border-top:1px solid var(--line)}.result-secondary strong{font:400 35px var(--serif);display:block;margin-bottom:7px}.result-secondary p{font-size:14px;line-height:1.6;margin:0;color:var(--muted)}.case-next{border-top:1px solid var(--line);margin-top:36px;padding-top:22px;font-size:14px;line-height:1.7;color:var(--muted)}.case-next b{color:var(--ink);font-weight:500}.case-bottom{margin-top:50px;border-top:1px solid var(--line);padding-top:22px;font-size:12px;line-height:1.6;color:var(--muted)}.permissions{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin:45px 0 24px}.permissions article{border-top:1px solid var(--line);padding-top:22px}.permissions h3{font:400 29px var(--serif);margin:0 0 14px}.permissions p{font-size:16px;line-height:1.65;color:var(--muted);margin:0}.permissions .tile{display:inline-block;width:14px;height:15px;margin-right:11px}.desks-table{border-top:1px solid var(--line);margin-top:38px}.desk-row{display:grid;grid-template-columns:32px 180px 1fr;gap:18px;padding:23px 0;border-bottom:1px solid var(--line);align-items:start}.desk-row .tile{margin-top:4px}.desk-row h3{font-size:17px;font-weight:500;margin:0}.desk-row p{font-size:16px;line-height:1.55;color:var(--muted);margin:0}.scope-note{font-size:13px;color:var(--muted);line-height:1.7;margin-top:25px}.demo-section{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.demo-cover{background:var(--card);border:1px solid var(--line);aspect-ratio:1.25;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:35px;gap:26px;text-decoration:none;position:relative}.demo-cover .tile-group{grid-template-columns:repeat(5,22px);gap:6px;margin:0}.demo-cover .tile{width:22px;height:23px}.play{width:64px;height:64px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-size:24px;padding-left:4px;transition:transform .2s}.demo-cover:hover .play{transform:scale(1.08)}.demo-cover strong{font:400 30px var(--serif)}.demo-cover small{font-size:13px;line-height:1.6;color:var(--muted)}.demo-links{display:flex;flex-direction:column;gap:12px;margin:30px 0 0}.demo-links a{font-size:14px;text-underline-offset:5px}.faq{max-width:850px}.faq details{border-top:1px solid var(--line);padding:23px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font-size:18px;line-height:1.5;list-style:none;display:flex;justify-content:space-between;gap:25px}.faq summary:after{content:'+';font-size:23px;color:var(--muted)}.faq details[open] summary:after{content:'−'}.faq details p{font-size:16px;line-height:1.8;color:var(--muted);margin:18px 0 0}.closing{display:flex;align-items:center;justify-content:space-between;gap:40px;padding-top:65px;padding-bottom:65px}.closing h2{font-size:43px;max-width:530px;margin:0}.site-footer{padding:28px 7%;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:22px;font-size:12px;color:var(--muted);line-height:1.6}.site-footer a{text-decoration:none}.footer-links{display:flex;gap:24px}.text-story{position:relative;background:var(--paper);z-index:15;max-width:800px;margin:auto;padding:100px 7%}.text-story h2{font:400 30px var(--serif)}.text-story p{font-size:18px;line-height:1.7}.text-story section{margin:35px 0}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) body{--muted:#b4b7a9}}:root[data-theme="dark"] body{--muted:#b4b7a9}
@media(min-width:1600px){.hero{padding-left:max(7%,calc((100vw - 1380px)/2));padding-right:max(7%,calc((100vw - 1380px)/2))}}
@media(max-width:1000px){.hero{gap:4%;padding-left:6%;padding-right:6%}.hero h1{font-size:65px}.intro-copy{font-size:17px}.hero-figure .state-card{padding:23px;width:100%}.state-card h2{font-size:27px}.section-head,.workflow,.case-layout,.demo-section{gap:35px}.section{padding:80px 6%}.header-right{gap:20px}.caption-area{width:275px}.hero-actions{gap:20px}.case-layout{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.hero{grid-template-columns:1fr;gap:35px;padding:115px 7% 75px;min-height:100svh}.hero-copy{max-width:560px}.hero h1{font-size:clamp(54px,10vw,80px);letter-spacing:-2.5px}.hero-figure{max-width:410px;width:100%;margin:auto;padding:0}.hero-proof{margin-top:26px}.hero-bottom{display:none}.hero-figure .source-row,.hero-figure .flow-stems,.hero-figure .diagram-eyebrow{display:none}.hero-figure .state-card{margin:0;padding:20px 24px}.state-card h2{font-size:27px;margin:8px 0 17px}.diagram-foot{margin:13px 0 0}.section-head{grid-template-columns:1fr;gap:0;margin-bottom:30px}.section-head .lead{margin-top:0}.workflow,.case-layout,.demo-section{grid-template-columns:1fr;gap:35px}.section{padding:64px 7%}.section h2{font-size:42px;letter-spacing:-1.4px}.lead{font-size:17px}.case-layout{gap:44px}.case-title{max-width:580px}.case-top{align-items:start}.case-top .kicker{max-width:200px}.result-numbers{font-size:75px}.case-bottom{margin-top:32px}.permissions{gap:22px}.permissions h3{font-size:25px}.permissions p{font-size:15px}.desk-row{grid-template-columns:20px 130px 1fr;gap:12px}.desk-row h3{font-size:16px}.desk-row p{font-size:15px}.demo-cover{aspect-ratio:1.6;max-height:360px}.demo-section>div{order:-1}.closing{align-items:start}.closing h2{font-size:35px}.closing .button{flex-shrink:0}.header-right{gap:17px}.header-right .nav-story{display:none}.header-right .nav-demo{padding:8px 11px}.header-right a{font-size:12px}.wordmark{font-size:23px}.theme{width:30px;height:30px}.caption-area{width:auto;bottom:128px}.caption h2{font-size:26px}.caption p{font-size:16px}.caption .eyebrow{font-size:10px}.caption .action{font-size:12px}.caption-note{font-size:10px}.legend{bottom:75px;gap:9px;flex-wrap:wrap}.legend-item{font-size:10px}.chapters button{width:9px}.step{font-size:10px}}
@media(max-width:520px){header{padding:0 6%}.header-right{gap:12px}.header-right .nav-proof{display:none}.wordmark{font-size:22px;gap:8px}.hero h1{font-size:57px}.hero{padding-top:106px;gap:28px}.kicker{font-size:11px;margin-bottom:19px}.intro-copy{font-size:16px;line-height:1.65}.hero-actions{gap:18px}.button{font-size:13px;padding:14px 17px}.hero-proof{font-size:12px}.hero-proof a{font-size:13px}.hero-figure .state-card{padding:17px 21px}.state-card h2{font-size:25px}.state-row{font-size:12px;padding:11px 0}.hero-figure .tile-group{display:none}.section h2{font-size:37px}.workflow-example{padding:23px;min-height:330px}.workflow-tab strong{font-size:18px}.workflow-tab small{font-size:15px}.quote blockquote{font-size:22px}.case-top{gap:20px;flex-direction:column}.case-top .kicker{max-width:none}.permissions{grid-template-columns:1fr;gap:26px}.permissions h3{font-size:28px}.permissions p{font-size:16px}.desk-row{grid-template-columns:20px 1fr;gap:7px 12px}.desk-row p{grid-column:2;font-size:16px}.closing{flex-direction:column;gap:25px}.site-footer{flex-direction:column;gap:15px}.footer-links{gap:20px}.faq summary{font-size:17px}.caption-area{bottom:131px}.caption{padding:15px 17px}.caption h2{font-size:24px}.caption p{font-size:15px}.caption .scroll-hint{margin-top:12px}.legend{bottom:67px}.caption-note{font-size:9px}.result-numbers{font-size:70px}}
@media(max-height:700px) and (min-width:821px){.hero{padding-top:125px;padding-bottom:80px}.hero h1{font-size:65px}.hero-proof{margin-top:22px}.caption-area{bottom:115px}.caption h2{font-size:25px}.caption p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.play{transition:none}}

@media(min-width:821px) and (max-width:1050px){.caption-area{left:6%;right:6%;width:auto;max-width:470px;bottom:143px}.caption{padding:20px 23px}.caption h2{font-size:28px}.caption p{font-size:17px}.caption-note{font-size:11px}.legend{bottom:82px}.caption .eyebrow{font-size:11px}}


/* Buyer-facing opening: a quiet, finite demonstration of one update carrying through. */
.hero{grid-template-columns:1.18fr 1fr;gap:6%}.hero h1{font-size:clamp(54px,5.8vw,90px)}.hero-proof{display:block;text-decoration:none}.hero-proof>strong{display:block;font-size:17px;line-height:1.4;letter-spacing:-.2px}.hero-proof>span{display:block;font-size:14px;margin-top:6px;color:var(--ink)}.hero-proof>small{display:block;font-size:12px;margin-top:8px;color:var(--muted);text-decoration:underline;text-underline-offset:4px}.hero-bottom{font-size:12px}.coordination-flow{margin:0;padding:0;max-width:480px;width:100%;justify-self:end}.coordination-flow figcaption .kicker{font-size:11px;letter-spacing:1.2px;margin-bottom:12px}.coordination-flow h2{font:400 35px/1.1 var(--serif);letter-spacing:-1px;margin:0 0 25px}.reply-card{display:flex;align-items:center;gap:20px;padding:18px 22px;background:var(--paper);border:1px solid var(--line);border-radius:3px;max-width:350px;margin-left:auto}.reply-card>.tile{flex-shrink:0;background:var(--handle);width:26px;height:27px}.reply-source{font-size:12px;color:var(--muted)}.reply-card p{font:400 22px/1.3 var(--serif);margin:7px 0}.reply-attachment{font-size:12px;color:var(--muted)}.flow-line{height:31px;position:relative;width:1px;background:var(--line);margin:0 auto}.flow-line .tile{position:absolute;left:-4px;top:10px;width:9px;height:10px;background:var(--handle)}.flow-record{border:1px solid var(--line);padding:19px 22px;background:var(--card);transition:border-color .6s,background .6s;position:relative}.record-brand{font-size:14px;display:flex;align-items:center;gap:9px}.record-brand .tile{width:13px;height:14px;background:var(--handle)}.flow-record p{font:400 24px/1.2 var(--serif);margin:14px 0 7px;min-height:2.4em}.record-detail{font-size:12px;line-height:1.5;color:var(--muted)}.flow-branches{height:39px;display:flex;justify-content:space-between;position:relative;margin:0 16.666%}.flow-branches:before{content:'';position:absolute;top:18px;left:0;right:0;border-top:1px solid var(--line)}.flow-branches:after{content:'';position:absolute;top:0;left:50%;height:18px;border-left:1px solid var(--line)}.flow-branches span{width:1px;height:20px;background:var(--line);align-self:end}.flow-people{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}.flow-person{opacity:.38;transition:opacity .6s;min-width:0}.flow-person .tile{display:block;background:var(--neutral);width:22px;height:23px;margin:0 auto 9px;transition:background .6s,transform .6s}.flow-person h3{font-size:13px;font-weight:500;margin:0 0 5px}.flow-person p{font-size:12px;line-height:1.4;margin:0;color:var(--muted)}.flow-controls{display:flex;gap:15px;align-items:center;border-top:1px solid var(--line);padding-top:17px;margin-top:24px}.flow-controls button{border:0;background:transparent;font-size:12px;color:var(--muted);padding:4px 0;line-height:1.5;border-bottom:1px solid transparent}.flow-controls button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--ink)}.flow-controls #flow-replay{margin-left:auto}.flow-summary{font-size:13px;line-height:1.5;margin:14px 0 0;min-height:4.5em;color:var(--ink)}.flow-example-note{font-size:11px;color:var(--muted);margin:6px 0 0}.coordination-flow[data-flow="1"] .flow-record,.coordination-flow[data-flow="2"] .flow-record{border-color:var(--handle)}.coordination-flow[data-flow="2"] .flow-person{opacity:1}.coordination-flow[data-flow="2"] .flow-person .tile{background:var(--profit);transform:rotate(2deg)}.coordination-flow[data-playing="true"][data-flow="0"] .flow-line .tile{animation:carry-reply 1.4s ease-in-out 1}.coordination-flow[data-playing="true"][data-flow="1"] .record-brand .tile{animation:record-ready 1.4s ease-in-out 1}.result-numbers.reclaimed{gap:17px;align-items:center}.result-unit{font:400 23px/1.14 var(--serif);letter-spacing:-.3px;color:var(--ink)}.result-percent{font-size:15px;font-weight:500;color:var(--profit);margin:17px 0 10px}.desk-row{grid-template-columns:32px 165px 1fr;padding:29px 0}.desk-row h3{color:var(--muted);padding-top:4px}.desk-row h4{font:400 28px/1.15 var(--serif);letter-spacing:-.4px;margin:0 0 12px}.desk-row p{max-width:680px}.value-close{margin-top:47px;padding:32px 0 0;border-top:1px solid var(--line)}.value-close p{font:400 31px/1.3 var(--serif);letter-spacing:-.5px;margin:0 0 17px}.value-close span{font-size:14px;color:var(--muted)}
@keyframes carry-reply{from{transform:translateY(-12px);opacity:0}30%{opacity:1}to{transform:translateY(11px);opacity:1}}
@keyframes record-ready{0%,100%{transform:scale(1)}45%{transform:scale(1.3)}}
@media(max-width:1100px){.hero{gap:5%;grid-template-columns:1.08fr 1fr}.hero h1{font-size:clamp(47px,5.5vw,66px);letter-spacing:-2.5px}.coordination-flow h2{font-size:31px}.reply-card{padding:15px 18px}.flow-record{padding:18px}.flow-record p{font-size:22px}.hero-proof>strong{font-size:16px}.hero-actions{gap:17px}}
@media(max-width:820px){.hero{grid-template-columns:1fr;gap:44px;padding-bottom:65px}.hero h1{font-size:clamp(51px,8.4vw,72px);letter-spacing:-2.5px}.coordination-flow{max-width:440px;justify-self:center}.coordination-flow h2{font-size:34px}.hero-figure .tile-group{display:grid}.reply-card{max-width:340px}.desk-row{grid-template-columns:24px 130px 1fr;gap:12px}.desk-row h4{font-size:26px}.hero-proof>strong{font-size:17px}.hero-proof{max-width:500px}.value-close p{font-size:28px}.flow-summary{min-height:4.5em}}
@media(max-width:520px){.hero{padding-top:106px;gap:42px}.hero h1{font-size:clamp(43px,11.8vw,60px);letter-spacing:-1.8px}.hero-proof>strong{font-size:16px;max-width:300px}.hero-proof>span{font-size:14px}.coordination-flow h2{font-size:32px}.reply-card{width:91%;gap:17px}.reply-card p{font-size:22px}.flow-record p{font-size:22px}.flow-person h3{font-size:12px}.flow-person p{font-size:11px}.flow-controls{gap:14px}.flow-controls button{font-size:11px}.flow-summary{font-size:12px}.desk-row{grid-template-columns:20px 1fr;gap:9px 12px}.desk-row>div{grid-column:2}.desk-row h3{font-size:14px;padding:0}.desk-row h4{font-size:27px}.desk-row p{font-size:16px}.value-close p{font-size:26px}.result-unit{font-size:22px}.closing h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){.coordination-flow *{animation:none!important;transition:none!important}}


/* An action loop: spot the gap, chase the outcome, close with evidence. */
.coordination-flow .reply-card{max-width:370px;min-height:108px}.reply-card p{min-height:2.6em;display:flex;align-items:center}.flow-mode{margin-left:auto;font-size:10px;letter-spacing:.2px;color:var(--muted);font-weight:400}.flow-record p{white-space:pre-line}.record-detail{display:block;min-height:3em}.coordination-flow .flow-controls{margin-top:18px;padding-top:12px}.flow-summary{margin-top:12px;min-height:4.5em}.human-focus{margin-top:13px;padding-top:18px;border-top:1px solid var(--line)}.human-focus-label{font-size:12px;line-height:1.5;color:var(--muted);margin:0 0 18px}.coordination-flow .human-focus .flow-person{opacity:1}.coordination-flow .human-focus .flow-person .tile{background:var(--human);width:18px;height:19px;transform:rotate(-3deg)}.human-focus .flow-person h3{font-size:12px;line-height:1.45;max-width:105px;margin:auto}.flow-example-note{margin-top:18px;line-height:1.45}.coordination-flow[data-flow="0"] .reply-card>.tile{background:var(--new)}.coordination-flow[data-flow="1"] .reply-card>.tile{background:var(--handle)}.coordination-flow[data-flow="2"] .flow-record{border-color:var(--profit)}.coordination-flow[data-flow="2"] .record-brand>.tile{background:var(--profit)}
@media(max-width:520px){.coordination-flow .reply-card{width:94%;min-height:115px}.reply-card p{font-size:21px}.record-detail{min-height:3em}.flow-mode{font-size:10px}.human-focus .flow-person h3{font-size:11px;max-width:96px}.flow-example-note{font-size:10px}.human-focus-label{font-size:11px}}

.human-focus-label{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.ownership-key{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:11px;color:var(--ink)}.ownership-key .tile{width:10px;height:11px;background:var(--human)}.coordination-flow .reply-card>.tile{background:var(--neutral)!important}.coordination-flow[data-flow="2"] .flow-record{border-color:var(--handle)}.coordination-flow[data-flow="2"] .record-brand>.tile{background:var(--handle)}

/* Human judgment has its own color; gray remains unclassified work. */
.legend-item:first-child .swatch{background:var(--human)}
/* Ease the opening caption into view when the story first becomes visible. */
.caption-area{opacity:0;transition:opacity .35s ease-out}
body[data-phase="story"] .caption-area{opacity:1}
/* Give the story a generous, stable reading area beside the animation. */
.caption-area{left:4.5%;right:auto;top:clamp(180px,34vh,360px);bottom:auto;width:clamp(360px,29vw,460px);max-width:none}
.caption{padding:28px 30px 30px;max-width:none;box-shadow:0 8px 32px #15170e0a}
.caption h2,.caption .end-title{font-size:34px;line-height:1.12;margin-bottom:17px}
.caption p{font-size:21px;line-height:1.45}
.caption .eyebrow{font-size:11px;line-height:1.5;margin-bottom:14px}
.caption .scroll-hint{margin-top:24px;font-size:11px}
.caption-note{font-size:12px;line-height:1.5;margin-top:12px}
@media(max-width:1100px){
 .caption-area{left:6%;right:6%;top:auto;bottom:max(155px,17vh);width:auto;max-width:620px}
 .caption{padding:25px 28px 27px}
 .caption h2,.caption .end-title{font-size:32px}
 .caption p{font-size:20px}
 .caption-note{position:absolute;top:100%}
}
@media(max-width:600px){
 .caption-area{left:5%;right:5%;bottom:151px;max-width:none}
 .caption{padding:21px 22px 23px}
 .caption h2,.caption .end-title{font-size:29px;margin-bottom:13px}
 .caption p{font-size:18px;line-height:1.4}
 .caption .eyebrow{font-size:10px;letter-spacing:1.4px;margin-bottom:11px}
 .caption .scroll-hint{font-size:10px;margin-top:19px}
 .caption-note{font-size:10px;margin-top:9px}
}
@media(max-width:600px) and (max-height:720px){
 .caption-area{left:12px;right:12px;bottom:125px}
 .caption{padding:16px 17px 18px}
 .caption h2,.caption .end-title{font-size:27px;margin-bottom:11px}
 .caption p{font-size:17px}
}


/* A quiet opening leaves the story to the animation below. */
.hero.hero-simple{display:flex;align-items:center;min-height:100svh;padding:145px 10% 120px}
.hero-simple:before{opacity:.1;mask-image:linear-gradient(120deg,transparent 35%,black)}
.hero-simple .hero-copy{width:100%;max-width:1050px;margin:auto}
.hero.hero-simple h1{font-size:clamp(74px,8.7vw,136px);line-height:.98;letter-spacing:-.055em;margin:0 0 32px}
.hero-simple .intro-copy{max-width:650px;font-size:20px;line-height:1.6;margin-bottom:28px}
.hero-simple .hero-proof{max-width:650px;margin-top:35px;padding-top:20px}
.hero-simple .hero-proof>strong{font-size:16px}
.hero-simple .hero-bottom{left:10%;right:10%;bottom:32px;font-size:14px}
.hero-simple .hero-bottom a{display:inline-flex;align-items:center;gap:16px}
.header-right .nav-contact{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.case-contact{display:flex;align-items:center;justify-content:space-between;gap:40px;border-top:1px solid var(--line);padding-top:32px;margin-top:38px}
.case-contact h3{font:400 31px/1.18 var(--serif);letter-spacing:-.5px;margin:0 0 12px}
.case-contact p{font-size:16px;line-height:1.6;max-width:630px;margin:0;color:var(--muted)}
.case-contact .contact-actions{flex-shrink:0;text-align:center}.contact-email{display:block;margin-top:12px;font-size:13px;text-underline-offset:4px}
@media(max-width:820px){
 .hero.hero-simple{padding:130px 7% 110px}
 .hero.hero-simple h1{font-size:clamp(67px,12vw,94px)}
 .hero-simple .intro-copy{font-size:18px;max-width:600px}
 .hero-simple .hero-bottom{left:7%;right:7%;display:flex;font-size:12px}
 .case-contact{align-items:flex-start;flex-direction:column;gap:22px}.case-contact .contact-actions{text-align:left}
}
@media(max-width:520px){
 .hero.hero-simple{padding:122px 6% 105px}
 .hero.hero-simple h1{font-size:clamp(58px,15vw,76px);margin-bottom:25px}
 .hero-simple .intro-copy{font-size:17px;line-height:1.55}
 .hero-simple .hero-proof{margin-top:27px;padding-top:18px}
 .hero-simple .hero-proof>strong{max-width:none;font-size:15px}
 .hero-simple .hero-bottom{left:6%;right:6%;bottom:26px;flex-wrap:wrap;gap:12px}
}

/* Reader-controlled examples: the controls name the benefit; the diagram shows the work. */
.workflow-guide{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--muted);margin:0 0 16px}
.workflow-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.workflow-tab,.workflow-tab:last-child{position:relative;display:grid;grid-template-columns:30px 1fr;gap:12px;padding:22px 30px 22px 20px;min-height:126px;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--ink);transition:background .2s,border-color .2s,transform .2s}
.workflow-tab:hover{border-color:var(--handle);transform:translateY(-3px);background:var(--card)}
.workflow-tab[aria-selected="true"]{border-color:var(--handle);background:color-mix(in srgb,var(--handle) 12%,var(--paper));box-shadow:inset 0 3px var(--handle)}
.workflow-tab .num{padding:0;width:28px;height:29px;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);font-size:12px;border-radius:3px}
.workflow-tab[aria-selected="true"] .num{background:var(--handle);border-color:var(--handle);color:#182b39}
.workflow-tab strong{font-size:18px;line-height:1.3;font-weight:500;margin:1px 0 9px}
.workflow-tab small{font-size:14px;line-height:1.45;color:var(--muted)}
.tab-arrow{position:absolute;right:12px;top:12px;font-size:15px;color:var(--muted)}
.workflow-tab[aria-selected="true"] .tab-arrow{color:var(--ink)}
.workflow-panel{padding:28px 32px 24px;background:var(--card);border:1px solid var(--line);border-radius:4px}
.workflow-headline{margin:0 0 30px;max-width:850px;font:400 clamp(25px,2.6vw,34px)/1.2 var(--serif);letter-spacing:-.5px;color:var(--ink);text-wrap:balance}
.case-label{margin:0 0 26px;font-size:17px;font-weight:500;line-height:1.5;color:var(--ink)}
.wf-scene{display:grid;grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr);align-items:center;gap:16px;min-height:286px}
.wf-scene.is-entering{animation:wf-appear .4s ease-out both}
.wf-column{min-width:0}.wf-label{display:block;font-size:14px;font-weight:500;margin:0 0 18px;line-height:1.5}
.wf-sources{display:grid;gap:10px;padding:0 15px}
.wf-source{display:flex;align-items:center;gap:13px;padding:13px 16px;background:var(--paper);border:1px solid var(--line);border-radius:3px;font-size:15px}
.wf-source:nth-child(1){transform:rotate(-3deg);margin-right:25px}.wf-source:nth-child(2){transform:rotate(2deg);margin-left:22px}.wf-source:nth-child(3){transform:rotate(-1deg);margin-right:12px}
.wf-icon{display:block;flex-shrink:0;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.wf-bridge{height:2px;background:var(--line);position:relative;margin:0 8px}
.wf-bridge:after{content:'';position:absolute;right:0;top:-4px;width:9px;height:9px;border-top:1px solid var(--muted);border-right:1px solid var(--muted);transform:rotate(45deg)}
.wf-packet{position:absolute;width:17px;height:18px;background:var(--handle);top:-8px;left:40%;clip-path:polygon(3% 4%,97% 0,100% 96%,0 100%);transform:rotate(-4deg)}
.is-entering .wf-packet{animation:wf-transfer 1.05s ease-in-out both}
.wf-queue,.wf-task,.wf-message,.wf-outcome{background:var(--paper);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.wf-queue-head{display:flex;gap:9px;align-items:center;padding:16px 18px;font-size:16px;border-bottom:1px solid var(--line)}
.wf-queue-head .tile{background:var(--handle);width:14px;height:15px}
.wf-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;font-size:14px;border-bottom:1px solid var(--line)}
.wf-row:last-child{border-bottom:0}.wf-row.is-target{background:color-mix(in srgb,var(--new) 15%,var(--paper))}
.wf-row span:last-child{font-size:12px;color:var(--muted);flex-shrink:0}
.wf-task{padding:24px;display:flex;align-items:center;gap:18px;min-height:158px}
.wf-asset{position:relative;display:grid;place-items:center;flex-shrink:0;width:64px;height:76px;border:1px dashed var(--muted);border-radius:3px;color:var(--muted);background:var(--card)}
.wf-asset .wf-icon{width:38px;height:38px}.wf-task strong{font:400 25px/1.2 var(--serif);display:block}.wf-task small{display:block;font-size:14px;line-height:1.5;color:var(--muted);margin-top:8px}
.wf-message{padding:20px 22px}.wf-message .wf-label{display:flex;align-items:center;gap:10px;margin-bottom:16px}.wf-message .tile{background:var(--handle)}
.wf-message p{font:400 23px/1.35 var(--serif);margin:0 0 18px}
.wf-permission{display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.5;padding-top:14px;border-top:1px solid var(--line);color:var(--muted)}
.wf-permission .tile{width:12px;height:13px;background:var(--new)}
.wf-task.is-complete .wf-asset{border-style:solid;border-color:var(--profit);background:color-mix(in srgb,var(--profit) 10%,var(--paper));color:var(--profit)}
.wf-check{position:absolute;bottom:-8px;right:-8px;display:grid;place-items:center;width:25px;height:25px;background:var(--profit);color:var(--paper);border-radius:50%;font-size:16px}
.wf-outcome{padding:26px}.wf-outcome>.wf-icon{width:32px;height:32px;color:var(--profit);margin-bottom:14px}.wf-outcome strong{font:400 28px/1.15 var(--serif);display:block;margin-bottom:10px}.wf-outcome p{font-size:15px;line-height:1.55;color:var(--muted);margin:0}
.workflow-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);margin-top:25px;padding-top:23px;min-height:81px}
.workflow-bottom p{font-size:16px;line-height:1.6;margin:0;max-width:560px}
.workflow-bottom button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;flex-shrink:0;padding:13px 16px;border:1px solid var(--ink);border-radius:3px;background:var(--paper);font-size:14px;min-height:46px}
.workflow-bottom button:hover{background:var(--ink);color:var(--paper)}
.case-download{font-size:14px;margin:30px 0 0;text-underline-offset:5px}.case-bottom{margin-top:25px}
@keyframes wf-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes wf-transfer{0%{left:0;opacity:0}25%{opacity:1}100%{left:75%;opacity:1}}
@media(max-width:1050px){.workflow-tab,.workflow-tab:last-child{grid-template-columns:1fr;padding:19px;min-height:170px;gap:13px}.wf-scene{grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr);gap:10px}.workflow-bottom{gap:20px}.workflow-bottom button{max-width:210px;text-align:left}.wf-task{padding:20px;gap:13px}.wf-asset{width:50px;height:64px}.wf-row{padding:15px 13px;gap:10px}.wf-sources{padding:0}}
@media(max-width:720px){
 .workflow-tabs{grid-template-columns:1fr;gap:8px}
 .workflow-tab,.workflow-tab:last-child{grid-template-columns:30px 1fr;padding:16px 35px 16px 16px;min-height:0;gap:14px}
 .workflow-tab strong{font-size:18px;margin-bottom:4px}.workflow-tab small{font-size:14px}
 .workflow-panel{padding:23px 20px}.workflow-headline{margin-bottom:26px}
 .wf-scene{grid-template-columns:1fr;gap:20px;min-height:0;max-width:420px;margin:auto}
 .wf-label{margin-bottom:12px}.wf-bridge{height:40px;width:1px;margin:0 auto}.wf-bridge:after{top:auto;bottom:0;left:-4px;transform:rotate(135deg)}.wf-packet{left:-8px;top:12px}
 .is-entering .wf-packet{animation:wf-transfer-down .8s ease-in-out both}
 .wf-sources{display:flex;gap:7px;padding:4px 0}.wf-source,.wf-source:nth-child(n){margin:0;padding:14px 9px;flex:1;flex-direction:column;text-align:center;font-size:12px;gap:9px}
 .wf-task{min-height:130px}.wf-asset{width:58px;height:70px}.wf-task strong{font-size:26px}.wf-row{font-size:15px;padding:15px}.wf-row span:last-child{font-size:13px}
 .workflow-bottom{align-items:stretch;flex-direction:column;gap:20px;margin-top:26px;padding-top:20px;min-height:0}
 .workflow-bottom p{font-size:16px}.workflow-bottom button{max-width:none;align-self:flex-start}
}
@keyframes wf-transfer-down{0%{top:0;opacity:0}30%{opacity:1}100%{top:22px;opacity:1}}
@media(prefers-reduced-motion:reduce){.workflow-tab,.wf-scene,.wf-packet{animation:none!important;transition:none!important}.workflow-tab:hover{transform:none}}

/* The same painted task tiles preview the two kinds of work. */
.hero.hero-simple{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr);gap:6%;padding:140px 7% 115px}
.hero.hero-simple h1{font-size:clamp(62px,6.8vw,106px)}
.hero-simple .intro-copy{font-size:18px;max-width:560px}
.hero-simple .hero-bottom{left:7%;right:7%}
.hero-teaser{margin:0;width:100%;max-width:460px;justify-self:end;position:relative}
#teaser-canvas{display:block;width:100%;aspect-ratio:1.1;animation:none}
.hero-teaser figcaption{display:flex;justify-content:space-around;gap:20px;font-size:15px;margin-top:12px}
.hero-teaser figcaption span{display:flex;align-items:center;gap:9px}.hero-teaser figcaption .tile{width:13px;height:14px}
.hero-teaser p{font-size:14px;line-height:1.65;text-align:center;color:var(--muted);margin:24px 0 0}

@media(max-width:1000px) and (min-width:821px){.hero.hero-simple{gap:4%;padding-left:6%;padding-right:6%}.hero.hero-simple h1{font-size:60px}.hero-simple .intro-copy{font-size:17px}.hero-teaser p{font-size:13px}.hero-teaser figcaption{font-size:14px}}
@media(max-width:820px){.hero.hero-simple{grid-template-columns:1fr;gap:32px;padding:125px 7% 108px}.hero.hero-simple h1{font-size:clamp(66px,11vw,88px)}.hero-teaser{max-width:350px;justify-self:center}.hero-teaser p{margin-top:16px}.hero-simple .hero-copy{max-width:600px}.hero-simple .hero-proof{max-width:560px}}
@media(max-width:520px){.hero.hero-simple{padding:112px 6% 110px;gap:26px}.hero.hero-simple h1{font-size:clamp(55px,15vw,76px)}.hero-simple .intro-copy{font-size:17px}.hero-teaser{max-width:285px}.hero-teaser p{font-size:13px}.hero-teaser figcaption{font-size:14px}.hero-simple .hero-bottom{left:6%;right:6%}}
@media(prefers-reduced-motion:reduce){#teaser-canvas{animation:none}}

.section-head.section-head-stacked{display:block;margin-bottom:42px}
.section-head-stacked h2{max-width:960px}
.section-head-stacked .lead{max-width:740px;margin:0}
#how-title{max-width:960px;font-size:clamp(36px,4vw,56px);line-height:1.12}
.workflow-bottom{min-height:0;padding-top:20px;margin-top:24px}.workflow-bottom p{max-width:760px}
.permission-direction{display:flex;align-items:center;gap:24px;font-size:14px;color:var(--muted);margin:0 0 18px}
.permission-direction:after{content:'';height:1px;background:var(--line);flex:1}
.permission-path{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:0;margin:0;counter-reset:level}
.permission-path li{position:relative;counter-increment:level;border:1px solid var(--line);border-top:3px solid var(--level-color);background:var(--card);padding:27px 24px;display:flex;flex-direction:column}
.permission-path li:before{content:'0' counter(level);position:absolute;top:27px;right:23px;font-size:12px;color:var(--muted)}
.permission-path li:not(:last-child):after{content:'→';position:absolute;right:-20px;top:46%;font-size:17px;color:var(--muted)}
.permission-tiles{display:flex;gap:5px;align-items:center;height:30px;margin-bottom:19px}.permission-tiles .tile{background:var(--level-color);width:24px;height:25px}
.permission-path h3{font:400 32px/1.1 var(--serif);margin:0 0 17px;letter-spacing:-.5px}
.permission-path p{font-size:16px;line-height:1.6;color:var(--muted);margin:0 0 25px}
.permission-path strong{font-size:14px;line-height:1.5;font-weight:500;margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
.permission-choice{font-size:14px;line-height:1.6;color:var(--muted);margin:20px 0 0}
.permission-learning{display:flex;align-items:flex-start;gap:24px;border-top:1px solid var(--line);margin-top:40px;padding-top:32px}
.learning-loop{display:grid;place-items:center;flex-shrink:0;width:50px;height:50px;font:400 34px var(--serif);color:var(--handle);border:1px solid var(--line);border-radius:50%}
.permission-learning h3{font:400 30px/1.2 var(--serif);letter-spacing:-.5px;margin:0 0 12px}
.permission-learning p{font-size:16px;line-height:1.65;color:var(--muted);max-width:810px;margin:0}
.desks-heading .lead{max-width:710px}
@media(max-width:820px){.permission-path{gap:18px}.permission-path li{padding:24px 18px}.permission-path li:before{right:17px;top:25px}.permission-path li:not(:last-child):after{right:-16px;font-size:14px}.permission-path p{font-size:15px}}
@media(max-width:650px){
 .permission-direction{gap:14px}.permission-direction>span:last-child{transform:rotate(90deg)}
 .permission-path{grid-template-columns:1fr;gap:27px}.permission-path li{padding:23px}
 .permission-path li:not(:last-child):after{right:auto;left:calc(50% - 7px);top:auto;bottom:-25px;transform:rotate(90deg);font-size:18px}
 .permission-tiles{margin-bottom:15px}.permission-path h3{font-size:30px}.permission-path p{font-size:16px;margin-bottom:19px}
 .permission-learning{gap:17px}.learning-loop{width:38px;height:38px;font-size:27px}.permission-learning h3{font-size:27px}
 .permission-learning p{font-size:16px}.section-head-stacked .lead{font-size:17px}
}

.hero-value{font:500 21px/1.4 var(--sans);letter-spacing:-.25px;max-width:550px;margin:0 0 15px;text-wrap:pretty}
.hero-simple .intro-copy{font-size:17px;line-height:1.6;max-width:560px}
.hero-teaser figcaption{justify-content:space-between;gap:14px;font-size:14px;line-height:1.4}
.hero-teaser figcaption span{gap:7px}.hero-teaser figcaption .tile{flex-shrink:0}
@media(max-width:1000px) and (min-width:821px){.hero-teaser figcaption{font-size:13px;gap:10px}.hero-value{font-size:19px}}
@media(max-width:520px){.hero-value{font-size:19px}.hero-teaser figcaption{font-size:13px;gap:12px}}

.tile-group.speaker .tile{background:var(--human)}

/* The skip control replaces the arrows beside the animation legend. */
.story-skip{display:inline-flex;align-items:center;justify-content:center;min-height:40px;min-width:120px;padding:9px 14px;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--ink);font-size:13px;line-height:1.4;text-decoration:none;white-space:nowrap;transform:translateY(-55px);visibility:hidden}
body:is([data-phase="field"],[data-phase="story"]) .story-skip{visibility:visible}
.story-skip:hover{border-color:var(--ink);text-decoration:underline;text-underline-offset:4px}
@media(max-width:1050px){.story-skip{transform:none;min-width:0;min-height:36px;padding:8px 11px;font-size:12px}}
@media(max-width:420px){.footer .step{min-width:36px}.footer .chapters button{width:4px}}
/* Compact, gently moving tool rows extend the story's paper and tile palette. */
.integrations-section{scroll-margin-top:80px;padding-top:80px;padding-bottom:80px}
.integrations-section .section-head{grid-template-columns:1fr 1fr;gap:50px;margin-bottom:30px}
.integrations-section .section-head h2{max-width:500px}
.integration-intro p{margin:0 0 14px;font-size:18px;line-height:1.65;color:var(--muted)}
.integration-intro .integration-promise{color:var(--ink);font-weight:500}
.integration-directory{border:0;background:none}
.integration-group{padding:21px 24px 16px;min-width:0}
.integration-group+.integration-group{margin-top:6px}
.integration-group-head{position:relative;display:flex;align-items:center;justify-content:center;min-height:32px;margin-bottom:12px;text-align:center;padding:0 36px}
.integration-group h3{font-size:15px;font-weight:500;line-height:1.4;margin:0}
.integration-motion{position:absolute;right:0;top:0;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:6px;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:3px}.integration-motion:hover{background:var(--line);color:var(--ink)}.integration-motion:focus-visible{outline:2px solid var(--handle);outline-offset:2px}.integration-motion svg{width:16px;height:16px;fill:currentColor}.integration-motion[hidden]{display:none}
.integration-grid{display:flex;gap:10px;list-style:none;padding:4px 0 6px;margin:0;overflow-x:auto;overscroll-behavior-x:contain;scroll-behavior:auto;scrollbar-width:none;cursor:grab;touch-action:pan-x pan-y;user-select:none}
.integration-grid::-webkit-scrollbar{display:none}.integration-grid.is-dragging{cursor:grabbing}.integration-grid img{pointer-events:none}
.integration-grid:focus-visible{outline:2px solid var(--handle);outline-offset:4px}
.integration-brand{display:flex;align-items:center;gap:12px;flex:0 0 183px;min-height:59px;padding:9px 8px;position:relative}
.integration-logo{display:flex;align-items:center;justify-content:center;flex:0 0 32px;height:32px}
.integration-logo img{display:block;width:32px;height:32px;max-width:32px;max-height:32px;object-fit:contain}
.integration-name{font-size:17px;line-height:1.35;font-weight:500}
.integration-name small{display:block;color:var(--muted);font-size:14px;font-weight:400;line-height:1.45;margin-top:5px}
.integration-brand.suite{flex-basis:292px}
.integration-brand.google-suite{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0}
.google-workspace-mark{display:block;width:170px;height:28px}
.google-workspace-mark img{display:block;width:170px;height:28px;object-fit:contain}
:root[data-theme="dark"] .google-workspace-mark{background:#fff;border-radius:3px;padding:3px;box-sizing:content-box}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .google-workspace-mark{background:#fff;border-radius:3px;padding:3px;box-sizing:content-box}}
.integration-brand.suite .integration-name{font-size:18px}
.integration-logo.mono{background:var(--ink);mask:var(--logo) center/contain no-repeat;-webkit-mask:var(--logo) center/contain no-repeat}
.integration-logo.mono img{visibility:hidden}
.integration-brand.wordmark-brand{flex-wrap:wrap;align-content:center;gap:4px}
.integration-logo.wordmark-logo{flex:0 1 118px;width:118px;max-width:100%;height:29px}
.integration-logo.wordmark-logo img{width:118px;height:auto;max-width:100%;max-height:29px}
.integration-brand[data-tool="zoom"] .integration-logo{mask-size:90px 90px;-webkit-mask-size:90px 90px}
.integration-brand[data-tool="mapyourshow"] .integration-logo{flex-basis:172px;width:172px;height:40px}
.integration-route{display:block;flex-basis:100%;font-size:13px;line-height:1.3;color:var(--muted)}
.integration-hero-note{font-size:14px;line-height:1.5;margin:19px 0 0;color:var(--muted)}
@media(max-width:850px){.integrations-section .section-head{grid-template-columns:1fr;gap:8px}.integration-group{padding:18px 18px 13px}.integrations-section{padding-top:65px;padding-bottom:65px}}
@media(max-width:580px){.integration-group{padding:17px 14px 12px}.integration-group h3{font-size:14px}.integration-brand{flex-basis:170px;gap:10px}.integration-brand.suite{flex-basis:270px}.integration-name{font-size:16px}.integration-intro p{font-size:17px}.integration-group-head{gap:8px}}

/* One clear contact action, with enough room to tap and a clear next step. */
.header-right .nav-contact{display:inline-flex;align-items:center;justify-content:center;min-height:44px;line-height:1.3;text-align:center}
.contact-reassurance{max-width:440px;font-size:14px;line-height:1.55;color:var(--muted);margin:13px 0 0}
.closing-copy{min-width:0}.closing-copy .contact-reassurance{max-width:460px;margin-top:18px}
@media(max-width:680px){header{gap:12px;padding-left:4.5%;padding-right:4.5%}.header-right{gap:10px}.header-right>a:not(.nav-contact){display:none}.header-right .nav-contact{padding:8px 10px}.wordmark{font-size:20px}}
@media(max-width:380px){header{gap:8px}.wordmark{font-size:18px;gap:7px}.header-right{gap:8px}.header-right .nav-contact{max-width:128px;padding:7px 8px}.theme{flex-shrink:0;width:28px;height:28px}}

/* Contact: one short form at the end of the story, reached by the primary CTAs. */
.contact-section{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;scroll-margin-top:20px}
.contact-copy h2{max-width:540px}.contact-copy>p{font-size:18px;line-height:1.65;max-width:450px;color:var(--muted);margin:0 0 27px}
.contact-direct{font-size:14px;line-height:1.6;text-underline-offset:5px;overflow-wrap:anywhere}
.contact-panel{background:var(--card);border:1px solid var(--line);padding:32px;border-radius:4px;min-width:0}
.contact-panel h3{font:400 30px/1.15 var(--serif);letter-spacing:-.5px;margin:0 0 28px}
.contact-field{margin-bottom:21px}.contact-field label{display:block;font-size:14px;font-weight:500;line-height:1.5;margin-bottom:8px}.contact-field label span{font-weight:400;color:var(--muted);font-size:13px;margin-left:7px}
.contact-field input,.contact-field textarea{display:block;width:100%;border:1px solid var(--line);border-radius:3px;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--sans);padding:12px 13px;min-height:48px;transition:border-color .15s}.contact-field textarea{resize:vertical;min-height:108px;max-height:360px}.contact-field input::placeholder,.contact-field textarea::placeholder{color:var(--muted);opacity:.8}.contact-field input:focus,.contact-field textarea:focus{outline:2px solid var(--handle);outline-offset:2px;border-color:var(--handle)}
.contact-field [aria-invalid="true"]{border-color:var(--accent)}.field-error,.contact-error{font-size:14px;line-height:1.5;color:var(--ink);margin:8px 0 0}.contact-error{border-left:3px solid var(--accent);padding:10px 12px;background:var(--paper);margin:0 0 18px}
.contact-submit{width:100%;justify-content:space-between;font-size:15px;min-height:50px}.contact-submit:disabled{opacity:.65;cursor:wait}.contact-privacy{font-size:13px;line-height:1.55;color:var(--muted);margin:13px 0 0}
.contact-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-success-mark{display:grid;place-items:center;width:44px;height:44px;background:var(--profit);color:var(--paper);font-size:24px;border-radius:3px;margin-bottom:24px}.contact-success h3{margin-bottom:17px}.contact-success p{font-size:17px;line-height:1.65;color:var(--muted);margin:0 0 28px;overflow-wrap:anywhere}.contact-success:focus{outline:none}.contact-section [hidden]{display:none!important}
@media(max-width:900px){.contact-section{grid-template-columns:1fr;gap:32px}.contact-copy h2{max-width:630px}.contact-copy>p{max-width:600px}.contact-panel{max-width:600px;width:100%}}
@media(max-width:520px){.contact-panel{padding:24px 20px}.contact-panel h3{font-size:28px}.contact-copy>p{font-size:17px}.contact-field label span{font-size:12px}}

/* The transcript is readable without animation or JavaScript. */
.faq summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.noscript-note{position:relative;z-index:6;padding:24px 7%;background:var(--paper);font-size:14px}.contact-section:focus{outline:none}

/* The hosted overview loads only when the visitor starts playback. */
.demo-section{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center}.demo-video-frame{margin:0;min-width:0}.demo-video-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--card);border:1px solid var(--line);border-radius:4px}.demo-video-frame video:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.demo-video-error{font-size:14px;line-height:1.6;color:var(--muted)}#play-demo[hidden],.demo-video-error[hidden]{display:none}.demo-copy .lead{margin-bottom:25px}@media(max-width:820px){.demo-section{grid-template-columns:1fr}.demo-copy{order:-1}}