:root{
  --bg:#07040d; --bg2:#0d0818; --surface:rgba(255,255,255,.035); --line:rgba(255,255,255,.08);
  --ink:#f6f2fc; --mute:#b9aecb; --faint:#85799a;
  --p1:#5c3289; --p2:#8f5bd6; --p3:#c9a9f7; --p4:#efe4ff; --cyan:#4fe3e0; --good:#3ddc97;
  --r-lg:28px; --r-md:20px; --r-sm:12px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --f-en:Inter,"IBM Plex Sans Arabic",system-ui,sans-serif;
  --f-ar:"IBM Plex Sans Arabic",Inter,system-ui,sans-serif;
  --f-disp:Sora,"IBM Plex Sans Arabic",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{background:var(--bg);color:var(--ink);font:400 16px/1.7 var(--f-en);overflow-x:hidden;-webkit-font-smoothing:antialiased}
[dir=rtl] body{font-family:var(--f-ar);line-height:1.85}
a{color:inherit;text-decoration:none}
svg{display:block}
html[lang=ar] .en, html[lang=en] .ar{display:none!important}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px}
h1,h2,h3{font-family:var(--f-disp);letter-spacing:-.025em;line-height:1.08;font-weight:700}
[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3{font-family:var(--f-ar);letter-spacing:0;line-height:1.3}
:focus-visible{outline:2px solid var(--p3);outline-offset:3px;border-radius:8px}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--p2);color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{top:12px}

