/* Product story: a level canvas, native scroll and four readable chapters. */
.mock-bars>div:nth-child(1){--bar:88%}.mock-bars>div:nth-child(2){--bar:53%}.mock-bars>div:nth-child(3){--bar:34%}
.product-demo{transform:none}.story{background:#f0f2ea}.story-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%;align-items:start}.story-chapter{min-height:75vh;display:flex;flex-direction:column;justify-content:center;padding:60px 0;scroll-margin-top:80px}.chapter-label{display:flex;gap:18px;align-items:center;font-size:13px;font-weight:700;color:#425a49}.chapter-label>span{font:700 24px Barlow,sans-serif;border:1px solid #9eafa0;border-radius:50%;width:45px;height:45px;display:grid;place-items:center}.story-chapter h3{font:700 clamp(34px,3.5vw,53px)/1.08 Barlow,sans-serif;letter-spacing:-.5px;margin:22px 0}.story-chapter>p:not(.chapter-label){line-height:1.85;font-size:16px;color:#4d5e52;max-width:440px}.story-chapter .chapter-tags{font-size:12px!important;border-top:1px solid #cbd4c8;padding-top:20px}.chapter-next{align-self:start;margin-top:20px;font-size:13px;border-bottom:1px solid #8b9b8a;padding-bottom:8px}.chapter-next span{margin-left:24px}.story-visual{position:sticky;top:70px;padding:25px 0}.story-nav{display:flex;justify-content:space-between;gap:8px;margin-bottom:24px}.story-nav a{display:flex;gap:8px;font-size:12px;padding:10px 0;color:#526255;border-bottom:2px solid transparent}.story-nav a[aria-current]{color:#192c20;border-color:#365b40;font-weight:700}.story-stage{display:grid;perspective:1400px}.story-screen{background:#fff;border:1px solid #c7d1c5;border-radius:16px;overflow:hidden;box-shadow:0 25px 65px #22322015;margin-bottom:22px}.story-screen-body{padding:30px}.screen-heading h4{font:700 32px/1.15 Barlow,sans-serif;margin:10px 0}.screen-heading>p{font-size:12px;line-height:1.7;color:#526356}.screen-heading .eyebrow{font-size:10px;color:#4e6755}.mock-tabs{display:flex;gap:22px;font-size:12px;border-bottom:1px solid #dce2d9;padding:17px 0;color:#526356}.mock-tabs b{color:#203b2a}.mock-document{display:flex;gap:20px;background:#eef3e7;border-radius:9px;padding:22px;margin:24px 0 10px;font-size:14px}.mock-document p{font-size:12px;line-height:1.6}.doc-symbol{font-size:30px}.pill{display:inline-block;font-size:10px;padding:7px 10px;border:1px solid #aebfa6;border-radius:20px;color:#304e36}.mock-task{display:flex;align-items:center;gap:12px;padding:20px 0;border-bottom:1px solid #e2e7df;font-size:12px}.mock-task i{font-style:normal;color:#385740}.mock-task small{margin-left:auto;color:#526356;font-size:10px}.mock-people{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.mock-people>div{background:#f0f3ec;padding:20px 10px;text-align:center;border-radius:8px}.avatar{width:65px;height:65px;border-radius:50%;display:grid;place-items:center;margin:0 auto 20px;font:700 22px Barlow,sans-serif;background:#d6e2cc;color:#324738}.mock-people>div:nth-child(2) .avatar{background:#e9dfcc}.mock-people>div:nth-child(3) .avatar{background:#d4e2e3}.mock-people b{display:block;font-size:12px}.mock-people small{display:block;font-size:10px;line-height:1.6;margin-top:8px;color:#526356}.mock-note{display:flex;gap:16px;align-items:center;margin-top:28px;border-top:1px solid #dce2d9;padding-top:18px}.mock-note>span{font-size:28px;color:#45634a}.mock-note p{font-size:12px;line-height:1.9;color:#526356}.mock-note b{color:#263e2c;font-weight:600}.mock-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:#edf2e7;padding:22px 14px;border-radius:8px;margin:25px 0}.mock-totals small{display:block;font-size:10px;color:#526356}.mock-totals b{display:block;font:700 26px Barlow,sans-serif;margin-top:10px}.mock-bars>div{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:12px;padding:14px 0}.mock-bars i{grid-row:2;grid-column:1/-1;display:block;height:9px;background:linear-gradient(to right,#9eb78d var(--bar),#edf1e9 var(--bar));border-radius:10px}.mock-call{background:#edf2e7;border-radius:8px;padding:20px;display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:23px}.mock-call small{display:block;font-size:10px;color:#526356}.mock-call b{display:block;font-size:14px;margin-top:8px}.mock-timeline{padding-top:16px}.mock-timeline>div{display:flex;align-items:center;gap:20px;padding:17px 0}.mock-timeline time{font-size:12px}.mock-timeline i{height:12px;width:12px;border-radius:50%;background:#88a87a;box-shadow:0 0 0 5px #edf2e7}.mock-timeline b{font-size:12px}.mock-timeline small{display:block;margin-top:6px;font-size:10px;color:#526356}.story-caption{font-size:11px;color:#506150;margin:20px 0}.story-track{height:2px;background:#cfd9c9}.story-track span{display:block;width:100%;height:100%;transform-origin:left;transform:scaleX(var(--story-progress, .25));background:#385b3c;transition:transform .6s ease}.story-enhanced .story-screen{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(24px) scale(.97);transition:opacity .55s ease,transform .7s cubic-bezier(.22,1,.36,1),visibility .55s;margin:0;pointer-events:none}.story-enhanced .story-screen.is-active{opacity:1;visibility:visible;transform:none;pointer-events:auto}.story-enhanced .story-chapter .chapter-label>span{transition:background .35s,color .35s}.story-enhanced .story-chapter.is-active .chapter-label>span{background:#284832;color:white;border-color:#284832}
@media(min-width:901px) and (max-height:760px){.story-visual{top:15px;padding:10px 0}.story-screen-body{padding:20px}.mock-task{padding:14px 0}.story-nav{margin-bottom:12px}.mock-note{margin-top:15px;padding-top:8px}.story-caption{margin:12px 0}}
@media(max-width:900px){.story-layout{display:flex;flex-direction:column;gap:0}.story-chapters,.story-visual{display:contents}.story-chapter{min-height:0;padding:35px 0 22px;order:0}.story-screen{width:100%;margin:0 0 38px}.story-stage{display:contents}.story-chapter[data-chapter="0"],.story-screen[data-screen="0"]{order:1}.story-chapter[data-chapter="1"],.story-screen[data-screen="1"]{order:2}.story-chapter[data-chapter="2"],.story-screen[data-screen="2"]{order:3}.story-chapter[data-chapter="3"],.story-screen[data-screen="3"]{order:4}.story-nav,.story-track,.chapter-next{display:none}.story-caption{order:5}.story-chapter h3{font-size:38px;max-width:500px}.story-screen-body{padding:22px}.story-chapter>p:not(.chapter-label){font-size:15px}.mock-people{gap:7px}.avatar{width:48px;height:48px}.mock-people>div{padding:15px 5px}.mock-totals b{font-size:23px}.mock-task{gap:8px}.demo-top{padding:17px 20px}.mock-tabs{gap:15px}}
@media(prefers-reduced-motion:reduce){.story-enhanced .story-screen,.story-track span,.story-enhanced .story-chapter .chapter-label>span{transition:none;transform:none}.story-track span{transform:scaleX(var(--story-progress,.25))}}
