/* Explain the integration layer before showing individual vendor examples. */
.connection-model{padding:82px 0;background:#f4f5f8}
.connection-model .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:70px;align-items:center}
.connection-model h2,.integration-area-heading h2,.connection-examples h2{font-size:clamp(34px,4.4vw,58px);line-height:1.05;letter-spacing:-.045em}
.connection-model p{max-width:46ch;margin-top:25px;color:#535b68}
.connection-model .depth-text-link{margin-top:25px}
.connection-flow{display:grid;gap:18px}
.connection-flow>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:25px 28px;border:1px solid #dfe2e7;background:#fff}
.connection-flow strong{font-size:27px;font-weight:800;letter-spacing:-.7px}.connection-flow span{font-size:12px;text-align:right}
.connection-flow .connection-fibric{background:#2450e8;color:#fff;border-color:#2450e8}
.connection-flow>i{font-size:22px;text-align:center;line-height:1;font-style:normal;color:#6b7280}
.integration-areas{padding:90px 0}
.integration-area-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:44px}
.integration-area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}
.integration-area-grid article{border-top:1px solid #dfe2e7;padding-top:25px}
.integration-area-grid h3{font-size:25px;letter-spacing:-.6px;line-height:1.15}
.integration-area-grid p{font-size:15px;line-height:1.65;color:#535b68;margin-top:15px;max-width:32ch}
.connection-examples{padding:80px 0;background:#e4e3ff}
.connection-examples .depth-kicker{margin-bottom:20px}
.connection-examples>div>p{max-width:55ch;margin-top:25px;color:#535b68}
.connection-example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:55px;margin-top:44px}
.connection-example-grid a{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #c0bfdc;padding:26px 0;color:#131417}
.connection-example-grid h3{font-size:27px;letter-spacing:-.7px;line-height:1.15}
.connection-example-grid p{font-size:13px;margin-top:10px;color:#535b68}
.connection-example-grid a>span{font-size:27px}.connection-example-grid a:hover h3{text-decoration:underline;text-underline-offset:5px}
.integration-catalog-link{margin-top:35px}
.depth .integration-path{display:grid;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr);align-items:center;gap:20px;grid-column:1/-1;width:100%}
.depth .integration-path .integration-wordmark{font-size:clamp(24px,3.4vw,43px);overflow-wrap:anywhere}
.integration-path .integration-bridge{font-size:26px}
.integration-pdp-note{margin:22px 0 0;font-size:13px;color:#535b68;line-height:1.65}
.integration-pdp-note a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.connection-model .wrap{gap:35px}.integration-area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.connection-flow>div{padding:20px}.connection-flow strong{font-size:23px}}
@media(max-width:600px){.connection-model,.integration-areas,.connection-examples{padding:55px 0}.connection-model .wrap{grid-template-columns:1fr;gap:35px}.integration-area-heading{display:block}.integration-area-grid{grid-template-columns:1fr;gap:26px}.integration-area-grid p{max-width:45ch}.connection-example-grid{grid-template-columns:1fr;margin-top:30px}.depth .integration-path{grid-template-columns:1fr;gap:18px}.depth .integration-path .integration-wordmark{font-size:31px}.integration-path .integration-bridge{transform:rotate(90deg);line-height:1}.integration-area-heading .depth-text-link{margin-top:22px}}