/* ---------- ambient ---------- */
#fx{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.9}
.orb{position:fixed;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0;opacity:.55}
.orb.a{width:620px;height:620px;background:#5c3289;top:-220px;inset-inline-end:-160px;animation:drift 22s ease-in-out infinite}
.orb.b{width:520px;height:520px;background:#3b1d63;bottom:-200px;inset-inline-start:-180px;animation:drift 28s ease-in-out infinite reverse}
@keyframes drift{50%{transform:translate(60px,40px) scale(1.08)}}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
header,main,footer{position:relative;z-index:2}

/* ---------- header ---------- */
.hdr{position:fixed;top:0;inset-inline:0;z-index:50;transition:background .4s,border-color .4s,backdrop-filter .4s;border-bottom:1px solid transparent}
.hdr.solid{background:rgba(7,4,13,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;height:78px}
.nav img{height:34px;width:auto}
.links{display:flex;gap:30px;font-size:14.5px;color:var(--mute)}
.links a{position:relative;padding:6px 0;transition:color .25s}
.links a::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:var(--p3);transform:scaleX(0);transition:transform .35s var(--ease)}
.links a:hover{color:var(--ink)}.links a:hover::after{transform:scaleX(1)}
.nav-end{display:flex;gap:10px;align-items:center}

.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 15px/1 inherit;font-family:inherit;padding:16px 26px;border-radius:14px;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .3s var(--ease),box-shadow .3s,background .3s,border-color .3s;min-height:48px;touch-action:manipulation}
.btn svg{width:18px;height:18px;flex:none}
[dir=rtl] .btn .arr{transform:scaleX(-1)}
.btn-p{color:#fff;background:linear-gradient(135deg,#9d6bea 0%,#6a3aa2 55%,#4a2672 100%);box-shadow:0 12px 40px -12px rgba(157,107,234,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 18px 50px -12px rgba(157,107,234,.95),inset 0 1px 0 rgba(255,255,255,.3)}
.btn-g{color:var(--ink);background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.12)}
.btn-g:hover{background:rgba(157,107,234,.14);border-color:rgba(201,169,247,.4)}
.btn-sm{padding:10px 16px;font-size:13.5px;min-height:42px;border-radius:12px}
#lang{font-family:var(--f-en)} html[lang=en] #lang{font-family:var(--f-ar)}

/* ---------- hero ---------- */
.hero{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;padding-block:130px 80px}
.badge{display:inline-flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600;color:var(--p4);background:rgba(157,107,234,.1);border:1px solid rgba(201,169,247,.25);padding:8px 16px 8px 8px;border-radius:999px;margin-bottom:28px}
[dir=rtl] .badge{padding:8px 8px 8px 16px}
.badge b{font:700 11.5px var(--f-en);color:#fff;background:linear-gradient(135deg,#9d6bea,#5c3289);padding:4px 10px;border-radius:999px;letter-spacing:.04em;white-space:nowrap;flex:none}
.hero h1{font-size:clamp(42px,6.2vw,84px);font-weight:800;letter-spacing:-.04em}
[dir=rtl] .hero h1{font-weight:700;font-size:clamp(40px,5.6vw,76px)}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(40%) rotate(2deg);filter:blur(8px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.ready .hero h1 .w{opacity:1;transform:none;filter:none}
.grad{background:linear-gradient(100deg,#f3e9ff 0%,#c9a9f7 35%,#9d6bea 65%,#4fe3e0 120%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 8s ease-in-out infinite}
@keyframes sheen{50%{background-position:100% 0}}
.lead{font-size:clamp(17px,1.5vw,19.5px);color:var(--mute);margin-top:26px;max-width:560px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:38px}
.trust{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:44px;color:var(--faint);font-size:13.5px}
.trust .plats{display:flex;gap:8px;direction:ltr}
.trust .plats span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.trust .plats svg{width:16px;height:16px;fill:var(--mute)}

/* hero stage */
.stage{position:relative;height:560px;perspective:1400px}
.stage .card{position:absolute;border-radius:22px;background:linear-gradient(160deg,rgba(32,20,52,.92),rgba(14,9,26,.92));border:1px solid rgba(201,169,247,.18);box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.02) inset;backdrop-filter:blur(10px);transform-style:preserve-3d;transition:transform .8s var(--ease)}
.c-dash{width:78%;inset-inline-start:4%;top:8%;padding:22px;transform:rotateY(-14deg) rotateX(6deg)}
[dir=ltr] .c-dash{transform:rotateY(14deg) rotateX(6deg)}
.c-dash .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.live{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mute)}
.live i{width:8px;height:8px;border-radius:50%;background:var(--good);box-shadow:0 0 0 0 rgba(61,220,151,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(61,220,151,0)}100%{box-shadow:0 0 0 0 rgba(61,220,151,0)}}
.demo{font-size:10.5px;color:var(--faint);border:1px solid var(--line);padding:2px 9px;border-radius:999px}
.c-dash .kp{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.c-dash .kp div{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:12px}
.c-dash .kp small{display:block;font-size:11px;color:var(--faint)}
.c-dash .kp b{font:700 19px var(--f-disp);direction:ltr;display:block}
.c-dash .kp em{font-style:normal;font-size:11px;color:var(--good);direction:ltr;display:block}
.chart{margin-top:14px;height:130px;border-radius:14px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);position:relative;overflow:hidden}
.chart svg{position:absolute;inset:0;width:100%;height:100%}
.chart path.l{stroke-dasharray:600;stroke-dashoffset:600;animation:draw 2.6s .8s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.c-reel{width:34%;aspect-ratio:9/14;inset-inline-end:2%;top:46%;overflow:hidden;transform:rotateY(10deg) translateZ(60px);padding:0}
[dir=ltr] .c-reel{transform:rotateY(-10deg) translateZ(60px)}
.c-reel .shot{position:absolute;inset:0;background:radial-gradient(120% 80% at 30% 20%,#7b47c2 0%,#2a1446 50%,#0d0818 100%)}
.c-reel .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(0,0,0,.75))}
.c-reel .pl{position:absolute;top:50%;left:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);display:grid;place-items:center;border:1px solid rgba(255,255,255,.3)}
.c-reel .pl::before{content:"";width:0;height:0;border-left:18px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
.c-reel .pl::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(255,255,255,.25);animation:ring 2.4s infinite}
@keyframes ring{from{transform:scale(.85);opacity:1}to{transform:scale(1.35);opacity:0}}
.c-reel .meta{position:absolute;inset-inline:14px;bottom:14px;z-index:2}
.c-reel .meta b{display:block;font-size:13px}
.c-reel .meta .bar{height:3px;border-radius:2px;background:rgba(255,255,255,.2);margin-top:10px;overflow:hidden}
.c-reel .meta .bar i{display:block;height:100%;width:0;background:#fff;animation:prog 6s linear infinite}
[dir=rtl] .c-reel .meta .bar{direction:ltr}
@keyframes prog{to{width:100%}}
.c-pill{padding:10px 14px;display:flex;align-items:center;gap:10px;font:600 13px var(--f-en);direction:ltr;animation:float 7s ease-in-out infinite;border-radius:14px}
.c-pill s{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;text-decoration:none}
.c-pill s svg{width:14px;height:14px;fill:#fff}
.c-pill small{display:block;font:500 11px var(--f-en);color:var(--good)}
.p1{inset-inline-end:8%;top:2%}
.p2{inset-inline-start:0;bottom:12%;animation-delay:-2.5s}
.p3{inset-inline-end:0;bottom:2%;animation-delay:-5s}
@keyframes float{50%{transform:translateY(-12px)}}

/* ---------- marquee ---------- */
.marq{border-block:1px solid var(--line);background:rgba(255,255,255,.015);overflow:hidden;padding:24px 0;direction:ltr;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.track{display:flex;width:max-content;animation:marq 38s linear infinite}
.track span{display:flex;align-items:center;gap:56px;padding-inline-end:56px;font:600 22px var(--f-disp);color:rgba(246,242,252,.38);white-space:nowrap}
.track span::after{content:"";width:0;height:0;border-left:9px solid var(--p2);border-top:6px solid transparent;border-bottom:6px solid transparent;opacity:.8}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{padding-top:140px}
.kick{display:inline-flex;align-items:center;gap:10px;font:600 13px var(--f-en);color:var(--p3);letter-spacing:.18em;text-transform:uppercase;margin-bottom:18px}
[dir=rtl] .kick{font-family:var(--f-ar);letter-spacing:0;font-size:15px}
.kick::before{content:"";width:28px;height:1px;background:var(--p3)}
.h2{font-size:clamp(34px,4.6vw,60px);max-width:820px}
.sub{color:var(--mute);font-size:clamp(16px,1.4vw,18.5px);margin-top:18px;max-width:640px}

/* manifesto */
.manifesto{padding-top:150px}
.manifesto p{font:700 clamp(28px,4.2vw,58px)/1.3 var(--f-disp);letter-spacing:-.02em;max-width:1050px}
[dir=rtl] .manifesto p{font-family:var(--f-ar);letter-spacing:0;line-height:1.55}
.manifesto .wd{opacity:.14;transition:opacity .25s linear}
.manifesto .wd.on{opacity:1}
.manifesto .wd.hl.on{background:linear-gradient(90deg,#c9a9f7,#9d6bea);-webkit-background-clip:text;background-clip:text;color:transparent}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:90px;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--surface)}
.stats div{padding:34px 28px;border-inline-start:1px solid var(--line)}
.stats div:first-child{border-inline-start:0}
.stats b{display:block;font:800 clamp(40px,4.4vw,62px)/1 var(--f-disp);letter-spacing:-.03em;background:linear-gradient(180deg,#fff,#b996ee);-webkit-background-clip:text;background-clip:text;color:transparent;direction:ltr;text-align:start}
.stats span{display:block;color:var(--mute);font-size:14.5px;margin-top:12px}

/* bento */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:60px}
.tile{position:relative;border-radius:var(--r-lg);padding:30px;background:var(--surface);border:1px solid var(--line);overflow:hidden;transition:transform .5s var(--ease),border-color .4s;isolation:isolate}
.tile::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(157,107,234,.18),transparent 45%)}
.tile:hover{border-color:rgba(201,169,247,.32);transform:translateY(-4px)}
.tile:hover::before{opacity:1}
.tile.w2{grid-column:span 2}.tile.w4{grid-column:span 4}
.ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(150deg,rgba(157,107,234,.35),rgba(92,50,137,.12));border:1px solid rgba(201,169,247,.28);margin-bottom:26px;box-shadow:0 10px 30px -10px rgba(157,107,234,.6)}
.ico svg{width:24px;height:24px;stroke:var(--p4);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tile h3{font-size:21px;margin-bottom:10px}
[dir=rtl] .tile h3{font-size:20px}
.tile p{color:var(--mute);font-size:15.5px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.chips span{font-size:13px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);color:var(--ink)}
.tile .big{position:absolute;inset-inline-end:-30px;bottom:-60px;width:260px;height:260px;opacity:.08;z-index:-1}
.tile.w4{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;background:linear-gradient(120deg,rgba(92,50,137,.32),rgba(255,255,255,.02))}
.tile.w4 .ico{margin:0}
.tile.w4 .tx{flex:1;min-width:240px}

/* process */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:70px}
.rail{position:absolute;top:27px;inset-inline:27px;height:2px;background:var(--line);border-radius:2px}
.rail i{position:absolute;inset:0;background:linear-gradient(90deg,#9d6bea,#4fe3e0);transform:scaleX(var(--p,0));transform-origin:left;border-radius:2px}
[dir=rtl] .rail i{transform-origin:right;background:linear-gradient(270deg,#9d6bea,#4fe3e0)}
.step{position:relative}
.step .dot{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font:700 16px var(--f-disp);background:var(--bg2);border:1px solid rgba(201,169,247,.3);color:var(--p3);margin-bottom:26px;position:relative;z-index:1;transition:background .5s,color .5s,box-shadow .5s}
.step.on .dot{background:linear-gradient(135deg,#9d6bea,#5c3289);color:#fff;box-shadow:0 0 0 8px rgba(157,107,234,.12),0 10px 30px -6px rgba(157,107,234,.8)}
.step h3{font-size:22px;margin-bottom:10px}
.step p{color:var(--mute);font-size:15.5px}

/* reports */
.rep{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:center}
.ticks{list-style:none;margin-top:30px;display:grid;gap:14px}
.ticks li{display:flex;gap:14px;align-items:flex-start;color:var(--mute);font-size:16.5px}
.ticks svg{flex:none;width:26px;height:26px;padding:5px;border-radius:8px;background:rgba(61,220,151,.13);stroke:var(--good);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;margin-top:3px}
.board{position:relative;border-radius:30px;padding:26px;background:linear-gradient(160deg,rgba(157,107,234,.16),rgba(255,255,255,.02));border:1px solid rgba(201,169,247,.22);box-shadow:0 60px 120px -40px rgba(92,50,137,.8)}
.board .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.board .row{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
.gauge{position:relative;width:170px;height:170px}
.gauge svg{width:100%;height:100%;transform:rotate(-90deg)}
.gauge .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.gauge .c b{font:800 38px var(--f-disp);direction:ltr;display:block;line-height:1}
.gauge .c small{display:block;font-size:11.5px;color:var(--mute);margin-top:6px}
#garc{transition:stroke-dashoffset 2s var(--ease)}
.bars{display:grid;gap:14px}
.bars .bl small{display:flex;justify-content:space-between;font-size:12.5px;color:var(--mute);margin-bottom:6px}
.bars .bl small b{color:var(--ink);font-family:var(--f-disp);direction:ltr}
.bars .tr{height:10px;border-radius:5px;background:rgba(255,255,255,.06);overflow:hidden}
.bars .tr i{display:block;height:100%;width:0;border-radius:5px;transition:width 1.6s var(--ease)}

/* why */
.why{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.why-list{display:grid;gap:14px}
.why-item{display:flex;gap:20px;padding:26px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);transition:border-color .4s,background .4s}
.why-item:hover{border-color:rgba(201,169,247,.3);background:rgba(157,107,234,.06)}
.why-item .n{flex:none;font:800 15px var(--f-disp);color:var(--p3);width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(157,107,234,.12)}
.why-item h3{font-size:19px;margin-bottom:6px}
.why-item p{color:var(--mute);font-size:15.5px}
.sticky{position:sticky;top:120px}

/* cta */
.cta{position:relative;margin-top:150px;border-radius:36px;padding:2px;background:conic-gradient(from var(--a,0deg),#5c3289,#9d6bea,#4fe3e0,#c9a9f7,#5c3289);animation:spin 8s linear infinite}
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes spin{to{--a:360deg}}
.cta-in{border-radius:34px;padding:90px 40px;text-align:center;background:radial-gradient(700px 340px at 50% 0,rgba(157,107,234,.35),transparent 70%),linear-gradient(180deg,#140b24,#0b0614);overflow:hidden;position:relative}
.cta h2{font-size:clamp(36px,5.4vw,72px);max-width:900px;margin:0 auto}
.cta p{color:var(--mute);font-size:18px;max-width:580px;margin:22px auto 0}
.cta .cta-row{justify-content:center;margin-top:40px}

footer{margin-top:120px;border-top:1px solid var(--line);padding:46px 0 40px;color:var(--faint);font-size:14px}
.foot{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap}
.foot img{height:32px}
.fc{display:flex;gap:22px;flex-wrap:wrap}
.fc a:hover{color:var(--ink)}
.soc{display:flex;gap:10px}
.soc a{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);transition:background .3s,border-color .3s,transform .3s var(--ease)}
.soc a:hover{background:rgba(157,107,234,.2);border-color:rgba(201,169,247,.4);transform:translateY(-2px)}
.soc svg{width:18px;height:18px;fill:var(--ink)}
.copy{margin-top:28px;font-size:13px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* reveal */
.rv{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
/* floating contact */
.fab{position:fixed;z-index:60;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:flex-end;gap:12px;direction:ltr}
.fab-main{width:62px;height:62px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2fe07a,#128c4a);box-shadow:0 14px 34px -8px rgba(37,211,102,.65),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .35s var(--ease),box-shadow .3s;position:relative;touch-action:manipulation}
.fab-main::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(37,211,102,.55);animation:ring 2.4s infinite}
.fab-main:hover{transform:scale(1.06)}
.fab-main svg{width:30px;height:30px;transition:transform .35s var(--ease),opacity .25s;position:absolute}
.fab-main .x{opacity:0;transform:rotate(-90deg) scale(.6);stroke:#fff;stroke-width:2.4;fill:none;stroke-linecap:round;width:24px;height:24px}
.fab.open .fab-main{background:linear-gradient(135deg,#9d6bea,#5c3289);box-shadow:0 14px 34px -8px rgba(157,107,234,.7)}
.fab.open .fab-main::before{animation:none;opacity:0}
.fab.open .fab-main .wa{opacity:0;transform:rotate(90deg) scale(.6)}
.fab.open .fab-main .x{opacity:1;transform:none}
.fab-list{display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}
.fab-item{display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(14px) scale(.9);transition:opacity .3s var(--ease),transform .4s var(--ease);transition-delay:calc(var(--i)*40ms)}
.fab.open .fab-list{pointer-events:auto}
.fab.open .fab-item{opacity:1;transform:none}
.fab-item span{font:600 13.5px var(--f-ar);color:var(--ink);background:rgba(20,12,34,.92);border:1px solid var(--line);padding:7px 12px;border-radius:10px;box-shadow:0 10px 24px -10px rgba(0,0,0,.7);backdrop-filter:blur(8px)}
html[lang=en] .fab-item span{font-family:var(--f-en)}
.fab-item i{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.6)}
.fab-item i svg{width:22px;height:22px}
.fab-item:hover i{transform:scale(1.07)}
.fab-item i{transition:transform .25s var(--ease)}

@media (max-width:1024px){
  .links{display:none}
  .hero{grid-template-columns:minmax(0,1fr);padding-block:120px 70px;gap:30px;min-height:auto}
  .stage{height:480px;max-width:560px;width:100%;margin-inline:auto}
  .bento{grid-template-columns:repeat(2,1fr)}
  .tile.w4{grid-column:span 2}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:40px}
  .rail{display:none}
  .rep,.why{grid-template-columns:minmax(0,1fr)}
  .sticky{position:static}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stats div:nth-child(3){border-inline-start:0}
  .stats div:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding-inline:18px}
  .nav{height:66px}
  .nav img{height:27px}
  .nav-end .btn-p{display:none}
  .hero{padding-block:104px 50px}
  .hero h1{font-size:clamp(38px,11vw,50px)}
  [dir=rtl] .hero h1{font-size:clamp(36px,10.4vw,46px)}
  .badge{font-size:12.5px;margin-bottom:22px}
  .lead{font-size:17px;margin-top:20px}
  .cta-row{margin-top:30px}
  .cta-row .btn{flex:1 1 100%}
  .trust{margin-top:32px}
  .stage{height:400px}
  .c-dash{width:86%;padding:16px;top:4%}
  .c-dash .kp b{font-size:15px}
  .chart{height:96px}
  .c-reel{width:34%;top:50%}
  .c-pill{font-size:12px;padding:8px 11px}
  .p1{top:-2%}.p2{bottom:6%}.p3{bottom:-2%}
  .track span{font-size:17px;gap:40px;padding-inline-end:40px}
  .marq{padding:18px 0}
  section{padding-top:100px}
  .manifesto{padding-top:100px}
  .stats{margin-top:60px;border-radius:22px}
  .stats div{padding:24px 18px}
  .stats span{font-size:13px}
  .bento{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:40px}
  .tile.w2,.tile.w4{grid-column:auto}
  .tile{padding:24px;border-radius:22px}
  .ico{margin-bottom:20px}
  .steps{grid-template-columns:minmax(0,1fr);row-gap:28px;margin-top:44px}
  .step{display:grid;grid-template-columns:56px 1fr;gap:18px}
  .step .dot{margin:0}
  .rep{gap:40px}
  .board{padding:18px;border-radius:24px}
  .board .row{grid-template-columns:minmax(0,1fr);justify-items:center;gap:20px}
  .board .bars{width:100%}
  .why{gap:36px}
  .why-item{padding:20px;gap:16px}
  .cta{margin-top:100px;border-radius:28px}
  .cta-in{padding:60px 22px;border-radius:26px}
  .cta p{font-size:16.5px}
  footer{margin-top:80px}
  .foot{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .hero h1 .w{opacity:1;transform:none;filter:none}
  .manifesto .wd{opacity:1}
  #fx{display:none}
}

/* ===== v2 additions ===== */
.nav img{height:34px}
.about{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px;align-items:start}
.capsule{font-size:clamp(18px,1.7vw,22px);line-height:1.75;color:var(--ink)}
[dir=rtl] .capsule{line-height:2}
.capsule strong{color:var(--p3);font-weight:700}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.fact{padding:20px 22px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line)}
.fact b{display:block;font:700 15px var(--f-disp);color:var(--p3);margin-bottom:4px}
[dir=rtl] .fact b{font-family:var(--f-ar)}
.fact span{color:var(--mute);font-size:14.5px}
.inds{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.inds span{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:14.5px;color:var(--ink)}
.inds span::before{content:"";width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#9d6bea,#4fe3e0)}
.svc-li{list-style:none;margin-top:14px;display:grid;gap:7px}
.svc-li li{position:relative;padding-inline-start:20px;color:var(--mute);font-size:14.5px}
.svc-li li::before{content:"";position:absolute;inset-inline-start:0;top:.6em;width:9px;height:9px;border-radius:3px;background:linear-gradient(135deg,#9d6bea,#5c3289)}
.crit{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:50px}
.crit .card2{padding:26px 28px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line)}
.crit h3{font-size:18px;margin-bottom:8px;display:flex;align-items:center;gap:10px}
.crit h3 svg{width:22px;height:22px;flex:none;padding:4px;border-radius:7px;background:rgba(61,220,151,.13);stroke:var(--good);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.crit p{color:var(--mute);font-size:15px}
.pk{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:50px}
.plan{position:relative;padding:32px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column}
.plan.hot{background:linear-gradient(170deg,rgba(157,107,234,.2),rgba(255,255,255,.02));border-color:rgba(201,169,247,.4);box-shadow:0 40px 90px -40px rgba(157,107,234,.7)}
.plan .tag{position:absolute;top:18px;inset-inline-end:18px;font:700 11px var(--f-en);letter-spacing:.1em;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,#9d6bea,#5c3289);padding:5px 10px;border-radius:999px}
.plan h3{font-size:24px;margin-bottom:6px}
.plan .for{color:var(--p3);font-size:14px;margin-bottom:22px;min-height:44px}
.plan ul{list-style:none;display:grid;gap:11px;flex:1}
.plan li{display:flex;gap:10px;color:var(--mute);font-size:15px}
.plan li::before{content:"";flex:none;width:18px;height:18px;margin-top:4px;border-radius:5px;background:rgba(61,220,151,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233ddc97' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat}
.plan .btn{margin-top:26px;width:100%}
.pk-note{margin-top:16px;color:var(--faint);font-size:13.5px;text-align:center}
.faqs{margin-top:46px;display:grid;gap:10px;max-width:900px}
.faq{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden;transition:border-color .3s}
.faq[open]{border-color:rgba(201,169,247,.35)}
.faq summary{list-style:none;cursor:pointer;padding:20px 24px;font:600 17px var(--f-ar);display:flex;justify-content:space-between;align-items:center;gap:16px}
html[lang=en] .faq summary{font-family:var(--f-disp);font-size:16.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a9f7' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .4s var(--ease)}
.faq[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 24px 22px;color:var(--mute);font-size:15.5px}
.faq .a p+p{margin-top:10px}
.faq .a a{color:var(--p3);text-decoration:underline;text-underline-offset:3px}
.guide-teaser{margin-top:50px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center;padding:36px 40px;border-radius:var(--r-lg);background:linear-gradient(120deg,rgba(92,50,137,.35),rgba(255,255,255,.02));border:1px solid rgba(201,169,247,.25)}
.guide-teaser h3{font-size:24px;margin-bottom:8px}
.guide-teaser p{color:var(--mute)}
/* article */
.art{max-width:820px;padding-top:130px}
.crumb{display:flex;gap:8px;font-size:13.5px;color:var(--faint);margin-bottom:26px;flex-wrap:wrap}
.crumb a:hover{color:var(--ink)}
.art h1{font-size:clamp(32px,4.6vw,54px);margin-bottom:18px}
.art .meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--faint);font-size:14px;margin-bottom:34px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.art .intro{font-size:clamp(18px,1.6vw,21px);color:var(--ink);line-height:1.8;padding:26px 30px;border-radius:var(--r-md);background:rgba(157,107,234,.08);border:1px solid rgba(201,169,247,.22)}
[dir=rtl] .art .intro{line-height:2}
.art h2{font-size:clamp(26px,3vw,36px);margin:64px 0 18px}
.art h3{font-size:21px;margin:34px 0 10px}
.art p,.art li{color:var(--mute);font-size:17px;line-height:1.8}
[dir=rtl] .art p,[dir=rtl] .art li{line-height:2}
.art p+p{margin-top:16px}
.art ul,.art ol{margin:14px 0 0 0;padding-inline-start:22px;display:grid;gap:8px}
.art strong{color:var(--ink)}
.art a{color:var(--p3);text-decoration:underline;text-underline-offset:3px}
.toc{margin:34px 0 0;padding:22px 26px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface)}
.toc b{display:block;font-size:14px;color:var(--p3);margin-bottom:10px}
.toc ol{padding-inline-start:20px;display:grid;gap:6px}
.toc a{color:var(--mute);text-decoration:none;font-size:15.5px}
.toc a:hover{color:var(--ink)}
.callout{margin:28px 0;padding:22px 26px;border-radius:var(--r-md);background:rgba(61,220,151,.07);border:1px solid rgba(61,220,151,.25)}
.callout.warn{background:rgba(255,181,71,.07);border-color:rgba(255,181,71,.3)}
.callout b{display:block;margin-bottom:6px;color:var(--ink)}
.tbl{width:100%;border-collapse:collapse;margin-top:18px;font-size:15px}
.tbl th,.tbl td{text-align:start;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--mute);vertical-align:top}
.tbl th{color:var(--ink);font-weight:600;background:rgba(255,255,255,.03)}
.ql{display:grid;gap:10px;margin-top:16px;padding:0;list-style:none}
.ql li{padding:14px 18px;border-radius:12px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:16px}
.art .cta{margin-top:70px}
@media (max-width:1024px){.about{grid-template-columns:minmax(0,1fr)}.pk{grid-template-columns:minmax(0,1fr);max-width:560px}.crit{grid-template-columns:minmax(0,1fr)}.guide-teaser{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.facts{grid-template-columns:1fr 1fr;gap:10px}.fact{padding:14px 16px}.fact span{font-size:13px}.plan{padding:26px 22px}.faq summary{padding:16px 18px;font-size:15.5px}.faq .a{padding:0 18px 18px}.guide-teaser{padding:26px 22px}.art{padding-top:96px}.art .intro{padding:20px}.tbl{font-size:13.5px}.tbl th,.tbl td{padding:9px 8px}}

/* ===== reels gallery ===== */
.reels{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:46px}
.reel{position:relative;aspect-ratio:9/16;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#120b20;cursor:pointer;padding:0;text-align:start;isolation:isolate;transition:transform .5s var(--ease),border-color .3s}
.reel img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
.reel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,4,13,0) 45%,rgba(7,4,13,.85));z-index:1}
.reel .pl{position:absolute;top:50%;left:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;z-index:2;transition:transform .4s var(--ease),background .3s}
.reel .pl::before{content:"";width:0;height:0;border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;margin-left:4px}
.reel .cap{position:absolute;inset-inline:12px;bottom:12px;z-index:2;font-size:12.5px;line-height:1.45;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.reel .ig{position:absolute;top:10px;inset-inline-end:10px;z-index:2;width:26px;height:26px;border-radius:8px;background:rgba(7,4,13,.55);display:grid;place-items:center}
.reel .ig svg{width:14px;height:14px;fill:#fff}
.reel:hover{transform:translateY(-4px);border-color:rgba(201,169,247,.4)}
.reel:hover img{transform:scale(1.06)}
.reel:hover .pl{transform:scale(1.1);background:rgba(157,107,234,.55)}
.reels-foot{display:flex;justify-content:center;margin-top:28px}
.lb{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;background:rgba(5,3,10,.86);backdrop-filter:blur(10px);padding:20px}
.lb.open{display:flex}
.lb-box{position:relative;width:min(420px,92vw);height:min(760px,90vh);border-radius:22px;overflow:hidden;background:#000;box-shadow:0 40px 100px -20px rgba(0,0,0,.9)}
.lb-box iframe{width:100%;height:100%;border:0;background:#fff}
.lb-x{position:absolute;top:16px;inset-inline-end:16px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(20,12,34,.8);color:#fff;cursor:pointer;display:grid;place-items:center;z-index:2}
.lb-x svg{width:20px;height:20px;stroke:#fff;stroke-width:2.2;fill:none;stroke-linecap:round}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(20,12,34,.8);color:#fff;cursor:pointer;display:grid;place-items:center}
.lb-nav svg{width:20px;height:20px;stroke:#fff;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lb-prev{left:max(12px,calc(50% - 270px))}.lb-next{right:max(12px,calc(50% - 270px))}
.lb-open-ig{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font:600 13px var(--f-en);color:#fff;background:rgba(20,12,34,.85);border:1px solid rgba(255,255,255,.18);padding:9px 14px;border-radius:999px;white-space:nowrap}
@media (max-width:1024px){.reels{grid-template-columns:repeat(4,1fr)}}
@media (max-width:640px){.reels{grid-template-columns:repeat(2,1fr);gap:10px;margin-top:30px}.reel{border-radius:14px}.reel .pl{width:44px;height:44px;margin:-22px 0 0 -22px}.lb-nav{display:none}.lb{padding:10px}.lb-box{width:94vw;height:88vh}}