/* Integration ecosystem: static, readable without JS and no implied active connections. */
.ecosystem{--eco-line:#ffffff16;--eco-ink:#f2f3f7;--eco-muted:#a5acb8}
.ecosystem-heading{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:end;margin-bottom:58px}
.ecosystem-heading .lead{font-size:17px;line-height:1.7;margin:0;max-width:40ch;color:var(--eco-muted)}
.ecosystem-map{position:relative;isolation:isolate;padding:0 28px 28px;border:1px solid var(--eco-line);border-radius:28px;background:radial-gradient(ellipse at 50% 0%,#25364b55,transparent 55%),#0d1118;overflow:hidden}
.ecosystem-map:before{content:"";position:absolute;z-index:-1;left:50%;top:10px;bottom:0;width:1px;background:linear-gradient(#ffffff40,#ffffff05)}
.ecosystem-hub{position:relative;display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;width:210px;margin:36px auto 34px;padding:24px 20px;border:1px solid #ffffff25;background:#171e29;border-radius:22px;box-shadow:0 14px 55px #0004;color:var(--eco-ink)}
.ecosystem-hub strong{font-size:22px;letter-spacing:-.04em}.ecosystem-hub span{font-size:11px;color:var(--eco-muted)}
.ecosystem-hub i{width:5px;height:5px;border-radius:50%;background:#dce8fb;box-shadow:0 0 15px #b5d7ff;position:absolute;bottom:-3px}
.ecosystem-tools{list-style:none!important;margin:0!important;padding:0!important;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--eco-line);border:1px solid var(--eco-line);border-radius:15px;overflow:hidden}
.ecosystem-tools li{list-style:none;margin:0;padding:23px 18px!important;background:#101620;min-width:0;display:flex;flex-direction:column;gap:16px;transition:background .2s}
.ecosystem-tools li:before{display:none!important}.ecosystem-tools li:hover{background:#1a2432}
.eco-identity{display:flex;align-items:center;gap:11px;min-height:37px}.eco-identity strong{font-size:14px;line-height:1.25;color:var(--eco-ink)}
.eco-logo{background:#f2f3f5;border-radius:9px;width:37px;height:37px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.eco-logo img{object-fit:contain}
.eco-wordmark{font-size:17px!important;letter-spacing:-.035em;color:var(--eco-ink)}.eco-wordmark small{font-size:10px;color:var(--eco-muted);margin-left:4px}
.eco-state{font-size:10px;line-height:1.5;color:var(--eco-muted);display:flex;align-items:center;gap:6px}.eco-state:before{content:"";width:4px;height:4px;border-radius:50%;background:#8590a3;flex-shrink:0}.eco-state.local{color:#c4d8d1}.eco-state.local:before{background:#9bc6b7}.eco-state.setup{color:#d4c9b2}.eco-state.setup:before{background:#c4ab7b}
.ecosystem-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:30px}.ecosystem-bottom p{font-size:14px;line-height:1.7;margin:0}.ecosystem-bottom p span{font-size:12px;color:var(--eco-muted)}
.ecosystem-disclaimer{font-size:10px;line-height:1.65;color:#929ba9;max-width:85ch;margin-top:25px}
.ecosystem .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1100px){.ecosystem-heading{gap:35px}.ecosystem-tools{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.ecosystem-heading{grid-template-columns:1fr;gap:20px;margin-bottom:35px}.ecosystem-heading .lead{max-width:45ch;font-size:16px}.ecosystem-map{padding:0 14px 14px;border-radius:20px}.ecosystem-hub{margin:25px auto}.ecosystem-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.ecosystem-tools li{padding:18px 13px!important}.eco-identity{gap:8px}.eco-identity strong{font-size:12px}.eco-state{font-size:9px}.ecosystem-bottom{flex-direction:column;align-items:flex-start}.ecosystem-bottom .button{width:auto}.eco-logo{width:30px;height:30px}.eco-logo img{width:21px;height:21px}}
@media(max-width:360px){.ecosystem-map{padding:0 9px 9px}.ecosystem-tools li{padding:15px 9px!important}.eco-identity{flex-wrap:wrap;gap:7px}.eco-identity strong{font-size:11px}.eco-wordmark{font-size:15px!important}}
@media(prefers-reduced-motion:reduce){.ecosystem-tools li{transition:none}}
/* Brand marks get a full, consistent display area instead of tiny tiles. */
.ecosystem-tools li{padding:28px 20px!important;align-items:center;text-align:center;gap:20px}
.eco-identity{width:100%;min-height:116px;flex-direction:column;justify-content:center;gap:15px}
.eco-logo{width:90px;height:70px;border-radius:14px;padding:10px;background:#f2f3f5}
.eco-logo img{width:100%;height:100%;object-fit:contain}
.eco-logo.logo-word{width:150px;background:transparent;padding:0}
.eco-identity strong{font-size:17px}.eco-wordmark{font-size:26px!important}
.eco-state{font-size:12px;justify-content:center}.magnet-placeholder{background:transparent;border:1px dashed #7c91af88}
@media(max-width:760px){.ecosystem-tools li{padding:23px 10px!important}.eco-identity strong{font-size:15px}.eco-logo{width:78px;height:64px}.eco-logo.logo-word{width:min(140px,100%)}.eco-state{font-size:11px}.eco-wordmark{font-size:23px!important}}
/* Authentic provider marks, unmodified, with breathing room matching their proportions. */
.eco-logo.logo-pipedrive{background:#1e302b;border:1px solid #a5c8b938;padding:13px}.eco-logo.logo-pipedrive img{width:44px;height:44px}
.eco-logo.logo-slack{width:150px;max-width:100%;background:white;padding:6px;border-radius:12px}
.eco-logo:has(img[src$="salesforce.svg"]){width:110px;max-width:100%;padding:10px;background:white}
.eco-logo:has(img[src$="microsoftoutlook.svg"]){background:#f7f9fc;padding:10px}
@media(max-width:760px){.eco-logo.logo-slack{width:130px}.eco-logo.logo-pipedrive img{width:40px;height:40px}}
/* Horizontal provider tiles: authentic mark on white, identity and availability beside it. */
.ecosystem-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;background:transparent;border:0;overflow:visible}
.ecosystem-tools li{position:relative;z-index:2;padding:20px!important;border:1px solid #ffffff16;border-radius:15px;align-items:stretch;text-align:left;background:#121a27;gap:0}
.eco-identity{flex-direction:row;justify-content:flex-start;align-items:center;gap:15px;min-height:68px;width:100%}
.eco-logo,.eco-logo.logo-word,.eco-logo.logo-slack,.eco-logo.logo-pipedrive,.eco-logo:has(img[src$="salesforce.svg"]),.eco-logo:has(img[src$="microsoftoutlook.svg"]){width:68px;height:68px;max-width:68px;border-radius:13px;padding:9px;background:#fff;border:0;flex:0 0 68px}
.eco-logo img,.eco-logo.logo-pipedrive img{width:100%;height:100%;object-fit:contain}
.eco-logo.logo-word img{background:#142238;padding:4px;border-radius:3px}
.eco-logo.magnet-placeholder{background:#fff;border:1px dashed #91a1b6}
.eco-copy{min-width:0;display:flex;flex-direction:column;gap:8px}.eco-identity strong{font-size:17px;line-height:1.25;overflow-wrap:anywhere}.eco-state{justify-content:flex-start;font-size:11px;line-height:1.45;text-align:left;align-items:flex-start}.eco-state:before{margin-top:5px}
.ecosystem-hub{z-index:3;margin-top:58px;margin-bottom:48px}.ecosystem-flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}.ecosystem-flow path{fill:none;stroke:#a9c3e323;stroke-width:1}.ecosystem-pulses{z-index:4}.ecosystem-pulses circle{fill:#d7eaff;filter:drop-shadow(0 0 5px #9bc8ff);opacity:0}.ecosystem-map:before{display:none}
@media(max-width:1100px){.ecosystem-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.ecosystem-tools li{padding:18px!important}}
@media(max-width:600px){.ecosystem-tools{grid-template-columns:1fr;gap:12px}.ecosystem-tools li{padding:18px!important}.eco-identity{gap:17px}.eco-logo,.eco-logo.logo-word,.eco-logo.logo-slack,.eco-logo.logo-pipedrive,.eco-logo:has(img[src$="salesforce.svg"]),.eco-logo:has(img[src$="microsoftoutlook.svg"]){width:64px;height:64px;max-width:64px;flex-basis:64px}.eco-identity strong{font-size:18px}.eco-state{font-size:12px}.ecosystem-map{padding:0 16px 20px}.ecosystem-hub{margin-top:52px;margin-bottom:36px}}
@media(prefers-reduced-motion:reduce){.ecosystem-pulses{display:none}}