/* Figma 12266:2751. All rules are scoped away from the animated inbox. */
.site-stage #connected-workspace{background:#f3efe3;padding-top:76px;padding-bottom:32px}
.site-stage #connected-workspace .section-heading{margin:0 auto 32px;text-align:center}
.site-stage #connected-workspace .eyebrow{justify-content:center;font-size:9px;letter-spacing:1.6px;color:#7b8872}
.site-stage #connected-workspace h2{font-size:clamp(34px,3.6vw,56px);line-height:1.15;letter-spacing:-2px;font-weight:500;margin:20px 0 0;color:#172c24}
.site-stage #connected-workspace h2 em{font-family:Georgia,serif;font-weight:400;color:#637b50}
.site-stage #connected-workspace .connection-diagram{display:grid;grid-template-columns:216px minmax(192px,1fr) 216px!important;gap:0;width:100%;max-width:1054px!important;height:476px;min-height:476px;padding:0;margin:0 auto!important;position:relative;align-items:center}
.site-stage #connected-workspace .connection-inputs,.site-stage #connected-workspace .connection-outputs{display:grid;grid-template-rows:64px 64px 1fr 64px 64px;row-gap:20px;height:476px;padding:0;align-content:space-between;align-self:stretch}
.site-stage #connected-workspace .connection-node{display:flex;flex-direction:row;align-items:center;gap:10px;width:216px;min-height:64px;height:64px;padding:12px 15px;border:0;border-radius:14px;background:#fffefa!important;box-shadow:none;margin:0!important;z-index:1}
.site-stage #connected-workspace .connection-node:nth-child(2){align-self:start}
.site-stage #connected-workspace .connection-inputs .connection-node:nth-child(3),.site-stage #connected-workspace .connection-outputs .connection-node:nth-child(3){grid-row:4}
.site-stage #connected-workspace .connection-inputs .connection-node:nth-child(4),.site-stage #connected-workspace .connection-outputs .connection-node:nth-child(4){grid-row:5}
.site-stage #connected-workspace .connection-node strong{font-size:16px;font-weight:500;line-height:1.25;color:#14251e}
.site-stage #connected-workspace .connection-node div>span{font-size:12px;line-height:1.3;margin-top:3px;color:#788278}
.site-stage #connected-workspace .connection-node .brand-icon,.site-stage #connected-workspace .connection-node .node-symbol{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:11px}
.site-stage #connected-workspace .connection-node .brand-whatsapp{background:#08bf46;color:white;border-radius:50%}
.site-stage #connected-workspace .connection-node .brand-facebook{background:#1977f3;color:white;border-radius:50%}
.site-stage #connected-workspace .connection-node .brand-instagram{background:#f9e4ee;color:#d62976}
.site-stage #connected-workspace .connection-node .brand-telegram{background:#21a7df;color:white;border-radius:50%}
.site-stage #connected-workspace .connection-node svg{width:28px;height:28px}
.site-stage #connected-workspace .connection-node .node-symbol{background:#e9ecdf;color:#758269}
.site-stage #connected-workspace .node-symbol svg{width:22px;height:22px}
.site-stage #connected-workspace .connection-core{width:192px;justify-self:center;align-self:center;margin:0;z-index:2}
.site-stage #connected-workspace .core-chip{width:192px;height:136px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;background:#fffefa!important;border:0;border-radius:15px;box-shadow:none;animation:none}
.site-stage #connected-workspace .core-chip .brandmark{width:40px;height:34px;background:#1b4935;border-radius:12px;font-size:28px;box-shadow:none}
.site-stage #connected-workspace .core-chip strong{font-size:26px;line-height:1.2;letter-spacing:-.5px;color:#14251e;font-weight:500}
.site-stage #connected-workspace .core-chip>span:last-child{font-size:12px;letter-spacing:0;text-transform:none;color:#788278}
.site-stage #connected-workspace .connection-paths{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.site-stage #connected-workspace .path-base path{stroke:#d0d4ce;stroke-width:1.2;fill:none}
.site-stage #connected-workspace .path-flow{display:none}
.site-stage #channels{background:#f3efe3;padding-top:0;padding-bottom:80px}
.site-stage #channels .channel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin:0!important}
.site-stage #channels .channel-card{display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:290px;background:#fffefa!important;border:1px solid #e4e3d9;border-radius:10px;padding:28px;box-shadow:none}
.site-stage #channels .channel-card>.brand-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px}
.site-stage #channels .brand-whatsapp{background:#c9efce;color:#05b73e}
.site-stage #channels .brand-facebook{background:#cde1fa;color:#1877f2}
.site-stage #channels .brand-instagram{background:#ecd2e4;color:#c3399b}
.site-stage #channels .brand-telegram{background:#def3fb;color:#20a7dc}
.site-stage #channels .channel-card h3{font-size:20px;font-weight:600;line-height:1.3;letter-spacing:-.6px;color:#1d2d25;margin:25px 0 10px}
.site-stage #channels .channel-card p{font-size:14px;line-height:1.7;color:#788278;margin:0 0 24px}
.site-stage #channels .channel-link{font-size:11px;color:#667e4f;margin-top:auto;line-height:1.5}
.site-stage #channels .channel-link span{margin-left:5px}
html[data-theme=dark] .site-stage #connected-workspace,html[data-theme=dark] .site-stage #channels{background:#14291f}
html[data-theme=dark] .site-stage #connected-workspace h2{color:#edf3e9}
html[data-theme=dark] .site-stage #connected-workspace .connection-node,html[data-theme=dark] .site-stage #connected-workspace .core-chip,html[data-theme=dark] .site-stage #channels .channel-card{background:#203b2c!important;border-color:#3a5140}
html[data-theme=dark] .site-stage #connected-workspace .connection-node strong,html[data-theme=dark] .site-stage #connected-workspace .core-chip strong,html[data-theme=dark] .site-stage #channels h3{color:#edf3e9}
html[data-theme=dark] .site-stage #connected-workspace .connection-node div>span,html[data-theme=dark] .site-stage #channels p{color:#bac8b8}
@media(max-width:1000px){.site-stage #connected-workspace .connection-diagram{grid-template-columns:195px minmax(160px,1fr) 195px!important}.site-stage #connected-workspace .connection-node{width:195px;padding:12px}.site-stage #connected-workspace .connection-node strong{font-size:14px}.site-stage #connected-workspace .connection-core,.site-stage #connected-workspace .core-chip{width:160px}.site-stage #channels .channel-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(max-width:760px){.site-stage #connected-workspace{padding-top:50px;padding-bottom:28px}.site-stage #connected-workspace h2{letter-spacing:-1.2px}.site-stage #connected-workspace .connection-diagram{grid-template-columns:minmax(0,1fr) 100px minmax(0,1fr)!important;height:350px;min-height:350px;gap:12px}.site-stage #connected-workspace .connection-inputs,.site-stage #connected-workspace .connection-outputs{height:350px;grid-template-rows:66px 66px 1fr 66px 66px;gap:12px}.site-stage #connected-workspace .connection-node{width:100%;height:66px;min-height:66px;padding:8px;gap:6px}.site-stage #connected-workspace .connection-node strong{font-size:11px}.site-stage #connected-workspace .connection-node div>span{font-size:9px}.site-stage #connected-workspace .connection-node .brand-icon,.site-stage #connected-workspace .connection-node .node-symbol{width:23px;height:23px;flex-basis:23px;border-radius:6px}.site-stage #connected-workspace .connection-node svg{width:20px;height:20px}.site-stage #connected-workspace .connection-core,.site-stage #connected-workspace .core-chip{width:100px}.site-stage #connected-workspace .core-chip{height:116px}.site-stage #connected-workspace .core-chip strong{font-size:17px}.site-stage #connected-workspace .core-chip>span:last-child{font-size:8px}.site-stage #channels{padding-bottom:48px}.site-stage #channels .channel-card{padding:22px;min-height:275px}.site-stage #channels .channel-card h3{font-size:18px}.site-stage #channels .channel-card p{font-size:13px}}
@media(max-width:480px){.site-stage #connected-workspace .connection-diagram{grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr)!important;gap:8px}.site-stage #connected-workspace .connection-core,.site-stage #connected-workspace .core-chip{width:82px}.site-stage #connected-workspace .connection-node{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;height:70px;min-height:70px}.site-stage #connected-workspace .connection-node div>span{display:none}.site-stage #connected-workspace .connection-node strong{font-size:10px}.site-stage #connected-workspace .core-chip strong{font-size:14px}.site-stage #connected-workspace .core-chip>span:last-child{font-size:7px}.site-stage #channels .channel-grid{grid-template-columns:1fr}.site-stage #channels .channel-card{min-height:0}}

/* Balance the three active channels and three CRM destinations. */
.site-stage #connected-workspace .connection-inputs,.site-stage #connected-workspace .connection-outputs{display:flex;flex-direction:column;justify-content:space-between;height:360px;align-self:center;gap:24px}
.site-stage #connected-workspace .connection-diagram{height:400px;min-height:400px}
.site-stage #channels .channel-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:760px){.site-stage #connected-workspace .connection-diagram{height:300px;min-height:300px}.site-stage #connected-workspace .connection-inputs,.site-stage #connected-workspace .connection-outputs{height:280px;gap:16px}.site-stage #channels .channel-grid{grid-template-columns:1fr}}

/* Separate, precisely anchored routes and a restrained channel-to-CRM flow. */
.site-stage #connected-workspace .connection-paths{overflow:visible}
.site-stage #connected-workspace .path-base path{stroke:#b8c9b8;stroke-width:1.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.site-stage #connected-workspace .path-flow{display:block}
.site-stage #connected-workspace .path-flow path{fill:none;stroke:#1bc45b;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:32 968;stroke-dashoffset:1000;opacity:.8;animation:connected-route-flow 4.8s linear infinite!important;vector-effect:non-scaling-stroke;filter:none}
@keyframes connected-route-flow{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
.motion-paused .site-stage #connected-workspace .path-flow path,.site-stage #connected-workspace .motion-offscreen .path-flow path{animation-play-state:paused!important}
html[data-theme=dark] .site-stage #connected-workspace .path-base path{stroke:#56735a}
@media(prefers-reduced-motion:reduce){.site-stage #connected-workspace .path-flow{display:none}}