:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--bg:#fff;--off:#f6f7f9;--ink:#0d1117;--mut:#5b6573;--ac:#2563eb;--ac2:#60a5fa;--line:#e6e9ee;--sh:0 10px 40px rgba(13,17,23,.07)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*:before,*:after{box-sizing:inherit;margin:0}
i.fa-solid,i.fa-brands{display:inline-block;font-style:normal;line-height:1}.fl i{display:block}
body{background:var(--bg);color:var(--ink);font:400 clamp(17px,1.2vw,19px)/1.9 "IBM Plex Sans Arabic",Tahoma,sans-serif;overflow-x:hidden}
h1,h2,h3{font-family:Tajawal,"IBM Plex Sans Arabic",sans-serif;font-weight:900;line-height:1.45}
h2{font-size:clamp(34px,5.5vw,76px)}
a{color:inherit;text-decoration:none}
.w{max-width:1240px;margin:auto;padding:0 24px}
.ac{background:linear-gradient(90deg,var(--ac),var(--ac2));-webkit-background-clip:text;background-clip:text;color:transparent;padding:.25em .08em;margin:-.25em -.08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
#pg{position:fixed;top:0;right:0;height:3px;width:0;background:var(--ac);z-index:100}
header{position:fixed;top:0;inset-inline:0;z-index:90;padding:14px 0;padding-top:calc(14px + env(safe-area-inset-top,0px));transition:.3s}
header.s{background:rgba(255,255,255,.72);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
header .w{display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{display:flex;align-items:center}.lg{height:40px;width:auto;display:block}.hl{height:clamp(54px,8vw,84px);margin:0 auto 22px}
nav{display:flex;gap:6px;font-weight:700;font-size:16px}nav a{display:flex;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;transition:.3s}nav a i{color:var(--ac);font-size:15px}nav a:hover{background:var(--off)}nav a.on{background:#eaf1ff;color:var(--ac);box-shadow:inset 0 0 0 1.5px rgba(37,99,235,.35)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 26px;border-radius:99px;background:var(--ink);color:#fff;font-weight:700;border:0;cursor:pointer;font-family:inherit;font-size:16px;transition:.3s}
.btn:hover{background:var(--ac);box-shadow:0 12px 30px rgba(37,99,235,.35)}
.btn.o{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}.btn.o:hover{color:#fff;background:var(--ink)}
.btn i{transition:.3s}.btn:hover i{transform:translateX(-5px)}
#bg{position:fixed;inset:0;z-index:-1;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/80px 80px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/80px 80px;opacity:.45;mask-image:radial-gradient(circle at 50% 30%,#000,transparent 70%);-webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 70%)}
.hero{min-height:100vh;display:grid;place-items:center;text-align:center;position:relative;padding:130px 0 80px}
.hero .brand{font:900 20px Tajawal;letter-spacing:.5px;color:var(--ac);margin-bottom:18px;display:block}
.hero h1{font-size:clamp(42px,8vw,118px);margin-bottom:26px}
.hero h1 span{display:inline-block;margin:0 .1em}
.hero p{max-width:720px;margin:0 auto 34px;color:var(--mut)}
.hero .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.orb{position:absolute;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--ac2),var(--ac));opacity:.14;filter:blur(2px);pointer-events:none}
.chip{position:absolute;background:#fff;border-radius:16px;padding:10px 16px;box-shadow:var(--sh);font-size:14px;font-weight:500;display:flex;gap:8px;align-items:center}
.chip i{color:var(--ac)}
/* story */
#story{height:100vh;position:relative;background:var(--off)}
.scene{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;max-width:1240px;margin:auto;padding:0 24px;opacity:0}
.scene h2{font-size:clamp(34px,5vw,68px)}.scene small{color:var(--ac);font-weight:700;display:block;margin-bottom:10px}
.vis{justify-self:center;width:min(340px,70vw);aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:var(--sh);display:grid;place-items:center;font-size:clamp(80px,12vw,140px);color:var(--ac);position:relative}
.vis:after{content:"";position:absolute;inset:-22px;border-radius:50%;border:1.5px dashed var(--ac2);opacity:.6}
.dots{position:absolute;inset-inline-start:24px;top:50%;display:flex;flex-direction:column;gap:10px}
.dots b{width:8px;height:8px;border-radius:50%;background:var(--line);transition:.3s}.dots b.on{background:var(--ac);transform:scale(1.5)}
/* flow */
.sec{padding:clamp(80px,12vw,160px) 0}
.flow{display:flex;flex-wrap:wrap;gap:18px 0;margin-top:60px;align-items:center}
.node{display:flex;align-items:center;gap:12px;background:#fff;border-radius:99px;padding:12px 22px;box-shadow:var(--sh);font-weight:700}
.node i{color:var(--ac)}
.link{width:36px;height:2px;background:linear-gradient(90deg,var(--ac),var(--ac2));transform-origin:right;flex:none}
/* services */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:22px;margin-top:56px}
.card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px;display:flex;flex-direction:column;gap:12px;min-height:310px;transition:transform .4s,box-shadow .4s,background .4s}
.card:hover{transform:translateY(-8px);box-shadow:var(--sh);background:linear-gradient(160deg,#fff,#eef4ff)}
.card .n{position:absolute;left:22px;top:16px;direction:ltr;font:900 84px/1 Tajawal;color:var(--ac);opacity:.2;transition:.4s;pointer-events:none;z-index:1}
.card:hover .n{opacity:.45;transform:scale(1.08)}
.card>*:not(.fl):not(.n){position:relative;z-index:1}
.fl{position:absolute;inset:0;pointer-events:none;color:var(--ac);overflow:hidden}
.fl i{position:absolute;opacity:.14;--r:0deg;transform:rotate(var(--r));animation:fy 4s ease-in-out infinite;transition:opacity .4s;will-change:transform}
.card:hover .fl i{opacity:.24}
.fl i:nth-child(1){left:16px;bottom:64px;font-size:88px;--r:-12deg}
.fl i:nth-child(2){left:112px;bottom:14px;font-size:46px;--r:10deg;animation-delay:-1.3s;animation-duration:3.4s}
.fl i:nth-child(3){left:20px;top:112px;font-size:34px;--r:-6deg;animation-delay:-2.6s;animation-duration:4.8s}
@keyframes fy{50%{transform:translateY(-18px) rotate(calc(var(--r) + 10deg))}}
.card .ic{width:58px;height:58px;border-radius:18px;background:var(--off);display:grid;place-items:center;font-size:24px;color:var(--ac);transition:.4s}
.card:hover .ic{transform:rotate(-8deg) scale(1.1);background:var(--ac);color:#fff}
.card h3{font-size:25px}.card p{color:var(--mut);font-size:16px;line-height:1.8}
.card .go{margin-top:auto;font-weight:700;display:flex;gap:8px;align-items:center;color:var(--ac)}.card:hover .go i{transform:translateX(-6px)}.go i{transition:.3s}
/* steps */
.tl{position:relative;margin-top:60px;padding-inline-start:60px}
.tl:before{content:"";position:absolute;inset-inline-start:19px;top:0;bottom:0;width:2px;background:var(--line)}
.tl .fill{position:absolute;inset-inline-start:19px;top:0;width:2px;height:0;background:var(--ac)}
.st{position:relative;padding:18px 0 34px}
.st:before{content:attr(data-n);position:absolute;inset-inline-start:-60px;top:18px;width:40px;height:40px;border-radius:50%;background:#fff;border:2px solid var(--ac);display:grid;place-items:center;font:700 14px Tajawal}
.st h3{font-size:clamp(24px,3vw,38px)}
/* seo/ads */
.band{background:var(--off)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.mock{background:#fff;border-radius:24px;box-shadow:var(--sh);padding:22px}
.bar{display:flex;gap:10px;align-items:center;background:var(--off);border-radius:99px;padding:10px 18px;color:var(--mut);margin-bottom:16px;font-size:15px}
.res{padding:14px 10px;border-radius:14px;margin-bottom:6px;border:1px solid transparent}
.res .sl{display:flex;gap:10px;align-items:center;margin-bottom:4px}
.res .fv{width:28px;height:28px;border-radius:50%;background:var(--off);display:grid;place-items:center;font-size:13px;color:var(--mut)}
.res strong{display:block;font-size:14px;line-height:1.3;color:#202124}.res small{display:block;font-size:12px;color:#4d5156;direction:ltr;text-align:right}
.res h4{font:500 19px/1.5 "IBM Plex Sans Arabic";color:#1a0dab;margin:2px 0}
.res p{font-size:14px;line-height:1.7;color:#4d5156}
.res.me{border-color:var(--ac2);background:#f3f8ff}.res.me .fv{background:var(--ac);color:#fff}
.res.g{opacity:.6}.bd{display:inline-block;font-style:normal;font-size:12px;font-weight:700;background:var(--ac);color:#fff;border-radius:99px;padding:1px 10px;margin-inline-start:8px}
.tabs{display:flex;gap:18px;font-size:14px;color:var(--mut);margin:0 6px 14px;border-bottom:1px solid var(--line)}.tabs span{padding-bottom:8px}.tabs .on{color:var(--ac);border-bottom:2px solid var(--ac);font-weight:700}
.note{font-size:12px;color:var(--mut);text-align:center;margin-top:8px}
.kp{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kp div{background:var(--off);border-radius:16px;padding:16px;font-weight:700}.kp i{color:var(--ac);margin-inline-end:8px}.kp small{display:block;font-size:12px;color:var(--mut);font-weight:500;letter-spacing:.4px;margin-inline-start:26px;line-height:1.4}
.kp em{display:block;height:8px;border-radius:9px;background:linear-gradient(90deg,var(--ac),var(--ac2));margin-top:10px;transform-origin:right;width:100%;transform:scaleX(.15)}
.dev{display:flex;align-items:flex-end;justify-content:center;gap:16px;height:280px}
.dev div{background:#fff;border:3px solid var(--ink);display:grid;place-items:center;color:var(--ac);font-size:30px}
.d1{width:230px;height:170px;border-radius:14px}.d2{width:120px;height:160px;border-radius:16px}.d3{width:70px;height:130px;border-radius:14px}
/* why */
.why{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.why span{padding:10px 20px;border-radius:99px;border:1px solid var(--line);background:#fff;font-weight:500}.why i{color:var(--ac);margin-inline-end:8px}
/* faq */
.q{border-bottom:1px solid var(--line)}
.q button{all:unset;box-sizing:border-box;width:100%;display:flex;justify-content:space-between;gap:20px;padding:24px 0;font:700 clamp(18px,2vw,24px) "IBM Plex Sans Arabic";cursor:pointer}
.q button i{color:var(--ac);transition:.3s}.q.o button i{transform:rotate(45deg)}
.q .a{height:0;overflow:hidden;color:var(--mut)}.q .a p{padding-bottom:24px}
/* cta */
.fin{text-align:center;background:radial-gradient(circle at 50% 0,#e8f0ff,#fff 65%)}
.fin h2{font-size:clamp(40px,7.5vw,110px);margin-bottom:24px}
.fin .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
footer{position:relative;overflow:hidden;background:#080d1a;color:#b9c3d3;font-size:16px;padding-bottom:20px}
footer:before{content:"";position:absolute;width:900px;height:900px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.45),transparent 65%);top:-460px;left:50%;translate:-50% 0;pointer-events:none}
.mq{overflow:hidden;background:var(--ac);color:#fff;padding:14px 0;font:800 22px Tajawal;position:relative;transform:rotate(-1.2deg);margin:0 -20px 70px}
.mt{display:flex;width:max-content;animation:mq 40s linear infinite}.mt div{display:flex;flex:none}.mt span{padding:0 22px;display:flex;align-items:center;gap:22px;white-space:nowrap}.mt i{font-size:14px;opacity:.7}
@keyframes mq{to{transform:translateX(50%)}}
.ft{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;position:relative}
.ft h2{color:#fff;font-size:clamp(34px,6vw,84px)}
.ft .btn{background:#fff;color:var(--ink);padding:18px 34px;font-size:18px}.ft .btn:hover{background:var(--ac2)}
.fg{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:18px;margin-top:56px;position:relative}
.gc{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:26px;padding:28px;backdrop-filter:blur(8px)}
.gc h4{color:#fff;font-size:19px;margin-bottom:14px;display:flex;gap:10px;align-items:center}.gc h4 i{color:var(--ac2)}
.gc a.l{display:flex;gap:10px;align-items:center;padding:7px 0;transition:.3s}.gc a.l i{width:20px;color:var(--ac2);transition:.3s}.gc a.l:hover{color:#fff;transform:translateX(-6px)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.fl2{filter:brightness(0) invert(1);height:46px;margin-bottom:14px}
.soc{display:flex;gap:10px;margin-top:18px}.soc a{width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.08);display:grid;place-items:center;color:#fff;transition:.3s}.soc a:hover{background:var(--ac);transform:translateY(-4px)}
.big{font:900 clamp(64px,19vw,300px)/1.5 Tajawal;text-align:center;margin-top:50px;background:linear-gradient(180deg,rgba(96,165,250,.55),rgba(96,165,250,0) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1.5px rgba(96,165,250,.35);user-select:none;position:relative}
.cp{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);position:relative}
.cp a{color:var(--ac2)}.cp a:hover{color:#fff}
.up{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;transition:.3s}.up:hover{background:var(--ac);transform:translateY(-6px)}
#cur{position:fixed;width:14px;height:14px;border-radius:50%;background:var(--ac);z-index:200;pointer-events:none;mix-blend-mode:multiply;transform:translate(-50%,-50%)}
.burger{display:none;background:none;border:0;font-size:22px;cursor:pointer;color:var(--ink)}
#mm{position:fixed;inset:0;background:var(--off);z-index:95;display:none;flex-direction:column;gap:12px;padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px))}
.mh{display:flex;justify-content:space-between;align-items:center;padding:0 6px}
.mx{width:46px;height:46px;border-radius:50%;border:0;background:#fff;box-shadow:var(--sh);font-size:20px;cursor:pointer;color:var(--ink)}
.mg{flex:1;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px;min-height:0}
.mg a{background:#fff;border-radius:24px;box-shadow:var(--sh);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font:800 clamp(22px,6.5vw,30px) Tajawal;text-align:center}
.mg a i{font-size:32px;color:var(--ac)}
.mg a.on{background:var(--ink);color:#fff}.mg a.on i{color:var(--ac2)}
.mcta{justify-content:center;padding:18px;font-size:19px}
@media(max-width:1100px){nav a i{display:none}}
@media(max-width:860px){nav,.hd-btn{display:none}.burger{display:block}.scene,.split,.fg{grid-template-columns:1fr}.scene{text-align:center;align-content:center;gap:20px}.vis{width:200px;font-size:80px}.chip,#cur{display:none}.mq{font-size:18px}.dots{display:none}.dev{height:220px}.d1{width:150px}}
@media(pointer:coarse){#cur{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.ah{padding:calc(130px + env(safe-area-inset-top,0px)) 0 30px;position:relative}
.ah .in{max-width:940px}
.crumb{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:14px;color:var(--mut);margin-bottom:24px}.crumb a:hover{color:var(--ac)}.crumb i{font-size:10px}
.cat{display:inline-flex;gap:8px;align-items:center;background:#eaf1ff;color:var(--ac);padding:6px 18px;border-radius:99px;font-weight:700;font-size:14px;margin-bottom:20px}
.ah h1{font-size:clamp(34px,6vw,82px);margin-bottom:22px}.ah h1 span{display:inline-block;margin-inline-end:.22em}
.ah .lead{font-size:clamp(18px,1.6vw,22px);color:var(--mut);max-width:760px}
.meta{display:flex;gap:10px 26px;flex-wrap:wrap;color:var(--mut);font-size:15px;margin-top:26px}.meta i{color:var(--ac);margin-inline-end:8px}
.cv{height:clamp(230px,36vw,420px);border-radius:32px;background:radial-gradient(circle at 72% 28%,#dbe8ff,transparent 55%),linear-gradient(135deg,#f8faff,#eef3fd);border:1px solid var(--line);position:relative;overflow:hidden;display:grid;place-items:center;box-shadow:var(--sh);margin-top:30px}
.cv .ring{position:absolute;border-radius:50%;border:1.5px dashed var(--ac2);opacity:.55}
.cv .core{width:clamp(110px,18vw,200px);aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:var(--sh);display:grid;place-items:center;font-size:clamp(46px,8vw,92px);color:var(--ac);position:relative}
.bw{display:grid;grid-template-columns:270px 1fr;gap:64px;align-items:start;padding-top:70px;padding-bottom:40px}
.toc{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px;box-shadow:var(--sh)}
.toc h4{font:800 19px Tajawal;margin-bottom:12px;display:flex;gap:8px;align-items:center}.toc h4 i{color:var(--ac)}
.toc ol{list-style:none;padding:0}.toc ol a{display:block;padding:8px 12px;border-radius:12px;font-size:15px;line-height:1.6;color:var(--mut);transition:.3s;border-inline-start:3px solid transparent}
.toc ol a:hover{color:var(--ink);background:var(--off)}.toc ol a.on{background:#eaf1ff;color:var(--ac);font-weight:700;border-color:var(--ac)}
.sh{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}.sh a{width:42px;height:42px;border-radius:13px;background:var(--off);display:grid;place-items:center;transition:.3s}.sh a:hover{background:var(--ac);color:#fff;transform:translateY(-3px)}
.prose{max-width:760px;font-size:clamp(18px,1.5vw,21px);line-height:2.1}
.prose h2{font-size:clamp(28px,3.4vw,44px);margin:62px 0 16px;scroll-margin-top:100px}
.prose p{margin-bottom:22px;color:#2a313c}
.call{display:flex;gap:16px;background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:24px;padding:24px;margin:32px 0}.call>i{font-size:24px;color:var(--ac);margin-top:8px}.call p{margin:0}
.prose blockquote{margin:46px 0;padding:6px 26px 6px 0;border-inline-start:4px solid var(--ac);font:800 clamp(24px,3vw,36px)/1.7 Tajawal}
ol.st2{list-style:none;padding:0;counter-reset:s;margin:26px 0}
ol.st2 li{counter-increment:s;position:relative;padding:18px 20px;padding-inline-start:84px;background:#fff;border:1px solid var(--line);border-radius:22px;margin-bottom:12px;transition:.35s;line-height:1.9}
ol.st2 li:before{content:counter(s,decimal-leading-zero);position:absolute;inset-inline-start:22px;top:12px;font:900 34px Tajawal;color:var(--ac);opacity:.9}
ol.st2 li:hover{transform:translateX(-8px);box-shadow:var(--sh)}
ul.ck{list-style:none;padding:0;margin:20px 0 26px}ul.ck li{display:flex;gap:14px;margin-bottom:10px}ul.ck i{color:var(--ac);margin-top:11px}
.mid{background:var(--ink);color:#fff;border-radius:30px;padding:34px;margin:54px 0;display:flex;gap:22px;justify-content:space-between;align-items:center;flex-wrap:wrap;position:relative;overflow:hidden}
.mid:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.55),transparent 65%);top:-220px;left:-100px}
.mid>*{position:relative}.mid h3{font-size:clamp(24px,3vw,34px);line-height:1.5}.mid .btn{background:#fff;color:var(--ink)}.mid .btn:hover{background:var(--ac2)}
.au{display:flex;gap:18px;align-items:center;border:1px solid var(--line);border-radius:26px;padding:22px;margin-top:54px;background:#fff}
.au .av{width:66px;height:66px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:26px;flex:none}.au b{font:800 20px Tajawal}.au p{margin:0!important;font-size:16px;color:var(--mut)!important;line-height:1.8}
.rg{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-top:44px}
.rc{background:#fff;border:1px solid var(--line);border-radius:26px;padding:28px;display:flex;flex-direction:column;gap:14px;transition:.4s;min-height:230px}
.rc:hover{transform:translateY(-8px);box-shadow:var(--sh);background:linear-gradient(160deg,#fff,#eef4ff)}
.rc .ic{width:52px;height:52px;border-radius:16px;background:var(--off);display:grid;place-items:center;color:var(--ac);font-size:22px;transition:.4s}.rc:hover .ic{background:var(--ac);color:#fff;transform:rotate(-8deg)}
.rc h3{font-size:24px}.rc .go{margin-top:auto;color:var(--ac);font-weight:700;display:flex;gap:8px;align-items:center}
@media(max-width:960px){.bw{grid-template-columns:1fr;gap:30px;padding-top:40px}.toc{position:static}.cv .ring{display:none}}

.pt{position:fixed;inset:0;background:var(--ink);z-index:300;transform:translateY(-101%);pointer-events:none}
a.ul{background:linear-gradient(currentColor,currentColor) 100% 100%/0 1.5px no-repeat;transition:background-size .35s,color .3s}a.ul:hover{background-size:100% 1.5px}
.s1{position:relative;padding:calc(118px + env(safe-area-inset-top,0px)) 0 90px;overflow:hidden}
.bgn{position:absolute;inset-inline-start:1%;top:70px;font:900 clamp(150px,30vw,440px)/1 Tajawal;color:transparent;-webkit-text-stroke:2px rgba(37,99,235,.16);direction:ltr;pointer-events:none;user-select:none}
.bgn small{display:block;font:800 clamp(14px,1.6vw,22px) Tajawal;letter-spacing:.5em;-webkit-text-stroke:0;color:var(--ac);opacity:.7;margin-bottom:-.6em}
.hg{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;position:relative;z-index:1}
.s1 h1{font-size:clamp(44px,7vw,108px);margin:6px 0 14px}
.wm{display:inline-block;overflow:hidden;vertical-align:top;padding:.22em 0;margin:-.22em .08em -.22em 0}.wm>span{display:inline-block}
.tag{font:800 clamp(22px,2.5vw,34px)/1.6 Tajawal;margin-bottom:14px}
.s1 .lead{color:var(--mut);max-width:560px;margin-bottom:28px}
.cta2{display:flex;gap:14px;flex-wrap:wrap}
.tb2{display:inline-flex;gap:10px;align-items:center;background:#eaf1ff;color:var(--ac);padding:6px 18px;border-radius:99px;font-weight:700;font-size:14px;margin:10px 0 8px}
.hv{position:relative;height:clamp(440px,44vw,560px)}
.hc{position:absolute;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--sh);padding:18px}
.hc.a{inset-inline-end:0;top:120px;width:88%}.hc.b{inset-inline-start:0;bottom:0;width:62%}.hc.c{inset-inline-start:4%;top:0;width:44%;padding:14px}
.hc .bar{margin-bottom:12px;font-size:14px}.hc .bar span{overflow:hidden;white-space:nowrap}
.rk{display:flex;gap:10px;align-items:center;border-radius:14px;padding:10px 12px;margin-bottom:6px;border:1px solid var(--line);font-size:14px}
.rk b{width:30px;height:30px;border-radius:50%;background:var(--off);display:grid;place-items:center;color:var(--mut);flex:none;font-size:13px}
.rk.me{border-color:var(--ac2);background:#f3f8ff;font-weight:700}.rk.me b{background:var(--ac);color:#fff}.rk .up2{margin-inline-start:auto;color:#16a34a}
.kw{display:flex;gap:7px;flex-wrap:wrap}.kw span{background:var(--off);border-radius:99px;padding:5px 12px;font-size:13px;font-weight:500}.kw i{color:var(--ac);margin-inline-end:6px}
.hc h5{font:800 15px Tajawal;margin-bottom:10px;display:flex;gap:8px;align-items:center}.hc h5 i{color:var(--ac)}
.gp{width:100%;height:70px;display:block}.gp path{fill:none;stroke:var(--ac);stroke-width:3;stroke-linecap:round}.gp .f{fill:rgba(37,99,235,.08);stroke:none}
#st2{height:100vh;position:relative;background:var(--off);overflow:hidden}
.sg{max-width:1240px;margin:auto;height:100%;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.txw{position:relative;height:300px}.tx{position:absolute;inset:0;opacity:0;display:flex;flex-direction:column;justify-content:center}
.tx small{color:var(--ac);font-weight:800;display:flex;gap:10px;align-items:center;margin-bottom:14px;font-size:20px}
.tx h2{font-size:clamp(32px,4.6vw,66px)}
.sv{position:relative;height:clamp(350px,56vh,450px);background:#fff;border:1px solid var(--line);border-radius:30px;box-shadow:var(--sh);overflow:hidden}
.qb{position:absolute;inset:18px 18px auto;height:48px;border-radius:99px;background:var(--off);display:flex;align-items:center;gap:10px;padding:0 18px;color:var(--mut)}
.qb .qt{color:var(--ink);font-weight:500;white-space:nowrap}.qb .us{margin-inline-start:auto;display:flex;gap:6px;color:var(--ac);opacity:0}
.rw{position:absolute;top:0;inset-inline:18px;height:56px;border-radius:16px;border:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 14px;background:#fff}
.rw b{width:32px;height:32px;border-radius:50%;background:var(--off);display:grid;place-items:center;color:var(--mut);flex:none}
.rw .sk{flex:1}.sk i{display:block;height:8px;border-radius:8px;background:var(--line);width:62%}.sk i+i{width:38%;margin-top:6px}
.rw.me{border-color:var(--ac2);background:#f3f8ff;z-index:2}.rw.me b{background:var(--ac);color:#fff}.rw.me .sk i{background:#bcd3ff}
.rw .eb{color:var(--mut)}.rw .rb{color:#16a34a;opacity:0}
.ct{position:absolute;inset-inline:18px;bottom:16px;border-radius:18px;background:var(--ink);color:#fff;padding:14px 18px;display:flex;gap:12px;align-items:center;font-weight:700;opacity:0}.ct i{color:var(--ac2)}
.ab p{font-size:clamp(22px,2.5vw,34px);line-height:2.1;max-width:960px;margin-top:26px}
.hl{display:inline-block;font:900 1.3em/1.3 Tajawal;color:var(--ac);background:linear-gradient(transparent 64%,#dbe8ff 64%);padding:0 8px}
.py{display:flex;gap:26px;align-items:center;padding:34px 0;border-bottom:1px solid var(--line);opacity:.15}
.py .nm{font:900 clamp(54px,9vw,120px)/1 Tajawal;color:transparent;-webkit-text-stroke:2px var(--ac);min-width:1.4em;direction:ltr;text-align:center}
.py h3{font-size:clamp(26px,3.6vw,48px);display:flex;gap:14px;align-items:center}.py h3 i{color:var(--ac);font-size:.7em}.py p{color:var(--mut);margin-top:4px}
.sol{font:900 clamp(34px,5.5vw,76px)/1.5 Tajawal;margin-top:60px}
.og{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:50px}
.of{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px;display:flex;flex-direction:column;gap:12px;min-height:290px;transition:translate .4s,box-shadow .4s,background .4s}
.of:before{content:"";position:absolute;top:0;inset-inline:0;height:4px;background:linear-gradient(90deg,var(--ac),var(--ac2));transform:scaleX(0);transform-origin:right;transition:transform .5s}
.of:hover{translate:0 -6px;box-shadow:var(--sh);background:linear-gradient(160deg,#fff,#eef4ff)}.of:hover:before{transform:scaleX(1)}
.og:hover .of:not(:hover){opacity:.7}
.of .n{position:absolute;left:22px;top:14px;direction:ltr;font:900 70px/1 Tajawal;color:var(--ac);opacity:.2;transition:.4s}.of:hover .n{opacity:.5;transform:scale(1.15)}
.of .ic{width:58px;height:58px;border-radius:18px;background:var(--off);display:grid;place-items:center;font-size:24px;color:var(--ac);transition:.4s}.of:hover .ic{transform:rotate(-8deg) scale(1.1);background:var(--ac);color:#fff}
.of h3{font-size:25px}.of p{color:var(--mut);font-size:16px;line-height:1.8}.of .go{margin-top:auto;color:var(--ac);font-weight:700;display:flex;gap:8px}.of .go i{transition:.3s}.of:hover .go i{transform:translateX(-7px)}
.jn h3 i{color:var(--ac);margin-inline-end:12px;font-size:.8em}.jn p{color:var(--mut);max-width:560px}
.vw{font:900 clamp(60px,13vw,190px)/1.35 Tajawal;--p:0%;background:linear-gradient(to left,var(--ac) var(--p),rgba(13,17,23,.09) var(--p));-webkit-background-clip:text;background-clip:text;color:transparent;display:flex;align-items:center;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.vw small{font:500 clamp(16px,1.6vw,20px)/1.8 "IBM Plex Sans Arabic";-webkit-text-fill-color:var(--mut);max-width:300px}
.pls{display:flex;gap:12px;flex-wrap:wrap;margin-top:40px}
.pl{all:unset;cursor:pointer;box-sizing:border-box;padding:12px 24px;border-radius:99px;background:#fff;border:1px solid var(--line);font-weight:700;display:flex;gap:10px;align-items:center;transition:background .3s,color .3s,translate .3s,box-shadow .3s}
.pl i{color:var(--ac);transition:.3s}.pl:hover{translate:0 -3px;box-shadow:var(--sh)}.pl.on{background:var(--ink);color:#fff}.pl.on i{color:var(--ac2)}
.pd{margin-top:22px;background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:26px;padding:28px;font-size:clamp(19px,2vw,26px);line-height:1.9;display:flex;gap:18px;align-items:center;min-height:130px}.pd>i{font-size:40px;color:var(--ac)}
.ob{position:relative;height:560px;max-width:760px;margin:30px auto 0}.ol{display:none}
.ob .rg2{position:absolute;left:50%;top:50%;border:1.5px dashed var(--ac2);border-radius:50%;translate:-50% -50%;opacity:.5}
.oc{position:absolute;left:50%;top:50%;translate:-50% -50%;width:190px;height:190px;border-radius:50%;background:#fff;box-shadow:var(--sh);display:grid;place-items:center;z-index:2}.oc img{height:44px}
.oi{position:absolute;left:50%;top:50%;background:#fff;border:1px solid var(--line);border-radius:99px;padding:11px 20px;font-weight:700;white-space:nowrap;box-shadow:var(--sh);display:flex;gap:10px;align-items:center;z-index:3}.oi i{color:var(--ac)}
.cs{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:34px;padding:clamp(26px,4vw,56px);margin-top:40px;position:relative;overflow:hidden}
.cs>i.bgi{position:absolute;left:-10px;bottom:-30px;font-size:260px;color:var(--ac);opacity:.07;line-height:1}.cs h3{font-size:clamp(26px,3.4vw,44px);margin-bottom:8px}.cs p{color:var(--mut)}
.ba{position:relative;height:330px;border-radius:28px;overflow:hidden;border:1px solid var(--line);background:#fff;max-width:780px;margin:44px auto 0;--x:50%;box-shadow:var(--sh);direction:ltr}
.bl{position:absolute;inset:0;display:grid;place-items:center;padding:24px}.bl.al{clip-path:inset(0 calc(100% - var(--x)) 0 0);background:#f3f8ff}
.sn{width:min(430px,100%);direction:rtl}.sn .u{display:flex;gap:10px;align-items:center;font-size:13px;color:#4d5156;direction:ltr;margin-bottom:6px}.sn .u b{width:26px;height:26px;border-radius:50%;background:var(--line);display:grid;place-items:center;font-size:12px;flex:none}
.sn h4{font:500 21px/1.5 "IBM Plex Sans Arabic";color:#1a0dab}.bl:not(.al) .sn h4{color:#7a8190}.sn p{font-size:15px;color:#4d5156;line-height:1.8}
.sn em{display:inline-block;margin-top:10px;font-style:normal;font-size:13px;font-weight:700;padding:3px 12px;border-radius:99px}
.bl:not(.al) em{background:#eceff3;color:var(--mut)}.al em{background:var(--ac);color:#fff}
.tg{position:absolute;top:14px;font:800 14px Tajawal;background:var(--ink);color:#fff;padding:3px 14px;border-radius:99px;z-index:3}
.hd2{position:absolute;top:0;bottom:0;left:var(--x);width:3px;background:var(--ac);z-index:4;pointer-events:none}.hd2:after{content:"\2194";position:absolute;top:50%;left:50%;translate:-50% -50%;width:42px;height:42px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:18px;box-shadow:var(--sh)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5;margin:0}
.nt{text-align:center;font-size:13px;color:var(--mut);margin-top:12px}
.cf{position:relative;overflow:hidden;text-align:center;background:linear-gradient(180deg,#eaf1ff,#fff 80%)}
.cf h2{font-size:clamp(40px,7.5vw,110px);margin-bottom:18px}.cf p.s{font:800 clamp(20px,2.4vw,30px)/1.7 Tajawal;color:var(--mut);max-width:760px;margin:auto}
.cf .rgs{position:absolute;left:50%;top:50%;border:1.5px dashed var(--ac2);border-radius:50%;translate:-50% -50%;opacity:.35;pointer-events:none}
.cf .cta2{justify-content:center;margin-top:34px;position:relative}
.sn2{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:stretch;padding:50px 0 80px}
.sn2 a{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px 26px;transition:box-shadow .4s,background .4s,translate .4s}.sn2 a:hover{translate:0 -5px;box-shadow:var(--sh);background:linear-gradient(160deg,#fff,#eef4ff)}
.sn2 small{display:block;color:var(--mut);font-size:14px}.sn2 b{font:800 clamp(18px,2vw,24px) Tajawal}.sn2 i{font-size:22px;color:var(--ac);transition:.3s}
.sn2 a.pv:hover i{transform:translateX(7px)}.sn2 a.nx:hover i{transform:translateX(-7px)}.sn2 a.nx{justify-content:flex-start}
.sn2 a.al2{justify-content:center;background:var(--ink);color:#fff}.sn2 a.al2 i{color:var(--ac2)}
.rm .ob{display:none}.rm .ol{display:block}.cf{padding-bottom:clamp(60px,8vw,110px)}
.rm #st2{height:auto;padding:70px 0}.rm .txw{height:auto}.rm .tx{position:static;opacity:1;margin-bottom:26px}.rm .sg{height:auto}
@media(max-width:860px){.hg,.sg,.cs{grid-template-columns:1fr}.hv{height:480px}.hc.a{width:94%}.hc.b{width:78%}.hc.c{width:56%}.bgn{top:96px}.sg{gap:16px;align-content:center;padding-top:70px}.txw{height:200px}.tx small{font-size:17px;margin-bottom:6px}.tx h2{font-size:clamp(28px,8vw,40px)}.sv{height:340px}.ob{display:none}.ol{display:block}.sn2{grid-template-columns:1fr}.py{gap:14px}.ba{height:360px}.oc2{display:grid}}
.oc2{display:none;place-items:center;width:140px;height:140px;border-radius:50%;background:#fff;box-shadow:var(--sh);margin:0 auto 26px}.oc2 img{height:34px}

.scr{container-type:size;background:#fff;overflow:hidden;position:relative;flex:1;min-height:0}
.ws{display:flex;flex-direction:column;gap:2cqw;padding:2.2cqw;height:100%;background:#fff}
.ws s,.ws u{text-decoration:none;display:block}
.wn{display:flex;align-items:center;gap:3cqw;height:6cqw;flex:none}
.lgo{width:7cqw;height:3cqw;border-radius:99px;background:var(--ac)}
.lk{display:flex;gap:2cqw;margin-inline-start:auto}.lk s{width:6cqw;height:1.2cqw;border-radius:9px;background:var(--line)}
.bgr{display:none;margin-inline-start:auto;font-size:4.5cqw;color:var(--ink)}
.cbtn{width:9cqw;height:3.4cqw;border-radius:99px;background:var(--ink)}
.wh{display:grid;grid-template-columns:1.1fr .9fr;gap:3cqw;align-items:center;background:linear-gradient(160deg,#f3f8ff,#eaf1ff);border-radius:3cqw;padding:2.5cqw;flex:none}
.tt s{height:2.6cqw;border-radius:9px;background:var(--ink);width:90%;margin-bottom:1.3cqw}.tt s+s{width:60%}
.sb s{height:1.1cqw;border-radius:9px;background:#b9c6da;width:80%;margin-bottom:1cqw}
.bt u{width:12cqw;height:3.6cqw;border-radius:99px;background:var(--ac);margin-top:1.8cqw}
.img{aspect-ratio:1.9;border-radius:2.5cqw;background:linear-gradient(135deg,var(--ac),var(--ac2));display:grid;place-items:center;color:#fff;font-size:5cqw}
.wc{display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw;flex:1;min-height:0}
.cd{border:1px solid var(--line);border-radius:2.5cqw;padding:1.8cqw;background:#fff;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.cd i{color:var(--ac);font-size:3cqw;display:block;margin-bottom:1.2cqw}.cd s{height:1.1cqw;border-radius:9px;background:var(--line);margin-bottom:1cqw}
.wx{display:none;align-items:center;gap:3cqw;border:1px solid var(--line);border-radius:2.5cqw;padding:2.5cqw;flex:none}.wx div{flex:1}.wx s{height:1.2cqw;border-radius:9px;background:var(--line);margin-bottom:1cqw}.wx s:first-child{background:var(--ink);width:70%;height:2.2cqw}
.wf2{display:flex;gap:2cqw;flex:none}.fi{flex:1;height:3.8cqw;border-radius:99px;background:var(--off);border:1px solid var(--line);position:relative;overflow:hidden}.fi:after{content:"";position:absolute;top:30%;bottom:30%;inset-inline-start:2cqw;width:var(--tw,0%);background:var(--ink);border-radius:9px;opacity:.5}.fb{width:11cqw;height:3.8cqw;border-radius:99px;background:var(--ac)}
@container (max-aspect-ratio:1.2){.lk,.cbtn{display:none}.bgr{display:block}.wh{grid-template-columns:1fr}.img{aspect-ratio:2.1}.wx{display:flex}.ws{gap:2.4cqw;padding:3cqw}}
@container (max-aspect-ratio:.65){.wc{grid-template-columns:1fr}}
.ws.wire{position:absolute;inset:0;z-index:2}
.wire *{background:transparent!important;color:transparent!important;border:1.5px dashed #c3cde0!important;box-shadow:none!important}
.wire svg,.wire i,.wire path{border:0!important}
.dv{background:var(--ink);border:5px solid var(--ink);border-radius:16px;box-shadow:var(--sh);display:flex;flex-direction:column;overflow:hidden}
.dv .ub{height:20px;background:#eef1f5;display:flex;align-items:center;gap:5px;padding:0 10px;flex:none;font-size:11px;color:var(--mut);direction:ltr}
.dv .ub b{width:7px;height:7px;border-radius:50%;background:#cfd6e0}.dv .ub span{margin-inline-start:8px;flex:1;background:#fff;border-radius:9px;padding:0 8px;line-height:14px}.ub .ok{color:#16a34a;opacity:0;margin:0}
.s1{position:relative;padding:calc(118px + env(safe-area-inset-top,0px)) 0 90px;overflow:hidden}
.bgn{position:absolute;inset-inline-start:1%;top:70px;font:900 clamp(150px,30vw,440px)/1 Tajawal;color:transparent;-webkit-text-stroke:2px rgba(37,99,235,.16);direction:ltr;pointer-events:none;user-select:none}
.bgn small{display:block;font:800 clamp(14px,1.6vw,22px) Tajawal;letter-spacing:.5em;-webkit-text-stroke:0;color:var(--ac);opacity:.7;margin-bottom:-.6em}
.hg{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;position:relative;z-index:1}
.s1 h1{font-size:clamp(36px,5.4vw,82px);margin:6px 0 18px}
.wm{display:inline-block;overflow:hidden;vertical-align:top;padding:.22em 0;margin:-.22em .08em -.22em 0}.wm>span{display:inline-block}
.s1 .lead{color:var(--mut);max-width:560px;margin-bottom:28px}
.cta2{display:flex;gap:14px;flex-wrap:wrap}
.tb2{display:inline-flex;gap:10px;align-items:center;background:#eaf1ff;color:var(--ac);padding:6px 18px;border-radius:99px;font-weight:700;font-size:14px;margin:10px 0 8px}
.hdv{position:relative;height:clamp(380px,40vw,520px)}
.hdv .dv{position:absolute}
.hd1{inset-inline-end:0;top:20px;width:86%;aspect-ratio:16/10}.hd2{inset-inline-start:0;bottom:0;width:32%;aspect-ratio:3/4;border-radius:18px}.hd3{inset-inline-start:34%;bottom:-14px;width:16%;aspect-ratio:9/18;border-radius:16px;border-width:4px}
#st2{height:100vh;position:relative;background:var(--off);overflow:hidden}
.sg{max-width:1240px;margin:auto;height:100%;padding:0 24px;display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center}
.txw{position:relative;height:300px}.tx{position:absolute;inset:0;opacity:0;display:flex;flex-direction:column;justify-content:center}
.tx small{color:var(--ac);font-weight:800;display:flex;gap:10px;align-items:center;margin-bottom:10px;font-size:20px}
.tx h2{font-size:clamp(44px,6.4vw,100px)}.tx p{color:var(--mut);font-size:clamp(18px,1.6vw,22px)}
.sv2{position:relative;height:clamp(340px,60vh,470px);display:flex;flex-direction:column;gap:14px}
.sfwrap{flex:1;min-height:0;display:flex;justify-content:center;align-items:center}
#sfr{width:100%;height:100%;position:relative}.dv.sfr{height:100%}
.chs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;flex:none}.chp{background:#fff;border:1px solid var(--line);border-radius:99px;padding:4px 14px;font-size:14px;font-weight:700;color:var(--mut)}
#pc{position:absolute;left:0;top:0;font-size:26px;color:var(--ink);opacity:0;z-index:9;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}
#lnc{position:absolute;inset-inline-end:6px;top:4px;width:64px;height:64px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:26px;box-shadow:0 12px 30px rgba(37,99,235,.45);opacity:0;z-index:9}
.of.pn{min-height:250px}
.og{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;margin-top:50px}
.plt{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px;align-items:center;color:var(--mut)}.plt span{background:#fff;border:1px solid var(--line);border-radius:99px;padding:8px 20px;font-weight:700;color:var(--ink);display:flex;gap:10px;align-items:center}.plt i{color:var(--ac)}
.rfw{max-width:900px;margin:40px auto 0}.rfs{height:clamp(300px,34vw,400px);display:flex;justify-content:center;align-items:center}
#rf{width:100%;height:100%}.rfs .dv{width:100%}.rtb{display:flex;gap:10px;justify-content:center;margin-top:24px}
.rtb button{all:unset;cursor:pointer;display:flex;gap:10px;align-items:center;padding:12px 24px;border-radius:99px;background:#fff;border:1px solid var(--line);font-weight:700;transition:.3s}.rtb button i{color:var(--ac)}.rtb button:hover{transform:translateY(-3px);box-shadow:var(--sh)}.rtb button.on{background:var(--ink);color:#fff}.rtb button.on i{color:var(--ac2)}
.sq{display:flex;align-items:center;gap:20px;padding:20px 24px;border:1px solid var(--line);border-radius:24px;background:#fff;margin-bottom:12px;opacity:.2;transition:box-shadow .3s}
.sq:hover{box-shadow:var(--sh)}.sq .ic{width:54px;height:54px;border-radius:16px;background:var(--off);display:grid;place-items:center;font-size:22px;color:var(--ac);flex:none;transition:.4s}.sq.on .ic{background:var(--ac);color:#fff}
.sq b{font:800 clamp(20px,2.2vw,28px) Tajawal;display:block}.sq span.d{color:var(--mut);font-size:16px}.sq>i{margin-inline-start:auto;color:var(--line);font-size:22px;transition:.4s}.sq.on>i{color:var(--ac)}
.sqs{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}.sqs .l{position:sticky;top:110px}
.cf{position:relative;overflow:hidden;text-align:center;background:linear-gradient(180deg,#eaf1ff,#fff 80%)}
.cf h2{font-size:clamp(38px,7vw,104px);margin-bottom:18px}.cf p.s{font:800 clamp(20px,2.4vw,30px)/1.7 Tajawal;color:var(--mut);max-width:760px;margin:auto}
.cf .rgs{position:absolute;left:50%;top:50%;border:1.5px dashed var(--ac2);border-radius:50%;translate:-50% -50%;opacity:.35;pointer-events:none}
.cf .cta2{justify-content:center;margin-top:34px;position:relative}
.sn2{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:stretch;padding:50px 0 80px}
.sn2 a{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px 26px;transition:box-shadow .4s,background .4s,translate .4s}.sn2 a:hover{translate:0 -5px;box-shadow:var(--sh);background:linear-gradient(160deg,#fff,#eef4ff)}
.sn2 small{display:block;color:var(--mut);font-size:14px}.sn2 b{font:800 clamp(18px,2vw,24px) Tajawal}.sn2 i{font-size:22px;color:var(--ac);transition:.3s}
.sn2 a.pv:hover i{transform:translateX(7px)}.sn2 a.nx:hover i{transform:translateX(-7px)}
.sn2 a.al2{justify-content:center;background:var(--ink);color:#fff}.sn2 a.al2 i{color:var(--ac2)}
.rm #st2{height:auto;padding:70px 0}.rm .txw{height:auto}.rm .tx{position:static;opacity:1;margin-bottom:26px}.rm .sg{height:auto}.rm .sq{opacity:1}.rm .ws.wire{display:none}
@media(max-width:860px){.hg,.sg,.sqs{grid-template-columns:1fr}.sqs .l{position:static}.hdv{height:360px}.hd1{width:92%}.hd2{width:38%}.hd3{width:19%;inset-inline-start:40%}.bgn{top:96px}.sg{gap:14px;align-content:center;padding-top:72px}.txw{height:150px}.tx small{font-size:16px;margin-bottom:2px}.tx h2{font-size:clamp(34px,10vw,52px)}.tx p{font-size:16px}.sv2{height:300px}.sn2{grid-template-columns:1fr}.rtb button{padding:10px 16px}.rtb span{display:none}.tb2{margin-top:4px}}

.db{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--sh);padding:20px;position:relative}
.dh{display:flex;align-items:center;gap:10px;margin-bottom:16px;font:800 17px Tajawal}.dh i{color:var(--ac)}.dh .bd2{margin-inline-start:auto;font:700 12px "IBM Plex Sans Arabic";background:#eaf1ff;color:var(--ac);border-radius:99px;padding:3px 12px}
.kg{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.kt{background:var(--off);border-radius:16px;padding:12px}.kt>i{color:var(--ac);font-size:16px}.kt b{display:block;font-size:14px;margin-top:6px;line-height:1.3}.kt small{display:block;font-size:11px;color:var(--mut);letter-spacing:.4px}
.vb{height:8px;border-radius:9px;background:linear-gradient(90deg,var(--ac),var(--ac2));margin-top:8px;transform-origin:right;width:100%}
.cht{width:100%;height:clamp(110px,14vw,170px);display:block;margin-top:14px}
.cht path{fill:none;stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}.p1{stroke:var(--ac2)}.p2{stroke:var(--ac)}.p3{stroke:var(--ink)}.cht .ar{fill:rgba(37,99,235,.07);stroke:none}
.bg2{display:flex;align-items:center;gap:12px;margin-top:12px;font-weight:700;font-size:14px}.bg2 i{color:var(--ac)}.bg2 .tk{flex:1;height:10px;border-radius:9px;background:var(--line);overflow:hidden}.bg2 .tk span{display:block;height:100%;width:62%;border-radius:9px;background:var(--ac);transform-origin:right}
.fc{position:absolute;background:#fff;border-radius:16px;padding:10px 16px;box-shadow:var(--sh);font-weight:700;font-size:14px;display:flex;gap:8px;align-items:center}.fc i{color:var(--ac)}
.hdv2{position:relative;padding:34px 0}
.s1 h1{font-size:clamp(38px,5.6vw,86px)}
#st2{height:100vh;position:relative;background:var(--off);overflow:hidden}
.sv3{position:relative;height:clamp(340px,60vh,470px);display:flex;flex-direction:column;gap:14px}
.stg{position:relative;flex:1;min-height:0;background:#fff;border:1px solid var(--line);border-radius:30px;box-shadow:var(--sh);overflow:hidden}
.ugw{position:absolute;left:50%;top:50%;width:68%}.ug{display:grid;grid-template-columns:repeat(7,1fr);gap:clamp(6px,1.4vw,14px)}
.u{aspect-ratio:1;border-radius:50%;background:var(--off);display:grid;place-items:center;color:#b3bccb;font-size:clamp(12px,1.6vw,18px);position:relative}
.tr{position:absolute;border:2px dashed var(--ac);border-radius:28px;opacity:0;pointer-events:none}
.vb2{position:absolute;inset-inline-end:-6px;top:-8px;width:22px;height:22px;border-radius:50%;background:#16a34a;color:#fff;font-size:11px;display:grid;place-items:center;opacity:0}
.adc{position:absolute;left:16px;top:44px;width:48%;background:#fff;border:1px solid #cfe0ff;border-radius:20px;box-shadow:var(--sh);padding:16px;opacity:0}
.adc .tg2{display:inline-block;font:700 12px "IBM Plex Sans Arabic";border:1px solid #1a0dab;color:#1a0dab;border-radius:6px;padding:0 6px;margin-bottom:8px}
.adc h4{font:500 17px/1.5 "IBM Plex Sans Arabic";color:#1a0dab}.adc .sk i{display:block;height:8px;border-radius:8px;background:var(--line);width:80%;margin-top:7px}.adc .sk i+i{width:55%}
.adb{position:relative;margin-top:12px;display:inline-flex;gap:8px;align-items:center;background:var(--ac);color:#fff;border-radius:99px;padding:6px 16px;font-weight:700;font-size:14px}
.rp{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px;border-radius:50%;background:var(--ac2);opacity:0}
.ck{position:absolute;top:-14px;inset-inline-start:-10px;background:var(--ink);color:#fff;border-radius:99px;font-size:12px;font-weight:700;padding:2px 12px;opacity:0;white-space:nowrap}
.ld{position:absolute;left:16px;bottom:16px;width:48%;background:var(--ink);color:#fff;border-radius:18px;padding:14px 16px;display:flex;gap:12px;align-items:center;font-weight:700;opacity:0}.ld i{color:#4ade80;font-size:22px}.ld small{display:block;color:#9fb0c8;font-weight:400;font-size:12px}
#pc2{position:absolute;left:0;top:0;font-size:24px;color:var(--ink);opacity:0;z-index:9;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}
.chs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;flex:none}.chp{background:#fff;border:1px solid var(--line);border-radius:99px;padding:4px 14px;font-size:14px;font-weight:700;color:var(--mut)}
.tys{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;margin-top:50px;align-items:stretch}.tyb{display:flex;flex-direction:column;gap:10px}
.tyb button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:14px;align-items:center;padding:14px 18px;border-radius:20px;background:#fff;border:1px solid var(--line);font:700 clamp(17px,1.6vw,20px) "IBM Plex Sans Arabic";transition:background .3s,color .3s,translate .3s,box-shadow .3s}
.tyb button i{width:42px;height:42px;border-radius:13px;background:var(--off);display:grid;place-items:center;color:var(--ac);flex:none;transition:background .3s,color .3s}.tyb button:hover{translate:-5px 0}
.tyb button.on{background:var(--ink);color:#fff;translate:-10px 0}.tyb button.on i{background:var(--ac);color:#fff}
.typ{position:relative;overflow:hidden;background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:30px;padding:32px;min-height:400px}
.typ h3{font-size:clamp(26px,3vw,36px);margin-bottom:10px}.typ p{color:var(--mut)}.typ ul{list-style:none;padding:0;margin:14px 0}.typ li{display:flex;gap:10px;margin-bottom:6px}.typ li i{color:var(--ac);margin-top:9px}
.pv2{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;margin-top:16px;box-shadow:var(--sh);min-height:190px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pv2 .sr{width:100%;font-size:14px}.pv2 .sr em{font-style:normal;font-size:12px;border:1px solid #1a0dab;color:#1a0dab;border-radius:6px;padding:0 6px}.pv2 h5{font:500 17px "IBM Plex Sans Arabic";color:#1a0dab;margin:6px 0 2px}.pv2 .ln{height:8px;border-radius:8px;background:var(--line);margin-top:6px;width:85%}
.bn{width:100%;height:100px;border-radius:14px;background:linear-gradient(135deg,var(--ac),var(--ac2));color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:800 20px Tajawal}.bn span{background:#fff;color:var(--ac);border-radius:99px;padding:6px 18px;font-size:14px}
.mp{width:100%;height:110px;border-radius:14px;background:linear-gradient(90deg,transparent 0 49%,#dfe7f3 49% 51%,transparent 51%),linear-gradient(0deg,transparent 0 49%,#dfe7f3 49% 51%,transparent 51%),#f3f6fb;position:relative}.mp i{position:absolute;left:46%;top:22%;font-size:34px;color:var(--ac)}.mp span{position:absolute;left:54%;top:30%;background:#fff;border-radius:10px;padding:4px 12px;font-size:13px;font-weight:700;box-shadow:var(--sh)}
.lm{position:relative;height:230px;width:calc(100% + 28px);margin:-14px}.lm svg{width:100%;height:100%;display:block}
.lm .pin{position:absolute;left:50%;top:46%;translate:-50% -100%;color:var(--ac);font-size:38px;filter:drop-shadow(0 6px 6px rgba(37,99,235,.35));animation:bob 2s ease-in-out infinite}
@keyframes bob{50%{translate:-50% calc(-100% - 6px)}}
.lm .pulse{position:absolute;left:50%;top:46%;width:16px;height:16px;margin:-8px;border-radius:50%;background:rgba(37,99,235,.4);animation:pls 2.4s ease-out infinite}
@keyframes pls{to{transform:scale(8);opacity:0}}
.lm .me2{position:absolute;left:70%;top:50%;width:14px;height:14px;border-radius:50%;background:#fff;border:4px solid var(--ac);box-shadow:0 0 0 6px rgba(37,99,235,.15)}
.lm .tg3{position:absolute;background:var(--ink);color:#fff;border-radius:99px;font-size:12px;font-weight:700;padding:2px 12px;white-space:nowrap}
.lm .lc{position:absolute;inset-inline:12px;bottom:12px;background:#fff;border-radius:16px;box-shadow:var(--sh);padding:10px 14px;display:flex;align-items:center;gap:12px;font-size:14px}.lm .lc b{display:block;font-size:15px}.lm .lc small{color:var(--mut)}
.lm .bt3{margin-inline-start:auto;display:flex;gap:8px}.lm .bt3 span{width:34px;height:34px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:14px}.lm .bt3 span+span{background:var(--off);color:var(--ink)}
.rt{display:flex;align-items:center;gap:16px;font-size:30px;color:var(--ac)}.rt span{font:700 15px "IBM Plex Sans Arabic";color:var(--ink)}
.stp{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px;position:relative}
.sp1{position:absolute;top:-22px;inset-inline:0;height:4px;background:var(--line);border-radius:9px}.sp1 span{display:block;height:100%;background:linear-gradient(90deg,var(--ac),var(--ac2));border-radius:9px;transform-origin:right;transform:scaleX(0)}
.sc2{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px;min-height:200px;display:flex;flex-direction:column;gap:10px;opacity:.3;transition:box-shadow .4s,border-color .4s}
.sc2.on{opacity:1;border-color:#cfe0ff;box-shadow:var(--sh)}.sc2 .n{font:900 44px/1 Tajawal;color:var(--ac);opacity:.25;direction:ltr;text-align:right}.sc2 .ic{width:50px;height:50px;border-radius:15px;background:var(--off);display:grid;place-items:center;color:var(--ac);font-size:21px;transition:.4s}.sc2.on .ic{background:var(--ac);color:#fff;transform:rotate(-8deg)}
.sc2 h3{font-size:21px}.sc2 p{color:var(--mut);font-size:15px;line-height:1.8}
.dbg{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;margin-top:44px}.cd2{background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px;box-shadow:var(--sh)}
.cd2 h4{font:800 18px Tajawal;display:flex;gap:10px;align-items:center;margin-bottom:10px}.cd2 h4 i{color:var(--ac)}
.lgd{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--mut)}.lgd span:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-inline-end:6px;background:var(--c)}
.bars{display:flex;align-items:flex-end;gap:6px;height:110px}.bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--ac2),var(--ac));height:100%;transform-origin:bottom;transform:scaleY(.4)}
.rgw{display:flex;align-items:center;gap:20px}.rgw svg{width:120px;height:120px;transform:rotate(-90deg)}.rgw circle{fill:none;stroke-width:12}.rgw .t{stroke:var(--line)}.rgw .v{stroke:var(--ac);stroke-linecap:round}
.fn{display:flex;flex-direction:column;gap:10px}.fn div{display:flex;gap:12px;align-items:center;font-weight:700;font-size:15px}.fn i{color:var(--ac);width:20px}.fn span{display:block;height:12px;border-radius:9px;background:linear-gradient(90deg,var(--ac),var(--ac2));transform-origin:right}
.dbs{display:grid;gap:18px}
.wf{display:flex;gap:12px;margin-top:44px;height:340px}
.wp{flex:1;min-width:0;background:#fff;border:1px solid var(--line);border-radius:28px;padding:26px;display:flex;flex-direction:column;justify-content:space-between;transition:flex .6s cubic-bezier(.2,.8,.2,1),background .4s,box-shadow .4s;overflow:hidden;position:relative}
.wp:hover{flex:2.6;background:linear-gradient(160deg,#fff,#eaf1ff);box-shadow:var(--sh)}
.wp .ic{width:58px;height:58px;border-radius:18px;background:var(--off);display:grid;place-items:center;font-size:24px;color:var(--ac);transition:.4s;flex:none}.wp:hover .ic{background:var(--ac);color:#fff;transform:rotate(-8deg)}
.wp h3{font-size:clamp(22px,2vw,28px)}.wp p{color:var(--mut);font-size:16px;max-height:0;opacity:0;transition:.5s;overflow:hidden}.wp:hover p{max-height:120px;opacity:1}.wp .n{position:absolute;left:18px;top:14px;font:900 46px/1 Tajawal;color:var(--ac);opacity:.18;direction:ltr}
.rm #st2{height:auto;padding:70px 0}.rm .txw{height:auto}.rm .tx{position:static;opacity:1;margin-bottom:26px}.rm .sg{height:auto}
@media(max-width:860px){.kg{grid-template-columns:1fr 1fr}.tys,.dbg{grid-template-columns:1fr}.tyb button.on{translate:none}.stp{grid-template-columns:1fr 1fr}.wf{flex-direction:column;height:auto}.wp{flex:none}.wp p{max-height:none;opacity:1;margin-top:8px}.wp:hover{flex:none}.sv3{height:320px}.adc{width:56%;padding:12px;top:30px}.ld{width:56%}.fc{display:none}.sc2{min-height:0}.hdv2{padding:10px 0}.rgw svg{width:90px;height:90px}}

.pt{position:fixed;inset:0;background:var(--ink);z-index:300;transform:translateY(-101%);pointer-events:none}
:focus-visible{outline:3px solid var(--ac2);outline-offset:3px;border-radius:8px}
.ar-top{padding:calc(118px + env(safe-area-inset-top,0px)) 0 30px}
.ar-crumb ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:var(--mut);margin-bottom:22px}.ar-crumb li{display:flex;gap:8px;align-items:center}.ar-crumb li+li:before{content:"\2039";font-size:18px;line-height:1;opacity:.6}.ar-crumb a:hover{color:var(--ac)}.ar-crumb [aria-current]{color:var(--ink);font-weight:700;max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-demo{display:inline-flex;gap:8px;align-items:center;background:#fff8e6;border:1px solid #fde8a8;color:#7a5a12;border-radius:99px;padding:5px 16px;font-weight:700;font-size:13px;margin-bottom:14px}
.ar-cat{display:inline-flex;gap:8px;align-items:center;background:#eaf1ff;color:var(--ac);border-radius:99px;padding:5px 16px;font-weight:800;font-size:14px;margin-bottom:16px;transition:background .3s,color .3s}a.ar-cat:hover{background:var(--ink);color:#fff}
.ar-hd{max-width:960px}.ar-hd h1{font-size:clamp(32px,5vw,70px);line-height:1.4;margin-bottom:18px}.ar-hd h1 .wm{margin-inline-end:.12em}
.ar-lead{font-size:clamp(18px,1.6vw,22px);color:var(--mut);max-width:780px;line-height:1.9}
.ar-meta{display:flex;gap:10px 24px;flex-wrap:wrap;color:var(--mut);font-size:15px;margin-top:22px}.ar-meta i{color:var(--ac);margin-inline-end:8px}
.ar-fig0{margin-top:34px;border-radius:30px;overflow:hidden;aspect-ratio:16/8;background:linear-gradient(135deg,var(--c1,#2563eb),var(--c2,#60a5fa));display:grid;place-items:center;color:#fff;font-size:72px;box-shadow:var(--sh);position:relative}.ar-fig0 img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ar-wrap{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:clamp(30px,4.5vw,70px);align-items:start;padding-top:56px;padding-bottom:30px}
.ar-main{min-width:0;max-width:780px}
.ar-prose{font-size:clamp(18px,1.4vw,20.5px);line-height:2.1;color:#262d38}
.ar-prose>*+*{margin-top:1.1em}
.ar-prose h2{font-size:clamp(26px,3vw,38px);line-height:1.5;margin-top:2em;color:var(--ink);scroll-margin-top:100px}.ar-prose h3{font:800 clamp(21px,2.2vw,27px)/1.6 Tajawal;margin-top:1.6em;color:var(--ink);scroll-margin-top:100px}
.ar-prose a{color:var(--ac);font-weight:700;background:linear-gradient(currentColor,currentColor) 100% 100%/100% 1.5px no-repeat;transition:background-size .3s,color .3s}.ar-prose a:hover{background-size:100% 100%;color:#fff;padding:0 4px;border-radius:4px}
.ar-prose ul,.ar-prose ol{padding-inline-start:1.4em;display:flex;flex-direction:column;gap:.45em}.ar-prose li::marker{color:var(--ac);font-weight:800}
.ar-prose blockquote{border-inline-start:4px solid var(--ac);background:var(--off);border-radius:0 18px 18px 0;padding:18px 24px;font:800 clamp(19px,2vw,24px)/1.9 Tajawal;color:var(--ink)}
.ar-prose figure{margin-inline:0}.ar-prose figure img,.ar-ph{width:100%;border-radius:20px;display:block}.ar-ph{aspect-ratio:16/9;background:linear-gradient(135deg,#dbe3ef,#eef2f8);display:grid;place-items:center;color:#aebbd0;font-size:44px}.ar-prose figcaption{font-size:14px;color:var(--mut);margin-top:10px;text-align:center}
.ar-tw{overflow-x:auto;border:1px solid var(--line);border-radius:18px}.ar-prose table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.7;min-width:480px}.ar-prose th{background:var(--off);text-align:start;padding:12px 16px;font-weight:800}.ar-prose td{padding:12px 16px;border-top:1px solid var(--line)}
.ar-vid{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden}.ar-vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ar-prose code{background:var(--off);border-radius:6px;padding:1px 8px;font-size:.9em;direction:ltr;unicode-bidi:embed}
/* inline cta */
.ar-cta{margin-top:2.2em!important;background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:26px;padding:clamp(18px,3vw,30px);display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;position:relative;overflow:hidden}
.ar-cta .ic{width:56px;height:56px;border-radius:18px;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:24px;flex:none}.ar-cta .tx2{flex:1;min-width:220px}.ar-cta b{display:block;font:900 clamp(19px,2.2vw,26px)/1.5 Tajawal;color:var(--ink)}.ar-cta span.d{color:var(--mut);font-size:16px;line-height:1.8}
.ar-cta .btn{font-size:15px;padding:12px 24px}.ar-prose .ar-cta a.btn{color:#fff;background-image:none;padding:12px 24px}.ar-prose .ar-cta a.btn:hover{background:var(--ac)}
/* story */
.ar-st{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(18px,3vw,36px);margin-top:2em;background:var(--off);border-radius:30px;padding:clamp(18px,3vw,32px);line-height:1.9}
.ar-sv{position:sticky;top:100px;align-self:start;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--sh)}
.ar-sn{display:flex;gap:14px;align-items:center;border:1.5px solid var(--line);border-radius:18px;padding:12px 16px;font-weight:800;font-size:16px;color:var(--mut);transition:border-color .5s,background .5s,color .5s,scale .5s}.ar-sn i{width:42px;height:42px;border-radius:13px;background:var(--off);display:grid;place-items:center;color:var(--mut);transition:background .5s,color .5s}
.ar-st[data-s="0"] .ar-sn:nth-child(1),.ar-st[data-s="1"] .ar-sn:nth-child(2),.ar-st[data-s="2"] .ar-sn:nth-child(3){border-color:var(--ac);background:#eaf1ff;color:var(--ink);scale:1.03}
.ar-st[data-s="0"] .ar-sn:nth-child(1) i,.ar-st[data-s="1"] .ar-sn:nth-child(2) i,.ar-st[data-s="2"] .ar-sn:nth-child(3) i{background:var(--ac);color:#fff}
.ar-ss{list-style:none;padding:0!important;display:flex;flex-direction:column;gap:0!important}.ar-ss li{min-height:min(52vh,360px);display:flex;flex-direction:column;justify-content:center;padding:14px 0;transition:opacity .5s}
.js .ar-ss li{opacity:.35}.js .ar-ss li.on{opacity:1}.ar-ss li b.n{font:900 38px Tajawal;color:var(--ac);opacity:.35}.ar-ss h3{margin-top:4px!important}
/* sources / author */
.ar-src{margin-top:2.4em;border-top:1px solid var(--line);padding-top:1.4em}.ar-src h2{font-size:clamp(22px,2.4vw,30px)!important;margin-top:0!important}
.ar-au{margin-top:2.4em;border:1px solid var(--line);border-radius:24px;padding:20px;display:flex;gap:16px;align-items:center;background:#fff}.ar-au .av{width:60px;height:60px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-size:24px;flex:none}.ar-au small{color:var(--mut);display:block;font-size:13px}.ar-au b{font:800 19px Tajawal}.ar-au p{margin:4px 0 0;font-size:15px;color:var(--mut);line-height:1.8}
/* aside */
.ar-as{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px}
.ar-toc{background:#fff;border:1px solid var(--line);border-radius:24px;padding:16px 18px;box-shadow:var(--sh)}.ar-toc summary{cursor:pointer;font:800 18px Tajawal;display:flex;gap:10px;align-items:center;list-style:none}.ar-toc summary::-webkit-details-marker{display:none}.ar-toc summary i{color:var(--ac)}.ar-toc summary .chv{margin-inline-start:auto;transition:rotate .3s}.ar-toc[open] summary .chv{rotate:180deg}
.ar-toc ol{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-direction:column;gap:2px;max-height:50vh;overflow:auto}.ar-toc a{display:block;padding:7px 12px;border-radius:12px;font-size:15px;line-height:1.6;color:var(--mut);border-inline-start:3px solid transparent;transition:background .3s,color .3s,border-color .3s}.ar-toc a:hover{color:var(--ink);background:var(--off)}.ar-toc a.on{background:#eaf1ff;color:var(--ac);font-weight:800;border-color:var(--ac)}.ar-toc li.h3 a{padding-inline-start:26px;font-size:14px}
.ar-tm{display:none}
.ar-sc{background:linear-gradient(160deg,#fff,#eef4ff);border:1px solid #cfe0ff;border-radius:24px;padding:18px 20px;display:flex;flex-direction:column;gap:10px}.ar-sc small{color:var(--ac);font-weight:800}.ar-sc h3{font:900 20px/1.5 Tajawal}.ar-sc p{color:var(--mut);font-size:15px;line-height:1.8}.ar-sc .btn{font-size:14px;padding:10px 20px;width:max-content}
.ar-sh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:22px;padding:12px 16px}.ar-sh span{font-weight:800;font-size:14px;margin-inline-end:6px}.ar-sh a,.ar-sh button{all:unset;cursor:pointer;width:40px;height:40px;border-radius:12px;background:var(--off);display:grid;place-items:center;transition:background .3s,color .3s,translate .3s}.ar-sh a:hover,.ar-sh button:hover{background:var(--ac);color:#fff;translate:0 -3px}.ar-sh a:focus-visible,.ar-sh button:focus-visible{outline:3px solid var(--ac2)}
.ar-toast{position:fixed;bottom:24px;left:50%;translate:-50% 30px;background:var(--ink);color:#fff;border-radius:99px;padding:10px 22px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .3s,translate .3s;z-index:120}.ar-toast.on{opacity:1;translate:-50% 0}
/* end + related */
.ar-end{text-align:center;background:radial-gradient(circle at 50% 0,#e8f0ff,#fff 65%);padding:clamp(60px,9vw,110px) 0}.ar-end h2{font-size:clamp(28px,4.4vw,60px);margin-bottom:12px}.ar-end p{color:var(--mut);max-width:620px;margin:auto;font-size:1.1em}.ar-end .cta2{justify-content:center;margin-top:28px}
.ar-rl{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-top:34px}
.ar-rc{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;transition:translate .4s,box-shadow .4s}.ar-rc:hover,.ar-rc:focus-within{translate:0 -8px;box-shadow:var(--sh)}
.ar-rc .im{aspect-ratio:16/10;display:grid;place-items:center;background:linear-gradient(135deg,var(--c1,#2563eb),var(--c2,#60a5fa));color:#fff;font-size:34px;position:relative;overflow:hidden}.ar-rc .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale .6s}.ar-rc:hover .im img{scale:1.07}
.ar-rc .b{padding:16px 18px 20px;display:flex;flex-direction:column;gap:10px}.ar-rc h3{font-size:19px;line-height:1.55}.ar-rc h3 a:hover{color:var(--ac)}.ar-rc .ar-cat{margin:0;font-size:12.5px;padding:3px 12px;width:max-content}
.ar-rc .rd{color:var(--ac);font-weight:800;display:inline-flex;gap:8px;align-items:center}.ar-rc .rd i{transition:translate .3s}.ar-rc:hover .rd i{translate:-6px 0}
.rm .ar-st .ar-ss li{opacity:1}
@media(max-width:959px){
.ar-wrap{grid-template-columns:1fr;padding-top:34px}.ar-as{position:static}.ar-as .ar-toc{display:none}.ar-tm{display:block;margin-bottom:26px}.ar-fig0{aspect-ratio:16/10;border-radius:22px}
.ar-st{grid-template-columns:1fr;padding:16px}.ar-sv{display:none}.ar-ss li{min-height:0;padding:16px;background:#fff;border-radius:18px;margin-bottom:10px}.js .ar-ss li{opacity:1}
.ar-top{padding-top:calc(100px + env(safe-area-inset-top,0px))}.ar-crumb [aria-current]{max-width:180px}}