#connected-example{overflow:clip;padding-bottom:95px}
.b2b-demo-intro{grid-template-columns:1.15fr .85fr;gap:9%;padding-bottom:30px}
.journey-intro-copy p{color:#c8d9e6;font-size:15px;line-height:1.8;margin:0 0 17px;max-width:440px}
.journey-intro-copy p:first-child{color:#f6fbff;font-size:19px;line-height:1.6}
.journey-expanded-stage{min-height:820px;padding:140px 0;display:grid;place-items:center;perspective:1500px;overflow:visible;isolation:isolate;gap:0}
.journey-expanded-stage .demo-rail{inset:17% 3%;border-color:#c5dfef20;pointer-events:none}
.journey-platform{position:relative;width:82%;z-index:1;border:1px solid #c1d7e8;border-radius:14px;overflow:hidden;background:#f2f7fb;color:#243c54;box-shadow:0 30px 85px #0c1b3659;transform:translateY(var(--platform-drift,0px)) rotateX(2deg) rotateY(-2deg)}
.jp-window-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 19px;background:#fafcfe;border-bottom:1px solid #d8e4ed;color:#496a82;font-size:8px;font-weight:700;letter-spacing:.1em}
.jp-window-head>small{font-size:7px;color:#607f95;white-space:nowrap}
.jp-window-dots{display:flex;gap:4px}.jp-window-dots i{width:5px;height:5px;background:#a6bed0;border-radius:50%;display:block}
.jp-workspace{display:grid;grid-template-columns:122px minmax(0,1fr);min-height:420px}
.jp-sidebar{background:#e6eef4;border-right:1px solid #d8e3ec;padding:24px 14px;display:flex;flex-direction:column;gap:21px;color:#4c6c83;font-size:7px;letter-spacing:.09em;font-weight:700}
.jp-brand{display:flex;gap:10px;align-items:center;color:#31536d;margin-bottom:10px;font-size:8px;line-height:1.6}
.jp-brand>b{font-size:26px;color:#7598b0}.jp-side-foot{font-size:6px;line-height:1.8;color:#718c9f;margin-top:auto;padding-top:25px;border-top:1px solid #cadbe7}
.jp-main{padding:24px 23px;min-width:0}
.jp-app-title{display:flex;justify-content:space-between;align-items:center;gap:15px}.jp-app-title small{font-size:7px;letter-spacing:.1em;color:#597a91;font-weight:700}
.jp-app-title h3{font:700 28px/1.15 var(--display);letter-spacing:-.045em;margin:8px 0 0;color:#203f58}
.jp-group-badge{border:1px solid #cee0eb;border-radius:30px;padding:7px 10px;background:#e9f1f7;color:#55798f;font-size:6px;font-weight:700;letter-spacing:.06em;white-space:nowrap}
.jp-tabs{display:flex;gap:7px;margin:22px 0 18px;border-bottom:1px solid #d7e4ed;padding-bottom:10px}
.jp-tabs button{border:0;border-radius:7px;background:transparent;color:#57778e;padding:8px 11px;font:600 9px var(--sans);cursor:pointer;transition:background .2s,color .2s}
.jp-tabs button[aria-selected=true]{background:#375f7f;color:white}.jp-tabs button:hover{background:#dbe8f2;color:#244965}.jp-tabs button[aria-selected=true]:hover{background:#2c526f;color:#fff}
.jp-tabs button:focus-visible{outline:2px solid #578bae;outline-offset:3px}
.jp-view{min-height:300px}.jp-view[hidden]{display:none}
.jp-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.jp-metrics>div{display:flex;flex-direction:column;gap:6px;padding:15px;border:1px solid #d4e3ee;background:#fff;border-radius:9px}
.jp-metrics small{font-size:6px;letter-spacing:.1em;color:#587a92;font-weight:700}.jp-metrics strong{font:700 25px/1 var(--display);color:#2e536f;letter-spacing:-.03em}.jp-metrics span{font-size:8px;color:#5d7b91;line-height:1.5}
.jp-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:12px}
.jp-panel{background:#fff;border:1px solid #d6e3ed;border-radius:10px;padding:17px;min-width:0}
.jp-panel>small{font-size:6px;letter-spacing:.11em;color:#587990;font-weight:700;display:block;line-height:1.6}
.jp-panel h4{font:700 14px/1.25 var(--display);letter-spacing:-.035em;color:#2b4c66;margin:9px 0 15px}
.jp-panel p{font-size:9px;color:#536f83;line-height:1.8;margin:15px 0 0}
.jp-pipeline{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:12px 0 18px}.jp-pipeline span{font-size:7px;background:#e9f2f8;padding:7px 8px;border-radius:5px;color:#4c718c;font-weight:700}.jp-pipeline b{font-size:9px;font-weight:400;color:#8da7ba}.jp-pipeline i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#6eaa9c;margin-right:4px}
.jp-client-row{display:flex;align-items:center;gap:8px;background:#f3f7fa;padding:11px 9px;border-radius:7px}
.jp-avatar{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border-radius:50%;background:#d5e6f1;color:#6589a2;font-size:11px;font-weight:700}
.jp-client-row b{font-size:9px;display:block;color:#36556d}.jp-client-row small{font-size:7px;display:block;margin-top:4px;color:#68859b;line-height:1.5}.jp-status{font-size:5px;letter-spacing:.06em;background:#e5efe9;color:#527e72;padding:5px;border-radius:4px;margin-left:auto;white-space:nowrap}
.jp-task{display:flex;gap:9px;align-items:center;padding:11px 0;border-bottom:1px solid #e0eaf1}.jp-task:last-child{border:0}.jp-task>i{width:6px;height:6px;border:1px solid #87a8c1;border-radius:50%;flex-shrink:0}.jp-task b{display:block;font-size:8px;font-weight:700;color:#35576f}.jp-task small{display:block;font-size:7px;margin-top:5px;line-height:1.5;color:#6c879b}.jp-task em{margin-left:auto;font-size:7px;font-style:normal;color:#5d819a;white-space:nowrap}
.jp-context-strip{display:flex;gap:9px;align-items:center;justify-content:center;flex-wrap:wrap;padding:17px 0 0;color:#66869d;font-size:7px;font-weight:600}.jp-context-strip b{font-weight:400;color:#a0b6c6}.jp-context-strip i{display:inline-block;width:4px;height:4px;background:#76a491;border-radius:50%;margin-right:4px}
.jp-week{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.jp-week>div{padding:11px 9px;min-height:120px;background:#eff5f9;border:1px solid #d9e7f0;border-radius:6px}.jp-week strong{display:block;color:#68869c;font-size:8px;letter-spacing:.08em;margin-bottom:14px}.jp-week span{display:block;background:#d9e9f5;color:#40657e;font-size:8px;padding:10px 7px;margin-bottom:7px;border-radius:5px;line-height:1.6}.jp-week small{display:block;color:#64879e;font-size:6px;margin-top:5px}
.jp-projects{margin-top:12px}.jp-projects>div{display:grid;grid-template-columns:1fr auto;gap:5px;padding:12px 0;border-bottom:1px solid #e1ebf2}.jp-projects>div:last-child{border:0;padding-bottom:0}.jp-projects b{font-size:9px;color:#31546e}.jp-projects span{font-size:6px;color:#68899f;background:#edf4f8;padding:5px 7px;border-radius:4px}.jp-projects div small{grid-column:1/-1;font-size:8px;color:#607f94;line-height:1.6}
.jp-location-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.jp-location-list>div{padding:13px;background:#edf4f8;border:1px solid #d7e5ee;border-radius:7px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}.jp-location-list b{font-size:10px;color:#32536c}.jp-location-list span{font-size:6px;color:#5b829c;border:1px solid #c9dfe9;background:#f7fbfd;border-radius:20px;padding:5px 7px}.jp-location-list small{font-size:8px;line-height:1.65;color:#608096}
#jp-growth>.jp-grid{margin-top:12px}.jp-readiness{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center}.jp-readiness>b{font:700 25px var(--display);color:#4b7897}.jp-readiness b small{font-size:13px;color:#9eb6c7}.jp-readiness>span{font-size:8px;color:#6a899e}.jp-readiness>i{grid-column:1/-1;height:5px;border-radius:4px;background:#e0ebf2;margin-top:7px}.jp-readiness em{display:block;height:5px;width:40%;border-radius:4px;background:#7b9fb9}
.jp-learning{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:17px 0}.jp-learning span{font-size:8px;color:#577f9a;padding:6px 7px;background:#edf5fa;border-radius:4px}.jp-learning b{font-size:9px;color:#9bb4c6;font-weight:400}
.journey-expanded-stage .demo-float{position:absolute;display:flex;flex-direction:column;gap:8px;width:218px;max-width:25%;padding:18px 20px;background:#f3f9fdeF;color:#274560;border:1px solid #d8e9f4;border-radius:11px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:2;transform:translate3d(var(--journey-x,0px),var(--journey-y,0px),var(--journey-z,0px)) rotateX(var(--journey-rx,0deg)) rotateY(var(--journey-ry,0deg)) scale(var(--journey-scale,1));box-shadow:0 var(--journey-shadow-y,20px) var(--journey-shadow-blur,40px) rgba(8,19,42,var(--journey-shadow-opacity,.2));will-change:transform}
.journey-expanded-stage .demo-float>span{font-size:8px;color:#69869b;letter-spacing:.1em;line-height:1.5}.journey-expanded-stage .demo-float strong{font:700 18px/1.2 var(--display);letter-spacing:-.035em;color:#2d4e6a}.journey-expanded-stage .demo-float small{font-size:11px;line-height:1.7;color:#5c798d}
.journey-expanded-stage .demo-float-one{top:40px;left:1%;right:auto;bottom:auto}
.journey-expanded-stage .demo-float-two{top:43%;right:0;left:auto;bottom:auto}
.journey-expanded-stage .demo-float-three{bottom:52px;left:2%;right:auto;top:auto}
.journey-expanded-stage .demo-float-four{top:60px;right:3%;left:auto;bottom:auto}
.journey-expanded-stage .demo-float-five{bottom:40px;right:8%;left:auto;top:auto}
.journey-workflow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;max-width:1120px;margin:40px auto 0}
.journey-workflow article{position:relative;border-top:1px solid #b6cfdf55;padding-top:22px}
.journey-workflow article>span{font-size:8px;letter-spacing:.12em;color:#abc7d9;font-weight:700}
.journey-workflow h3{font:600 19px/1.2 var(--display);letter-spacing:-.035em;color:#f1f8fd;margin:16px 0 13px}
.journey-workflow p{color:#bcd0df;font-size:12px;line-height:1.8;margin:0}
.journey-workflow article:not(:last-child):after{content:'→';position:absolute;top:18px;right:1px;color:#dcebf5;font-size:14px}
#connected-example .journey-footer{max-width:1120px;margin:48px auto 0;padding-top:25px;border-top:1px solid #bfd6e644}
#connected-example .demo-caption{font-size:8px;letter-spacing:.1em;max-width:560px;line-height:1.8}
@media(max-width:1100px){.journey-platform{width:86%}.jp-workspace{grid-template-columns:95px minmax(0,1fr)}.jp-sidebar{font-size:6px;padding:20px 11px}.jp-main{padding:20px 17px}.jp-panel{padding:13px}.jp-grid{gap:9px}.jp-app-title h3{font-size:25px}.journey-expanded-stage .demo-float{width:195px;padding:16px}.journey-expanded-stage .demo-float strong{font-size:16px}.journey-expanded-stage .demo-float small{font-size:10px}.journey-workflow{gap:16px}.journey-workflow h3{font-size:17px}}
@media(max-width:900px){.b2b-demo-intro{grid-template-columns:1fr;gap:28px}.journey-intro-copy{display:grid;grid-template-columns:1fr 1fr;gap:30px}.journey-intro-copy p:first-child{font-size:17px}.journey-intro-copy p{font-size:13px}.jp-grid{grid-template-columns:1fr}.jp-panel h4{font-size:13px}.jp-panel p{font-size:8px}.jp-task{padding:8px 0}.jp-view{min-height:380px}.journey-expanded-stage{padding-top:150px;padding-bottom:150px;min-height:900px}.journey-platform{width:87%}.journey-expanded-stage .demo-float{width:175px;max-width:27%;padding:15px}.journey-expanded-stage .demo-float strong{font-size:15px}.journey-workflow{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.jp-week small{display:none}.jp-location-list{gap:6px}.jp-location-list>div{padding:10px 8px}.jp-location-list b{font-size:9px}.jp-location-list small{font-size:7px}}
@media(max-width:600px){
  #connected-example{padding-bottom:65px}.journey-intro-copy{display:block}.journey-intro-copy p{font-size:14px;line-height:1.8}.journey-intro-copy p:first-child{font-size:17px}.b2b-demo-intro{padding-bottom:18px}
  .journey-expanded-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px;padding:20px 0 28px;min-height:0;perspective:1100px;align-items:stretch}
  .journey-expanded-stage .demo-rail{display:none}.journey-platform{grid-column:1/-1;width:100%;transform:none;border-radius:11px;margin-bottom:6px}
  .jp-window-head{padding:12px 13px;font-size:6px;gap:7px}.jp-window-head>small{font-size:5px}.jp-window-dots{gap:3px}.jp-window-dots i{width:4px;height:4px}
  .jp-workspace{display:block;min-height:0}.jp-sidebar{display:none}.jp-main{padding:19px 15px}.jp-app-title h3{font-size:23px}.jp-app-title small{font-size:6px}.jp-group-badge{font-size:5px;padding:6px 8px}.jp-tabs{gap:4px;margin-top:18px}.jp-tabs button{font-size:9px;padding:8px 9px}.jp-metrics{gap:6px}.jp-metrics>div{padding:11px 8px}.jp-metrics small{font-size:5px}.jp-metrics strong{font-size:22px}.jp-metrics span{font-size:7px}
  .jp-grid{grid-template-columns:1fr}.jp-panel{padding:15px}.jp-panel>small{font-size:6px}.jp-panel h4{font-size:14px}.jp-panel p{font-size:10px}.jp-client-row b{font-size:10px}.jp-client-row small{font-size:8px}.jp-pipeline span{font-size:8px}.jp-task b{font-size:10px}.jp-task small{font-size:8px}.jp-task em{font-size:8px}.jp-context-strip{font-size:7px;gap:7px}.jp-view{min-height:0}
  .jp-week{gap:5px}.jp-week>div{padding:10px 5px}.jp-week span{font-size:8px;padding:9px 5px}.jp-projects b{font-size:10px}.jp-projects div small{font-size:9px}.jp-location-list{grid-template-columns:1fr}.jp-location-list>div{display:grid;grid-template-columns:1fr auto;padding:11px}.jp-location-list b{font-size:10px}.jp-location-list small{grid-column:1/-1;font-size:9px}.jp-location-list span{font-size:6px}
  .journey-expanded-stage .demo-float{position:relative;inset:auto!important;max-width:none;width:100%;padding:17px 14px;gap:9px;border-radius:10px;min-height:150px}.journey-expanded-stage .demo-float>span{font-size:7px}.journey-expanded-stage .demo-float strong{font-size:17px}.journey-expanded-stage .demo-float small{font-size:11px}.journey-expanded-stage .demo-float-five{grid-column:1/-1;min-height:0;padding:19px}.journey-expanded-stage .demo-float-five strong{font-size:20px}
  .journey-workflow{grid-template-columns:1fr;gap:24px;margin-top:28px}.journey-workflow article{padding-top:18px}.journey-workflow h3{font-size:21px;margin-top:12px}.journey-workflow p{font-size:13px;line-height:1.8}.journey-workflow article>span{font-size:8px}.journey-workflow article:not(:last-child):after{content:'↓';top:15px}
  #connected-example .journey-footer{margin-top:32px;gap:22px}#connected-example .demo-caption{font-size:8px}.journey-link{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.journey-platform{transform:none}.journey-expanded-stage .demo-float{transform:none!important;will-change:auto}.jp-tabs button{transition:none}}
/* Keep the working interface readable inside the wider platform preview. */
@media(min-width:601px){
  .jp-window-head{font-size:9px}.jp-window-head>small{font-size:8px}.jp-sidebar{font-size:9px;letter-spacing:.035em}.jp-brand{font-size:9px}.jp-side-foot{font-size:8px}.jp-app-title small{font-size:8px}.jp-group-badge{font-size:8px}.jp-tabs button{font-size:11px}.jp-metrics small{font-size:8px}.jp-metrics span{font-size:10px}.jp-panel>small{font-size:8px}.jp-panel h4{font-size:16px}.jp-panel p{font-size:11px}.jp-pipeline span{font-size:9px}.jp-client-row b{font-size:11px}.jp-client-row small{font-size:9px}.jp-status{font-size:7px}.jp-task b{font-size:10px}.jp-task small{font-size:9px}.jp-task em{font-size:9px}.jp-context-strip{font-size:9px}.jp-week strong{font-size:9px}.jp-week span{font-size:10px}.jp-week small{font-size:8px}.jp-projects b{font-size:11px}.jp-projects span{font-size:8px}.jp-projects div small{font-size:10px}.jp-location-list b{font-size:11px}.jp-location-list span{font-size:8px}.jp-location-list small{font-size:9px}.jp-readiness>span{font-size:10px}.jp-learning span{font-size:10px}
}
@media(max-width:600px){.jp-metrics small{font-size:7px}.jp-metrics span{font-size:8px}.jp-panel>small{font-size:7px}.jp-tabs button{font-size:10px}.jp-window-head{font-size:7px}.jp-window-head>small{font-size:6px}}
