/* Mazrio WordPress extras: mobile menu, sticky CTA, back-to-top, reveal, focus polish. */
.mbtn{display:none;width:44px;height:44px;border:1px solid var(--l);border-radius:12px;background:#fff;cursor:pointer;align-items:center;justify-content:center;padding:0;flex:none}
.mbtn .mbar,.mbtn .mbar:before,.mbtn .mbar:after{display:block;width:18px;height:2px;border-radius:2px;background:var(--n);transition:transform .2s,opacity .2s;content:""}
.mbtn .mbar{position:relative}.mbtn .mbar:before{position:absolute;top:-6px}.mbtn .mbar:after{position:absolute;top:6px}
.mbtn[aria-expanded=true] .mbar{background:transparent}.mbtn[aria-expanded=true] .mbar:before{transform:translateY(6px) rotate(45deg)}.mbtn[aria-expanded=true] .mbar:after{transform:translateY(-6px) rotate(-45deg)}
.mnav{border-top:1px solid var(--l);background:#fff;box-shadow:0 24px 40px -24px rgba(11,27,77,.35);max-height:calc(100dvh - 68px);overflow:auto}
.mnav[hidden]{display:none}
.mnav nav{display:flex;flex-direction:column;padding-block:10px}
.mnav nav a{display:flex;align-items:center;min-height:52px;font-size:18px;font-weight:500;text-decoration:none;color:var(--t);border-bottom:1px solid var(--m)}
.mnav nav a[aria-current=page]{color:var(--n);font-weight:700}
.mnav nav a[aria-current=page]:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);margin-inline-end:10px}
.mrow{display:flex;gap:12px;align-items:center;justify-content:space-between;padding-block:14px 22px}.mrow .btn{flex:1}
@media(max-width:980px){.mbtn{display:inline-flex}}
@media(min-width:981px){.mnav{display:none!important}}
header.sc{box-shadow:0 10px 30px -22px rgba(11,27,77,.55)}
/* sticky early-access bar (phones) */
.stk{display:none}
@media(max-width:620px){
 .stk{display:flex;position:fixed;inset-inline:12px;bottom:12px;z-index:25;min-height:52px;align-items:center;justify-content:center;border-radius:14px;background:var(--c);color:var(--n);font-weight:700;text-decoration:none;box-shadow:0 16px 34px -12px rgba(11,27,77,.55);transform:translateY(140%);transition:transform .25s}
 .stk.on{transform:none}
 body{padding-bottom:0}.ft{padding-bottom:96px}
}
.totop{position:fixed;inset-inline-end:16px;bottom:84px;width:44px;height:44px;border-radius:50%;border:1px solid var(--l);background:#fff;box-shadow:0 10px 24px -10px rgba(11,27,77,.5);cursor:pointer;z-index:24;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:.2s}
.totop svg{width:22px;height:22px;fill:none;stroke:var(--n);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.totop.on{opacity:1;transform:none}.totop[hidden]{display:none}
@media(min-width:621px){.totop{bottom:22px}}
/* scroll reveal (only when JS has added .js-rv to <html>) */
.js-rv .rv{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.js-rv .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js-rv .rv{opacity:1;transform:none;transition:none}.stk,.totop{transition:none}}
/* focus polish */
:focus-visible{outline:3px solid #6E7BFF;outline-offset:3px;border-radius:6px}
.hero :focus-visible,.ft :focus-visible{outline-color:#fff}
/* better tap targets + readable measure */
.card p,.head p,.sub{max-width:68ch}
::selection{background:#FF4D5A33}

/* ===================== Integrations: light "network" ===================== */
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.hubw{--g1:#6E7BFF;--g2:#FF4D5A;--g3:#12B886;position:relative;margin-top:12px;padding:clamp(18px,3vw,36px) 0 0;isolation:isolate}
.hubw:before{content:"";position:absolute;inset:-10px -10px 0;z-index:-1;opacity:.9;
 background-image:radial-gradient(circle,#6E7BFF33 1.2px,transparent 1.6px);background-size:26px 26px;
 -webkit-mask:radial-gradient(ellipse at 50% 15%,#000 15%,transparent 70%);mask:radial-gradient(ellipse at 50% 15%,#000 15%,transparent 70%);animation:gridmove 16s linear infinite}
@keyframes gridmove{to{background-position:26px 26px}}

.hub{position:relative;background:var(--n);border-radius:20px;padding:14px 22px 14px 14px;gap:14px;box-shadow:0 22px 44px -20px rgba(11,27,77,.55),0 0 50px -12px #6E7BFF88;border:0}
.hub:before{content:"";position:absolute;inset:-2px;border-radius:22px;padding:2px;z-index:-1;background:conic-gradient(from var(--ang),#6E7BFF,#FF4D5A,#12B886,#6E7BFF);animation:spin 6s linear infinite;
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
@keyframes spin{to{--ang:360deg}}
.hub:after{content:"LIVE";position:absolute;inset-inline-end:-10px;top:-10px;font:700 10.5px/1 Outfit,sans-serif;letter-spacing:.12em;color:#fff;background:var(--g3);padding:5px 8px 5px 18px;border-radius:99px;box-shadow:0 6px 14px -4px #12B88699}
.hub b{color:#fff}
.hubic{position:relative;background:linear-gradient(135deg,#6E7BFF,#FF4D5A);box-shadow:0 0 20px #6E7BFF77}
.hubic:before,.hubic:after{content:"";position:absolute;inset:0;border-radius:12px;border:1.5px solid #6E7BFF;opacity:0;animation:ring 2.8s ease-out infinite}
.hubic:after{animation-delay:1.4s;border-color:#FF4D5A}
@keyframes ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.1);opacity:0}}

.wires{height:84px}
.wires path{stroke:#6E7BFF;stroke-opacity:.55;stroke-width:1.6;stroke-dasharray:3 7;animation:flow 1.1s linear infinite}
.wires path:nth-of-type(2){stroke:#12B886}.wires path:nth-of-type(3){stroke:#FF4D5A}
@keyframes flow{to{stroke-dashoffset:-20}}
.wires .pulse{fill:var(--c);filter:drop-shadow(0 0 5px #FF4D5A) drop-shadow(0 0 10px #6E7BFF88);r:4.5}
.wires .pulse:nth-of-type(2){fill:#12B886;filter:drop-shadow(0 0 6px #12B886)}

.ig{position:relative;background:#fff;border:1px solid var(--l);border-radius:20px;overflow:hidden;box-shadow:0 1px 2px rgba(11,27,77,.04),0 18px 36px -28px rgba(11,27,77,.3);transition:transform .25s,border-color .25s,box-shadow .25s}
.ig:before{content:"";position:absolute;inset-inline:0;top:0;height:3px;background:linear-gradient(90deg,var(--g1),var(--g2));opacity:.85}
.ig:hover{transform:translateY(-4px);border-color:#6E7BFF88;box-shadow:0 26px 50px -26px #6E7BFF88,0 0 0 1px #6E7BFF33}
.ig .flow svg{stroke:var(--g2)}
.ig li{position:relative;border-radius:8px;transition:padding-inline-start .2s,background .2s}
.ig li:hover{padding-inline-start:8px;background:#F6F7FD}
.ig li:after{content:"";margin-inline-start:auto;flex:none;width:8px;height:8px;border-radius:50%;background:var(--g3);box-shadow:0 0 0 0 #12B88688;animation:ping 2.6s ease-out infinite}
.ig li:nth-child(2):after{animation-delay:.7s}.ig li:nth-child(3):after{animation-delay:1.3s}
@keyframes ping{0%{box-shadow:0 0 0 0 #12B88699}70%,100%{box-shadow:0 0 0 9px #12B88600}}
.igs{gap:18px}
.js-rv .igs .ig.rv:nth-child(2){transition-delay:.12s}.js-rv .igs .ig.rv:nth-child(3){transition-delay:.24s}
@media(max-width:980px){
 .hub{margin-bottom:34px}
 .hubw .igs{position:relative}
 .hubw .igs:before{content:"";position:absolute;inset-inline-start:50%;top:-34px;height:34px;width:2px;background:repeating-linear-gradient(#6E7BFF 0 4px,transparent 4px 9px);animation:flowv 1s linear infinite}
}
@keyframes flowv{to{background-position:0 9px}}
@media(prefers-reduced-motion:reduce){.hubw:before,.hub:before,.hubic:before,.hubic:after,.wires path,.ig li:after{animation:none}.hubic:before,.hubic:after{opacity:0}}

/* ============================= Footer refresh ============================= */
.ft{position:relative;overflow:hidden;isolation:isolate;color:#B4BCD9;
 background:radial-gradient(800px 380px at 90% 0,#3b2dbf40,transparent 60%),radial-gradient(700px 340px at 0 100%,#ff4d5a26,transparent 60%),linear-gradient(180deg,#0A1240 0%,#050A26 100%)}
.ft:before{content:"";position:absolute;inset-inline:0;top:0;height:3px;background:linear-gradient(90deg,#6E7BFF,#FF4D5A,#2EE6A6,#6E7BFF);background-size:300% 100%;animation:ftline 9s linear infinite}
.ft:after{content:"";position:absolute;inset:0;z-index:-1;opacity:.4;pointer-events:none;
 background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:44px 44px;
 -webkit-mask:linear-gradient(180deg,#000,transparent 70%);mask:linear-gradient(180deg,#000,transparent 70%)}
@keyframes ftline{to{background-position:300% 0}}
.ft :is(h4,.hx4){color:#fff;display:flex;align-items:center;gap:8px}
.ft .fc :is(h4,.hx4):before{content:"";width:6px;height:6px;border-radius:2px;background:var(--c);box-shadow:0 0 10px #FF4D5A}
.ft .fc a{position:relative;display:inline-flex;align-items:center;min-height:32px;color:#DCE1F2;transition:color .2s,transform .2s}
.ft .fc a:hover{color:#fff;text-decoration:none;transform:translateX(4px)}
main[lang=ar] .ft .fc a:hover{transform:translateX(-4px)}
.ft .fc a:after{content:"";position:absolute;inset-inline:0;bottom:4px;height:1px;background:linear-gradient(90deg,var(--c),transparent);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.ft .fc a:hover:after{transform:scaleX(1)}
main[lang=ar] .ft .fc a:after{transform-origin:right}
.ftop,.fbot{border-color:#ffffff1a}
.askai{background:linear-gradient(135deg,#ffffff14,#ffffff06);border:1px solid #ffffff26;backdrop-filter:blur(10px);box-shadow:0 30px 60px -40px #6E7BFF}
.aib{transition:transform .2s,background .2s,border-color .2s}.aib:hover{transform:translateY(-2px);background:#6E7BFF33;border-color:#6E7BFF}
.ft .of a{color:#fff}
.fbot{color:#8F98BD}.fbot a{color:#C6CCE6}
.fbot span:first-child:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#2EE6A6;margin-inline-end:10px;box-shadow:0 0 10px #2EE6A6;animation:ping 2.6s ease-out infinite}
@media(prefers-reduced-motion:reduce){.ft:before,.fbot span:first-child:before{animation:none}.ft .fc a,.aib{transition:none}}