.integrations-section{padding-bottom:80px}
.integrations-board{position:relative;width:100%;max-width:1120px;height:560px;margin:0 auto;background-color:#eff2ec;background-image:radial-gradient(#b7c4b74d 1px,transparent 1px);background-size:20px 20px;border:1px solid #d9e1d5;border-radius:20px;isolation:isolate}
.integration-lines{position:absolute;inset:0;width:100%;height:100%;color:#b7c8ba;z-index:-1}
.integration-node{position:absolute;width:24%;height:118px;display:flex;gap:15px;align-items:center;padding:20px;background:#ffffffed;border:1px solid #dce4da;border-radius:14px;box-shadow:0 6px 18px #29442f06}
a.integration-node{transition:transform .2s,border-color .2s}
a.integration-node:hover{transform:translateY(-3px);border-color:#90aa91}
.integration-node h3{font-size:26px;line-height:1.1;letter-spacing:-.025em}
.integration-node p{font-size:14px;font-weight:500;color:#59676b;line-height:1.4;margin-top:6px}
.integration-icon{width:58px;height:58px;flex-shrink:0;display:grid;place-items:center;border-radius:16px;color:var(--icon);background:var(--icon-bg)}
.integration-icon svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.integration-catalog{left:5%;top:26px;--icon:#4b72b5;--icon-bg:#e9effb}
.integration-suppliers{right:5%;top:26px;--icon:#be7036;--icon-bg:#fcf0e2}
.integration-erp{left:5%;top:206px;--icon:#7b65ad;--icon-bg:#f0ebfa}
.integration-crm{right:5%;top:206px;--icon:#348b84;--icon-bg:#e2f2ee}
.integration-warehouse{left:5%;top:416px;--icon:#a37c2e;--icon-bg:#f7efd8}
.integration-shop{left:38%;top:416px;--icon:#b35e73;--icon-bg:#fae9ed}
.integration-mobile{right:5%;top:416px;--icon:#527f9e;--icon-bg:#e6f1f8}
.integration-hub{position:absolute;left:38%;top:191px;width:24%;height:148px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:21px;color:#f8faf5;background:#2d4438;box-shadow:0 12px 30px #2d443820;border:1px solid #3c5946}
.integration-hub>b{font:700 54px/.95 var(--display);letter-spacing:-2px}.integration-hub>b>span{color:#d3e7a6;margin-left:4px}
.integration-hub p{font-size:15px;font-weight:500;margin-top:11px;color:#e0e9dc}
.integration-hub-api{font:600 11px var(--mono);letter-spacing:.08em;background:#425e4b;border:1px solid #66806b;border-radius:5px;padding:4px 10px;margin-top:12px;color:#e5efdd}
.integrations-footer{max-width:1120px;margin:24px auto 0;display:flex;align-items:center;justify-content:space-between;gap:24px}
.integrations-footer>p{font-size:16px;line-height:1.5;font-weight:600;color:#4b565e}.integrations-footer .text-link{font-size:16px;flex-shrink:0}
@media(max-width:1100px) and (min-width:701px){.integration-node{padding:15px;gap:10px}.integration-icon{width:45px;height:45px;border-radius:12px}.integration-icon svg{width:33px;height:33px}.integration-node h3{font-size:23px}.integration-node p{font-size:13px}.integration-hub p{font-size:13px}}
@media(max-width:700px){.integrations-board{height:auto;padding:22px 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;border-radius:14px}.integration-lines{display:none}.integration-node{position:static;width:auto;height:auto;min-height:150px;display:flex;flex-direction:column;align-items:flex-start;padding:16px;gap:12px;border-radius:12px}.integration-node h3{font-size:24px;overflow-wrap:anywhere}.integration-node p{font-size:14px;margin-top:7px}.integration-icon{width:48px;height:48px;border-radius:13px}.integration-icon svg{width:34px;height:34px}.integration-hub{position:relative;left:auto;top:auto;grid-column:1/-1;width:100%;height:155px;margin:16px 0}.integration-hub::before,.integration-hub::after{content:'';position:absolute;left:50%;width:2px;height:30px;background:#a6bca9;z-index:-1}.integration-hub::before{bottom:100%}.integration-hub::after{top:100%}.integration-mobile{grid-column:1/-1;flex-direction:row;align-items:center;min-height:98px}.integrations-footer{display:block}.integrations-footer .text-link{margin-top:16px}.integrations-section{padding-bottom:52px}}
@media(max-width:360px){.integrations-board{padding:18px 10px;gap:10px}.integration-node{padding:12px}.integration-node h3{font-size:22px}.integration-node p{font-size:14px}.integration-hub{margin-block:16px}}
@media(prefers-reduced-motion:reduce){a.integration-node{transition:none}a.integration-node:hover{transform:none}}
