.clientBanner .description{line-height:1.2;font-family:var(--font-secondary);color:var(--colour-charcoal);margin:0}.navigationAlert-isShowing .clientBanner{padding-top:165px}@media(min-width: 1050px){.navigationAlert-isShowing .clientBanner{padding-top:175px}}.clientBanner{background-color:var(--colour-surface-light);position:relative;padding-top:125px;overflow:hidden}@media(min-width: 1050px){.clientBanner{padding-top:135px}}.clientBanner .container{max-width:1300px;margin:0 auto;padding:0 5%;box-sizing:content-box}.clientBanner .container.small{max-width:860px}@media(min-width: 768px){.clientBanner .container{padding:0 8%}}.clientBanner .container{position:relative}@media(min-width: 1050px){.clientBanner .row{position:relative;display:flex}}.clientBanner .modal{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);transition:opacity .2s ease,visibility .2s ease;position:fixed;width:1000px;max-width:90vw;opacity:0;visibility:hidden;z-index:20020;aspect-ratio:373/197}@media(min-width: 768px){.clientBanner .modal{max-width:80vw}}@media(min-width: 1050px){.clientBanner .modal{max-width:60vw}}.clientBanner .modal.pc-isActive{transition:opacity .4s ease,visibility .4s ease;opacity:1;transition-delay:.2s;visibility:visible}.clientBanner .modal .closeButton{position:absolute;width:20px;height:20px;top:-26px;right:-3px;cursor:pointer;outline-offset:2px}.clientBanner .modal .closeButton:focus-visible{outline:1px solid var(--colour-white)}.clientBanner .modal .closeButton:before,.clientBanner .modal .closeButton:after{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);content:"";width:20px;height:3px;background:var(--colour-white);display:block;-webkit-transform-origin:70% 50%;transform-origin:50% 50%;transition:all .2s ease}.clientBanner .modal .closeButton:before{-webkit-transform:translate(-51%, -50%) rotate(-45deg);transform:translate(-51%, -50%) rotate(-45deg)}.clientBanner .modal .closeButton:after{-webkit-transform:translate(-51%, -50%) rotate(45deg);transform:translate(-51%, -50%) rotate(45deg)}.clientBanner .modal .content,.clientBanner .modal iframe{width:100%;height:100%}.clientBanner .back{display:inline-flex;align-items:center;margin-bottom:24px;font-size:15px;font-weight:700;color:var(--colour-primary);text-decoration-line:underline;text-decoration-color:rgba(0,0,0,0);transition:text-decoration .2s ease}@media(min-width: 1050px){.clientBanner .back{margin-bottom:12px}}.clientBanner .back:hover,.clientBanner .back:focus-visible{text-decoration-color:var(--colour-primary)}.clientBanner .back svg{margin-right:6px;fill:var(--colour-primary)}@media(min-width: 1050px){.clientBanner .row{min-height:480px}}@media(min-width: 1230px){.clientBanner .row{min-height:570px}}@media(min-width: 1420px){.clientBanner .row{min-height:545px}}@media(min-width: 1700px){.clientBanner .row{min-height:625px}}.clientBanner .col:first-child{position:relative;padding:0 80px 40px 0;min-height:285px}@media(min-width: 1050px){.clientBanner .col:first-child{position:static;flex:0 0 58%;padding:20px 80px 80px 0;display:flex;align-items:center}}@media(min-width: 1230px){.clientBanner .col:first-child{padding:20px 170px 100px 0}}@media(min-width: 1050px){.clientBanner .col:last-child{flex:0 0 42%;max-width:42%}}.clientBanner .logo{max-width:160px;margin-bottom:32px}@media(min-width: 1050px){.clientBanner .logo{max-width:190px;margin-bottom:50px}}.clientBanner .logo img{max-height:100%}.clientBanner .tag{display:flex;align-items:flex-start;margin-bottom:24px;font-family:var(--font-secondary);font-size:1.5rem;font-weight:400;text-transform:uppercase}.clientBanner .color{flex:0 0 12px;margin-right:6px;background-image:url("/assets/images/icons/pixelSquare.svg");width:12px;height:12px;background-size:cover;background-repeat:no-repeat}.clientBanner .title{line-height:1.2;font-family:var(--font-body);margin:0;font-weight:600}.clientBanner .title+p,.clientBanner .title+.preamble{margin-top:15px}@media(min-width: 1230px){.clientBanner .title+p,.clientBanner .title+.preamble{margin-top:20px}}.clientBanner .title{font-size:2.8rem}@media(min-width: 768px){.clientBanner .title{font-size:3.2rem}}@media(min-width: 1230px){.clientBanner .title{font-size:3.7rem}}@media(min-width: 1700px){.clientBanner .title{font-size:4.5rem}}.clientBanner .description{font-size:1.8rem}@media(min-width: 768px){.clientBanner .description{font-size:2.1rem}}@media(min-width: 1420px){.clientBanner .description{font-size:2.6rem}}.clientBanner .lottie{position:absolute;left:calc(95vw - 60px);bottom:0;z-index:10;width:60px;height:285px;overflow:hidden}@media(min-width: 768px){.clientBanner .lottie{left:calc(92vw - 60px)}}@media(min-width: 1050px){.clientBanner .lottie{right:auto;left:calc(50vw + 50% - 120px);width:120px;height:510px}}@media(min-width: 1230px){.clientBanner .lottie{height:600px}}@media(min-width: 1420px){.clientBanner .lottie{height:570px}}@media(min-width: 1700px){.clientBanner .lottie{height:656px}}.clientBanner .lottie svg{min-width:60px;min-height:345px}@media(min-width: 1050px){.clientBanner .lottie svg{min-width:120px;min-height:690px}}.clientBanner .preview{display:block;position:relative;left:50%;width:100vw;transform:translateX(-50%);overflow:hidden;height:100%}@media(min-width: 1050px){.clientBanner .preview{left:0;width:calc(50vw - 19%);transform:none}}.clientBanner .preview img{width:100%;height:100%;object-fit:cover}.clientBanner .play:focus-visible{outline:var(--colour-primary) 1px solid;outline-offset:2px}.clientBanner .play{position:absolute;left:0;bottom:0;display:flex;align-items:center;justify-content:center;width:100px;height:100px;background:var(--colour-primary);transform:scale(0.75);transform-origin:0 100%;cursor:pointer;transition:background .4s ease}@media(min-width: 768px){.clientBanner .play{transform:scale(1)}}.clientBanner .play:hover{background:var(--colour-primaryHover)}.clientBanner .play:after{content:"";position:absolute;top:calc(50% - 22px);left:calc(50% - 22px);width:44px;height:44px;border:2px solid var(--colour-white);border-radius:50%}.clientBanner .bottom{background:var(--colour-webFabric)}.clientBanner .list{font-size:1.4rem;padding:38px 0 6px}@media(min-width: 768px){.clientBanner .list{position:relative;display:flex;flex-wrap:wrap;padding:56px 0 16px}}@media(min-width: 1050px){.clientBanner .list{position:relative;z-index:2;flex-wrap:nowrap;padding:42px 0 36px;background:rgba(0,0,0,0);font-size:1.8rem}.clientBanner .list .listWhite{color:var(--colour-white)}.clientBanner .list:before{content:"";position:absolute;top:0;right:42%;z-index:-1;width:100vw;height:100%;background:var(--colour-deepBlue)}}.clientBanner .list li{margin-bottom:32px}@media(min-width: 768px){.clientBanner .list li{flex:0 0 50%;margin-bottom:40px}}@media(min-width: 1050px){.clientBanner .list li{margin:0 5% 0 0}.clientBanner .list li:nth-child(1){flex:0 0 12%}.clientBanner .list li:nth-child(2){flex:0 0 36%;margin-right:13%}.clientBanner .list li:nth-child(3){flex:0 0 14%}.clientBanner .list li:nth-child(4){flex:0 0 15%;margin:0}}.clientBanner .caption{display:flex;align-items:center;margin-bottom:8px;font-size:1.1rem;text-transform:uppercase;position:relative}@media(min-width: 1050px){.clientBanner .caption{font-size:1.5rem}}.clientBanner .caption picture,.clientBanner .caption svg{margin:-1px 6px 0 0}.clientBanner .caption.captionUseCases,.clientBanner .caption.captionOperatingRegions{padding-left:25px}.clientBanner .caption.captionUseCases:before,.clientBanner .caption.captionOperatingRegions:before{content:"";background-repeat:no-repeat;width:16px;height:16px;position:absolute;left:0px;top:0px}.clientBanner .caption.captionUseCases::before{background-image:url("/assets/images/icons/comment.svg")}@media(min-width: 1050px){.clientBanner .caption.captionUseCases::before{background-image:url("/assets/images/icons/commentWhite.svg")}}.clientBanner .caption.captionOperatingRegions::before{background-image:url("/assets/images/icons/globe.svg")}@media(min-width: 1050px){.clientBanner .caption.captionOperatingRegions::before{background-image:url("/assets/images/icons/globeWhite.svg")}}.clientBanner .inner,.clientBanner .preview,.clientBanner .bottom{clip-path:polygon(0 0, 0 0, 0 100%, 0 100%);transition:clip-path .8s ease}.clientBanner .inner.active,.clientBanner .preview.active,.clientBanner .bottom.active{clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%)}.clientBanner .preview{transition-delay:.8s}.clientBanner .bottom{transition-delay:1.6s}@media(min-width: 1050px){.clientBanner .bottom{transition-duration:1.6s}}
