/* PaymentConnect follows the ServiceConnect component's scroll and hover animation. */
.paymentconnect-page .serviceconnect-page__overview{padding-bottom:95px;background:linear-gradient(180deg,#fff 0,#f7faeb 64%,#f7faeb 100%)}
.paymentconnect-page .sc-graph{margin-top:65px}
.paymentconnect-page .sc-graph__stage{aspect-ratio:897/650}
.paymentconnect-page .sc-graph__brand{left:40.5%;top:39%;width:19%;gap:10px;justify-content:center}
.paymentconnect-page .sc-graph__arrow-group{transform-origin:449px 325px}
.paymentconnect-page .sc-graph__arrows{z-index:0;overflow:visible}
.paymentconnect-page .sc-graph__arrows line{stroke-width:2;stroke-linecap:butt}
.paymentconnect-page .sc-graph__brand{z-index:2}
.paymentconnect-page .sc-node{z-index:1}
.paymentconnect-page__symbol{display:block;width:82px;height:80px;overflow:hidden;position:relative}
.paymentconnect-page__symbol img{position:absolute;top:0;left:0;width:485px!important;height:80px!important;max-width:none!important;object-fit:fill!important}
.paymentconnect-page .sc-node{width:24.5262%}
.paymentconnect-page .pc-node--1{left:7%;top:7.4%;--from-x:128%;--from-y:75%}
.paymentconnect-page .pc-node--2{left:68.5%;top:7.4%;--from-x:-125%;--from-y:75%}
.paymentconnect-page .pc-node--3{left:7%;top:58.7%;--from-x:128%;--from-y:-75%}
.paymentconnect-page .pc-node--4{left:68.5%;top:58.7%;--from-x:-125%;--from-y:-75%}
.paymentconnect-page .sc-node__media img{width:100%;height:100%;top:0;left:0;object-fit:cover}
.paymentconnect-page .sc-node__label{left:12%;right:12%;top:auto;bottom:14%;transform:none;white-space:normal;text-align:center;line-height:1.15}
.paymentconnect-page .sc-node__link:hover .sc-node__label,.paymentconnect-page .sc-node__link:focus-visible .sc-node__label{transform:translateY(-18px)}
.paymentconnect-page .serviceconnect-page__module-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none}
.paymentconnect-page .serviceconnect-page__clients{background:#f7faeb}
.paymentconnect-page .serviceconnect-page__logo-row{gap:24px 55px}
.paymentconnect-page .serviceconnect-page__logo-row img{filter:none}
@media(max-width:700px){.paymentconnect-page .serviceconnect-page__overview{padding-bottom:48px}.paymentconnect-page .sc-graph{margin:38px auto 0}.paymentconnect-page .sc-graph__brand{gap:3px}.paymentconnect-page__symbol{width:36px;height:36px}.paymentconnect-page__symbol img{width:218px!important;height:36px!important}.paymentconnect-page .sc-graph__wordmark-text{font-size:2.1cqw}.paymentconnect-page .sc-node__label{font-size:max(8px,1.7cqw)}.paymentconnect-page .serviceconnect-page__logo-row{gap:22px}.paymentconnect-page .serviceconnect-page__logo-row li{max-width:calc(50% - 12px)}}
@media(prefers-reduced-motion:reduce){html:not(.eimsky-motion-full) .paymentconnect-page .sc-node__media img,html:not(.eimsky-motion-full) .paymentconnect-page .serviceconnect-page__logo-row img{transition:none}}

/* Scale the payment mark with the stage instead of leaving an 80px crop at
   small desktop widths. The source image has a 400:66 wordmark ratio. */
.paymentconnect-page__symbol {width:9.1416cqw;height:8.9186cqw;min-width:38px;min-height:37px;flex:none}
.paymentconnect-page__symbol img {width:606.06%!important;height:100%!important}
.paymentconnect-page__symbol img[src$="paymentconnect-symbol.svg"]{width:100%!important;height:100%!important;object-fit:contain!important}
.paymentconnect-page .sc-graph__wordmark-text {font-size:clamp(12px,2.45cqw,22px)}
@media (min-width:701px) and (max-height:850px) {
 .paymentconnect-page .sc-graph {width:min(100%,897px,calc((100dvh - 132px)*897/650))}
}
