/* Native responsive layout: photographs and text are never scaled or tilted. */
.ecosystem{position:relative;min-width:0;margin:0;color:#1e2b3c;isolation:isolate}.eco-stage{position:relative;aspect-ratio:600/565;container-type:inline-size;border-radius:22px;background:#f1f6fb;overflow:hidden;direction:ltr}.eco-world{position:absolute;inset:0;direction:ltr;font-family:"Readex Pro",sans-serif}.eco-world:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,58%),#fff,transparent 58%)}
.eco-photos{position:absolute;left:3%;right:3%;top:3%;height:43%;display:flex;gap:9px;z-index:3}.eco-photo{position:relative;flex:1;min-width:0;padding:0;border:2px solid white;border-radius:13px;background:#fff;overflow:hidden;cursor:pointer;text-align:left;color:inherit;box-shadow:0 6px 18px #194f920b;transition:flex .65s cubic-bezier(.2,.7,.2,1),border-color .3s}.eco-photo.is-featured{flex:1.7;border-color:#194f92}.eco-photo:focus-visible{outline:3px solid #109fd1;outline-offset:2px}
.photo-image{position:relative;display:block;height:calc(100% - 36px);overflow:hidden}.photo-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--photo-x,50%) 50%}.photo-commerce img{object-position:var(--photo-x,45%) 50%}.photo-cafe img{object-position:var(--photo-x,62%) 50%}.photo-warehouse img{object-position:var(--photo-x,40%) 50%}.photo-image:after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#0c2238a6);pointer-events:none}.photo-category{position:absolute;bottom:10px;left:10px;right:8px;z-index:1;color:white;font-size:clamp(9px,2cqw,12px);line-height:1.4;font-weight:500;text-shadow:0 1px 2px #0003}.photo-footer{height:36px;display:flex;align-items:center;gap:7px;padding:0 9px;font-size:clamp(7px,1.7cqw,10px);white-space:nowrap;background:#fff}.photo-footer>span{display:flex;align-items:center;gap:4px}.platform-dot{height:4px;width:4px;background:#194f92;border-radius:50%;flex-shrink:0}.salla{background:#38b9a7}.magento{background:#ee672f}.foodics{background:#e94150}.talabat{background:#ff5900}.omniful{background:#4976d7}.photo-footer .eco-arrow{margin-left:auto;font-size:12px;color:#194f92}.eco-photo:not(.is-featured) .eco-arrow{display:none}
.eco-paths{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}.eco-route path{fill:none;stroke:#bed0e5;stroke-width:1.6;stroke-linecap:round;transition:stroke .3s,stroke-width .3s}.eco-route.out path{stroke:#a5d8e9}.eco-route circle{fill:#194f92;stroke:#fff;stroke-width:1.3}.eco-route.out circle{fill:#109fd1}.eco-route.is-active path{stroke:#194f92;stroke-width:3}.eco-route.out.is-active path{stroke:#109fd1}.eco-orbit{position:absolute;width:39%;height:37%;left:30.5%;top:47.5%;border:1px solid #109fd120;border-radius:50%;pointer-events:none}.orbit-two{inset:45% auto auto 28%;width:44%;height:42%;border:1px dashed #194f9214;animation:eco-orbit 50s linear infinite}
.eco-hub{position:absolute;left:30%;top:52%;width:40%;height:27%;z-index:4}.hub-depth{display:none}.hub-face{position:absolute;inset:0;overflow:hidden;background:#fff;border:1px solid #a9c6e1;border-radius:15px;padding:clamp(10px,2.4cqw,16px);box-shadow:0 8px 20px #194f9210,0 0 0 5px #ffffffb3}.hub-head{display:flex;align-items:center;gap:6px;font-size:clamp(6px,1.5cqw,9px);font-weight:600;letter-spacing:.11em;color:#6381a0;margin-bottom:3px}.hub-head img{width:clamp(18px,4cqw,24px);height:auto;object-fit:contain}.hub-head>i{margin-left:auto;width:5px;height:5px;background:#109fd1;border-radius:50%;animation:eco-status 2.5s ease-in-out infinite}.hub-face>strong{display:block;color:#194f92;font-size:clamp(19px,4.3cqw,27px);font-weight:600;line-height:1.4;letter-spacing:-.025em}.hub-description{display:block;color:#607993;font-size:clamp(7px,1.8cqw,10px);line-height:1.5}.hub-mini{display:flex;align-items:center;gap:10px;height:clamp(21px,5.5cqw,33px);margin-top:7px}.mini-chart{height:90%;display:flex;align-items:flex-end;gap:clamp(3px,.7cqw,5px)}.mini-chart>i{height:var(--bar,40%);width:clamp(4px,1.1cqw,7px);background:#194f92;border-radius:2px 2px 0 0;transform-origin:bottom;animation:eco-bar 3.2s ease-in-out infinite}.mini-chart>i:nth-child(2){--bar:55%;animation-delay:-.2s}.mini-chart>i:nth-child(3){--bar:45%;animation-delay:-.4s}.mini-chart>i:nth-child(4){--bar:70%;animation-delay:-.6s}.mini-chart>i:nth-child(5){--bar:58%;animation-delay:-.8s}.mini-chart>i:nth-child(6){--bar:90%;background:#109fd1;animation-delay:-1s}.mini-chart>i:nth-child(7){--bar:78%;background:#109fd1;animation-delay:-1.2s}.mini-chart>i:nth-child(8){--bar:100%;background:#109fd1;animation-delay:-1.4s}.mini-rows{width:20%;display:grid;gap:4px}.mini-rows i{height:3px;background:#d1deec;border-radius:2px}.mini-rows i:nth-child(2){width:70%}.mini-ring{height:clamp(20px,5cqw,29px);aspect-ratio:1;border:4px solid #e0eaf4;border-top-color:#194f92;border-right-color:#109fd1;border-radius:50%;margin-left:auto;animation:eco-orbit 12s linear infinite}.hub-bottom{display:flex;justify-content:space-between;align-items:center;font-size:clamp(6px,1.5cqw,9px);line-height:1.5;color:#6e87a0;margin-top:5px}.hub-sync{font-size:16px;color:#109fd1;line-height:1}.eco-hub:after{content:"";position:absolute;inset:-8px;border:1px solid #109fd1;border-radius:23px;z-index:-1;pointer-events:none;animation:eco-ping 3.6s ease-out infinite}
.eco-crm,.eco-message,.eco-zatca{position:absolute;top:86%;height:10%;z-index:3;padding:0 10px;border:1px solid #d7e4f0;border-radius:11px;background:#fff;display:flex;align-items:center;gap:8px;cursor:pointer;text-align:left;color:#234360;transition:border-color .3s,background .3s}.eco-crm{left:3%;width:27%}.eco-crm>img{width:35%;height:auto;max-height:36px;object-fit:contain;flex-shrink:0}.eco-crm>span{font-size:clamp(7px,1.7cqw,10px);line-height:1.5}.eco-message{left:34%;width:32%;flex-direction:column;align-items:stretch;justify-content:center;gap:2px;padding:5px 10px}.message-title{display:flex;align-items:center;gap:5px;font-size:clamp(8px,2cqw,12px);font-weight:500}.message-title>svg{width:clamp(15px,3.7cqw,22px);height:auto}.message-title>span{margin-left:auto;font-size:12px;color:#6f8ca7}.message-bubble{display:flex;align-items:center;gap:4px;white-space:nowrap;font-size:clamp(5px,1.3cqw,8px);line-height:1.6;color:#527064}.message-check{color:#368b67}.message-bubble>i{font-style:normal;color:#109fd1;margin-left:auto;letter-spacing:-2px}.message-caption{display:none}.eco-zatca{left:70%;width:27%}.eco-zatca strong{display:block;font-size:clamp(10px,2.4cqw,14px);font-weight:500}.eco-zatca small{display:block;font-size:clamp(6px,1.5cqw,9px);line-height:1.5;color:#73879b;white-space:nowrap}.zatca-icon{width:clamp(16px,3.8cqw,23px);height:clamp(19px,4.5cqw,27px);display:grid;grid-template-columns:1fr 1fr;gap:2px;flex-shrink:0}.zatca-icon i{background:#517e6d;border-radius:2px}.zatca-icon i:nth-child(2),.zatca-icon i:nth-child(3){background:#bca97c}.zatca-check{margin-left:auto;color:#408568;font-size:12px}.eco-crm.is-active,.eco-message.is-active,.eco-zatca.is-active{border-color:#109fd1;background:#fbfeff}.eco-floor{display:none}
.eco-caption{padding:14px 5px 0}.eco-story{display:flex;align-items:flex-start;gap:10px;min-height:36px;font-size:11px;color:#42617d;line-height:1.6}.story-step{font-size:10px;color:#109fd1;font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:1px}.story-text[hidden]{display:none}.eco-legend{display:none}.ecosystem.is-paused *{animation-play-state:paused!important}
@keyframes eco-orbit{to{transform:rotate(360deg)}}@keyframes eco-status{50%{box-shadow:0 0 0 5px #109fd118}}@keyframes eco-bar{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.55)}}@keyframes eco-ping{0%{opacity:.3;transform:scale(1)}80%,100%{opacity:0;transform:scale(1.09)}}
html[lang=ar] .eco-caption{direction:rtl}html[lang=ar] .photo-category{direction:rtl;text-align:right;right:10px;left:8px}html[lang=ar] .hub-description{direction:rtl;text-align:left}html[lang=ar] .hub-face>strong{font-size:clamp(16px,4cqw,25px)}
@media(min-width:961px){.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:48px}.hero{padding-block:38px 60px}}@media(max-width:640px){.eco-photos{gap:5px}.eco-photo{border-radius:10px}.photo-footer{height:30px;padding-inline:5px;gap:5px}.photo-image{height:calc(100% - 30px)}.photo-category{left:7px;bottom:7px}.eco-crm,.eco-message,.eco-zatca{padding-inline:7px;border-radius:9px;gap:5px}.hub-head{letter-spacing:.05em}.hub-face{border-radius:12px}.hub-mini{margin-top:4px}.eco-stage{border-radius:16px}.eco-caption{padding-top:12px}.eco-story{font-size:10px}}
.eco-hub{top:51%;height:30%}
@media(max-width:640px){.eco-hub{top:50%;height:32%}.hub-bottom{display:none}}
/* Website and HRMS beside the core, SEAM in the row below it, and Ask Baba as the last layer, reading it all. */
.eco-stage{aspect-ratio:600/680}.eco-photos{top:2.5%;height:35%}.eco-hub{top:42%;height:25%}.eco-orbit{top:39%;height:31%}.orbit-two{top:37%;height:35%}.aggregators{background:#ff5900}
.eco-node{position:absolute;top:45.5%;height:18%;width:22%;z-index:3;padding:8px;border:1px solid #d7e4f0;border-radius:11px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;text-align:center;color:#234360;transition:border-color .3s,background .3s}.eco-web{left:3%}.eco-hrms{left:75%}
.node-icon{width:clamp(22px,5.4cqw,32px);aspect-ratio:1;display:grid;place-items:center;border-radius:9px;background:#eef5fb;color:#194f92;flex-shrink:0}.node-icon svg{width:64%;height:64%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.node-text strong{display:block;font-size:clamp(8px,2.1cqw,13px);font-weight:500;line-height:1.3}.node-text small{display:block;font-size:clamp(6px,1.5cqw,9px);line-height:1.4;color:#73879b}
.eco-crm,.eco-message,.eco-zatca{top:71%;height:8.5%}.eco-crm>img{width:44%}
.eco-askbaba{position:absolute;left:3%;width:94%;top:83.5%;height:13%;z-index:3;padding:0 clamp(10px,2.6cqw,18px);border:1px solid #a9c6e1;border-radius:14px;background:linear-gradient(100deg,#fff 55%,#eef7fc);display:flex;align-items:center;gap:clamp(8px,2.4cqw,16px);cursor:pointer;text-align:left;color:#234360;box-shadow:0 8px 20px #194f9210,0 0 0 5px #ffffffb3;transition:border-color .3s,background .3s}.ab-logo{width:24%;height:auto;flex-shrink:0}.ab-text strong{display:block;color:#194f92;font-size:clamp(9px,2.4cqw,15px);font-weight:600;line-height:1.3}.ab-text small{display:block;font-size:clamp(6px,1.6cqw,10px);line-height:1.5;color:#607993}
.ab-mini{margin-left:auto;display:flex;align-items:center;gap:clamp(6px,1.6cqw,10px);height:52%}.ab-mini .mini-chart{height:100%}.ab-chat{display:grid;gap:3px;align-content:center;width:clamp(26px,6.5cqw,40px);height:80%;padding:0 5px;border-radius:8px 8px 8px 2px;background:#194f92}.ab-chat i{height:2.5px;border-radius:2px;background:#ffffffc0}.ab-chat i:nth-child(2){width:60%}
.eco-node.is-active,.eco-askbaba.is-active{border-color:#109fd1;background:#fbfeff}
html[lang=ar] .node-text,html[lang=ar] .ab-text{direction:rtl}html[lang=ar] .ab-text{text-align:right}
@media(max-width:640px){.photo-footer{flex-wrap:wrap;align-content:center;row-gap:1px;line-height:1.25}.eco-hub{top:41.5%;height:26.5%}.eco-node{padding:5px;gap:4px;border-radius:9px}.node-text small{display:none}.ab-mini{display:none}.eco-askbaba{border-radius:11px}}
@media(prefers-reduced-motion:reduce){.ecosystem *{animation:none!important;transition:none!important}}