.integration-main{grid-template-columns:1.05fr 1fr;gap:65px;align-items:center}.integration-copy h2{font-size:clamp(34px,3.2vw,47px)}.integration-copy .section-lead{max-width:460px;font-size:15px}.connection-benefits{display:grid;grid-template-columns:1fr 1fr;gap:23px 24px;margin-top:28px}.connection-benefits>div{display:flex;gap:9px;align-items:flex-start}.connection-benefits>div>svg{width:16px;height:16px;color:#5b794c;margin-top:3px}.connection-benefits strong{display:block;font-size:13px;line-height:1.65;font-weight:600;margin-bottom:4px}.connection-benefits p>span{display:block;color:#6b7363;font-size:12px;line-height:1.8}.integration-promise{margin-top:25px;padding-top:20px}.connection-demo{width:100%;max-width:590px;margin:0 auto;border:1px solid #e0e6d8;border-radius:25px;background:#fff;box-shadow:0 20px 70px #34482107;overflow:hidden}.connection-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 24px;border-bottom:1px solid #eef0e9}.connection-top>span{display:flex;gap:8px;align-items:center;font-size:9px;letter-spacing:.09em;color:#66735c}.connection-top button{border:1px solid #e0e5d8;border-radius:30px;font-size:10px;padding:8px 14px;min-height:34px}.connection-top button:disabled{cursor:default}.connection-canvas{position:relative;min-height:360px;aspect-ratio:600/450;background-image:radial-gradient(#d4ddcb 0.65px,transparent 0.65px);background-size:19px 19px;background-position:center}.connection-wires{position:absolute;inset:0;width:100%;height:100%;stroke-width:1.5;stroke:#dce5d2;overflow:visible}.connection-wires .wire-input,.connection-wires .wire-output{stroke:var(--orange);stroke-width:2.5;stroke-dasharray:8 92;stroke-dashoffset:100;opacity:0}.connection-demo[data-connection-step="0"] .wire-input{opacity:1;animation:connection-travel 2.8s cubic-bezier(.4,0,.2,1) infinite}.connection-demo[data-connection-step="2"] .wire-output{opacity:1;animation:connection-travel 2.8s cubic-bezier(.4,0,.2,1) infinite}.connection-wires .wire-left{animation-delay:.15s!important}.connection-wires .wire-right{animation-delay:.3s!important}.connection-mis{position:absolute;top:5%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:13px 16px;background:#fff;border:1px solid #dce5d3;border-radius:14px;width:58%;box-shadow:0 5px 18px #3d523607}.connection-mis .mini-icon{width:36px;height:36px;border-radius:9px}.connection-mis .mini-icon svg{width:19px;height:19px}.connection-mis strong{display:block;font-size:13px;font-weight:600}.connection-mis div>span{display:block;font-size:10px;color:#7a8570;margin-top:3px}.connection-sync{margin-left:auto;color:#63814c;font-size:21px}.connection-demo[data-connection-step="0"] .connection-sync{animation:connection-sync 2.8s ease-in-out infinite}.connection-data{position:absolute;top:28%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:#fff;padding:5px 10px;white-space:nowrap;font-size:9px;color:#7e8974}.connection-data b{font-weight:500;color:#536944}.connection-data svg{width:14px;height:14px}.connection-brand{position:absolute;top:40%;left:50%;transform:translate(-50%,-10%);width:60%;padding:20px 22px 15px;border-radius:17px;background:#fff;border:1px solid #e5d6c7;box-shadow:0 8px 25px #8a59310a;transition:border-color .35s,box-shadow .35s}.connection-brand img{width:100%;max-width:245px;height:auto;margin:auto}.connection-brand>span{display:block;text-align:center;font-size:9px;line-height:1.6;color:#7d8573;margin-top:11px}.connection-demo[data-connection-step="1"] .connection-brand{border-color:#f79b58;box-shadow:0 0 0 5px #fff2e7,0 9px 24px #c3672010}.connection-channels{position:absolute;top:72%;left:4%;right:4%;display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.connection-channels>div{background:#fff;border:1px solid #e2e8dc;border-radius:11px;min-height:51px;padding:11px 8px;display:flex;gap:8px;align-items:center;justify-content:center;transition:transform .35s,border-color .35s}.connection-channels strong{font-size:10px;font-weight:500}.connection-channel-icon{width:23px;height:23px;border-radius:7px;display:grid;place-items:center;font-size:15px;flex-shrink:0}.connection-channel-icon svg{width:15px;height:15px}.channel-tg{background:#eaf5fe;color:#2899ce}.channel-wa{background:#ebf8eb;color:#3d915c}.channel-max{background:#eeeefa;color:#6269af;font-size:13px;font-weight:700}.connection-demo[data-connection-step="2"] .connection-channels>div{transform:translateY(-3px);border-color:#b5c9a5}.connection-reply{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);display:flex;gap:9px;align-items:center;white-space:nowrap;padding:8px 13px;border-radius:10px;background:#f5f8f0;transition:background-color .35s,box-shadow .35s}.connection-reply .round-check{width:25px;height:25px}.connection-reply svg{width:14px;height:14px}.connection-reply b{display:block;font-size:10px;font-weight:500}.connection-reply div>span{display:block;font-size:8px;color:#7a876d;margin-top:2px}.connection-demo[data-connection-step="3"] .connection-reply{background:#e9f1df;box-shadow:0 0 0 4px #f4f8ee}.connection-bottom{border-top:1px solid #e5eadf;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 25px;background:#fafcf7;min-height:96px}.connection-bottom .tiny-tag{font-size:8px;color:#859076}.connection-bottom p{font-size:12px;color:#3b5232;margin-top:7px;line-height:1.7;min-height:21px}.connection-steps{display:flex;gap:4px;flex-shrink:0}.connection-steps button{padding:8px 4px;min-width:20px;min-height:34px;background:none;display:grid;place-items:center}.connection-steps button:before{content:'';display:block;width:6px;height:6px;border-radius:50%;background:#d7dfcd;transition:background-color .2s,transform .2s}.connection-steps button[aria-current]:before{background:var(--orange);transform:scale(1.3)}.connection-paused .connection-wires path,.connection-paused .connection-sync,.motion-paused .connection-wires path,.motion-paused .connection-sync{animation-play-state:paused!important}.reduced-motion .connection-demo *{animation:none!important;transition:none!important}.reduced-motion .connection-wires .wire-input,.reduced-motion .connection-wires .wire-output{opacity:0}
@keyframes connection-travel{0%{stroke-dashoffset:100}100%{stroke-dashoffset:0}}@keyframes connection-sync{0%{transform:rotate(0)}75%,100%{transform:rotate(360deg)}}
@media(max-width:1180px){.integration-main{gap:32px}.connection-benefits{gap:18px 16px}.connection-benefits strong{font-size:12px}.connection-benefits p>span{font-size:11px}.connection-top{padding:16px 20px}.connection-top>span{font-size:8px}.connection-brand{padding:15px 20px 12px}.connection-brand>span{font-size:8px;margin-top:8px}.connection-mis{gap:10px;padding:10px 13px}.connection-mis strong{font-size:12px}.connection-mis div>span{font-size:9px}.connection-channels{gap:10px}.connection-channels>div{min-height:44px;padding:9px 7px;gap:6px}.connection-channels strong{font-size:9px}.connection-channel-icon{width:21px;height:21px}.connection-reply{padding:6px 11px}.connection-reply b{font-size:9px}.connection-bottom{padding:18px 20px;gap:12px}.connection-bottom p{font-size:11px}.connection-data{font-size:8px;gap:7px}}
@media(max-width:960px){.integration-main{grid-template-columns:1fr;gap:38px}.integration-copy{grid-row:1}.integration-copy h2 br:nth-of-type(2){display:none}.integration-copy .section-lead{max-width:600px}.connection-benefits{grid-template-columns:repeat(3,1fr);gap:22px}.connection-demo{max-width:590px}.connection-mis{padding:13px 16px}.connection-mis strong{font-size:13px}.connection-mis div>span{font-size:10px}.connection-brand{padding:20px 22px 15px}.connection-brand>span{font-size:9px}.connection-channels>div{min-height:51px}.connection-channels strong{font-size:11px}.connection-reply b{font-size:11px}.connection-data{font-size:10px}.connection-bottom p{font-size:13px}}
@media(max-width:720px){.integration-main{display:flex;flex-direction:column-reverse;gap:30px}.connection-benefits{grid-template-columns:1fr 1fr;gap:20px 17px}.connection-benefits strong{font-size:12px}.connection-benefits p>span{font-size:11px}.integration-copy .section-lead{font-size:14px}.connection-demo{border-radius:20px;max-width:470px}.connection-top{padding:14px 16px}.connection-top>span{font-size:7px;letter-spacing:.07em}.connection-top button{font-size:9px;padding:6px 10px}.connection-canvas{min-height:320px;aspect-ratio:600/580}.connection-mis{top:4%;width:68%;padding:10px 12px;gap:9px}.connection-mis .mini-icon{width:29px;height:29px}.connection-mis strong{font-size:11px}.connection-mis div>span{font-size:8px}.connection-sync{font-size:18px}.connection-data{top:27%;font-size:8px;gap:6px;padding:4px 8px}.connection-brand{top:39%;width:72%;padding:15px 17px 11px}.connection-brand>span{font-size:8px;margin-top:8px}.connection-channels{top:69%;left:4%;right:4%;gap:7px}.connection-channels>div{padding:8px 5px;min-height:40px;gap:5px;border-radius:9px}.connection-channels strong{font-size:8px}.connection-channel-icon{width:18px;height:18px;font-size:12px;border-radius:5px}.connection-channel-icon svg{width:13px;height:13px}.connection-reply{bottom:4%;padding:7px 10px}.connection-reply b{font-size:9px}.connection-reply div>span{font-size:7px}.connection-reply .round-check{width:23px;height:23px}.connection-bottom{padding:16px;align-items:center;gap:8px;min-height:100px}.connection-bottom p{font-size:10px;max-width:210px}.connection-steps{gap:0}.connection-steps button{min-width:17px}.connection-bottom .tiny-tag{font-size:7px}}
@media(max-width:370px){.connection-benefits{grid-template-columns:1fr;gap:15px}.connection-benefits strong{font-size:12px;margin-bottom:1px}.connection-benefits p>span{font-size:11px}.connection-top>span{font-size:6px}.connection-mis div>span{font-size:7px}.connection-brand>span{font-size:7px}.connection-data{font-size:7px}.connection-reply{bottom:3%}.connection-bottom p{font-size:10px;max-width:175px}.connection-canvas{aspect-ratio:600/600}}
@media(prefers-reduced-motion:reduce){.connection-demo *{animation:none!important;transition:none!important}.connection-wires .wire-input,.connection-wires .wire-output{opacity:0}}