/* Viewport size changes the layout, never whether scrolling advances the story. */
.live-scene:not(.live-static){height:calc(100svh + var(--live-travel,1440px))!important}
.live-scene:not(.live-static) .live-pin{position:sticky;top:var(--live-top);height:var(--live-height,calc(100svh - 43px));min-height:0;max-height:none;padding:20px 0!important}
.live-scene:not(.live-static) .live-layout{max-height:100%;align-items:center}
.live-scene:not(.live-static) .live-app{margin:0;max-height:100%;min-width:0}
.live-app-stage{bottom:auto;min-height:100%}
.live-static .live-app-canvas{height:auto!important;min-height:0;overflow:visible}
.live-static .live-app-stage{position:relative;inset:auto;min-height:0;transform:none!important}
.live-static .live-app-stage[aria-hidden="true"]{display:none}
.live-scene:not(.live-static) .live-controls>span>b{font-size:12px}
.live-scene:not(.live-static) .live-controls>span>b:after{content:none}
.live-scene:not(.live-static) .live-controls>span>svg{display:block}
@media(max-width:800px){
 .live-scene:not(.live-static) .live-layout{display:flex;flex-direction:column;align-items:stretch;gap:14px;height:100%}
 .live-scene:not(.live-static) .live-copy{flex:none;position:relative}
 .live-scene:not(.live-static) .live-copy>p{display:none}
 .live-scene:not(.live-static) .live-copy h2{font-size:27px;line-height:1.08;margin:9px 38px 11px 0}
 .live-scene:not(.live-static) .live-copy>.eyebrow{font-size:12px}
 .live-scene:not(.live-static) .live-chapters{margin-top:8px;gap:9px}
 .live-scene:not(.live-static) .live-chapter{padding:8px 2px;gap:4px;min-height:0}
 .live-scene:not(.live-static) .live-chapter>span{font-size:12px;margin:0}
 .live-scene:not(.live-static) .live-chapter strong{font-size:13px;line-height:1.4}
 .live-scene:not(.live-static) .live-chapter small{display:none}
 .live-scene:not(.live-static) .live-controls{position:absolute;right:0;top:27px;padding:0}
 .live-scene:not(.live-static) .live-controls>span{display:none}
 .live-scene:not(.live-static) .live-app{flex:none;max-width:none;margin:0}
 .live-scene:not(.live-static) .live-app-top{height:35px;font-size:12px}
 .live-scene:not(.live-static) .live-app-brand{font-size:16px!important}
 .live-scene:not(.live-static) .live-app-breadcrumb{height:31px;font-size:12px}
 .live-scene:not(.live-static) .live-app-foot{padding:8px 12px;min-height:32px}
 .live-scene:not(.live-static) .live-app-foot>span{display:none}
 .live-scene:not(.live-static) .live-app-foot>a{font-size:12px}
 .live-scene:not(.live-static) .live-app-rail{display:none}
 .live-scene:not(.live-static) .live-app-frame{grid-template-columns:1fr}
 .live-scene:not(.live-static) .live-app-stage{padding:17px 16px}
}
@media(min-width:801px) and (max-height:740px){
 .live-scene:not(.live-static) .live-copy h2{font-size:30px;margin:12px 0}
 .live-scene:not(.live-static) .live-copy>p{font-size:14px;line-height:1.65}
 .live-scene:not(.live-static) .live-chapters{margin-top:15px}
 .live-scene:not(.live-static) .live-chapter{padding:10px 2px}
 .live-scene:not(.live-static) .live-chapter strong{font-size:14px}
 .live-scene:not(.live-static) .live-chapter.active small{font-size:13px;line-height:1.55;max-height:95px}
 .live-scene:not(.live-static) .live-controls{padding-top:12px}
}
@media(max-height:540px){
 .live-scene:not(.live-static) .live-pin{padding:10px 0!important}
 .live-scene:not(.live-static) .live-copy h2{font-size:23px;margin:8px 0}
 .live-scene:not(.live-static) .live-copy>p,.live-scene:not(.live-static) .live-chapter small{display:none}
 .live-scene:not(.live-static) .live-chapter{padding:8px 0}
 .live-scene:not(.live-static) .live-copy>.eyebrow{font-size:12px}
 .live-scene:not(.live-static) .live-app-top,.live-scene:not(.live-static) .live-app-foot{display:none}
 .live-scene:not(.live-static) .live-app-breadcrumb{height:28px}
}
/* A natural fit is a data-flow diagram driven by the same native scroll. */
.fit-motion{position:relative;height:calc(100svh + 1200px);background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);--fit-top:43px;--fit-height:calc(100svh - 43px)}
.fit-motion-pin{position:sticky;top:var(--fit-top);height:var(--fit-height);display:flex;align-items:center;padding:24px 0}
.fit-motion-pin>.container{width:100%}
.fit-motion-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:16px}
.fit-motion-heading h2{font-size:40px;line-height:1.08;letter-spacing:-.055em;margin-top:15px}
.fit-motion-heading>p{max-width:350px;font-size:16px;line-height:1.8;color:var(--muted)}
.fit-flow-canvas{position:relative;height:clamp(240px,calc(var(--fit-height) - 250px),410px);margin:0 0 5px}
.fit-input-card,.fit-output-card{position:absolute;border:1px solid #dbe7d6;background:#fff;border-radius:9px;display:flex;align-items:center;gap:12px;padding:18px 17px;box-shadow:0 10px 28px #143b2310;z-index:3;will-change:transform,opacity;width:220px;min-height:73px}
.fit-input-card{left:2%;top:27%}.fit-input-card[data-fit-input="1"]{top:52%}
.fit-input-card>span,.fit-output-card>span{height:35px;width:32px;display:grid;place-items:center;background:#edf4e7;border:1px solid #dce8d2;color:#668850;border-radius:6px;flex-shrink:0}
.fit-input-card>span svg,.fit-output-card>span svg{width:19px;height:19px}
.fit-input-card strong,.fit-output-card strong{font-size:15px;font-weight:550;display:block}
.fit-input-card small,.fit-output-card small{font-size:12px;color:#8b9c7d;display:block;margin-top:5px;line-height:1.5}
.fit-output-card{right:1%;width:231px;min-height:63px;padding:13px 15px;opacity:0;top:5%}
.fit-output-card[data-fit-output="1"]{top:28%}.fit-output-card[data-fit-output="2"]{top:51%}.fit-output-card[data-fit-output="3"]{top:74%}
.fit-system{position:absolute;left:calc(50% - 54px);top:calc(50% - 54px);width:108px;height:108px;border-radius:23px;background:var(--brand-deep,#0d3026);display:flex;align-items:center;justify-content:center;color:white;border:1px solid #537349;box-shadow:0 16px 45px #1d4f2320;z-index:4;transform-origin:center}
.fit-system .brand-mark,.fit-system .brand-mark svg{width:40px;height:45px}.fit-system .brand-mark path{stroke:#e4f1d4;stroke-width:3;fill:none}
.fit-system-label{position:absolute;top:calc(50% + 71px);left:calc(50% - 120px);width:240px;text-align:center;color:#829972;font-size:13px}
.fit-system-label strong{display:block;font-size:16px;color:#355b34;margin-bottom:6px;letter-spacing:-.025em}
.fit-review-card{position:absolute;left:calc(50% - 124px);top:calc(50% - 68px);width:248px;background:#fff;border:1px solid #dce8d0;border-radius:9px;padding:18px;box-shadow:0 12px 35px #26472c12;z-index:5;opacity:0;will-change:opacity,transform}
.fit-review-card>small{font-size:12px;color:#8a9d78;letter-spacing:.055em}.fit-review-card>div{display:flex;align-items:center;justify-content:space-between;font-size:13px;padding:11px 0;border-bottom:1px solid #e7eddf;color:#82966e}.fit-review-card>div strong{font-size:16px;font-weight:550;color:#315735}.fit-review-card>p{display:flex;align-items:center;gap:8px;font-size:12px;color:#688f49;margin-top:14px}.fit-review-card>p svg{width:14px;height:14px}
.fit-route{position:absolute;top:50%;height:1px;background:#e0e9d6;width:22%;left:25%;z-index:1}.fit-route-right{left:54%;width:21%}.fit-route i{height:100%;width:100%;display:block;background:#a4c587;transform-origin:left;transform:scaleX(0)}
.fit-bottom{border-top:1px solid var(--line);padding-top:19px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.fit-caption{font-size:14px;line-height:1.7;color:var(--muted);max-width:530px;min-height:46px}
.fit-motion-steps{display:flex;gap:22px;align-items:center}.fit-motion-steps button{font-size:13px;color:#94a288;padding:9px 0;border-bottom:2px solid transparent;white-space:nowrap}.fit-motion-steps button.active{color:var(--teal);border-color:var(--teal)}.fit-motion-steps button>span{font-size:12px;margin-right:7px}.fit-motion-steps .fit-pause{border:1px solid var(--line);border-radius:50%;width:29px;height:29px;padding:0;display:grid;place-items:center}.fit-pause svg{width:13px;height:13px}
.fit-motion.fit-paused{height:auto}.fit-paused .fit-motion-pin{position:relative;top:auto;height:auto;padding:65px 0}.fit-paused .fit-flow-canvas{height:410px}
@media(max-width:1100px){.fit-input-card{left:0;width:190px;padding:14px}.fit-output-card{right:0;width:200px;padding:12px}.fit-input-card strong,.fit-output-card strong{font-size:14px}.fit-motion-heading h2{font-size:35px}.fit-motion-steps{gap:14px}.fit-caption{max-width:450px}.fit-system{left:calc(50% - 47px);top:calc(50% - 47px);width:94px;height:94px}.fit-system-label{top:calc(50% + 62px)}}
@media(max-width:800px){
 .fit-motion-pin{padding:18px 0}.fit-motion-heading{gap:20px;margin-bottom:7px}.fit-motion-heading>p{display:none}.fit-motion-heading h2{font-size:29px;margin-top:9px}.fit-motion-heading .eyebrow{font-size:12px}
 .fit-flow-canvas{height:clamp(250px,calc(var(--fit-height) - 210px),410px)}
 .fit-input-card,.fit-input-card[data-fit-input="1"]{left:2%;top:4%;width:43%;min-height:62px;padding:12px;gap:9px}.fit-input-card[data-fit-input="1"]{left:auto;right:2%}
 .fit-input-card>span,.fit-output-card>span{width:26px;height:29px}.fit-input-card strong,.fit-output-card strong{font-size:13px}.fit-input-card small,.fit-output-card small{font-size:12px}
 .fit-system{width:76px;height:76px;left:calc(50% - 38px);top:calc(41% - 38px);border-radius:17px}.fit-system .brand-mark,.fit-system .brand-mark svg{width:28px;height:34px}.fit-system-label{top:calc(41% + 48px);font-size:12px}.fit-system-label strong{font-size:14px;margin-bottom:4px}
 .fit-output-card{width:46%;min-height:58px;padding:10px;left:1%;right:auto;top:65%;gap:8px}.fit-output-card[data-fit-output="1"]{top:65%;left:auto;right:1%}.fit-output-card[data-fit-output="2"]{top:84%;left:1%;right:auto}.fit-output-card[data-fit-output="3"]{top:84%;left:auto;right:1%}
 .fit-output-card small{font-size:12px}.fit-review-card{left:calc(50% - 118px);top:calc(41% - 40px);width:236px;padding:15px}.fit-review-card>div{padding:9px 0}
 .fit-route{height:25%;width:1px;top:18%;left:50%}.fit-route-right{top:48%;height:28%}.fit-route i{transform-origin:top}
 .fit-bottom{display:block;padding-top:13px;margin-top:15px}.fit-caption{font-size:13px;min-height:42px;max-width:none}.fit-motion-steps{gap:15px;justify-content:space-between;margin-top:8px}.fit-motion-steps button{font-size:12px}.fit-motion-steps button>span{font-size:12px;margin-right:5px}
 .fit-paused .fit-flow-canvas{height:410px}
}
@media(max-height:590px){.fit-motion-pin{padding:12px 0}.fit-motion-heading h2{font-size:27px}.fit-motion-heading>p{font-size:14px}.fit-caption{font-size:12px;min-height:32px}.fit-flow-canvas{height:clamp(195px,calc(var(--fit-height) - 195px),320px)}.fit-input-card,.fit-output-card{min-height:43px;padding:9px}.fit-input-card small,.fit-output-card small{display:none}.fit-bottom{padding-top:10px}.fit-review-card{padding:12px}.fit-review-card>div{padding:7px 0}.fit-review-card>p{margin-top:10px}.fit-system-label>span{display:none}}
.live-scene:not(.live-static) .live-app-rail{contain:size;overflow:hidden}
