/* One timeline; one phase at a time. */
html{scroll-padding-top:26px}
.opening{grid-template-columns:1.1fr 1fr;gap:55px;padding-block:58px 70px;min-height:620px}
.opening h1{margin:0 0 32px;line-height:1.08;letter-spacing:-.065em}
.opening h1 .marked-title{color:#647c2f;position:relative;z-index:0;box-decoration-break:clone;-webkit-box-decoration-break:clone;background:linear-gradient(177deg,transparent 73%,#d1f663 74%,#d1f663 93%,transparent 95%);padding-inline:4px;margin-left:-4px}
.opening h1 br:nth-child(2){display:initial}
.opening-lead{line-height:1.75;max-width:495px}
.opening-projects{position:relative;min-height:440px;isolation:isolate;border-radius:26px;background:#e9eddf;overflow:hidden}
.project-orbit{position:absolute;width:340px;height:340px;border:1px solid #bdcbaa;border-radius:50%;left:50%;top:45%;transform:translate(-50%,-50%)}
.project-orbit:before{content:'';position:absolute;inset:24px;border:1px dashed #c9d4bb;border-radius:50%}
.opening-phone{position:absolute;margin:0;width:145px;filter:drop-shadow(4px 15px 11px #1c2c281a);transition:translate .4s var(--ease)}
.opening-phone:hover{translate:0 -10px}
.opening-phone img{width:100%;height:310px;object-fit:cover;object-position:top;border:4px solid #fff;border-radius:18px;background:white}
.opening-phone figcaption{font-weight:500;letter-spacing:.07em;padding-top:12px;text-align:center;color:#53674b}
.phone-app{left:7%;top:54px;transform:rotate(-10deg);z-index:1}
.phone-wpay{left:37%;top:30px;transform:rotate(3deg);z-index:2}
.opening-note{position:absolute;bottom:19px;left:0;right:0;text-align:center;color:#68765d}
.chronology{padding-top:0;padding-bottom:65px;scroll-margin-top:22px}
.chronology-intro{padding:25px 0 32px;align-items:center}
.chronology-intro h2{}.chronology-intro p{}
.chronology-layout{grid-template-columns:230px minmax(0,1fr);gap:48px}
.phase-nav-wrap{position:sticky;top:24px;align-self:start;z-index:10}
.phase-nav{display:flex;flex-direction:column;position:relative;gap:0}
.phase-tab{display:flex;align-items:center;gap:15px;text-align:left;padding:20px 10px 20px 0;background:transparent;position:relative;width:100%;isolation:isolate}
.phase-tab:before{content:'';position:absolute;left:15px;top:0;bottom:0;width:1px;background:#cbd3c2;z-index:-1}
.phase-tab:first-child:before{top:50%}.phase-tab:last-child:before{bottom:50%}
.phase-dot{border:1px solid #b7c3aa;width:31px;height:31px;flex-shrink:0;border-radius:50%;background:var(--paper);display:grid;place-items:center;color:#7a876b;transition:background .2s,color .2s,box-shadow .2s}
.phase-label{display:block}.phase-label time{color:#7a876c;display:block;margin-bottom:5px;letter-spacing:.035em}
.phase-label strong{display:block;line-height:1.4;font-weight:500;color:#64705b;transition:color .2s}
.phase-label small{display:block;color:#8a947d;margin-top:4px;line-height:1.5}
.phase-tab.active .phase-dot{background:var(--ink);color:var(--lime);border-color:var(--ink);box-shadow:0 0 0 5px #e6ebdc}
.phase-tab.active strong{color:var(--ink)}.phase-tab.active time{color:#547026}.phase-tab:hover .phase-dot{background:var(--lime);color:var(--ink)}
.chapters{border:0;padding-left:0;min-width:0}.chapter{padding:3px 0 0;scroll-margin-top:25px}.chapter[hidden]{display:none!important}
.chapter:not([hidden]) .chapter-content{animation:phase-enter .3s var(--ease) both}
@keyframes phase-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.chapter-date{margin-bottom:20px;min-height:20px}.chapter-date p{}.chapter-content>h2{line-height:1.12}
.chapter-lead{max-width:750px;margin-top:20px;line-height:1.8}
.technical-roles{gap:25px;margin-top:36px}.technical-roles time{}.technical-roles h3{}.technical-roles p{}
.personal-chapter .chapter-content{border:0;padding-top:0;display:block}.personal-chapter .chapter-content>h2{}.personal-chapter .chapter-content>p:not(.eyebrow){max-width:580px;line-height:1.85;margin-top:23px}
.agency-panel{margin-top:27px}.agency-panel h3{}.agency-panel p{}.agency-panel .case-link{}.agency-accounts>p{}
.ms-chapter .chapter-content{padding:30px 26px 26px}.ms-chapter h2{}.ms-chapter .chapter-lead{}.ms-chapter .chapter-content>.eyebrow{margin-bottom:16px}
.ecosystem{margin-top:24px;grid-template-columns:1fr 28px 1fr 28px 1fr}.ecosystem-node{padding:15px 13px}.ecosystem-node>span{}.ecosystem-node h3{margin-top:8px}.ecosystem-node p{margin-top:7px}.ecosystem-connection>span{display:none}.ecosystem-connection b{}
.ms-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:24px}.ms-project{display:flex;flex-direction:column;margin:0;border-radius:13px}
.ms-project-copy{padding:20px 17px;order:2;display:flex;flex-direction:column;flex:1}
.delivery-line{margin-bottom:15px;padding-bottom:12px;min-height:47px}.delivery-line span:first-child{}
.ms-project h3{}.project-purpose{margin-top:10px;min-height:40px}.ms-project-copy>p:not(.project-purpose){line-height:1.75;margin-top:12px;flex:1}
.ms-comparison,.ms-payment-visual,.ms-bo-visual{order:1;height:240px;min-height:240px;padding:19px 14px;overflow:hidden;flex-shrink:0}
.ms-comparison .comparison{height:203px;width:94px;border-radius:15px;border-width:3px;box-shadow:5px 7px 0 #74876118}.ms-comparison{gap:8px}.ms-comparison>p{}.comparison-line>span{width:27px;height:27px;}.comparison-label{padding:2px 5px;bottom:7px}.label-before{left:3px}.label-after{right:3px}
.ms-payment-visual{display:flex;align-items:flex-start;justify-content:center}.ms-payment-visual>img{position:relative;top:6px;bottom:auto;right:auto;width:111px;transform:rotate(7deg);border:3px solid white;border-radius:15px;box-shadow:7px 10px 20px #1b2b2120}
.ms-bo-visual{justify-content:center;gap:18px;padding-left:15px}.ms-bo-visual>img{width:310px;border-width:3px}.ms-bo-visual>span{line-height:1.7;display:block}
.case-link,.agency-panel .case-link,.ms-project .case-link{border:1px solid #b5c4a4;background:#e4ecd7;color:#243b24;border-radius:10px;line-height:1.45;padding:12px 15px;min-height:48px;width:fit-content;max-width:100%;gap:18px;transition:background .2s,box-shadow .2s,transform .2s}
.case-link:hover{background:#d1f663;border-color:#aec65c;box-shadow:0 4px 12px #253a2010;transform:translateY(-2px)}.case-link span{}
.ms-project .case-link{gap:8px;padding:11px 12px;margin-top:20px;width:100%}.ms-project .case-link span{flex-shrink:0}
.phase-pagination{display:flex;align-items:center;gap:20px;border-top:1px solid #d5dccb;margin-top:32px;padding-top:20px;min-height:62px}
.phase-pagination>button{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;background:none;color:#485a3c;text-align:left;min-height:42px;padding:7px 0;transition:color .2s}
.phase-pagination>button:hover{color:#182622;text-decoration:underline;text-underline-offset:4px}.phase-pagination [data-phase-next]{margin-left:auto}.phase-pagination [data-phase-prev]{max-width:42%}.phase-pagination .phase-position{color:#88957a;margin-left:auto;white-space:nowrap}.phase-pagination [data-phase-next]+.phase-position{margin-left:0}
.phase-pagination>button>span[aria-hidden]{}
.contact-section{padding-top:43px}.contact-grid h2{}
@media(min-width:1600px){.chronology-layout{grid-template-columns:240px minmax(0,1fr);gap:55px}.ms-project-copy{padding:23px}.opening-phone{width:168px}.opening-phone img{height:350px}.opening-projects{min-height:480px}.ms-comparison .comparison{width:94px;height:203px}.ms-payment-visual>img{width:111px}}
@media(max-width:1100px){.opening{gap:32px;grid-template-columns:1.1fr 1fr}.opening h1{}.opening-projects{min-height:410px}.opening-phone{width:128px}.opening-phone img{height:275px}.phone-app{left:4%;top:60px}.phone-wpay{left:34%;top:39px}.chronology-layout{grid-template-columns:195px minmax(0,1fr);gap:28px}.phase-tab{gap:11px}.phase-label strong{}.phase-label small{}.ms-chapter .chapter-content{padding:25px 20px 20px}.ms-projects{grid-template-columns:1fr}.ms-project{display:grid;grid-template-columns:1fr 190px}.ms-project-copy{order:1;padding:23px}.ms-comparison,.ms-payment-visual,.ms-bo-visual{order:2;height:100%;min-height:310px;padding:20px 15px}.ms-comparison .comparison{width:122px;height:265px}.ms-project h3{}.project-purpose{min-height:0;}.ms-project .case-link{width:fit-content}.ms-payment-visual>img{width:140px;top:25px}.ms-bo-visual>img{width:300px}.ecosystem-node h3{}.ecosystem-node p{}.ecosystem-node>span{}}
@media(max-width:800px){html{scroll-padding-top:15px}.opening{grid-template-columns:1fr;gap:31px;padding-block:35px 36px;min-height:0}.opening h1{line-height:1.1;margin-bottom:25px}.opening h1 br:nth-child(2){display:initial}.opening-lead{max-width:550px}.opening-actions{margin-top:24px}.opening-projects{min-height:350px;max-width:600px;width:100%}.opening-phone{width:126px}.opening-phone img{height:268px;border-radius:16px}.phone-app{left:9%;top:32px}.phone-wpay{left:39%;top:18px}.opening-note{bottom:12px}.project-orbit{width:270px;height:270px}.chronology{padding-bottom:38px}.chronology-intro{display:flex;padding:22px 0 20px;gap:15px}.chronology-intro h2{}.chronology-intro>p{margin:0;}.chronology-layout{display:block}.phase-nav-wrap{top:0;margin-inline:-20px;padding:12px 16px 10px;background:#f5f4eff7;border-bottom:1px solid #d8dfce;backdrop-filter:blur(12px);z-index:10}.phase-nav{flex-direction:row;display:grid;grid-template-columns:repeat(var(--phase-count,4),minmax(0,1fr));gap:3px}.phase-tab{flex-direction:column;padding:5px 1px 3px;gap:7px;align-items:center;text-align:center}.phase-tab:before{top:19px!important;left:-50%;right:50%;height:1px;width:auto;bottom:auto!important}.phase-tab:first-child:before{display:none}.phase-dot{height:28px;width:28px;}.phase-label time{letter-spacing:-.03em;margin-bottom:4px;white-space:nowrap}.phase-label strong{line-height:1.35;min-height:24px}.phase-label small{display:none}.phase-tab.active .phase-dot{box-shadow:0 0 0 3px #e6ebdc}.chapters{padding:25px 0 0;margin:0;border:0}.chapter{padding:0;scroll-margin-top:0}.chapter-date{margin-bottom:17px}.chapter-date>p{}.chapter-date>small{}.chapter-content>h2{}.chapter-lead{margin-top:18px}.technical-roles{margin-top:25px;gap:18px}.technical-roles h3{}.technical-roles p{}.personal-chapter .chapter-content>h2{}.personal-chapter .chapter-content>p:not(.eyebrow){margin-top:20px}.agency-panel{padding:23px 21px}.agency-panel h3{}.agency-panel p{}.agency-accounts{grid-template-columns:1fr 1fr}.agency-accounts strong{}.agency-accounts span{}.agency-accounts>p{}.ms-chapter .chapter-content{margin:0;padding:25px 17px 17px}.ms-chapter h2{}.ms-chapter .chapter-lead{}.ecosystem{grid-template-columns:1fr;margin-top:23px}.ecosystem-node{padding:15px 17px}.ecosystem-node h3{}.ecosystem-node p{}.ecosystem-node>span{}.ecosystem-connection{padding:7px}.ecosystem-connection>b{}.ms-projects{gap:16px;margin-top:22px}.ms-project{display:flex;flex-direction:column}.ms-project-copy{order:2;padding:24px 20px}.ms-comparison,.ms-payment-visual,.ms-bo-visual{order:1;height:240px;min-height:240px;padding:18px}.ms-comparison .comparison{height:203px;width:94px;margin:0}.ms-comparison{gap:8px}.ms-payment-visual{padding-top:16px}.ms-payment-visual>img{top:0;width:130px}.ms-bo-visual{align-items:center}.ms-bo-visual>img{width:330px;max-width:110%}.ms-bo-visual>span{}.ms-project h3{}.delivery-line{min-height:0;}.delivery-line span:first-child{}.project-purpose{}.ms-project-copy>p:not(.project-purpose){}.ms-project .case-link{width:100%;padding:12px 14px}.case-link,.agency-panel .case-link{}.phase-pagination{gap:12px;margin-top:27px;padding-top:15px}.phase-pagination>button{gap:8px;line-height:1.5;max-width:40%}.phase-pagination .phase-position{}.phase-pagination>button>span[aria-hidden]{}.contact-grid h2{}}
@media(max-width:420px){.opening h1{}.opening-phone{width:113px}.opening-phone img{height:241px}.opening-projects{min-height:320px}.phone-app{left:3%;top:32px}.phone-wpay{left:34%;top:16px}.opening-note{}.phase-label strong{}.phase-label time{}.phase-nav-wrap{padding-inline:10px}.phase-tab{gap:6px}.phase-pagination>button{}.ms-chapter h2{}}
@media(prefers-reduced-motion:reduce){.chapter:not([hidden]) .chapter-content{animation:none}}
@media print{[role=tabpanel][hidden]{display:block!important}.phase-nav-wrap,.phase-pagination{display:none}.chronology-layout{display:block}.opening-projects{display:none}.opening{display:block}}
@media(max-width:800px){.phase-label strong{line-height:1.4}.phase-label time{}.phase-dot{width:30px;height:30px;}.phase-tab:before{top:20px!important}.phase-label strong{min-height:28px}.opening-note{display:none}}
@media(max-width:420px){.phase-label strong{}.phase-label time{}.phase-nav-wrap{padding-inline:11px}}
/* Language controls share the navigation's quiet, compact styling. */
.opening h1,.opening h1 .marked-title{color:#182622}
.header-actions{display:flex;align-items:center;gap:23px}
.language-switch{display:inline-flex;align-items:center;gap:1px;flex-shrink:0;padding:3px;border:1px solid #cbd3c2;border-radius:100px;background:#f5f4ef;color:#6c7962}
.language-switch button{background:transparent;border-radius:100px;padding:7px 10px;line-height:1.2;min-width:34px;min-height:30px;font-weight:500;transition:background .2s,color .2s}
.language-switch button[aria-pressed=true]{background:#182622;color:#d1f663}
.language-switch button:hover:not([aria-pressed=true]){background:#e4ebd8;color:#182622}
.language-switch>span{color:#9aa58c;padding-inline:1px}
.mobile-language-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 2px 0;color:#d3dfc6}
.case-languages{margin-left:auto;margin-right:20px}.dialog-bar .close-dialog{flex-shrink:0}
html[lang=en-GB] .opening h1{}
@media(max-width:1100px){.header-actions{gap:14px}.desktop-nav{gap:19px}.desktop-nav a{}}
@media(max-width:800px){.header-actions{gap:11px}.language-switch{padding:2px}.language-switch button{min-width:30px;padding:7px 8px;}.language-switch>span{}.case-languages{margin-right:12px}.dialog-bar{gap:10px}.dialog-bar #case-counter{max-width:90px;line-height:1.4}.dialog-bar .wordmark{}html[lang=en-GB] .opening h1{}}
@media(max-width:420px){.header-actions{gap:8px}.site-header>.wordmark{}.case-languages{margin-right:4px}.dialog-bar{padding-inline:13px;gap:7px}.dialog-bar .close-dialog>span{display:none}.dialog-bar #case-counter{max-width:84px}.case-languages button{padding:6px 7px;min-width:29px}.dialog-bar .wordmark{}html[lang=en-GB] .opening h1{}}
/* The agency is the subject; client accounts are supporting examples. */
.agency-context{line-height:1.85;max-width:750px;color:#56614f;margin-top:20px}
.agency-examples{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px;max-width:750px}
.agency-account{display:flex;align-items:center;gap:15px;border:1px solid #d2dac8;padding:20px;border-radius:13px;background:#edf0e6;transition:background .2s,transform .2s}
.agency-account:hover{background:#e2ebd4;transform:translateY(-2px)}
.agency-account img{width:47px;height:47px;border-radius:50%;object-fit:cover;flex-shrink:0}
.agency-account>span{min-width:0}.agency-account strong{font-weight:500;display:block}.agency-account small{color:#6a785e;display:block;margin-top:4px}.agency-account i{font-style:normal;margin-left:auto}
#creativity .chapter-content>.case-link{margin-top:25px}
/* Each ecosystem node is also the direct entrance to its case. */
.ecosystem-launcher{grid-template-columns:minmax(0,1fr) 25px minmax(0,1fr) 25px minmax(0,1fr);margin-top:30px}
.ecosystem-launcher .ecosystem-node{display:flex;flex-direction:column;gap:0;text-align:left;padding:23px 20px 17px;cursor:pointer;border:1px solid #4b6150;color:#f3f5eb;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s;overflow:hidden}
.ecosystem-launcher .ecosystem-node:hover{transform:translateY(-5px);border-color:#b9d890;box-shadow:0 10px 24px #07190d28}
.ecosystem-launcher .ecosystem-node:focus-visible{outline:3px solid #d1f663;outline-offset:5px}
.ecosystem-launcher .ecosystem-center{color:#182622;background:#d1f663;border-color:#c2e690}
.ecosystem-launcher .node-role{display:block;letter-spacing:.06em;color:#b7cda9;min-height:15px}
.ecosystem-launcher .node-name{display:block;font-family:Arial,Helvetica,sans-serif;font-weight:700;line-height:1.15;letter-spacing:-.04em;margin-top:14px}
.ecosystem-launcher .node-purpose{line-height:1.7;color:#c0cfb9;min-height:67px;margin-top:12px;letter-spacing:0}
.ecosystem-launcher .ecosystem-center .node-role,.ecosystem-launcher .ecosystem-center .node-purpose{color:#405b24}
.ecosystem-launcher .node-preview{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:190px;overflow:hidden;background:#ffffff08;border-radius:9px;margin-top:18px}
.ecosystem-launcher .preview-bo img{width:350px;max-width:none;transform:rotate(-4deg);border:3px solid #fff;border-radius:5px;box-shadow:0 10px 22px #0002}
.ecosystem-launcher .preview-app{background:#b5d952}
.ecosystem-launcher .preview-app img{width:84px;max-width:none;border:3px solid #fff;border-radius:13px;box-shadow:7px 8px 0 #466f1a23;transform:rotate(-5deg);position:relative;top:9px}
.ecosystem-launcher .preview-wpay img{width:95px;max-width:none;border:3px solid #fff;border-radius:12px;box-shadow:8px 12px 20px #0002;transform:rotate(7deg);position:relative;top:32px}
.ecosystem-launcher .node-action{letter-spacing:0;color:#d8e8c9;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px;padding-top:13px;border-top:1px solid #506546;width:100%}
.ecosystem-launcher .node-action i{font-style:normal;line-height:1;transition:transform .2s}
.ecosystem-launcher .ecosystem-node:hover .node-action i{transform:translate(2px,-2px)}
.ecosystem-launcher .ecosystem-center .node-action{color:#253b16;border-color:#91b641}
.story>h2:first-child{margin-top:0}
.story-client-example{border-top:1px solid #d8dfce;margin-top:35px;padding-top:27px}
.story-client-example>h3{font-family:LocalSans,Arial,sans-serif;font-weight:500;line-height:1.35;letter-spacing:-.02em}
.story-client-example>p{line-height:1.8;color:#59694f;max-width:790px;margin-top:15px}
.story-client-example .account-links{margin:20px 0 0}.story-client-example .account-link{padding:19px}.story-client-example .account-link img{width:45px;height:45px}
.story-comparison{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:35px;background:#e6ecdf;border:1px solid #d5dfca;border-radius:17px;padding:30px;margin-top:35px}
.story-comparison h3{line-height:1.15}.story-comparison p{line-height:1.7;color:#64765a;margin-top:16px}
.story-comparison .comparison{height:369px;width:170px;justify-self:center;margin:0}
@media(max-width:1100px){.ecosystem-launcher .ecosystem-node{padding:20px 14px 15px}.ecosystem-launcher .node-name{}.ecosystem-launcher .node-role{}.ecosystem-launcher .node-purpose{min-height:80px}.ecosystem-launcher .node-preview{height:175px}.agency-account{padding:16px;gap:12px}.agency-account strong{}.agency-account img{width:39px;height:39px}}
@media(max-width:800px){.agency-context{line-height:1.8}.agency-examples{gap:12px;margin-top:22px}.agency-account{display:grid;grid-template-columns:1fr 18px;gap:12px;padding:17px}.agency-account img{width:40px;height:40px;grid-column:1;grid-row:1}.agency-account>span{grid-column:1/-1;grid-row:2}.agency-account i{grid-column:2;grid-row:1}.agency-account strong{}.agency-account small{}.ecosystem-launcher{grid-template-columns:1fr;margin-top:25px}.ecosystem-launcher .ecosystem-node{display:grid;grid-template-columns:minmax(0,1fr) 84px;gap:0 18px;padding:22px 19px;min-height:215px}.ecosystem-launcher .node-role{grid-column:1;min-height:0}.ecosystem-launcher .node-name{grid-column:1;margin-top:10px}.ecosystem-launcher .node-purpose{grid-column:1;margin-top:11px;min-height:0;line-height:1.7}.ecosystem-launcher .node-preview{grid-column:2;grid-row:1/5;height:155px;align-self:center;margin:0;overflow:visible;background:transparent}.ecosystem-launcher .preview-bo{overflow:hidden;background:#ffffff08}.ecosystem-launcher .preview-bo img{width:215px;transform:rotate(-6deg)}.ecosystem-launcher .preview-app img{width:70px;top:0;transform:rotate(4deg);border-width:2px;border-radius:11px}.ecosystem-launcher .preview-wpay img{width:70px;top:0;transform:rotate(5deg);border-width:2px;border-radius:10px}.ecosystem-launcher .node-action{grid-column:1;margin-top:17px;padding-top:11px}.ecosystem-launcher .node-action i{}.ecosystem-launcher .ecosystem-connection{padding:10px;min-height:31px}.ecosystem-launcher .ecosystem-connection>b{}.story-client-example>h3{}.story-client-example>p{}.story-client-example .account-link{padding:17px}.story-comparison{padding:24px;gap:24px;grid-template-columns:1fr}.story-comparison h3{}.story-comparison p{margin-top:10px}.story-comparison .comparison{height:369px;width:170px}}
@media(max-width:420px){.ecosystem-launcher .ecosystem-node{grid-template-columns:minmax(0,1fr) 69px;gap:0 13px;padding:20px 16px}.ecosystem-launcher .node-name{}.ecosystem-launcher .node-role{}.ecosystem-launcher .node-purpose{}.ecosystem-launcher .node-action{}.ecosystem-launcher .node-preview{height:148px}.ecosystem-launcher .preview-app img{width:65px}.ecosystem-launcher .preview-wpay img{width:65px}.agency-examples{gap:10px}.agency-account{padding:15px}.agency-account strong{}}
/* Keep linked chapters clear of the pinned timeline on narrow screens. */
@media(max-width:800px){.chapter{scroll-margin-top:125px}}