@font-face{font-family:Inter;src:url(../../assets/inter-regular.woff2)}@font-face{font-family:Inter;src:url(../../assets/inter-medium.woff2);font-weight:500}
/* The editorial page inherits the featured-case structure. Colour belongs to the product. */
.project-bjak{--case-muted:#717b82;--case-band:#f3f4f5;--case-cyan:#56b1c8}.project-bjak .case-section{scroll-margin-top:115px}.project-bjak .case-content{padding-bottom:80px}.contents button{display:block;width:100%;border:0;background:none;color:#969ea3;font:10px/1.5 Inter,Arial,sans-serif;text-align:left;letter-spacing:.04em;padding:9px 0;cursor:pointer}.contents button[aria-current],.contents button:hover{color:#17211b}.project-bjak button:focus-visible{outline:2px solid #3986ec;outline-offset:4px}.opening-product,.opening-component{position:relative;aspect-ratio:4/3;border-radius:5px;overflow:hidden}.opening-product{background:radial-gradient(ellipse at 15% 85%,#d0eadc,transparent 55%),radial-gradient(ellipse at 80% 10%,#f7faf6,transparent 55%),#a7bdb0}.opening-product-phones{position:absolute;inset:13% -7% auto;display:flex;gap:6%;justify-content:center}.opening-product .device-wrap{--device-scale:.35}.opening-product .device-wrap:nth-child(2){transform:translateY(20px)}.device-wrap{--device-scale:.7;width:calc(360px * var(--device-scale));height:calc(792px * var(--device-scale));position:relative;flex-shrink:0}.device-wrap>.runway-device{transform:scale(var(--device-scale));transform-origin:top left}.opening-component{display:grid;place-items:center;background:radial-gradient(ellipse at 15% 85%,#d0eadc,transparent 55%),radial-gradient(ellipse at 80% 10%,#f7faf6,transparent 55%),#a7bdb0}.glass-layer,.component-allocation{position:absolute;width:63%;height:76%;border-radius:20px;background:#f3f8f9db;border:1px solid #fff9;box-shadow:0 7px 24px #175f7e16}.glass-layer{background:linear-gradient(140deg,#c4f1f240,#f8f0d43b 40%,#9ccdfb63);border-color:#e2f8ff9c}.layer-one{transform:translate(21px,17px) rotate(-4deg)}.layer-two{transform:translate(10px,8px) rotate(-2deg)}.component-allocation{padding:17px 18px;color:#22392c}.component-tabs{display:flex;justify-content:space-between;font-size:8px;color:#8a9a90}.component-tabs span:first-child{color:#243e30}.component-allocation .r-ring{width:170px;height:170px;max-width:100%;margin:9px auto 0}.component-allocation .r-ring-copy>span,.component-allocation .r-ring-copy b{color:#647a6c}.component-allocation .r-ring-copy strong{font-size:25px}.allocation-footer{font-size:7px;display:flex;justify-content:space-between;gap:7px;border-top:1px solid #a6bfb933;padding-top:10px;color:#6b8074}.allocation-footer b{font-weight:400;color:#263a2e}.allocation-footer i{display:inline-block;width:4px;height:4px;background:#689f87;border-radius:50%;margin-right:4px}.system-layers{display:grid;grid-template-columns:1fr 24px 1fr 24px 1fr;gap:18px;align-items:center}.system-layers article{padding:25px 22px;border:1px solid #dde3e4;border-radius:5px;min-height:180px;background:#fff}.system-layers article>span{font:10px Plex,monospace;color:#9ba6a8}.system-layers h3{font-size:20px;font-weight:400;letter-spacing:-.5px;margin:20px 0 12px}.system-layers p{font-size:12px;line-height:1.7;color:#758185;margin:0}.system-layers>b{font-weight:400;color:#9aa7aa}.calculation-detail{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:38px;border-top:1px solid #dbe2e4;padding-top:30px}.calculation-detail>div>span{font:9px Plex,monospace;color:#98a4a7}.calculation-detail strong{font-size:23px;line-height:1.5;font-weight:400;display:block;letter-spacing:-.5px;margin:15px 0}.calculation-detail b{font-size:30px;font-weight:400;letter-spacing:-1px}.calculation-detail p{font-size:13px;line-height:1.9;color:#758185;margin:0}.research-export .figure-art,.journey-export .figure-art,.flow-export .figure-art{border:1px solid #e0e6e8;background:#fff;overflow-x:auto}.research-export img{min-width:1000px}.journey-export img,.flow-export img{min-width:1200px}.annotated-product{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,1fr);align-items:center;gap:5%;padding:48px 5%;margin-top:30px;background:#e8edef;border:1px solid #dbe2e5;border-radius:5px}.annotated-product:nth-child(even){background:#e9edeb}.annotation-copy{max-width:400px}.annotation-index{font:10px Plex,monospace;color:#99a6ad}.annotation-copy h3{font-size:26px;line-height:1.3;font-weight:400;letter-spacing:-.7px;margin:21px 0 15px}.annotation-copy>p{font-size:14px;line-height:1.8;color:#77838a;margin:0 0 32px}.blue-annotation{display:grid;grid-template-columns:24px 1fr;gap:12px;margin:25px 0;color:#237bed}.blue-annotation>b{font-weight:400;font-size:27px;line-height:1}.blue-annotation p{font-size:12px;line-height:1.8;margin:0;color:#237bed}.annotation-screen{position:relative;display:flex;justify-content:center;padding:8px 0}.annotation-screen:before{content:'';position:absolute;width:70%;height:45%;left:15%;top:22%;background:radial-gradient(ellipse,#c0dfcd90,transparent 70%);filter:blur(20px)}.annotation-pin{position:absolute;width:24px;height:24px;background:#fff;border:1px solid #237bed;border-radius:50%;font:11px/1 Inter,Arial,sans-serif;color:#237bed;display:grid;place-items:center;box-shadow:0 0 0 5px #237bed15}.pin-a{left:16%;top:31%}.pin-b{right:15%;top:65%}.prototype-viewer{border:1px solid #dce3e5;border-radius:5px;overflow:hidden;background:#f0f3f1}.prototype-toolbar{padding:17px 22px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #dce3e5;background:#f9faf9}.prototype-toolbar [role=tablist]{display:flex;gap:5px;padding:4px;border:1px solid #e1e5e2;border-radius:30px}.prototype-toolbar [role=tab]{border:0;background:none;border-radius:25px;padding:10px 14px;font:10px Inter,Arial,sans-serif;color:#88968e;cursor:pointer}.prototype-toolbar [aria-selected=true]{background:#fff;color:#233d2d;box-shadow:0 1px 5px #1525190c}.motion-toggle{border:0;background:none;color:#718379;font:10px Inter,Arial,sans-serif;cursor:pointer}.demo-stage{padding:55px 8%;display:grid;grid-template-columns:1fr 252px;gap:9%;align-items:center;background:radial-gradient(ellipse at 80% 50%,#c9e2d3,#f0f3ef 65%);min-height:670px}.demo-side>span{font:9px Plex,monospace;letter-spacing:.07em;color:#8a9b8d}.demo-side h3{font-size:36px;line-height:1.15;letter-spacing:-1px;font-weight:400;margin:30px 0 20px;max-width:290px}.demo-side p{font-size:13px;line-height:1.8;color:#819187;max-width:280px}.demo-progress{display:flex;gap:5px;margin-top:35px}.demo-progress i{width:25px;height:3px;background:#d4dfd6;border-radius:5px}.demo-progress .active{background:#6f9a80}.demo-phone{position:relative}.prototype-cursor{position:absolute;width:25px;z-index:4;left:80%;top:46%;transition:left .9s cubic-bezier(.4,0,.2,1),top .9s cubic-bezier(.4,0,.2,1);pointer-events:none}.prototype-cursor svg{width:25px;display:block;filter:drop-shadow(0 2px 3px #173b2640)}.prototype-cursor em{font:8px Inter,Arial,sans-serif;color:white;background:#416f55;padding:4px 6px;border-radius:4px;position:absolute;top:27px;left:16px;font-style:normal;white-space:nowrap}.prototype-cursor.is-clicking{filter:drop-shadow(0 0 9px #60b385)}.prototype-viewer iframe{width:100%;height:910px;border:0;display:block;background:#f0f3ef}.prototype-viewer [hidden]{display:none!important}
@media(min-width:1600px){.opening-product .device-wrap{--device-scale:.45}.component-allocation .r-ring{width:230px;height:230px;margin-top:22px}.component-tabs{font-size:10px}.component-allocation{padding:26px}.allocation-footer{font-size:10px}.component-allocation .r-ring-copy strong{font-size:32px}}
@media(max-width:1050px){.opening-product .device-wrap{--device-scale:.25}.component-allocation{padding:12px}.component-tabs{font-size:6px}.component-allocation .r-ring{width:130px;height:130px;margin-top:4px}.component-allocation .r-ring-copy strong{font-size:20px}.allocation-footer{font-size:6px;padding-top:5px}.annotated-product{grid-template-columns:1fr 252px;padding:35px 25px;gap:25px}.annotation-copy h3{font-size:23px}.blue-annotation{gap:8px}.blue-annotation p{font-size:11px}.demo-stage{padding:40px 5%;gap:30px}.demo-side h3{font-size:28px}}
@media(max-width:700px){.project-bjak .case-section{scroll-margin-top:140px}.contents button{font-size:9px;white-space:nowrap;width:auto}.project-bjak .contents nav{display:flex;gap:23px}.opening-product .device-wrap{--device-scale:.3}.component-allocation .r-ring{width:170px;height:170px;margin-top:9px}.component-tabs{font-size:8px}.allocation-footer{font-size:7px}.system-layers{grid-template-columns:1fr}.system-layers>b{text-align:center;transform:rotate(90deg)}.system-layers article{min-height:0;padding:22px}.system-layers h3{margin-top:12px}.calculation-detail{grid-template-columns:1fr;gap:24px}.calculation-detail strong{font-size:21px}.annotated-product{grid-template-columns:1fr;padding:30px 24px;gap:30px}.annotation-copy{max-width:none}.annotation-copy>p{margin-bottom:24px}.blue-annotation p{font-size:12px}.annotation-copy h3{font-size:26px}.annotation-screen{padding-bottom:8px}.pin-a{left:10%;}.pin-b{right:10%}.prototype-toolbar{padding:12px;flex-wrap:wrap;gap:10px}.prototype-toolbar [role=tab]{font-size:9px;padding:10px}.demo-stage{display:flex;flex-direction:column;gap:30px;padding:32px 25px}.demo-side{width:100%}.demo-side h3{font-size:29px;max-width:100%;margin:20px 0 13px}.demo-side p{max-width:100%;font-size:12px}.demo-progress{margin-top:20px}.prototype-viewer iframe{height:1090px}.project-bjak .decision-grid{grid-template-columns:1fr}.research-export img{min-width:1100px}}
@media(prefers-reduced-motion:reduce){.prototype-cursor{transition:none}}
.annotated-product{position:relative}.annotation-leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.annotation-leaders path{stroke:#237bed;stroke-width:1.3;fill:none}.annotation-leaders circle{fill:#e8edef;stroke:#237bed;stroke-width:1.3}@media(max-width:700px){.annotation-leaders{display:none}}

#runway-walkthrough{display:block;width:100%;height:auto;aspect-ratio:16/11;background:#e6eee7}
.project-bjak .research-export .figure-art,.project-bjak .journey-export .figure-art,.project-bjak .flow-export .figure-art{padding:0!important}

/* A single straight card, using the same mint backdrop as the phones. */
.opening-component .component-allocation{background:#f3f8f5f2;box-shadow:0 12px 32px #264c3615;border-color:#ffffffa0;transform:none}
/* Wide exports must begin at the left edge, never centred beyond the scroll origin. */
.project-bjak .case-content{min-width:0}
.project-bjak [data-diagram]{width:100%;min-width:0}
.project-bjak [data-diagram] .figure-art{display:block!important;overflow:auto;padding:0!important;max-width:100%;scrollbar-width:thin}
.project-bjak [data-diagram] .figure-art img{display:block;width:100%;min-width:0;max-width:none;height:auto}
.project-bjak [data-diagram].is-enlarged .figure-art img{width:max(100%,1500px);min-width:1500px}
.diagram-tools{display:flex;justify-content:flex-end;margin-bottom:10px}
.diagram-tools button{border:1px solid #d3ddd7;border-radius:6px;background:#fff;padding:9px 14px;color:#395245;font:12px Inter,Arial,sans-serif;cursor:pointer}
.journey-steps{list-style:none;margin:30px 0 0;padding:0;max-width:850px}
.journey-steps>li{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:24px;padding-bottom:32px}
.journey-steps>li:not(:last-child):before{content:'';position:absolute;left:21px;top:44px;bottom:0;width:1px;background:#c6d8cd}
.journey-number{width:44px;height:44px;display:grid;place-items:center;border:1px solid #c6d8cd;border-radius:50%;background:#edf4ef;color:#395745;font:12px Inter,Arial,sans-serif}
.journey-steps>li>div{border:1px solid #dce4de;border-radius:10px;padding:25px 28px;background:#fafcfb}
.journey-steps h3{margin:0;font-size:22px;font-weight:500;letter-spacing:-.4px}
.journey-steps p{font-size:14px;line-height:1.75;color:#65766c;margin:12px 0 0}
.journey-steps .journey-question{font-size:17px;color:#2d4638}
.journey-outcome{border-top:1px solid #dfe8e2;margin-top:20px;padding-top:16px}
.journey-outcome>span{font-size:11px;color:#708478}
.journey-outcome p{margin-top:6px;color:#314a3c}
.journey-alternatives{margin-top:14px;max-width:1000px}
.journey-alternatives h3{font-size:22px;font-weight:400;margin-bottom:22px}
.journey-alternatives>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.journey-alternatives article{border-top:2px solid #b7cdbf;padding-top:18px}
.journey-alternatives h4{font-size:15px;font-weight:500;margin:0 0 10px}
.journey-alternatives p{font-size:13px;line-height:1.8;color:#718078;margin:0}
.annotation-screen .device-wrap{isolation:isolate}
.annotation-screen .annotation-pin{z-index:3;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 0 3px #237bed1a}
.annotation-focus{position:absolute;z-index:2;border:1px solid #237bed;border-radius:5px;pointer-events:none;box-sizing:border-box}
.blue-annotation>b{width:24px;height:24px;border:1px solid currentColor;border-radius:50%;font:12px/1 Inter,Arial,sans-serif;display:grid;place-items:center}
@media(max-width:700px){.journey-steps>li{grid-template-columns:32px minmax(0,1fr);gap:12px;padding-bottom:22px}.journey-number{width:32px;height:32px;font-size:10px}.journey-steps>li:not(:last-child):before{left:15px;top:32px}.journey-steps>li>div{padding:20px 18px}.journey-steps h3{font-size:20px}.journey-steps p{font-size:13px}.journey-alternatives>div{grid-template-columns:1fr}.annotation-pin{width:21px;height:21px}}

/* High resolution captures isolate product screens from editorial styles. */
.runway-device.runway-capture{border:0;background:#171a18;box-shadow:0 14px 30px #06170d20}
.runway-screen-image{display:block;width:100%;height:100%;object-fit:contain;border:0;max-width:none}
.project-bjak #prototype .prototype-viewer{max-width:284px;margin:28px auto 0;padding:24px;background:#d9e8de;border:0;border-radius:18px}
.project-bjak #runway-walkthrough{display:block;width:100%;height:auto;max-height:none;aspect-ratio:5/11;object-fit:contain;border-radius:24px;background:transparent}
.annotation-focus,.annotation-pin,.annotation-leaders{display:none!important}
@media(max-width:600px){.project-bjak #prototype .prototype-viewer{max-width:288px;padding:16px}}


/* One neutral surface for the six interface studies. */
.project-bjak #design .annotated-product{background:#f3f4f5!important}
.project-bjak .annotation-screen::before{content:none}
.project-bjak .annotation-focus,.project-bjak .annotation-pin{display:none!important}
@media(min-width:701px){.project-bjak .annotation-leaders{display:block!important;z-index:2}.project-bjak .annotation-leaders path{stroke:#0d99ff}.project-bjak .annotation-leaders circle{fill:#fff;stroke:#0d99ff}}
.project-bjak #delivery>p{color:var(--case-muted);font-size:15px;line-height:1.8;max-width:850px}
.project-bjak #prototype .prototype-viewer{width:100%;max-width:880px;margin:30px auto 0;padding:0;overflow:hidden;border:0;border-radius:12px;background:#e0ece4}
.project-bjak #prototype #runway-walkthrough{display:block;width:100%;height:auto;aspect-ratio:1280/900;max-height:none;object-fit:contain;border-radius:0;background:#e0ece4}
@media(max-width:700px){.project-bjak #prototype .prototype-viewer{max-width:100%;padding:0}.project-bjak #delivery>p{font-size:13px}}
