/* Graphic-first ecosystem map: let the visual flow explain the product. */
.ecosystem-heading{margin-bottom:31px}
.ecosystem-scale{position:relative;display:flex;align-items:center;justify-content:space-between;width:132px;height:58px;padding:0;border:0;background:transparent}
.ecosystem-scale::before{position:absolute;top:50%;right:18px;left:18px;height:2px;background:linear-gradient(90deg,#c4d5bb,#86a977,#b8cea9);content:""}
.ecosystem-scale>i{position:relative;z-index:1;width:15px;height:15px;border:3px solid #fbfcf7;border-radius:50%;background:#81ad6b;box-shadow:0 0 0 1px #a9c99b}
.ecosystem-scale>b{position:relative;z-index:1;display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 25%,#d6ffa7,#8fc85b 58%,#478743);color:#16351f;font-size:.61rem;letter-spacing:.02em;box-shadow:0 0 0 6px rgba(156,205,111,.14),0 6px 17px rgba(69,117,57,.18)}
.ecosystem-shell{border-color:rgba(53,91,54,.1);border-radius:29px;background:radial-gradient(ellipse at 51% 50%,rgba(191,221,169,.25),transparent 40%),linear-gradient(145deg,#fbfcf7,#eef1e7);box-shadow:0 26px 72px rgba(36,68,39,.065)}
.ecosystem-shell::before{inset:5% 18%;border-color:rgba(89,139,77,.075);box-shadow:0 0 0 34px rgba(89,139,77,.025)}
.ecosystem-flow{grid-template-columns:minmax(0,1fr) 65px minmax(220px,.92fr) 65px minmax(0,1.08fr);min-height:400px;padding:33px 25px}
.ecosystem-wires{position:absolute;z-index:0;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ecosystem-wires path{fill:none;stroke:url(#ecosystem-wire);stroke-width:2;stroke-linecap:round;stroke-dasharray:2 9;animation:ecosystem-flow 17s linear infinite}
.ecosystem-wires circle{fill:#8dbd72;stroke:#f5f7ef;stroke-width:5}
@keyframes ecosystem-flow{to{stroke-dashoffset:-150}}
.ecosystem-stage,.ecosystem-bridge,.ecosystem-engine{position:relative;z-index:1}
.ecosystem-stage-heading{gap:0;margin:0 0 13px 2px}
.ecosystem-stage-heading h3{display:flex;align-items:center;gap:8px;color:#58735a;font-size:.55rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.ecosystem-integrations .ecosystem-stage-heading h3::before,.ecosystem-areas .ecosystem-stage-heading h3::before{display:block;width:7px;height:7px;border-radius:50%;background:#9ac777;box-shadow:0 0 0 4px rgba(154,199,119,.15);content:""}
.integration-grid{gap:9px}
.integration-tile{position:relative;flex-direction:row;align-items:center;justify-content:flex-start;gap:11px;min-height:78px;padding:11px 12px;border-color:rgba(48,87,51,.085);border-radius:17px;background:rgba(255,255,252,.91);box-shadow:0 11px 23px rgba(34,62,37,.045)}
.integration-tile:hover{transform:translateY(-3px) scale(1.012);border-color:rgba(75,131,67,.27);box-shadow:0 17px 29px rgba(34,62,37,.09)}
.integration-mark{width:45px;height:45px;flex:none;border:1px solid rgba(67,106,67,.055);border-radius:15px;background:linear-gradient(145deg,#f4f8f0,#edf4e8)}
.integration-mark img{width:32px;height:32px}
.integration-siigo .integration-mark{width:48px;height:45px;background:transparent}
.integration-siigo .integration-mark img{width:49px;height:35px}
.integration-tile>span:last-child{color:#304935;font-size:.7rem;font-weight:820;letter-spacing:-.02em}
.ecosystem-bridge{align-self:center;height:100%;justify-content:center;gap:0;color:#719463}
.ecosystem-bridge::before{top:50%;right:1px;left:1px;height:1px;background:linear-gradient(90deg,rgba(115,158,103,.06),rgba(115,158,103,.56),rgba(115,158,103,.06))}
.ecosystem-bridge i{width:31px;height:31px;border:1px solid rgba(89,135,78,.18);background:#f3f6ed;color:#598b50;font-size:.9rem;box-shadow:0 3px 9px rgba(53,92,49,.06)}
.ecosystem-bridge span{display:none}
.ecosystem-engine{width:min(100%,266px);aspect-ratio:1;min-height:0;justify-self:center;align-self:center;gap:0;padding:20px;border:1px solid rgba(178,228,136,.4);border-radius:50%;background:radial-gradient(circle at 50% 36%,#285233 0%,#173d28 46%,#0c2116 79%);box-shadow:0 0 0 12px rgba(86,139,75,.055),0 22px 51px rgba(20,53,30,.2),inset 0 0 48px rgba(130,183,85,.1)}
.ecosystem-engine::before,.ecosystem-engine::after{position:absolute;z-index:-1;inset:9px;border:1px solid rgba(190,235,145,.12);border-radius:50%;content:""}
.ecosystem-engine::after{inset:22px;border-color:rgba(190,235,145,.075)}
.ecosystem-engine-halo{top:50%;width:88%;height:88%;border-color:rgba(181,230,134,.12);transform:translate(-50%,-50%);box-shadow:0 0 0 15px rgba(181,230,134,.025)}
.ecosystem-engine-mark{width:63px;height:63px;margin-bottom:10px}
.ecosystem-engine>small{font-size:.4rem;letter-spacing:.14em;white-space:nowrap}
.ecosystem-engine h3{margin:7px 0 14px;font-size:1.12rem;line-height:1;letter-spacing:-.055em}
.engine-capabilities{gap:8px;width:auto}
.engine-capabilities span{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(199,235,174,.14);border-radius:50%;background:rgba(232,246,218,.055)}
.engine-capabilities img{width:22px;height:22px}
.ecosystem-area-list{gap:9px}
.ecosystem-area{grid-template-columns:54px minmax(0,1fr);gap:13px;min-height:75px;padding:10px 14px;border-color:rgba(48,87,51,.08);border-radius:18px;background:rgba(255,255,252,.9);box-shadow:0 10px 23px rgba(34,62,37,.045)}
.ecosystem-area:hover{transform:translateX(4px);border-color:rgba(75,131,67,.3);box-shadow:0 15px 28px rgba(34,62,37,.085)}
.area-mark{width:54px;height:54px;border:1px solid #dce8d4;border-radius:17px;background:linear-gradient(145deg,#f6f9f2,#e9f1e2);box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}
.ecosystem-area:nth-child(2) .area-mark{border-color:#eee4cc;background:linear-gradient(145deg,#fcf8ed,#f4eddd)}
.ecosystem-area:nth-child(3) .area-mark{border-color:#d4e6db;background:linear-gradient(145deg,#f1f8f3,#e2efe7)}
.area-mark img{width:44px;height:44px}
.ecosystem-area>span:nth-child(2){display:flex;align-items:center;min-height:45px}
.ecosystem-area>span strong{color:#2b4430;font-size:.83rem;font-weight:830;letter-spacing:-.03em}
.ecosystem-area>b,.ecosystem-area>span small,.ecosystem-area>span em,.ecosystem-stage-note,.ecosystem-shell-top,.ecosystem-shell-footer{display:none}
@media(max-width:1100px){
 .ecosystem-flow{grid-template-columns:minmax(0,1fr) 54px minmax(200px,.9fr) 54px minmax(0,1.08fr);padding-inline:18px}
 .ecosystem-engine{width:min(100%,244px)}
 .ecosystem-area{grid-template-columns:49px minmax(0,1fr);gap:9px;padding-inline:10px}
 .area-mark{width:49px;height:49px}
 .area-mark img{width:40px;height:40px}
}
@media(max-width:900px){
 .ecosystem-heading{margin-bottom:20px}
 .ecosystem-shell::before{inset:7% 15%}
 .ecosystem-flow{display:flex;flex-direction:column;gap:14px;min-height:0;padding:21px 20px 23px}
 .ecosystem-wires{display:none}
 .ecosystem-stage-heading{margin:0 0 10px 2px}
 .integration-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
 .integration-tile{flex-direction:column;justify-content:center;gap:5px;min-height:91px;padding:8px}
 .integration-mark{width:47px;height:47px}
 .integration-mark img{width:34px;height:34px}
 .integration-siigo .integration-mark{width:63px;height:47px}
 .integration-siigo .integration-mark img{width:62px;height:42px}
 .integration-tile>span:last-child{font-size:.61rem}
 .ecosystem-bridge{flex-direction:row;width:100%;height:22px}
 .ecosystem-bridge::before{top:50%;right:calc(50% + 17px);left:calc(50% + 17px);height:1px;background:linear-gradient(90deg,transparent,rgba(115,158,103,.48),transparent)}
 .ecosystem-bridge i{transform:rotate(90deg)}
 .ecosystem-engine{width:258px;flex:none;align-self:center}
 .ecosystem-area-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
 .ecosystem-area{grid-template-columns:1fr;justify-items:center;gap:7px;min-height:112px;padding:13px 8px;text-align:center}
 .area-mark{width:59px;height:59px;border-radius:18px}
 .area-mark img{width:47px;height:47px}
 .ecosystem-area>span:nth-child(2){justify-content:center;min-height:0}
 .ecosystem-area>span strong{font-size:.7rem}
}
@media(max-width:620px){
 .ecosystem-section{padding-block:49px}
 .ecosystem-heading{align-items:center;margin-bottom:17px}
 .ecosystem-heading h2{font-size:clamp(2.1rem,8.8vw,2.65rem)}
 .ecosystem-scale{width:79px;height:46px}
 .ecosystem-scale::before{right:13px;left:13px}
 .ecosystem-scale>i{width:11px;height:11px;border-width:2px}
 .ecosystem-scale>b{width:29px;height:29px;font-size:.49rem;box-shadow:0 0 0 4px rgba(156,205,111,.14),0 4px 12px rgba(69,117,57,.16)}
 .ecosystem-shell{border-radius:23px}
 .ecosystem-shell::before{display:none}
 .ecosystem-flow{gap:10px;padding:16px 12px 17px}
 .ecosystem-stage-heading h3{font-size:.52rem}
 .integration-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .integration-tile{flex-direction:row;justify-content:flex-start;gap:9px;min-height:62px;padding:8px 11px;border-radius:15px}
 .integration-mark{width:43px;height:43px}
 .integration-mark img{width:31px;height:31px}
 .integration-siigo .integration-mark{width:48px;height:43px}
 .integration-siigo .integration-mark img{width:48px;height:34px}
 .integration-tile>span:last-child{font-size:.65rem}
 .ecosystem-bridge{height:18px}
 .ecosystem-bridge::before{right:calc(50% + 16px);left:calc(50% + 16px)}
 .ecosystem-bridge i{width:26px;height:26px;font-size:.77rem}
 .ecosystem-engine{width:242px;padding:16px}
 .ecosystem-engine-mark{width:59px;height:59px}
 .ecosystem-engine>small{font-size:.36rem;letter-spacing:.12em}
 .ecosystem-engine h3{margin:7px 0 12px;font-size:1.04rem}
 .engine-capabilities{gap:7px}
 .engine-capabilities span{width:31px;height:31px}
 .engine-capabilities img{width:20px;height:20px}
 .ecosystem-area-list{grid-template-columns:1fr;gap:8px}
 .ecosystem-area{grid-template-columns:53px minmax(0,1fr);justify-items:stretch;gap:11px;min-height:72px;padding:8px 12px;border-radius:15px;text-align:left}
 .area-mark{width:53px;height:53px;border-radius:16px}
 .area-mark img{width:43px;height:43px}
 .ecosystem-area>span:nth-child(2){justify-content:flex-start;min-height:44px}
 .ecosystem-area>span strong{font-size:.76rem}
}
@media(max-width:360px){
 .ecosystem-heading h2{max-width:205px;font-size:2.02rem}
 .ecosystem-scale{flex-direction:row;align-items:center;width:66px;height:34px;text-align:initial}
 .ecosystem-scale::before{right:11px;left:11px}
 .ecosystem-scale>i{width:9px;height:9px}
 .ecosystem-scale>b{width:25px;height:25px;font-size:.43rem}
 .ecosystem-flow{padding-inline:10px}
 .ecosystem-engine{width:228px}
 .integration-grid{gap:6px}
 .integration-tile{padding-inline:8px}
}
@media(prefers-reduced-motion:reduce){.ecosystem-wires path,.integration-tile,.ecosystem-area{animation:none;transition:none}}
