
.jp {
  --bg:#FFFFFF; --bg2:#F7F7F9; --card:#FFFFFF; --soft:#F3F3F6;
  --ink:#0B0B0F; --mut:#2C2F37; --sub:#4A4D57; --line:#E7E8EC; --line2:#D9DBE1;
  --acc:#3E5BFF; --acc2:#7D8FFF; --acc-soft:#EEF1FF; --acc-ink:#FFFFFF;
  --ok:#15803D; --warn:#B45309; --err:#DC2626;
  --sh-md:0 1px 2px rgba(16,18,27,.05), 0 10px 28px -14px rgba(16,18,27,.16);
  --sh-lg:0 1px 2px rgba(16,18,27,.04), 0 16px 40px -18px rgba(16,18,27,.16), 0 50px 100px -40px rgba(16,18,27,.22);
  --glass:rgba(255,255,255,.74); --dot:rgba(11,11,15,.09); --glow:rgba(62,91,255,.13); --glow2:rgba(0,180,255,.07);
  --paper:#FFFFFF; --paper-ink:#15161A; --floor:rgba(16,18,27,.28);
  color-scheme:light;
  /* أسماء قديمة بتستخدمها مشاهد المنصة */
  --gold:var(--acc);

  background:var(--bg); color:var(--ink); min-height:100vh;
  font-family:'Cairo',system-ui,sans-serif; overflow-x:clip;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.jp[data-theme="dark"] { 
  --bg:#08080A; --bg2:#0D0D10; --card:#131317; --soft:#1B1B21;
  --ink:#F3F3F5; --mut:#C7C9D1; --sub:#A2A5AF; --line:#222228; --line2:#2E2E36;
  --acc:#8295FF; --acc2:#B3BEFF; --acc-soft:rgba(130,149,255,.13); --acc-ink:#08080A;
  --ok:#4ADE80; --warn:#FBBF24; --err:#FCA5A5;
  --sh-md:0 1px 0 rgba(255,255,255,.04) inset, 0 14px 34px -16px rgba(0,0,0,.75);
  --sh-lg:0 1px 0 rgba(255,255,255,.05) inset, 0 24px 60px -24px rgba(0,0,0,.8), 0 60px 120px -50px rgba(0,0,0,.7);
  --glass:rgba(16,16,20,.72); --dot:rgba(255,255,255,.085); --glow:rgba(130,149,255,.17); --glow2:rgba(80,200,255,.07);
  --paper:#FAFAF8; --paper-ink:#15161A; --floor:rgba(0,0,0,.65);
  color-scheme:dark;
 }
@media (prefers-color-scheme:dark) {
  .jp:not([data-theme]) { 
  --bg:#08080A; --bg2:#0D0D10; --card:#131317; --soft:#1B1B21;
  --ink:#F3F3F5; --mut:#C7C9D1; --sub:#A2A5AF; --line:#222228; --line2:#2E2E36;
  --acc:#8295FF; --acc2:#B3BEFF; --acc-soft:rgba(130,149,255,.13); --acc-ink:#08080A;
  --ok:#4ADE80; --warn:#FBBF24; --err:#FCA5A5;
  --sh-md:0 1px 0 rgba(255,255,255,.04) inset, 0 14px 34px -16px rgba(0,0,0,.75);
  --sh-lg:0 1px 0 rgba(255,255,255,.05) inset, 0 24px 60px -24px rgba(0,0,0,.8), 0 60px 120px -50px rgba(0,0,0,.7);
  --glass:rgba(16,16,20,.72); --dot:rgba(255,255,255,.085); --glow:rgba(130,149,255,.17); --glow2:rgba(80,200,255,.07);
  --paper:#FAFAF8; --paper-ink:#15161A; --floor:rgba(0,0,0,.65);
  color-scheme:dark;
 }
  .jp:not([data-theme]) .nv-sun { display:block; }
  .jp:not([data-theme]) .nv-moon { display:none; }
  .jp:not([data-theme]) .mk { border-color:var(--line2); }
  .jp:not([data-theme]) .mk-phone { border-color:rgba(255,255,255,.12); box-shadow:0 0 0 6px #1F2026, 0 30px 60px -24px rgba(0,0,0,.8); }
}

.jp *,.jp *::before,.jp *::after { box-sizing:border-box; }
/* ⚠️ :where() بتصفّر قوة المُحدِّد — من غيرها ".jp p" بتغلب أي كلاس
   وتلزّق العناصر في بعضها، و".jp a" بتلوّن الزراير بلون النص. */
:where(.jp h1,.jp h2,.jp h3,.jp p,.jp ul,.jp ol) { margin:0; }
:where(.jp ul,.jp ol) { list-style:none; padding:0; }
:where(.jp a) { text-decoration:none; color:inherit; }
.jp ::selection { background:var(--acc); color:var(--acc-ink); }
/* التبديل بين الفاتح والغامق بينعّم الألوان بس — مش الحركات */
.jp.jp-swap, .jp.jp-swap * { transition:background-color .4s ease, color .4s ease, border-color .4s ease, fill .4s ease !important; }

.jp [id] { scroll-margin-top:88px; }
.wrap { max-width:1180px; margin:0 auto; padding-inline:24px; }
.sec { padding-block:clamp(96px,12vw,164px); }
.sec-alt { background:var(--bg2); border-block:1px solid var(--line); }

/* ── الظهور مع السكرول: طلوع + وضوح ── */
.jp .rv { opacity:0; transform:translateY(26px); filter:blur(8px);
  transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1), filter .7s cubic-bezier(.16,1,.3,1); }
.jp .rv-on { opacity:1; transform:none; filter:none; }

/* ── الكتابة ── */
.eb { display:inline-flex; align-items:center; gap:10px; font-size:11.5px; font-weight:800; letter-spacing:.3em;
  color:var(--acc); direction:ltr; text-transform:uppercase; }
.eb::before { content:""; width:22px; height:1px; background:currentColor; opacity:.7; }
.sh { text-align:center; max-width:760px; margin:0 auto; }
.sh h2, .jp h2 { font-size:clamp(30px,4.5vw,56px); font-weight:900; line-height:1.22; }
.sh h2 { margin-top:16px; text-wrap:balance; }
.lead { color:var(--mut); font-size:clamp(15.5px,1.45vw,18px); line-height:1.9; margin-top:16px; max-width:56ch; }
.sh .lead { margin-inline:auto; }

/* ── الزراير ── */
.bt { display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:999px;
  padding:15px 26px; font-size:15px; font-weight:800; white-space:nowrap; cursor:pointer; border:1px solid transparent;
  font-family:inherit; transition:transform .15s ease, box-shadow .25s ease, background .2s ease, border-color .2s ease; }
.bt:active { transform:scale(.97); }
.bt-pri { background:var(--ink); color:var(--bg); box-shadow:0 10px 26px -12px rgba(11,11,15,.45); }
.bt-pri:hover { box-shadow:0 16px 36px -14px var(--acc), 0 0 0 4px var(--acc-soft); }
.bt-line { background:transparent; color:var(--ink); border-color:var(--line2); }
.bt-line:hover { border-color:var(--ink); }
.bt-sm { padding:10px 18px; font-size:13.5px; }
.bt-full { width:100%; }

/* ══════ الشريط ══════ */
.nv { position:fixed; top:14px; inset-inline:0; z-index:50; display:flex; justify-content:center; padding-inline:12px; pointer-events:none; }
.nv-in { pointer-events:auto; width:min(1100px,100%); display:flex; align-items:center; gap:18px; padding:8px 8px 8px 8px;
  padding-inline-start:22px; border-radius:999px; background:var(--glass); border:1px solid var(--line);
  backdrop-filter:blur(18px) saturate(1.6); -webkit-backdrop-filter:blur(18px) saturate(1.6); box-shadow:var(--sh-md); }
.nv-logo { font-weight:900; letter-spacing:.26em; font-size:16px; color:var(--ink); white-space:nowrap; direction:ltr; }
.nv-links { display:flex; gap:24px; margin-inline:auto; }
.nv-links a { font-size:14px; font-weight:700; color:var(--mut); transition:color .15s; }
.nv-links a:hover { color:var(--ink); }
.nv-theme { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; cursor:pointer;
  background:transparent; border:1px solid var(--line); color:var(--mut); transition:color .15s, border-color .15s, transform .3s; }
.nv-theme:hover { color:var(--ink); border-color:var(--line2); }
.nv-theme:active { transform:rotate(-30deg) scale(.94); }
.jp .nv-sun { display:none; }
.jp[data-theme="dark"] .nv-sun { display:block; }
.jp[data-theme="dark"] .nv-moon { display:none; }

/* ══════ البطل ══════ */
.hx { position:relative; overflow:hidden; padding:clamp(128px,15vw,172px) 0 44px; }
.hx-bg { position:absolute; inset:0; pointer-events:none; }
.hx-glow { position:absolute; inset:0;
  background:radial-gradient(42% 46% at 28% 38%, var(--glow), transparent 70%),
             radial-gradient(38% 40% at 78% 18%, var(--glow2), transparent 70%); }
.hx-dots { position:absolute; inset:0; background-image:radial-gradient(var(--dot) 1px, transparent 1.3px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 50% 42%, #000 20%, transparent 78%);
          mask-image:radial-gradient(ellipse 72% 62% at 50% 42%, #000 20%, transparent 78%); }
.hx-in { position:relative; max-width:1180px; margin:0 auto; padding-inline:24px; display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); grid-template-areas:"a d" "b d" "c d";
  column-gap:56px; row-gap:28px; align-items:center; }
.hx-txt { grid-area:a; align-self:end; }
.hx-field { grid-area:b; }
.hx-act { grid-area:c; align-self:start; }
.hx-card { grid-area:d; display:flex; justify-content:center; }
.hx h1 { font-size:clamp(38px,5.1vw,68px); font-weight:900; line-height:1.24; margin-top:22px; }
.hx h1 em { font-style:normal; display:inline-block;
  background:linear-gradient(100deg, var(--acc) 0%, var(--acc2) 55%, var(--ink) 120%);
  -webkit-background-clip:text; background-clip:text; color:transparent; padding-bottom:.08em; }
.hx-sub { color:var(--mut); font-size:clamp(16px,1.5vw,18.5px); line-height:1.9; margin-top:20px; max-width:50ch; }
.hx-cta { display:flex; gap:10px; flex-wrap:wrap; }
.hx-trust { display:flex; gap:10px 22px; flex-wrap:wrap; margin-top:22px; }
.hx-trust li { display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:700; color:var(--mut); }
.hx-trust svg { color:var(--acc); flex-shrink:0; }

/* دخول البطل مع التحميل — مش مع السكرول، هو أول حاجة بتتشاف */
@keyframes hx-rise { from { opacity:0; transform:translateY(22px); filter:blur(8px); } }
.hx-in-1,.hx-in-2,.hx-in-3,.hx-field,.hx-card,.hx-in-5 { animation:hx-rise .9s cubic-bezier(.16,1,.3,1) both; }
.hx-in-2 { animation-delay:.08s; } .hx-in-3 { animation-delay:.16s; } .hx-field { animation-delay:.24s; }
.hx-card { animation-delay:.2s; animation-duration:1.1s; } .hx-in-5 { animation-delay:.32s; }

/* خانة الدومين */
.dm { display:flex; gap:8px; max-width:520px; }
.dm-box { flex:1; display:flex; align-items:stretch; min-height:56px; background:var(--card); border:1px solid var(--line2);
  border-radius:16px; overflow:hidden; box-shadow:var(--sh-md); transition:border-color .15s, box-shadow .2s; }
.dm-box:focus-within { border-color:var(--acc); box-shadow:0 0 0 4px var(--acc-soft), var(--sh-md); }
.dm-box input { flex:1; min-width:0; border:0; outline:none; background:transparent; padding:0 16px;
  font-size:16px; font-weight:700; font-family:inherit; color:var(--ink); }
.dm-box input::placeholder { color:var(--sub); font-weight:600; }
.dm-sfx { display:flex; align-items:center; padding:0 14px; background:var(--soft); color:var(--mut);
  font-size:14px; font-weight:700; border-inline-start:1px solid var(--line); white-space:nowrap; }
.dm-go { display:flex; align-items:center; gap:6px; border:0; border-radius:16px; padding:0 22px; flex-shrink:0;
  background:var(--ink); color:var(--bg); font-size:15px; font-weight:800; font-family:inherit; cursor:pointer;
  transition:transform .15s, box-shadow .25s; }
.dm-go:hover { box-shadow:0 0 0 4px var(--acc-soft); }
.dm-go:active { transform:scale(.97); }
.dm-hint { font-size:12.5px; color:var(--sub); margin-top:10px; font-weight:600; }

/* ── المجسّم: المحل في الفاترينة، وضهره لوحة الشحن ──
   المقاسات كلها بوحدات الحاوية (cqw) — المجسّم بكل تفاصيله بيكبر ويصغر
   بنفس النسبة بالظبط على أي شاشة. البوليصة جوّه شاشتها ليها حاوية
   لوحدها، فمقاساتها نسبة من الشاشة. */
.hx-card { flex-direction:column; align-items:center; }
.cd-stage { --mx:30%; --my:20%; position:relative; width:min(470px,86vw); aspect-ratio:1; perspective:1500px;
  margin:64px 0 50px; container-type:inline-size; cursor:grab; touch-action:pan-y;
  -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent; }
.cd-stage[data-drag] { cursor:grabbing; }
/* تلميح فوق: المجسّم بيلف ووراه حاجة */
.cd-hint { position:absolute; top:-50px; inset-inline:0; margin-inline:auto; width:max-content; max-width:100%; z-index:3;
  display:flex; align-items:center; gap:7px; padding:7px 14px; border-radius:999px; font-size:12.5px; font-weight:800;
  color:var(--mut); background:var(--glass); border:1px solid var(--line); box-shadow:var(--sh-md);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); pointer-events:none; transition:opacity .5s, transform .5s; }
.cd-hint svg { color:var(--acc); animation:cd-spin 2.8s cubic-bezier(.65,0,.3,1) infinite; }
@keyframes cd-spin { 0%,35% { transform:rotate(0); } 75%,100% { transform:rotate(360deg); } }
.cd-stage[data-touched] .cd-hint { opacity:0; transform:translateY(-6px); }
.cd-float { position:absolute; inset:0; transform-style:preserve-3d; animation:cd-float 7s ease-in-out infinite; }
.cd-stage[data-drag] .cd-float { animation-play-state:paused; }
@keyframes cd-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
.cd-rot { position:absolute; inset:0; transform-style:preserve-3d; will-change:transform; transform:rotateX(6deg) rotateY(-14deg); }
.sf, .db { position:absolute; inset:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; transform:translateZ(1px); }
.db { transform:rotateY(180deg) translateZ(1px); }
@keyframes cd-type { from { opacity:.25; filter:blur(4px); transform:translateY(3px); } }

/* الوش: صورة المحل في الفاترينة (public/join/storefront.webp — 1100×938 بخلفية شفافة).
   الصندوق بنفس نسبة الصورة، فمكان اليافطة بالنسبة المئوية من الصورة نفسها،
   ومايلة زي ما هي في الصورة (‎-3.4°) فالاسم بيبان مكتوب عليها. */
.sf-box { position:absolute; left:-5%; right:-5%; top:50%; transform:translateY(-50%); aspect-ratio:1358/1158; }
.sf-img { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; -webkit-user-drag:none;
  filter:drop-shadow(0 4cqw 5cqw rgba(10,8,20,.35)); }
.sf-sign { position:absolute; left:35.5%; top:22%; width:42.2%; height:17%; transform:rotate(-3.4deg);
  border-radius:1.4cqw; background:radial-gradient(70% 70% at 50% 50%, rgba(20,22,34,.38), rgba(20,22,34,.12) 70%, transparent);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5cqw; padding:0 5%; text-align:center; }
.sf-sign b { display:block; max-width:100%; font-size:5cqw; font-weight:900; line-height:1.1; letter-spacing:.06em; text-transform:uppercase;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#FFFFFF;
  text-shadow:0 .25cqw .5cqw rgba(8,10,20,.85), 0 0 1.2cqw rgba(8,10,20,.55), 0 0 3.4cqw rgba(167,139,250,.9);
  animation:cd-type .45s cubic-bezier(.16,1,.3,1); }
.sf-sign span { display:block; max-width:100%; font-size:1.8cqw; font-weight:800; letter-spacing:.06em; color:#F1F2F6; text-shadow:0 .2cqw .45cqw rgba(8,10,20,.9);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sf-glare { position:absolute; inset:0; pointer-events:none; mix-blend-mode:soft-light;
  background:linear-gradient(115deg, transparent 34%, rgba(255,255,255,.35) 45%, transparent 56%);
  background-size:260% 260%; background-position:var(--mx) var(--my);
  -webkit-mask-image:url(/join/storefront-720.webp); mask-image:url(/join/storefront-720.webp); -webkit-mask-size:100% 100%; mask-size:100% 100%; }

/* الضهر: لوحة الشحن */
.db-panel { position:absolute; top:5cqw; left:6cqw; right:9cqw; padding:2.6cqw 3cqw 3cqw; border-radius:4cqw; overflow:hidden;
  background:linear-gradient(155deg,#F5F7FB 0%,#D8DDE6 55%,#BEC5D1 100%);
  box-shadow:inset 0 .4cqw 0 #fff, inset 0 -.6cqw 1.2cqw rgba(0,0,0,.12), 0 4cqw 8cqw -3cqw rgba(15,20,40,.55); }
.db-bar { display:flex; align-items:center; gap:1cqw; margin-bottom:1.8cqw; }
.db-bar span { width:1.6cqw; height:1.6cqw; border-radius:50%; background:#F87171; }
.db-bar span:nth-child(2) { background:#FBBF24; } .db-bar span:nth-child(3) { background:#34D399; }
.db-bar b { margin-inline-start:auto; font-size:2.2cqw; font-weight:800; color:#4B5563; }
.db-screen { position:relative; width:100%; aspect-ratio:1.586; container-type:inline-size; overflow:hidden; border-radius:2cqw;
  background:#FFFFFF; color:#000; direction:rtl; box-shadow:inset 0 0 0 .3cqw rgba(0,0,0,.08); }
.cd-sheen { position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  background:radial-gradient(38% 55% at var(--mx) var(--my), rgba(255,255,255,.35), transparent 62%); }
.db-map { position:absolute; left:3cqw; bottom:17cqw; width:42cqw; aspect-ratio:1.45; overflow:hidden; border-radius:2.4cqw;
  border:.8cqw solid #1E2330; background:#EAF0FA;
  box-shadow:0 3cqw 5cqw -1cqw rgba(10,14,30,.6), 0 0 0 .3cqw rgba(255,255,255,.25);
  animation:db-pop 5s ease-in-out infinite; }
@keyframes db-pop { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-1.2cqw); } }
.db-map svg { display:block; width:100%; height:100%; }
.db-route { stroke:var(--acc); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:5 4;
  animation:db-dash 1.2s linear infinite; }
@keyframes db-dash { to { stroke-dashoffset:-18; } }
.db-van { fill:#F59E0B; stroke:#fff; stroke-width:1.4; }
.db-pin-a circle { fill:#14B8A6; }
.db-pin-a .db-pulse { fill:rgba(20,184,166,.35); transform-box:fill-box; transform-origin:center; animation:db-pulse 1.8s ease-out infinite; }
@keyframes db-pulse { from { transform:scale(.6); opacity:1; } to { transform:scale(1.9); opacity:0; } }
.db-pin-b path { fill:#F43F5E; }
.db-eta { position:absolute; top:1.4cqw; right:1.4cqw; font-size:1.9cqw; font-weight:800; line-height:1.5; padding:.4cqw 1.3cqw;
  border-radius:99px; background:#111827; color:#fff; }
.db-drone { position:absolute; top:-5cqw; left:3cqw; width:12cqw; z-index:2; filter:drop-shadow(0 1.2cqw 1cqw rgba(0,0,0,.3));
  animation:db-bob 3.2s ease-in-out infinite; }
@keyframes db-bob { 0%,100% { transform:translate(0,0); } 50% { transform:translate(-1.5cqw,1.4cqw); } }
.db-base { position:absolute; left:2cqw; right:2cqw; bottom:4cqw; height:11cqw; border-radius:3cqw;
  background:linear-gradient(180deg,#ECEFF4,#B7BECA);
  box-shadow:inset 0 .5cqw 0 #fff, 0 3cqw 5cqw -1.5cqw rgba(0,0,0,.45); }
.db-glow { position:absolute; left:8%; right:8%; top:40%; height:.7cqw; border-radius:1cqw;
  background:linear-gradient(90deg, transparent, #FBBF24, var(--acc), transparent); box-shadow:0 0 2.6cqw rgba(251,191,36,.7); }
.db-truck { position:absolute; top:-6.4cqw; left:64%; width:13cqw; transform:scaleX(-1);
  filter:drop-shadow(0 .8cqw .8cqw rgba(0,0,0,.25)); animation:db-drive 9s linear infinite; }
.db-t2 { animation-delay:-4.5s; }
@keyframes db-drive {
  0% { transform:translateX(0) scaleX(-1); opacity:0; }
  8% { opacity:1; } 88% { opacity:1; }
  100% { transform:translateX(-46cqw) scaleX(-1); opacity:0; } }
.db-box { position:absolute; top:-3.4cqw; width:4.4cqw; height:3.4cqw; border-radius:.4cqw; background:#D6A46B;
  box-shadow:inset 0 -.6cqw 0 rgba(0,0,0,.12); }
.db-box.b1 { right:6%; } .db-box.b2 { right:12%; top:-2.6cqw; width:3.4cqw; height:2.6cqw; background:#C99358; }

/* البوليصة جوّه الشاشة — أبيض في أسود بجدول زي اللي بتتطبع من الشحن (cqw = عرض الشاشة) */
.wbm { position:absolute; inset:2.4cqw; border:.45cqw solid #000; border-radius:2.4cqw; padding:2.2cqw 2.6cqw 1.8cqw;
  display:flex; flex-direction:column; gap:1.5cqw; font-family:'Cairo',system-ui,sans-serif; }
.wbm-head { display:flex; align-items:center; justify-content:space-between; gap:2cqw; }
.wbm-logo { width:7.6cqw; height:7.6cqw; border-radius:50%; border:.45cqw solid #000; display:grid; place-items:center;
  font-size:3.8cqw; font-weight:900; line-height:1; flex-shrink:0; }
.wbm-title { flex:1; text-align:center; font-size:3cqw; font-weight:800; }
.wbm-brand { font-size:3.1cqw; font-weight:900; text-transform:uppercase; max-width:26cqw; white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis; animation:cd-type .45s cubic-bezier(.16,1,.3,1); }
.wbm-meta { display:flex; justify-content:space-between; font-size:2.05cqw; font-weight:700; }
.wbm-meta b { font-weight:900; }
.wbm-t { width:100%; border-collapse:collapse; table-layout:fixed; font-size:2.15cqw; line-height:1.35; }
.wbm-t th, .wbm-t td { border:.3cqw solid #000; padding:.75cqw 1.1cqw; text-align:right; vertical-align:middle;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wbm-t th { width:22%; background:#F2F2F2; font-weight:800; font-size:1.85cqw; }
.wbm-t .b { font-weight:800; }
.wbm-cod { font-size:4.6cqw; font-weight:900; line-height:1.05; }
.wbm-cod i { font-style:normal; font-size:1.8cqw; font-weight:700; margin-inline-start:.8cqw; }
.wbm-bar { text-align:center; padding:.7cqw 1.4cqw !important; }
.wbm-bars { display:flex; gap:.32cqw; height:5.2cqw; direction:ltr; }
.wbm-bars i { background:#000; min-width:.25cqw; }
.wbm-bar u { display:block; text-decoration:none; font-size:1.7cqw; font-weight:700; letter-spacing:.18em; margin-top:.4cqw; }
.wbm-policy { font-size:1.75cqw; text-align:center; font-weight:600; margin-top:auto; }

.cd-floor { position:absolute; left:12%; right:12%; bottom:-40px; height:26px; border-radius:50%;
  background:radial-gradient(closest-side, var(--floor), transparent); filter:blur(6px);
  animation:cd-floor 7s ease-in-out infinite; pointer-events:none; }
@keyframes cd-floor { 0%,100% { transform:scaleX(1); opacity:1; } 50% { transform:scaleX(.88); opacity:.75; } }


/* ── شريط «مناسبة لأي متجر» ── */
.mq { position:relative; max-width:1180px; margin:clamp(56px,7vw,88px) auto 0; padding-inline:24px;
  display:flex; align-items:center; gap:28px; }
.mq-l { font-size:12.5px; font-weight:800; color:var(--sub); white-space:nowrap; }
.mq-track { flex:1; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.mq-row { display:flex; width:max-content; animation:mq 42s linear infinite; }
.mq-row span { font-size:15.5px; font-weight:700; color:var(--mut); white-space:nowrap; padding-inline:22px;
  display:flex; align-items:center; gap:44px; }
.mq-row span::after { content:""; width:4px; height:4px; border-radius:50%; background:var(--line2); margin-inline-start:22px; }
.mq:hover .mq-row { animation-play-state:paused; }
@keyframes mq { to { transform:translateX(50%); } }

/* ══════ الفرق ══════ */
.st-h { margin-top:18px; font-size:clamp(26px,3.5vw,46px); line-height:1.45; max-width:30ch; }
.st-h span { color:var(--sub); }
.st-h em { font-style:normal; background:linear-gradient(100deg, var(--acc), var(--acc2));
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.cmp { margin-top:clamp(48px,6vw,72px); border-top:1px solid var(--line2); }
.cmp-h, .cmp-r { display:grid; grid-template-columns:170px 1fr 1fr; gap:24px; align-items:center; }
.cmp-h { padding:16px 0; font-size:12.5px; font-weight:800; color:var(--sub); border-bottom:1px solid var(--line); }
.cmp-h span:last-child { color:var(--acc); }
.cmp-r { padding:24px 0; border-bottom:1px solid var(--line); }
.cmp-r b { font-size:15px; font-weight:800; color:var(--sub); }
.cmp-them, .cmp-us { display:flex; align-items:center; gap:10px; font-size:16.5px; }
.cmp-them { color:var(--mut); font-weight:600; }
.cmp-them svg { color:var(--sub); flex-shrink:0; }
.cmp-us { color:var(--ink); font-weight:800; }
.cmp-us svg { color:var(--acc); flex-shrink:0; }

/* ══════ الخطوات ══════ */
.steps { display:grid; grid-template-columns:repeat(3,1fr); margin-top:clamp(48px,6vw,72px); border-top:1px solid var(--line2); }
.step { position:relative; padding:34px 26px 8px; }
.step + .step { border-inline-start:1px solid var(--line); }
.step::before { content:""; position:absolute; top:-1px; inset-inline:0; height:2px; background:var(--acc);
  transform:scaleX(0); transform-origin:right; transition:transform 1s cubic-bezier(.16,1,.3,1) .25s; }
.step.rv-on::before { transform:scaleX(1); }
.step-n { display:block; font-size:clamp(48px,5vw,64px); font-weight:800; line-height:1; color:transparent;
  -webkit-text-stroke:1.2px var(--sub); }
.step b { display:block; font-size:18.5px; font-weight:900; margin-top:22px; }
.step p { font-size:14.5px; color:var(--mut); line-height:1.85; margin-top:8px; }

/* ══════ اللوحة (bento) ══════ */
.bn { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:clamp(48px,6vw,72px); }
.bn-t.bn-big { grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:48px; align-items:center; padding:44px; }
.bn-t.bn-big .bn-m { margin-top:0; }
.bn-t.bn-big .bn-m > .mk { border-bottom:1px solid var(--line); border-radius:18px; }
.bn-t { position:relative; overflow:hidden; display:flex; flex-direction:column; border-radius:32px; padding:36px 36px 0;
  background:linear-gradient(180deg, var(--card), var(--bg2)); border:1px solid var(--line); }
.bn-h h3 { font-size:22px; font-weight:900; line-height:1.4; }
.bn-h p { font-size:14.5px; color:var(--mut); line-height:1.85; margin-top:8px; max-width:46ch; }
.bn-m { margin-top:28px; flex:1; display:flex; align-items:flex-end; }
.bn-m > .mk { width:100%; border-bottom:0; border-radius:18px 18px 0 0; box-shadow:var(--sh-lg);
  transition:transform .5s cubic-bezier(.16,1,.3,1); }
.bn-t:hover .bn-m > .mk { transform:translateY(-6px); }

/* ══════ الشحن ══════ */
.ja { margin-top:clamp(40px,5vw,64px); }
.ja-arc { position:relative; height:210px; max-width:1020px; margin:0 auto; }
.ja-arc > svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.ja-rail { fill:none; stroke:var(--line2); stroke-width:1.5; stroke-dasharray:3 7; }
.ja-prog { fill:none; stroke-width:2.5; stroke-linecap:round; transition:d .9s cubic-bezier(.16,1,.3,1); }
.ja-node { position:absolute; transform:translate(-50%,-25px); display:flex; flex-direction:column; align-items:center; gap:10px;
  background:none; border:0; padding:0; cursor:pointer; font-family:inherit; }
.ja-dot { width:50px; height:50px; border-radius:50%; display:grid; place-items:center; background:var(--card);
  border:1px solid var(--line2); color:var(--sub); box-shadow:var(--sh-md);
  transition:background .4s, color .4s, border-color .4s, box-shadow .4s, transform .4s cubic-bezier(.16,1,.3,1); }
.ja-node:hover .ja-dot { color:var(--ink); }
.ja-node.done .ja-dot { color:var(--acc); border-color:var(--acc); }
.ja-node.on .ja-dot { background:var(--acc); color:var(--acc-ink); border-color:var(--acc); transform:scale(1.1);
  box-shadow:0 0 0 8px var(--acc-soft), 0 14px 30px -10px var(--acc); }
.ja-k { font-size:13px; font-weight:800; color:var(--sub); white-space:nowrap; transition:color .3s; }
.ja-node.on .ja-k, .ja-node.done .ja-k { color:var(--ink); }
.ja-panel { max-width:640px; margin:34px auto 0; text-align:center; animation:ja-in .6s cubic-bezier(.16,1,.3,1); }
@keyframes ja-in { from { opacity:0; transform:translateY(10px); filter:blur(6px); } }
.ja-n { font-size:12px; font-weight:800; letter-spacing:.24em; color:var(--acc); }
.ja-panel h3 { font-size:clamp(22px,2.6vw,30px); font-weight:900; margin-top:10px; }
.ja-panel p { font-size:16px; color:var(--mut); line-height:1.9; margin-top:10px; }

.trio { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:clamp(64px,8vw,96px); }
.tr { display:flex; flex-direction:column; gap:24px; border-radius:30px; padding:30px 26px 26px;
  background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-md); }
.tr-h h3 { font-size:19px; font-weight:900; }
.tr-h p { font-size:14px; color:var(--mut); line-height:1.8; margin-top:6px; }
.tr-m { margin-top:auto; }

.ob-sec { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; margin-top:clamp(80px,10vw,128px); }
.ob-t h3 { font-size:clamp(26px,3.2vw,40px); font-weight:900; line-height:1.3; margin-top:16px; }
.ob-t > p:not(.eb) { font-size:16px; color:var(--mut); line-height:1.95; margin-top:16px; max-width:48ch; }
.ob-wrap { display:flex; justify-content:center; }
.ob { position:relative; width:min(470px,86vw); aspect-ratio:1; }
.ob-ring { position:absolute; border-radius:50%; border:1px dashed var(--line2); animation:ob-spin 70s linear infinite; }
.ob-r2 { inset:0; }
.ob-r1 { inset:22%; animation-duration:50s; animation-direction:reverse; }
@keyframes ob-spin { to { transform:rotate(360deg); } }
.ob-node { position:absolute; left:calc(50% + 50% * sin(var(--a))); top:calc(50% - 50% * cos(var(--a)));
  transform:translate(-50%,-50%); }
.ob-node b { display:block; padding:9px 16px; border-radius:999px; font-size:13.5px; font-weight:800; white-space:nowrap;
  background:var(--card); color:var(--ink); border:1px solid var(--line2); box-shadow:var(--sh-md);
  animation:ob-spin 70s linear infinite reverse; }
.ob-in b { background:var(--acc-soft); color:var(--acc); border-color:transparent; box-shadow:none;
  animation-duration:50s; animation-direction:normal; }
.ob-core { position:absolute; inset:37%; border-radius:50%; display:grid; place-items:center; align-content:center; gap:2px;
  background:radial-gradient(circle at 32% 26%, #2C2E37, #0B0C0F 72%); color:#fff;
  box-shadow:0 0 0 10px var(--acc-soft), 0 26px 60px -18px var(--acc); }
.ob-core::after { content:""; position:absolute; inset:-22px; border-radius:50%; border:1px solid var(--acc); opacity:0;
  animation:ob-pulse 3.2s ease-out infinite; }
@keyframes ob-pulse { 0% { transform:scale(.8); opacity:.55; } 100% { transform:scale(1.35); opacity:0; } }
.ob-core b { font-size:clamp(22px,2.6vw,30px); font-weight:900; letter-spacing:.08em; direction:ltr;
  background:linear-gradient(180deg,#fff,#A9AEB8); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ob-core i { font-style:normal; font-size:11px; color:#9095A0; font-weight:700; }

/* ══════ الرصّة ══════ */
.dkx { margin-top:clamp(40px,5vw,56px); }
.dkx-tabs { display:flex; justify-content:center; gap:4px; flex-wrap:wrap; }
.dkx-tabs button { position:relative; font-family:inherit; border:0; background:none; cursor:pointer; padding:10px 20px 14px;
  color:var(--sub); font-weight:800; font-size:15px; transition:color .2s; }
.dkx-tabs button:hover, .dkx-tabs button.on { color:var(--ink); }
.dkx-bar { position:absolute; left:20px; right:20px; bottom:4px; height:2px; border-radius:2px; background:var(--line); overflow:hidden; }
.dkx-bar em { position:absolute; inset:0; background:var(--acc); transform-origin:right; animation:dkx-p linear forwards; }
@keyframes dkx-p { from { transform:scaleX(0); } }
.dkx-stack { display:grid; padding-top:52px; touch-action:pan-y; }
.dkx-card { grid-area:1/1; display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;
  border-radius:34px; padding:52px; background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-lg);
  transform-origin:50% 0; transition:transform .75s cubic-bezier(.16,1,.3,1), opacity .5s ease; user-select:none; }
.dkx-card[data-pos="0"] { z-index:4; }
.dkx-card[data-pos="1"] { z-index:3; transform:translateY(-24px) scale(.955); opacity:.7; cursor:pointer; }
.dkx-card[data-pos="2"] { z-index:2; transform:translateY(-46px) scale(.91); opacity:.4; }
.dkx-card[data-pos="3"], .dkx-card[data-pos="4"] { z-index:1; transform:translateY(-64px) scale(.87); opacity:0; pointer-events:none; }
.dkx-card:not([data-pos="0"]) .dkx-t, .dkx-card:not([data-pos="0"]) .dkx-m { visibility:hidden; }
.dkx-num { font-size:13px; font-weight:800; letter-spacing:.24em; color:var(--acc); }
.dkx-t h3 { font-size:clamp(24px,3vw,38px); font-weight:900; line-height:1.3; margin-top:14px; }
.dkx-t p { font-size:16px; color:var(--mut); line-height:1.95; margin-top:14px; max-width:46ch; }
.dkx-t .bt { margin-top:28px; }
.dkx-m .mk { box-shadow:var(--sh-lg); }

/* ══════ الأرقام ══════ */
.nums { background:var(--bg2); border-block:1px solid var(--line); }
.nums-in { display:grid; grid-template-columns:repeat(4,1fr); }
.num { padding:clamp(44px,6vw,72px) 20px; text-align:center; }
.num + .num { border-inline-start:1px solid var(--line); }
.num b { display:block; font-size:clamp(44px,5.4vw,72px); font-weight:900; line-height:1; font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg, var(--ink) 30%, var(--acc) 130%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.num > span { display:block; font-size:14px; color:var(--mut); margin-top:14px; line-height:1.7; }

/* ══════ جوّه الاشتراك ══════ */
.ft { display:grid; grid-template-columns:repeat(3,1fr); column-gap:44px; margin-top:clamp(48px,6vw,72px); }
/* المميزات متقسّمة مجموعات — عنوان صغير فوق كل مجموعة */
.ft-g { margin-top:clamp(40px,5vw,60px); }
.ft-g .ft { margin-top:10px; }
.ft-gh { display:flex; align-items:center; gap:10px; font-size:13px; font-weight:900; letter-spacing:.02em; color:var(--acc); }
.ft-tag { font-size:11px; font-weight:800; padding:3px 10px; border-radius:999px; background:var(--acc-soft); color:var(--acc); }
.ft-i { display:flex; gap:16px; padding:28px 0; border-top:1px solid var(--line); }
.ft-i > svg { color:var(--acc); flex-shrink:0; margin-top:4px; }
.ft-i b { font-size:16.5px; font-weight:800; display:block; }
.ft-i p { font-size:14px; color:var(--mut); line-height:1.8; margin-top:4px; }

/* ══════ الأسعار ══════ */
.pl { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:18px; margin:clamp(48px,6vw,72px) auto 0;
  max-width:1040px; align-items:stretch; }
.pl-c { position:relative; display:flex; flex-direction:column; border-radius:30px; padding:40px 32px 32px;
  background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-md);
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s; }
.pl-c:hover { transform:translateY(-4px); box-shadow:var(--sh-lg); }
/* الأوفر كارت غامق في الوضعين — زي الكارت اللي في البطل */
.pl-best { background:linear-gradient(160deg,#1A1B21,#0B0C0F); color:#F3F3F5; border-color:transparent;
  box-shadow:0 0 0 1px rgba(130,149,255,.35), 0 30px 70px -30px var(--acc); }
.pl-badge { position:absolute; top:20px; inset-inline-end:20px; font-size:11.5px; font-weight:900; padding:5px 13px;
  border-radius:999px; background:#8295FF; color:#08080A; }
.pl-pop { border-color:var(--acc); box-shadow:0 0 0 1px var(--acc), var(--sh-lg); }
.pl-badge-pop { background:var(--acc); color:var(--acc-ink); }
.pl-name { font-size:15px; font-weight:800; color:var(--mut); }
.pl-best .pl-name { color:#A3A5AE; }
.pl-price { display:flex; align-items:baseline; gap:8px; margin-top:14px; }
.pl-price b { font-size:54px; font-weight:900; line-height:1; font-variant-numeric:tabular-nums; }
.pl-price i { font-style:normal; font-size:15px; font-weight:700; color:var(--mut); }
.pl-best .pl-price i { color:#A3A5AE; }
.pl-per { font-size:13.5px; font-weight:800; color:var(--acc); margin-top:10px; }
.pl-best .pl-per { color:#B3BEFF; }
.pl-d { font-size:13.5px; color:var(--sub); margin-top:10px; }
.pl-list { display:flex; flex-direction:column; gap:12px; margin:28px 0 30px; padding-top:24px; border-top:1px solid var(--line); }
.pl-best .pl-list { border-color:rgba(255,255,255,.1); }
.pl-list li { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:600; color:var(--mut); }
.pl-best .pl-list li { color:#D5D7DD; }
.pl-list svg { color:var(--acc); flex-shrink:0; }
.pl-best .pl-list svg { color:#8295FF; }
.pl-c .bt-full { margin-top:auto; }
.pl-best .bt-pri { background:#FFFFFF; color:#0B0B0F; }
.pl-best .bt-line { color:#fff; border-color:rgba(255,255,255,.2); }
.pl-note { text-align:center; font-size:14px; color:var(--mut); margin-top:30px; }

/* ── باقات الطلبات: نوع الحساب فوق وكروت باقاته تحت ── */
.pk-tog { display:flex; gap:6px; width:max-content; max-width:100%; margin:clamp(40px,5vw,56px) auto 0; padding:6px;
  border-radius:999px; background:var(--soft); border:1px solid var(--line); }
.pk-tog button { display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 22px; border-radius:999px;
  font-family:inherit; border:0; background:none; cursor:pointer; color:var(--mut);
  transition:background .25s ease, color .25s ease, box-shadow .25s ease; }
.pk-tog button b { font-size:14px; font-weight:800; }
.pk-tog button i { font-style:normal; font-size:12px; font-weight:700; color:var(--sub); }
.pk-tog button.on { background:var(--card); color:var(--ink); box-shadow:var(--sh-md); }
.pk-tog button.on i { color:var(--acc); }
.pk-feats { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 22px; margin:22px auto 0; max-width:760px; }
.pk-feats li { display:flex; align-items:center; gap:7px; font-size:14px; font-weight:600; color:var(--mut); }
.pk-feats svg { color:var(--acc); flex-shrink:0; }
.pk { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:clamp(36px,4.5vw,52px) auto 0; max-width:1120px; align-items:stretch; }
.pk-c { position:relative; display:flex; flex-direction:column; border-radius:26px; padding:32px 24px 24px;
  background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-md);
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s; }
.pk-c:hover { transform:translateY(-4px); box-shadow:var(--sh-lg); }
/* الأكثر طلبًا كارت غامق في الوضعين — زي «الأوفر» قبل كده */
.pk-hot { background:linear-gradient(160deg,#1A1B21,#0B0C0F); color:#F3F3F5; border-color:transparent;
  box-shadow:0 0 0 1px rgba(130,149,255,.35), 0 30px 70px -30px var(--acc); }
.pk-badge { position:absolute; top:16px; inset-inline-end:16px; font-size:11px; font-weight:900; padding:4px 11px;
  border-radius:999px; background:var(--acc-soft); color:var(--acc); }
.pk-hot .pk-badge { background:#8295FF; color:#08080A; }
.pk-name { font-size:17px; font-weight:900; }
.pk-price { display:flex; align-items:baseline; gap:6px; margin-top:16px; }
.pk-price b { font-size:44px; font-weight:900; line-height:1; font-variant-numeric:tabular-nums; }
.pk-price i { font-style:normal; font-size:14px; font-weight:700; color:var(--mut); }
.pk-hot .pk-price i { color:#A3A5AE; }
.pk-orders { margin-top:12px; font-size:15px; font-weight:700; color:var(--mut); }
.pk-orders b { color:var(--ink); font-weight:900; font-variant-numeric:tabular-nums; }
.pk-hot .pk-orders { color:#D5D7DD; }
.pk-hot .pk-orders b { color:#FFFFFF; }
.pk-per { font-size:13px; font-weight:800; color:var(--acc); margin:6px 0 26px; }
.pk-hot .pk-per { color:#B3BEFF; }
.pk-c .bt-full { margin-top:auto; }
.pk-hot .bt-pri { background:#FFFFFF; color:#0B0B0F; }
.pk-solo { display:flex; flex-direction:column; align-items:center; gap:22px; margin-top:clamp(36px,4.5vw,52px); }

/* ══════ الأسئلة ══════ */
.fq { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(40px,7vw,96px); align-items:start; }
.fq-side { position:sticky; top:120px; }
.fq-side h2 { margin-top:16px; font-size:clamp(28px,3.4vw,44px); }
.fq-list details { border-bottom:1px solid var(--line); padding:24px 0; }
.fq-list details:first-child { border-top:1px solid var(--line); }
.fq-list summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-size:17.5px; font-weight:800; }
.fq-list summary::-webkit-details-marker { display:none; }
.fq-list summary i { position:relative; width:30px; height:30px; border-radius:50%; border:1px solid var(--line2); flex-shrink:0;
  transition:transform .35s cubic-bezier(.16,1,.3,1), background .2s, border-color .2s; }
.fq-list summary i::before, .fq-list summary i::after { content:""; position:absolute; inset:0; margin:auto; width:11px; height:1.5px;
  background:var(--ink); border-radius:2px; }
.fq-list summary i::after { transform:rotate(90deg); }
.fq-list details[open] summary i { transform:rotate(45deg); background:var(--acc-soft); border-color:transparent; }
.fq-list details p { font-size:15.5px; color:var(--mut); line-height:2; margin-top:14px; max-width:62ch; }

/* ══════ الفورم ══════ */
.go { position:relative; overflow:hidden; padding-block:clamp(96px,12vw,160px); background:var(--bg2); border-top:1px solid var(--line); }
.go-bg { position:absolute; inset:0; pointer-events:none; }
.go-in { position:relative; max-width:740px; margin:0 auto; padding-inline:24px; text-align:center; }
.go-in h2 { margin-top:16px; }
.go-in .lead { margin-inline:auto; }

.jf { display:flex; flex-direction:column; gap:16px; margin-top:40px; text-align:right; border-radius:30px; padding:32px;
  background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-lg); }
.jf-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.jf label { display:flex; flex-direction:column; gap:8px; }
.jf label > span, .jf-lbl { font-size:13px; font-weight:800; color:var(--mut); }
.jf label i { font-style:normal; color:var(--sub); font-weight:600; }
.jf input { width:100%; padding:14px 16px; border-radius:14px; border:1px solid var(--line2); background:var(--bg2);
  color:var(--ink); font-size:15.5px; font-family:inherit; outline:none; transition:border-color .15s, box-shadow .2s, background .2s; }
.jf input:focus { border-color:var(--acc); background:var(--card); box-shadow:0 0 0 4px var(--acc-soft); }
.jf input::placeholder { color:var(--sub); }
.jf-dom { display:flex; align-items:stretch; border-radius:14px; overflow:hidden; border:1px solid var(--line2); background:var(--bg2);
  transition:border-color .15s, box-shadow .2s; }
.jf-dom:focus-within { border-color:var(--acc); box-shadow:0 0 0 4px var(--acc-soft); }
.jf-dom input { border:0; border-radius:0; box-shadow:none !important; background:transparent !important; }
/* مفتاح الدولة قبل رقم الموبايل — على الشمال (LTR) فالفاصل يمينه */
.jf-dom > span.jf-dial { border-inline-start:0; border-inline-end:1px solid var(--line); font-variant-numeric:tabular-nums; }
.jf-fld { display:flex; flex-direction:column; gap:8px; }
.jf-dom > span { display:flex; align-items:center; padding:0 14px; font-size:14px; font-weight:700; color:var(--mut);
  background:var(--soft); border-inline-start:1px solid var(--line); white-space:nowrap; }
/* كروت الباقة — بديل الـselect اللي نظام التشغيل بيرسم قايمته */
.jf-plans { display:flex; flex-direction:column; gap:8px; }
.jf-plan-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(124px,1fr)); gap:8px; }
.jf-plan { display:flex; flex-direction:column; align-items:center; gap:3px; text-align:center; padding:14px 10px; border-radius:16px;
  cursor:pointer; font-family:inherit; background:var(--bg2); border:1px solid var(--line2); color:var(--ink);
  transition:border-color .18s, background .18s, box-shadow .2s, transform .12s; }
.jf-plan:hover { border-color:var(--acc); }
.jf-plan:active { transform:scale(.98); }
.jf-plan.on { border-color:var(--acc); background:var(--acc-soft); box-shadow:0 0 0 3px var(--acc-soft); }
.jf-plan b { font-size:13px; font-weight:800; color:var(--mut); }
.jf-plan.on b { color:var(--acc); }
.jf-plan u { text-decoration:none; font-size:19px; font-weight:900; font-variant-numeric:tabular-nums; }
.jf-plan u i { font-size:11px; font-style:normal; font-weight:700; color:var(--sub); }
.jf-plan s { text-decoration:none; font-size:10.5px; color:var(--sub); font-weight:700; }
.jf-plan-none { justify-content:center; }
.jf-plan-none b { font-size:12.5px; }
.jf-err { display:flex; align-items:center; gap:7px; color:var(--err); font-size:13.5px; font-weight:700; }
.jf-login { margin-inline-start:auto; color:var(--acc); font:inherit; font-weight:900; text-decoration:underline; text-underline-offset:3px;
  background:none; border:0; padding:0; cursor:pointer; }
.jf .jf-bad, .jf .jf-dom.jf-bad { border-color:var(--err) !important; }
.jf-pw button { display:flex; align-items:center; padding:0 14px; color:var(--mut); background:transparent; border:0; cursor:pointer; }
.jf-avail { font-style:normal; font-size:12px; font-weight:800; }
.jf-avail.ok { color:var(--ok); } .jf-avail.no { color:var(--err); }
.jf-plan-free u { color:var(--acc); }
.jf-note { font-size:12.5px; color:var(--mut); font-weight:700; line-height:1.8; margin:2px 0 0; }
.jf-hp { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; opacity:0 !important; }
.jf-go { margin-top:6px; padding:17px; border:0; border-radius:16px; font-size:17px; font-weight:900; cursor:pointer;
  background:var(--ink); color:var(--bg); display:flex; align-items:center; justify-content:center; gap:9px; font-family:inherit;
  transition:transform .15s, box-shadow .25s; box-shadow:0 12px 30px -14px rgba(11,11,15,.5); }
.jf-go:hover { box-shadow:0 18px 40px -16px var(--acc), 0 0 0 4px var(--acc-soft); }
.jf-go:active { transform:scale(.99); } .jf-go:disabled { opacity:.6; }
.jf-fine { font-size:12.5px; color:var(--sub); text-align:center; }
.jf-spin { animation:jf-rot 1s linear infinite; }
@keyframes jf-rot { to { transform:rotate(360deg); } }
.jf-done { align-items:center; text-align:center; gap:12px; padding:44px 28px; }
.jf-tick { width:68px; height:68px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(22,163,74,.12); color:var(--ok); }
.jf-done h3 { font-size:22px; font-weight:900; }
.jf-done p { font-size:15px; color:var(--mut); line-height:1.9; }
.jf-slug { font-size:13.5px; font-weight:800; color:var(--acc); background:var(--acc-soft); padding:8px 16px; border-radius:10px; }
.jf-wa { display:inline-flex; align-items:center; gap:8px; margin-top:8px; padding:13px 24px; border-radius:999px;
  background:#25D366; color:#053; font-weight:900; font-size:14.5px; }

/* ── التذييل ── */
.ftr { text-align:center; padding:60px 24px; border-top:1px solid var(--line); background:var(--bg); }
.ftr p { font-size:13.5px; color:var(--sub); margin-top:12px; }
.ftr a { display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-size:14px; font-weight:800; color:var(--acc); }

/* ══════ مشاهد المنصة ══════ */
.mk { background:var(--card); border:1px solid var(--line); border-radius:18px; box-shadow:var(--sh-md); font-size:13px;
  overflow:hidden; color:var(--ink); text-align:right; }
.jp[data-theme="dark"] .mk { border-color:var(--line2); }

.mk-bar { display:flex; align-items:center; gap:6px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.mk-bar span { width:9px; height:9px; border-radius:50%; background:var(--line2); }
.mk-bar b { margin-inline-start:auto; font-size:11.5px; color:var(--sub); font-weight:800; }

/* لوحة الشحن */
.mk-dash { padding:14px; }
.mk-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:12px 0; }
.mk-stat { background:var(--soft); border:1px solid var(--line); border-radius:12px; padding:10px; text-align:center; }
.mk-stat span { font-size:10px; font-weight:800; display:block; }
.mk-stat b { font-size:18px; font-weight:900; font-variant-numeric:tabular-nums; }
.mk-chips { display:flex; gap:5px; flex-wrap:wrap; padding-bottom:11px; }
.mk-chip { font-size:10.5px; font-weight:800; padding:4px 10px; border-radius:999px; background:var(--soft); color:var(--sub);
  border:1px solid var(--line); transition:background .35s, color .35s; }
.mk-card { position:relative; border:1px solid var(--line); border-radius:14px; padding:12px 14px 12px 12px; background:var(--card); overflow:hidden; }
.mk-card::before { content:""; position:absolute; inset-block:0; inset-inline-end:0; width:3px; background:var(--st); transition:background .35s; }
.mk-card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.mk-card-top b { font-size:14px; font-weight:900; display:block; }
.mk-card-top i { font-size:10.5px; font-style:normal; color:var(--sub); display:block; margin-top:3px; }
.mk-amt { font-size:19px; font-weight:900; color:var(--acc); white-space:nowrap; font-variant-numeric:tabular-nums; }
.mk-amt u { font-size:9.5px; text-decoration:none; color:var(--sub); margin-inline-start:3px; }
.mk-status { display:inline-block; margin-top:9px; font-size:10.5px; font-weight:900; padding:3px 10px; border-radius:999px; transition:background .35s, color .35s; }
.mk-note { font-size:11px; color:var(--sub); margin-top:7px; }
.mk-acts { display:flex; gap:6px; margin-top:11px; }
.mk-act { display:flex; align-items:center; gap:4px; font-size:10px; font-weight:800; color:var(--mut); background:var(--soft);
  border:1px solid var(--line); border-radius:8px; padding:5px 9px; }

/* موبايل المندوب — جهاز غامق في الوضعين */
.mk-phone { max-width:272px; margin:0 auto; border-radius:30px; padding:16px 13px; background:#0F1014;
  border:1px solid rgba(255,255,255,.1); color:#F3F3F5; box-shadow:0 0 0 6px #1C1D22, 0 30px 60px -24px rgba(0,0,0,.55); }
.jp[data-theme="dark"] .mk-phone { border-color:rgba(255,255,255,.12); box-shadow:0 0 0 6px #1F2026, 0 30px 60px -24px rgba(0,0,0,.8); }
.mk-ph-top { display:flex; align-items:center; gap:9px; padding-bottom:12px; }
.mk-avatar { width:34px; height:34px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:12px;
  font-weight:900; color:#fff; background:linear-gradient(135deg,#B3BEFF,#4F63FF); flex-shrink:0; }
.mk-avatar.sm { width:28px; height:28px; border-radius:9px; }
.mk-ph-top b { font-size:13.5px; font-weight:900; color:#F3F3F5; display:block; }
.mk-ph-top i { font-size:10.5px; font-style:normal; color:#8B8E97; }
.mk-ph-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.mk-ph-stats div { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:11px; padding:9px 4px; text-align:center; }
.mk-ph-stats div.hot { background:rgba(74,222,128,.1); border-color:rgba(74,222,128,.25); }
.mk-ph-stats b { font-size:15px; font-weight:900; color:#F3F3F5; display:block; font-variant-numeric:tabular-nums; }
.mk-ph-stats div.hot b { color:#4ADE80; }
.mk-ph-stats span { font-size:9px; color:#8B8E97; font-weight:700; }
.mk-ph-card { margin-top:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); border-radius:14px; padding:12px; }
.mk-ph-row { display:flex; justify-content:space-between; align-items:center; }
.mk-ph-row b { font-size:14px; font-weight:900; color:#F3F3F5; }
.mk-ph-amt { font-size:17px; font-weight:900; color:#B3BEFF; font-variant-numeric:tabular-nums; }
.mk-ph-card i { display:flex; align-items:center; gap:4px; font-size:10.5px; font-style:normal; color:#8B8E97; margin-top:5px; }
.mk-ph-quick { display:flex; gap:6px; margin-top:10px; }
.mk-ph-quick .q { flex:1; display:flex; align-items:center; justify-content:center; gap:4px; font-size:10.5px; font-weight:800;
  padding:8px 4px; border-radius:9px; background:rgba(255,255,255,.06); color:#E4E6EC; border:1px solid rgba(255,255,255,.1); }
.mk-ph-quick .call { color:#4ADE80; border-color:rgba(74,222,128,.3); }
.mk-ph-quick .map { color:#60A5FA; border-color:rgba(96,165,250,.3); }
.mk-ph-acts { display:flex; gap:6px; margin-top:7px; }
.mk-ph-acts .a { flex:1; display:flex; align-items:center; justify-content:center; gap:5px; font-size:11px; font-weight:900;
  padding:10px 4px; border-radius:10px; color:#fff; }
.mk-ph-acts .go { background:linear-gradient(135deg,#A78BFA,#7C3AED); }
.mk-ph-acts .ok { background:linear-gradient(135deg,#34D399,#16A34A); }
.mk-ph-hint { font-size:10px; color:#8B8E97; text-align:center; margin-top:11px; }

/* تتبّع */
.mk-track { padding:18px 16px; }
.mk-track-h { font-size:15px; font-weight:900; display:block; text-align:center; margin-bottom:16px; }
.mk-track-bar { display:flex; }
.mk-track-st { flex:1; display:flex; flex-direction:column; align-items:center; position:relative; }
.mk-track-line { position:absolute; top:11px; left:50%; width:100%; height:2px; transition:background .5s; }
.mk-track-dot { width:23px; height:23px; border-radius:50%; border:2px solid; display:flex; align-items:center; justify-content:center;
  font-size:9.5px; font-weight:900; position:relative; z-index:2; transition:background .4s, border-color .4s, color .4s; }
.mk-track-st i { font-size:9.5px; font-style:normal; font-weight:800; margin-top:7px; text-align:center; line-height:1.4; transition:color .4s; }
.mk-track-log { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:10px; }
.mk-track-log li { display:flex; align-items:center; gap:9px; font-size:12px; font-weight:700; color:var(--mut); }
.mk-track-log .d { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--soft); color:var(--sub); flex-shrink:0; }
.mk-track-log .d.ok { background:rgba(22,163,74,.12); color:var(--ok); }
.mk-track-f { font-size:10.5px; color:var(--sub); text-align:center; margin-top:14px; }

/* التسوية */
.mk-settle { padding:16px; }
.mk-set-h { display:flex; align-items:center; gap:9px; padding-bottom:13px; border-bottom:1px solid var(--line); }
.mk-set-h b { font-size:13.5px; font-weight:900; display:block; }
.mk-set-h i { font-size:10.5px; font-style:normal; color:var(--sub); }
.mk-set-go { margin-inline-start:auto; display:flex; align-items:center; gap:4px; font-size:10.5px; font-weight:900;
  background:#16A34A; color:#fff; padding:6px 11px; border-radius:9px; white-space:nowrap; }
.mk-set-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; padding:14px 0 10px; }
.mk-set-grid div { background:var(--soft); border:1px solid var(--line); border-radius:11px; padding:11px 6px; text-align:center; }
.mk-set-grid div.net { background:rgba(22,163,74,.08); border-color:rgba(22,163,74,.24); }
.mk-set-grid span { font-size:9.5px; color:var(--sub); font-weight:700; display:block; }
.mk-set-grid b { font-size:16px; font-weight:900; font-variant-numeric:tabular-nums; }
.mk-set-f { display:flex; align-items:center; justify-content:center; gap:5px; font-size:10.5px; color:var(--sub);
  padding-top:9px; border-top:1px solid var(--line); }

/* واجهة المتجر */
.mk-store { padding:0; }
.mk-st-nav { display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--line); color:var(--sub); }
.mk-st-nav b { font-size:13px; font-weight:900; letter-spacing:.14em; color:var(--ink); }
.mk-st-hero { margin:13px; height:84px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:900; color:#fff; background:linear-gradient(120deg,#16171C,#3B4260 60%,#5A69B8); }
.mk-st-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:0 13px; }
.mk-st-p { text-align:center; }
.mk-st-img { display:block; height:56px; border-radius:10px; background:linear-gradient(140deg,var(--soft),var(--line2)); }
.mk-st-p i { display:block; font-size:9.5px; font-style:normal; color:var(--mut); margin-top:5px; }
.mk-st-p b { display:block; font-size:11px; font-weight:900; }
.mk-st-cta { display:block; margin:13px; padding:11px; border-radius:11px; background:var(--ink); color:var(--bg);
  font-size:12.5px; font-weight:900; text-align:center; }

/* تنبيه */
.mk-alert { display:flex; align-items:flex-start; gap:11px; padding:13px 15px; background:rgba(245,158,11,.1);
  border:1px solid rgba(245,158,11,.3); border-radius:14px; box-shadow:none; }
.mk-alert-ic { display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:9px;
  background:rgba(245,158,11,.16); color:#F59E0B; flex-shrink:0; }
.mk-alert b { font-size:12.5px; font-weight:900; display:block; }
.mk-alert i { font-size:11px; font-style:normal; color:var(--mut); display:block; margin-top:3px; }

/* إدارة الطلبات */
.mk-ord { padding:14px; }
.mk-ord-filters { display:flex; gap:5px; flex-wrap:wrap; padding:12px 0 10px; }
.mk-ord-f { font-size:10px; font-weight:800; padding:4px 9px; border-radius:999px; background:var(--soft); color:var(--sub); border:1px solid var(--line); }
.mk-ord-f.on { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.mk-ord-list { display:flex; flex-direction:column; gap:6px; }
.mk-ord-row { display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:11px; padding:9px 11px;
  transition:border-color .3s, background .3s; }
.mk-ord-row.sel { border-color:var(--acc); background:var(--acc-soft); }
.mk-ck { width:15px; height:15px; border-radius:5px; border:1.5px solid var(--line2); display:flex; align-items:center;
  justify-content:center; flex-shrink:0; color:var(--acc-ink); transition:background .3s, border-color .3s; }
.mk-ck.on { background:var(--acc); border-color:var(--acc); }
.mk-ord-who { flex:1; min-width:0; }
.mk-ord-who b { font-size:12.5px; font-weight:900; display:block; }
.mk-ord-who i { font-size:9.5px; font-style:normal; color:var(--sub); display:block; margin-top:2px; }
.mk-ord-st { font-size:9.5px; font-weight:900; padding:3px 8px; border-radius:999px; white-space:nowrap; }
.mk-ord-amt { font-size:13px; font-weight:900; color:var(--ink); font-variant-numeric:tabular-nums; }
.mk-ord-bulk { display:flex; align-items:center; gap:6px; margin-top:10px; padding:9px 11px; border-radius:12px; background:#101116;
  opacity:0; transform:translateY(6px); transition:opacity .3s, transform .3s; }
.mk-ord-bulk.on { opacity:1; transform:none; }
.mk-ord-bulk b { font-size:10.5px; font-weight:900; color:#B3BEFF; }
.mk-ord-bulk span { display:flex; align-items:center; gap:4px; font-size:9.5px; font-weight:800; color:#E4E6EC;
  background:rgba(255,255,255,.1); border-radius:7px; padding:4px 8px; }
.mk-ord-bulk .p { background:#8295FF; color:#08080A; }

/* الإحصائيات */
.mk-stats-scr { padding:14px; }
.mk-sc-tabs { display:flex; gap:5px; padding:12px 0 11px; }
.mk-sc-tabs span { font-size:10px; font-weight:800; padding:4px 10px; border-radius:8px; background:var(--soft); color:var(--sub); border:1px solid var(--line); }
.mk-sc-tabs span.on { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.mk-sc-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:7px; }
.mk-sc-grid div { background:var(--soft); border:1px solid var(--line); border-radius:11px; padding:10px 11px; }
.mk-sc-grid div.prof { background:rgba(22,163,74,.07); border-color:rgba(22,163,74,.22); }
.mk-sc-grid i { font-size:9.5px; font-style:normal; color:var(--sub); font-weight:700; display:block; }
.mk-sc-grid b { font-size:17px; font-weight:900; font-variant-numeric:tabular-nums; }
.mk-sc-grid div.prof b { color:var(--ok); }
.mk-sc-chart { display:flex; align-items:flex-end; gap:6px; height:64px; margin-top:12px; padding:0 2px; border-bottom:1px solid var(--line); }
.mk-sc-chart span { flex:1; border-radius:5px 5px 0 0; background:linear-gradient(180deg,var(--acc2),var(--acc));
  animation:mk-grow .8s cubic-bezier(.22,.8,.3,1) backwards; }
@keyframes mk-grow { from { height:4px !important; opacity:.4; } }
.mk-sc-src { display:flex; gap:12px; flex-wrap:wrap; margin-top:11px; }
.mk-sc-src div { display:flex; align-items:center; gap:5px; font-size:10.5px; font-weight:700; color:var(--mut); }
.mk-sc-src b { color:var(--ink); font-weight:900; }
.mk-sc-src .dot { width:8px; height:8px; border-radius:50%; }
.mk-sc-src .tt { background:#22D3EE; } .mk-sc-src .mt { background:#3B82F6; } .mk-sc-src .dr { background:#A78BFA; }

/* رحلة العميل */
.mk-jr { padding:14px; }
.mk-jr-list { display:flex; flex-direction:column; gap:9px; padding-top:13px; }
.mk-jr-row { display:flex; align-items:center; gap:8px; }
.mk-jr-ic { width:24px; height:24px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mk-jr-l { font-size:11px; font-weight:800; color:var(--mut); width:74px; flex-shrink:0; }
.mk-jr-track { flex:1; height:9px; border-radius:99px; background:var(--soft); overflow:hidden; }
.mk-jr-fill { display:block; height:100%; border-radius:99px; animation:mk-w .9s cubic-bezier(.22,.8,.3,1) backwards; }
@keyframes mk-w { from { width:0 !important; } }
.mk-jr-row b { font-size:12px; font-weight:900; width:42px; text-align:left; font-variant-numeric:tabular-nums; }
.mk-jr-f { display:flex; align-items:center; gap:6px; font-size:10.5px; font-weight:700; color:var(--warn);
  background:rgba(245,158,11,.1); border-radius:10px; padding:8px 11px; margin-top:13px; }

/* حماية التاجر */
.mk-guard { padding:14px; }
.mk-gd-row { border:1px solid var(--line); border-radius:12px; padding:10px 12px; margin-top:9px; }
.mk-gd-row.blocked { border-color:rgba(220,38,38,.3); background:rgba(220,38,38,.05); }
.mk-gd-row b { font-size:12.5px; font-weight:900; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.mk-gd-row i { font-size:10px; font-style:normal; color:var(--sub); display:block; margin-top:4px; }
.mk-gd-warn { display:inline-flex; align-items:center; gap:3px; font-size:9px; font-weight:900; padding:2px 7px; border-radius:999px; background:#FEF3C7; color:#92400E; }
.mk-gd-ban { display:inline-flex; align-items:center; gap:3px; font-size:9px; font-weight:900; padding:2px 7px; border-radius:999px; background:rgba(220,38,38,.12); color:#EF4444; }
.mk-gd-stop { display:flex; align-items:center; gap:10px; margin-top:11px; padding:11px 13px; border-radius:12px; background:#101116; color:#F3F3F5; }
.mk-gd-stop b { font-size:12px; font-weight:900; display:block; }
.mk-gd-stop i { font-size:10px; font-style:normal; color:#A3A5AE; display:block; margin-top:2px; }
.mk-gd-stop svg { color:#8295FF; flex-shrink:0; }

/* الربط */
.mk-int { padding:14px; }
.mk-int-list { display:flex; flex-direction:column; gap:7px; padding-top:13px; }
.mk-int-row { display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:11px; padding:9px 11px; }
.mk-int-ok { width:19px; height:19px; border-radius:50%; background:rgba(22,163,74,.12); color:var(--ok); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mk-int-row div { flex:1; min-width:0; }
.mk-int-row b { font-size:12px; font-weight:900; display:block; }
.mk-int-row i { font-size:9.5px; font-style:normal; color:var(--sub); display:block; margin-top:2px; }
.mk-int-tag { font-size:9px; font-weight:900; padding:3px 8px; border-radius:999px; background:rgba(22,163,74,.1); color:var(--ok); }
.mk-int-note { display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:700; color:var(--mut); background:var(--soft);
  border-radius:10px; padding:9px 11px; margin-top:11px; }
.mk-int-note svg { color:#25D366; flex-shrink:0; }

/* الفريق */
.mk-team { padding:14px; }
.mk-team-list { display:flex; flex-direction:column; gap:7px; padding-top:13px; }
.mk-team-row { display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:11px; padding:9px 11px; }
.mk-team-av { width:27px; height:27px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:900; flex-shrink:0; }
.mk-team-row div { flex:1; min-width:0; }
.mk-team-row b { font-size:12px; font-weight:900; display:block; }
.mk-team-row i { font-size:9.5px; font-style:normal; color:var(--sub); display:block; margin-top:2px; }
.mk-team-tag { font-size:9px; font-weight:900; padding:3px 9px; border-radius:999px; white-space:nowrap; }
.mk-team-f { display:flex; align-items:center; gap:6px; font-size:10.5px; color:var(--sub); margin-top:11px; padding-top:10px; border-top:1px solid var(--line); }

/* ══════ الدخول ══════
   نافذة بنفس لغة الصفحة: كارت زي فورم الاشتراك، وتوهّج خفيف من فوق،
   وبتطلع من تحت على الموبايل. خانات الإدخال من .jf نفسها. */
.nv-login { flex-shrink:0; gap:7px; }
.lg { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:20px;
  background:rgba(4,4,8,.55); backdrop-filter:blur(8px) saturate(1.2); -webkit-backdrop-filter:blur(8px) saturate(1.2);
  animation:lg-fade .22s ease-out both; }
.lg-card { position:relative; overflow:hidden; width:min(440px,100%); max-height:calc(100dvh - 40px); overflow-y:auto;
  text-align:right; padding:34px 30px 26px; border-radius:30px; background:var(--card); border:1px solid var(--line);
  box-shadow:var(--sh-lg); animation:lg-rise .38s cubic-bezier(.2,.85,.25,1) both; }
.lg-glow { position:absolute; inset:-40% -20% auto; height:70%; pointer-events:none;
  background:radial-gradient(closest-side, var(--glow), transparent 75%); }
.lg-card > *:not(.lg-glow) { position:relative; }
.lg-card h3 { font-size:clamp(24px,3vw,30px); font-weight:900; letter-spacing:-.01em; margin-top:12px; color:var(--ink); }
.lg-sub { color:var(--mut); font-size:15px; line-height:1.8; margin-top:6px; }
.lg-x { position:absolute !important; top:16px; inset-inline-end:16px; width:36px; height:36px; border-radius:50%;
  display:grid; place-items:center; cursor:pointer; color:var(--mut); background:var(--soft); border:1px solid var(--line);
  transition:color .15s, border-color .15s, transform .15s; }
.lg-x:hover { color:var(--ink); border-color:var(--line2); }
.lg-x:active { transform:scale(.92); }
.lg-f { margin-top:22px; padding:0; border:0; border-radius:0; background:none; box-shadow:none; gap:14px; }
.lg-pw-h { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.lg-forgot { font:inherit; font-size:12.5px; font-weight:800; color:var(--acc); background:none; border:0; padding:0; cursor:pointer; }
.lg-forgot:hover { text-decoration:underline; text-underline-offset:3px; }
.lg-forgot:disabled { opacity:.5; cursor:default; }
.lg-sent { display:flex; align-items:center; gap:7px; color:var(--ok); font-size:13.5px; font-weight:800; }
.lg-alt { margin-top:18px; padding-top:16px; border-top:1px solid var(--line); text-align:center; font-size:14px; color:var(--mut); }
.lg-alt a { color:var(--ink); font-weight:900; text-decoration:underline; text-decoration-color:var(--acc);
  text-decoration-thickness:2px; text-underline-offset:4px; }
.jf-have { margin-top:-6px; font-size:13.5px; color:var(--mut); text-align:center; }
.jf-have button { font:inherit; font-weight:900; color:var(--ink); background:none; border:0; padding:0; cursor:pointer;
  text-decoration:underline; text-decoration-color:var(--acc); text-decoration-thickness:2px; text-underline-offset:4px; }
@keyframes lg-fade { from { opacity:0; } }
@keyframes lg-rise { from { opacity:0; transform:translateY(14px) scale(.965); } }
@keyframes lg-up { from { transform:translateY(100%); } }

/* ══════ الألوان: لمسات هادية فوق الأساس المحايد ══════
   الأرضيات والنصوص زي ما هي (أبيض/أسود/رمادي). اللون بيدخل في حاجات
   صغيرة بس: العنوان الصغير فوق كل قسم، توهّج خفيف ورا القسم، أيقونات
   المميزات، أرقام الخطوات والإحصائيات. كل قسم ليه لون من عيلة واحدة
   (data-tone)، فالصفحة بقت ملوّنة من غير ما تبقى زحمة. */
.jp { --t-indigo:var(--acc); --t-violet:#7C3AED; --t-teal:#0D9488; --t-amber:#D97706; --t-rose:#E11D48; --t-sky:#0284C7; --t-green:#059669; }
.jp[data-theme="dark"] { --t-violet:#A78BFA; --t-teal:#2DD4BF; --t-amber:#FBBF24; --t-rose:#FB7185; --t-sky:#38BDF8; --t-green:#34D399; }
@media (prefers-color-scheme:dark) {
  .jp:not([data-theme]) { --t-violet:#A78BFA; --t-teal:#2DD4BF; --t-amber:#FBBF24; --t-rose:#FB7185; --t-sky:#38BDF8; --t-green:#34D399; }
}
.jp [data-tone="indigo"] { --tone:var(--t-indigo); } .jp [data-tone="violet"] { --tone:var(--t-violet); }
.jp [data-tone="teal"] { --tone:var(--t-teal); }     .jp [data-tone="amber"] { --tone:var(--t-amber); }
.jp [data-tone="rose"] { --tone:var(--t-rose); }     .jp [data-tone="sky"] { --tone:var(--t-sky); }
.jp [data-tone="green"] { --tone:var(--t-green); }
.jp [data-tone] { --tone-soft:color-mix(in srgb, var(--tone) 12%, transparent); }
.jp [data-tone] .eb { color:var(--tone); }
.sec[data-tone] { position:relative; isolation:isolate; }
.sec[data-tone]::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(46% 240px at 50% 0%, color-mix(in srgb, var(--tone) 9%, transparent), transparent 75%); }
.sh h2 em, .jp [data-tone] h2 em { font-style:normal; background:linear-gradient(100deg, var(--tone, var(--acc)), color-mix(in srgb, var(--tone, var(--acc)) 55%, var(--acc2)));
  -webkit-background-clip:text; background-clip:text; color:transparent; }
/* البطل: توهّج تاني دافي خفيف جنب الأزرق */
.hx-glow { background:radial-gradient(42% 46% at 28% 38%, var(--glow), transparent 70%),
             radial-gradient(38% 40% at 78% 18%, var(--glow2), transparent 70%),
             radial-gradient(30% 34% at 62% 86%, color-mix(in srgb, var(--t-amber) 9%, transparent), transparent 70%); }

/* الفرق: سطرين — كل سطر جملة كاملة */
.st-h { max-width:none; font-size:clamp(25px,3.3vw,44px); line-height:1.5; }
.st-h > span { display:block; text-wrap:balance; }
.st-h .st-l1 { color:var(--sub); }
.st-h .st-l2 { color:var(--ink); }
.st-h em { background:linear-gradient(100deg, var(--tone, var(--acc)), var(--acc2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cmp-us svg { color:var(--t-green); }
.cmp-h span:last-child { color:var(--tone, var(--acc)); }

/* الخطوات: الرقم يمين وبلون الخطوة */
.step-n { text-align:right; -webkit-text-stroke:0; padding-bottom:.06em;
  background:linear-gradient(160deg, var(--tone, var(--acc)) 20%, color-mix(in srgb, var(--tone, var(--acc)) 55%, var(--ink)));
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.step::before { background:var(--tone, var(--acc)); }

/* الأرقام */
.num[data-tone] b { background:linear-gradient(180deg, var(--ink) 25%, var(--tone) 120%); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* المميزات: أيقونة في مربع بلون المجموعة */
.ft-gh { color:var(--tone, var(--acc)); }
.ft-tag { background:var(--tone-soft, var(--acc-soft)); color:var(--tone, var(--acc)); }
.ft-tag-new { background:var(--tone); color:#fff; animation:ft-blink 2.4s ease-in-out infinite; }
@keyframes ft-blink { 0%,100% { box-shadow:0 0 0 0 color-mix(in srgb, var(--tone) 45%, transparent); } 50% { box-shadow:0 0 0 6px transparent; } }
.ft-ic { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; flex-shrink:0;
  background:var(--tone-soft, var(--acc-soft)); color:var(--tone, var(--acc)); transition:transform .3s cubic-bezier(.16,1,.3,1); }
.ft-i:hover .ft-ic { transform:translateY(-3px) rotate(-6deg); }
.ft-new { border-radius:28px; padding:6px 26px 4px; margin-inline:-26px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--tone) 6%, transparent), transparent);
  border:1px solid color-mix(in srgb, var(--tone) 22%, transparent); }
.ft-new .ft-gh { margin-top:20px; }
.ft-pay { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:14px; }
.ft-pay img { height:30px; width:auto; border-radius:8px; background:#fff; padding:3px 6px; border:1px solid var(--line);
  box-shadow:var(--sh-md); transition:transform .25s; }
.ft-pay img:hover { transform:translateY(-3px); }
.ft-cod { font-size:12.5px; font-weight:800; padding:6px 12px; border-radius:999px; background:var(--tone-soft); color:var(--tone); }

/* ══════ الثيمات ══════ */
.th { margin-top:clamp(36px,4.5vw,52px); }
.th-cats { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.th-cats button { font-family:inherit; font-size:14px; font-weight:800; padding:9px 18px; border-radius:999px; cursor:pointer;
  background:var(--card); color:var(--mut); border:1px solid var(--line2); transition:background .2s, color .2s, border-color .2s, transform .15s; }
.th-cats button:hover { color:var(--ink); border-color:var(--ink); }
.th-cats button:active { transform:scale(.97); }
.th-cats button.on { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.th-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:24px; margin-top:36px; }
.th-c { display:flex; flex-direction:column; border-radius:28px; overflow:hidden; background:var(--card); border:1px solid var(--line);
  box-shadow:var(--sh-md); color:inherit; animation:th-in .6s cubic-bezier(.16,1,.3,1) both;
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s, border-color .3s; }
.th-c:hover { transform:translateY(-8px); box-shadow:var(--sh-lg), 0 30px 60px -30px color-mix(in srgb, var(--th) 55%, transparent);
  border-color:color-mix(in srgb, var(--th) 40%, var(--line)); }
@keyframes th-in { from { opacity:0; transform:translateY(18px) scale(.98); } }
/* اللقطة: الكمبيوتر ورا والموبايل قدام — على أرضية بلون الثيم */
.th-shot { position:relative; height:270px; overflow:hidden;
  background:radial-gradient(120% 90% at 85% 0%, color-mix(in srgb, var(--th) 26%, var(--card)), color-mix(in srgb, var(--th) 8%, var(--bg2)) 70%); }
.th-desk { position:absolute; top:22px; left:22px; width:118%; max-width:none; border-radius:12px;
  box-shadow:0 22px 48px -18px rgba(15,18,30,.45), 0 0 0 1px rgba(0,0,0,.06);
  transform-origin:0 0; transition:transform .8s cubic-bezier(.16,1,.3,1); }
.th-c:hover .th-desk { transform:scale(1.04) translate(-6px,-4px); }
.th-phone { position:absolute; right:22px; bottom:-34px; width:118px; aspect-ratio:390/844; padding:6px; border-radius:24px;
  background:#0D0F14; box-shadow:0 0 0 1.5px #3A3F4B inset, 0 26px 40px -14px rgba(10,12,22,.55), 0 0 0 1px rgba(255,255,255,.06);
  transition:transform .7s cubic-bezier(.16,1,.3,1); }
.th-phone img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; border-radius:18px; }
.th-notch { position:absolute; top:10px; left:50%; width:34px; height:9px; margin-left:-17px; border-radius:9px; background:#0D0F14; z-index:1; }
.th-c:hover .th-phone { transform:translateY(-26px) rotate(-2deg); }
.th-open { position:absolute; left:16px; bottom:16px; display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px;
  font-size:12.5px; font-weight:900; color:#fff; background:rgba(12,14,22,.78); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  opacity:0; transform:translateY(8px); transition:opacity .35s, transform .35s; }
.th-c:hover .th-open, .th-c:focus-visible .th-open { opacity:1; transform:none; }
.th-info { padding:20px 22px 22px; display:flex; flex-direction:column; gap:9px; flex:1; }
.th-name { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.th-name b { font-size:20px; font-weight:900; }
.th-free { font-size:12px; font-weight:900; padding:4px 12px; border-radius:999px; background:color-mix(in srgb, var(--t-green) 14%, transparent); color:var(--t-green); }
.th-info p { font-size:14px; color:var(--mut); line-height:1.8; }
.th-tags { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:6px; }
.th-tags > span:not(.th-sw) { font-size:12px; font-weight:800; padding:5px 12px; border-radius:999px; border:1px solid var(--line2); color:var(--mut); }
.th-sw { display:flex; gap:5px; margin-inline-start:auto; }
.th-sw i { width:16px; height:16px; border-radius:50%; box-shadow:0 0 0 2px var(--card), 0 0 0 3px var(--line2); }
@media (hover:none) { .th-open { opacity:1; transform:none; } }

/* ══════ الدعم: كارت غامق في المودين بتدرّج المنصة + شات صغير ══════ */
.hp { margin-top:clamp(56px,7vw,88px); position:relative; overflow:hidden; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(24px,4vw,56px);
  align-items:center; padding:clamp(28px,4vw,48px); border-radius:32px; color:#F3F3F5;
  background:radial-gradient(60% 90% at 100% 0%, rgba(124,58,237,.45), transparent 60%),
             radial-gradient(50% 80% at 0% 100%, rgba(219,39,119,.32), transparent 60%),
             linear-gradient(160deg,#15131F,#0B0B10);
  box-shadow:0 0 0 1px rgba(167,139,250,.28), 0 40px 80px -40px rgba(124,58,237,.55); }
.hp::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.08) 1px, transparent 1.3px); background-size:22px 22px;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 60%); mask-image:linear-gradient(90deg, transparent, #000 60%); }
.hp > * { position:relative; }
.hp-live { display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:800; color:#A7F3D0;
  padding:6px 12px; border-radius:999px; background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.3); }
.hp-live i { width:8px; height:8px; border-radius:50%; background:#34D399; box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:hp-ping 1.8s ease-out infinite; }
@keyframes hp-ping { to { box-shadow:0 0 0 10px rgba(52,211,153,0); } }
.hp h3 { font-size:clamp(26px,3.2vw,40px); font-weight:900; line-height:1.3; margin-top:16px; color:#fff; }
.hp h3 em { font-style:normal; background:linear-gradient(100deg,#A78BFA,#F472B6); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hp p { font-size:15.5px; color:#C7C9D1; line-height:1.9; margin-top:10px; max-width:42ch; }
.hp .bt { margin-top:24px; }
.hp-chat { border-radius:22px; padding:16px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); display:flex; flex-direction:column; gap:10px;
  transform:rotate(-2deg); box-shadow:0 30px 60px -30px rgba(0,0,0,.7); }
.hp-chat-h { display:flex; align-items:center; gap:10px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.1); }
.hp-av { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; font-size:12px; font-weight:900; letter-spacing:.06em;
  color:#fff; background:var(--grad); flex-shrink:0; }
.hp-chat-h b { display:block; font-size:14px; font-weight:900; color:#fff; }
.hp-chat-h i { display:block; font-style:normal; font-size:11.5px; color:#34D399; font-weight:700; }
.hp-msg { margin:0; max-width:86%; font-size:13.5px !important; line-height:1.7 !important; padding:9px 13px; border-radius:16px; color:#fff !important;
  animation:hp-in .6s cubic-bezier(.16,1,.3,1) both; }
.hp-me { align-self:flex-start; background:rgba(255,255,255,.12); border-end-start-radius:4px; }
.hp-them { align-self:flex-end; background:linear-gradient(135deg,#6D28D9,#DB2777); border-end-end-radius:4px; animation-delay:.5s; }
.hp-typing { display:flex; gap:4px; padding:11px 14px; animation-delay:1s; }
.hp-typing i { width:6px; height:6px; border-radius:50%; background:#fff; opacity:.5; animation:hp-dot 1.2s ease-in-out infinite; }
.hp-typing i:nth-child(2) { animation-delay:.15s; } .hp-typing i:nth-child(3) { animation-delay:.3s; }
@keyframes hp-dot { 0%,100% { transform:translateY(0); opacity:.4; } 50% { transform:translateY(-3px); opacity:1; } }
@keyframes hp-in { from { opacity:0; transform:translateY(8px) scale(.97); } }
@media (max-width:860px) { .hp { grid-template-columns:1fr; } .hp-chat { transform:none; } }

/* ══════ ألوان أوضح (في المودين) ══════
   تدرّج واحد للمنصة (نيلي ← بنفسجي ← وردي) على الزراير الأساسية والعناوين
   المميّزة وتوهّج البطل — وكل قسم بلونه أوضح من الأول. الأرضيات لسه هادية. */
.jp { --grad:linear-gradient(115deg,#4F46E5 0%,#7C3AED 52%,#DB2777 100%); --grad-glow:rgba(124,58,237,.38); }
.bt-pri, .dm-go, .jf-go { background:var(--grad); color:#fff; border-color:transparent;
  box-shadow:0 12px 28px -12px var(--grad-glow), inset 0 1px 0 rgba(255,255,255,.22); }
.bt-pri:hover, .dm-go:hover, .jf-go:hover { box-shadow:0 18px 40px -14px var(--grad-glow), 0 0 0 4px rgba(124,58,237,.16), inset 0 1px 0 rgba(255,255,255,.22); }
.pl-best .bt-pri, .pk-hot .bt-pri { background:#FFFFFF; color:#0B0B0F; }
.hx h1 em { background:linear-gradient(100deg,#4F46E5 0%,#7C3AED 45%,#DB2777 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.jp[data-theme="dark"] .hx h1 em { background:linear-gradient(100deg,#818CF8 0%,#A78BFA 45%,#F472B6 100%); -webkit-background-clip:text; background-clip:text; }
@media (prefers-color-scheme:dark) {
  .jp:not([data-theme]) .hx h1 em { background:linear-gradient(100deg,#818CF8 0%,#A78BFA 45%,#F472B6 100%); -webkit-background-clip:text; background-clip:text; }
}
.hx-glow { background:radial-gradient(42% 46% at 26% 40%, rgba(99,102,241,.22), transparent 70%),
             radial-gradient(34% 40% at 80% 16%, rgba(236,72,153,.14), transparent 70%),
             radial-gradient(32% 36% at 60% 88%, rgba(245,158,11,.14), transparent 70%); }
.sec[data-tone]::before { background:radial-gradient(52% 300px at 50% 0%, color-mix(in srgb, var(--tone) 16%, transparent), transparent 78%); }
.jp [data-tone] { --tone-soft:color-mix(in srgb, var(--tone) 17%, transparent); }
.ft-ic { border:1px solid color-mix(in srgb, var(--tone, var(--acc)) 28%, transparent); }
.eb::before { height:2px; border-radius:2px; }
.nums { background:linear-gradient(115deg, color-mix(in srgb,#4F46E5 8%, var(--bg2)), color-mix(in srgb,#DB2777 7%, var(--bg2))); }
.num[data-tone] b { background:linear-gradient(180deg, var(--tone) 10%, color-mix(in srgb, var(--tone) 55%, var(--ink)) 110%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cmp-us { color:var(--ink); }
.cmp-us svg { width:20px; height:20px; padding:3px; border-radius:50%; background:color-mix(in srgb, var(--t-green) 16%, transparent); }
.go { background:linear-gradient(160deg, color-mix(in srgb,#4F46E5 9%, var(--bg2)), var(--bg2) 55%, color-mix(in srgb,#DB2777 8%, var(--bg2))); }
.mq-row span { color:var(--mut); }

/* «كل ده جوّه الاشتراك»: على الموبايل جزء الدفع بس + «عرض كل المميزات» */
.fm { display:flex; flex-direction:column; }
.fm-btn { display:none; }
@media (max-width:720px) {
  .fm:not([data-open]) .ft-g:not(.ft-lead) { display:none; }
  .fm .ft-lead { order:-1; }
  .fm:not([data-open]) .ft-lead .ft-i:nth-child(n+5) { display:none; }
  .fm-btn { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:22px; padding:14px 20px; border-radius:16px;
    font-family:inherit; font-size:15px; font-weight:900; cursor:pointer; color:var(--ink); background:var(--card);
    border:1px solid var(--line2); box-shadow:var(--sh-md); }
  .fm-btn svg { color:var(--t-violet); }
}

/* ══════ المقاسات ══════ */
@media (max-width:1040px) {
  .nv-links { display:none; }
  .nv-in { justify-content:space-between; }
  .hx-in { grid-template-columns:1fr; grid-template-areas:"a" "d" "b" "c"; row-gap:18px; text-align:right; }
  .hx-txt { align-self:auto; }
  .cd-stage { margin:60px auto 52px; }
  .bn { grid-template-columns:1fr; }
  .bn-t.bn-big { display:flex; padding:32px 28px 0; gap:0; }
  .bn-t.bn-big .bn-m { margin-top:28px; }
  .bn-t.bn-big .bn-m > .mk { border-bottom:0; border-radius:18px 18px 0 0; }
  .trio { grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .ob-sec { grid-template-columns:1fr; text-align:center; }
  .ob-t > p:not(.eb) { margin-inline:auto; }
  .dkx-card { grid-template-columns:1fr; padding:34px 28px; gap:28px; }
  .ft { grid-template-columns:repeat(2,1fr); }
  .pk { grid-template-columns:repeat(2,1fr); max-width:620px; }
  .fq { grid-template-columns:1fr; }
  .fq-side { position:static; }
}
@media (max-width:720px) {
  .wrap, .hx-in, .mq, .go-in { padding-inline:18px; }
  .nv { top:10px; }
  .nv-in { gap:10px; padding-inline-start:16px; }
  .nv-logo { font-size:13.5px; letter-spacing:.2em; }
  .dm { flex-direction:column; }
  .dm-go { min-height:52px; justify-content:center; }
  .cd-stage { width:min(380px,86vw); margin:58px 0 46px; }
  .cd-hint { font-size:11.5px; top:-46px; }
  .mq { flex-direction:column; align-items:stretch; gap:12px; text-align:center; }
  .cmp-h { display:none; }
  .cmp-r { grid-template-columns:1fr 1fr; gap:10px 14px; padding:20px 0; }
  .cmp-r b { grid-column:1 / -1; font-size:13px; }
  .cmp-them, .cmp-us { font-size:14.5px; align-items:flex-start; }
  .cmp-them svg, .cmp-us svg { margin-top:5px; }
  .steps { grid-template-columns:1fr; }
  .step + .step { border-inline-start:0; border-top:1px solid var(--line); }
  .step { padding:28px 16px 18px; }
  .bn-t { padding:26px 22px 0; border-radius:26px; }
  .ja-arc { height:150px; }
  .ja-dot { width:38px; height:38px; }
  .ja-dot svg { width:15px; height:15px; }
  .ja-node { transform:translate(-50%,-19px); gap:7px; }
  .ja-k { font-size:10.5px; }
  .ob { width:min(470px,74vw); }
  .ob-node b { font-size:11px; padding:7px 11px; }
  .eb { letter-spacing:.22em; }
  .dkx-tabs button { padding:9px 12px 13px; font-size:14px; }
  .dkx-bar { left:12px; right:12px; }
  .dkx-card { padding:28px 20px; border-radius:26px; }
  .nums-in { grid-template-columns:1fr 1fr; }
  .num:nth-child(3) { border-inline-start:0; }
  .num:nth-child(n+3) { border-top:1px solid var(--line); }
  .ft { grid-template-columns:1fr; }
  .ft-new { padding:4px 16px 2px; margin-inline:-6px; }
  .th-list { grid-template-columns:1fr; }
  /* الباقات: عمودين على الموبايل — الأربعة في شاشتين بدل أربعة */
  .pk-tog { width:100%; }
  .pk-tog button { flex:1; padding:9px 8px; text-align:center; }
  .pk-tog button b { font-size:12.5px; line-height:1.5; }
  .pk { gap:10px; }
  .pk-c { padding:18px 14px 14px; border-radius:20px; }
  .pk-badge { position:static; align-self:flex-start; margin-bottom:8px; font-size:10px; padding:3px 9px; }
  .pk-name { font-size:15px; }
  .pk-price { margin-top:10px; }
  .pk-price b { font-size:30px; }
  .pk-price i { font-size:12.5px; }
  .pk-orders { font-size:13.5px; margin-top:8px; }
  .pk-per { font-size:11.5px; margin-bottom:16px; }
  .pk-c .bt { padding:11px 10px; font-size:13.5px; }
  .jf { padding:22px 18px; }
  /* الدخول: أيقونة بس في الشريط، والنافذة بتطلع من تحت */
  .nv-login { width:38px; height:38px; padding:0; }
  .nv-login span { display:none; }
  .lg { place-items:end stretch; padding:0; }
  .lg-card { width:100%; border-radius:26px 26px 0 0; padding:30px 20px calc(22px + env(safe-area-inset-bottom));
    max-height:92dvh; animation:lg-up .34s cubic-bezier(.2,.85,.25,1) both; }
  .jf-row { grid-template-columns:1fr; }
  .mk-st-grid { grid-template-columns:repeat(2,1fr); }
}

/* تقليل الحركة: كل حاجة بتظهر ثابتة */
/* ══ مساعد جراند (AssistantChat) ══ */
.ac-fab { position:fixed; inset-inline-end:18px; bottom:18px; z-index:60; display:flex; align-items:center; gap:10px;
  padding:7px 8px 7px 16px; border-radius:999px; border:1px solid var(--line2); background:var(--card); color:var(--ink);
  font-family:inherit; cursor:pointer; box-shadow:0 18px 40px -16px var(--grad-glow), var(--sh-md); transition:transform .18s ease, box-shadow .25s ease; }
.ac-fab:hover { transform:translateY(-2px); box-shadow:0 22px 48px -14px var(--grad-glow), var(--sh-md); }
.ac-fab-t { display:flex; flex-direction:column; text-align:start; line-height:1.25; }
.ac-fab-t b { font-size:13.5px; font-weight:900; }
.ac-fab-t small { font-size:11px; color:var(--sub); font-weight:600; }
.ac-av { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; color:#fff; background:var(--grad);
  box-shadow:0 0 0 3px var(--acc-soft); }
.ac-panel { position:fixed; inset-inline-end:18px; bottom:18px; z-index:70; width:min(380px, calc(100vw - 24px)); height:min(580px, calc(100dvh - 110px));
  display:flex; flex-direction:column; background:var(--card); color:var(--ink); border:1px solid var(--line2); border-radius:22px; overflow:hidden;
  box-shadow:0 30px 80px -24px rgba(0,0,0,.45), 0 0 0 1px var(--line); animation:acIn .32s cubic-bezier(.16,1,.3,1) both; }
@keyframes acIn { from { opacity:0; transform:translateY(16px) scale(.97); } }
.ac-head { display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--grad); color:#fff; }
.ac-head .ac-av { background:rgba(255,255,255,.18); box-shadow:none; }
.ac-who { flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.3; }
.ac-who b { font-size:14.5px; font-weight:900; }
.ac-who small { font-size:11px; opacity:.88; display:flex; align-items:center; gap:6px; }
.ac-who small i { width:7px; height:7px; border-radius:50%; background:#4ADE80; box-shadow:0 0 0 3px rgba(74,222,128,.25); }
.ac-x { width:34px; height:34px; border-radius:10px; border:0; display:grid; place-items:center; background:rgba(255,255,255,.14); color:#fff; cursor:pointer; }
.ac-x:hover { background:rgba(255,255,255,.24); }
.ac-list { flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; background:var(--bg2); overscroll-behavior:contain; }
.ac-msg { max-width:86%; display:flex; flex-direction:column; gap:6px; }
.ac-msg p { margin:0; padding:9px 13px; border-radius:16px; font-size:13.5px; line-height:1.75; white-space:pre-wrap; overflow-wrap:anywhere; }
.ac-bot { align-self:flex-start; }
.ac-bot p { background:var(--card); border:1px solid var(--line); border-start-start-radius:5px; color:var(--ink); }
.ac-me { align-self:flex-end; }
.ac-me p { background:var(--grad); color:#fff; border-start-end-radius:5px; }
.ac-msg a { color:var(--acc); font-weight:800; text-decoration:underline; text-underline-offset:3px; direction:ltr; unicode-bidi:isolate; }
.ac-fail p { border-color:color-mix(in srgb, var(--warn) 45%, transparent); }
.ac-wa { align-self:flex-start; display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:999px; font-size:12px; font-weight:800;
  background:#16A34A; color:#fff !important; text-decoration:none !important; direction:rtl !important; }
.ac-dot { flex-direction:row; gap:4px; padding:12px 14px; background:var(--card); border:1px solid var(--line); border-radius:16px; border-start-start-radius:5px; width:fit-content; }
.ac-dot i { width:6px; height:6px; border-radius:50%; background:var(--sub); animation:acDot 1s ease-in-out infinite; }
.ac-dot i:nth-child(2) { animation-delay:.15s; } .ac-dot i:nth-child(3) { animation-delay:.3s; }
@keyframes acDot { 0%,80%,100% { opacity:.3; transform:translateY(0); } 40% { opacity:1; transform:translateY(-3px); } }
.ac-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:4px; }
.ac-chips button { font-family:inherit; font-size:12.5px; font-weight:800; padding:7px 12px; border-radius:999px; cursor:pointer;
  border:1px solid var(--line2); background:var(--card); color:var(--ink); transition:border-color .15s ease, color .15s ease; }
.ac-chips button:hover { border-color:var(--acc); color:var(--acc); }
.ac-acts { display:flex; gap:6px; padding:8px 12px 0; overflow-x:auto; scrollbar-width:none; border-top:1px solid var(--line); background:var(--card); }
.ac-acts > * { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; font-family:inherit; font-size:11.5px; font-weight:800; padding:6px 10px;
  border-radius:999px; border:1px solid var(--line); background:var(--soft); color:var(--mut); cursor:pointer; text-decoration:none; }
.ac-acts > *:hover { color:var(--ink); border-color:var(--line2); }
.ac-in { display:flex; align-items:flex-end; gap:8px; padding:10px 12px 12px; background:var(--card); }
.ac-in textarea { flex:1; resize:none; max-height:110px; min-height:42px; font-family:inherit; font-size:14px; line-height:1.6; padding:9px 13px;
  border-radius:14px; border:1px solid var(--line2); background:var(--bg2); color:var(--ink); outline:none; field-sizing:content; }
.ac-in textarea:focus { border-color:var(--acc); box-shadow:0 0 0 3px var(--acc-soft); }
.ac-in button { width:42px; height:42px; border-radius:13px; border:0; display:grid; place-items:center; background:var(--grad); color:#fff; cursor:pointer; flex-shrink:0; }
.ac-in button:disabled { opacity:.45; cursor:default; }
@media (max-width:560px) {
  .ac-fab { inset-inline-end:12px; bottom:12px; padding:5px 6px 5px 12px; }
  .ac-fab-t small { display:none; }
  .ac-panel { inset-inline:10px; bottom:10px; width:auto; height:min(640px, calc(100dvh - 84px)); }
}

/* ══ فورم الخطوتين + عرض أول شاشة ══ */
.hx-offer { display:inline-flex; align-items:center; gap:7px; margin-top:16px; padding:7px 14px; border-radius:999px; font-size:14px; font-weight:900;
  color:var(--acc); background:var(--acc-soft); border:1px solid color-mix(in srgb, var(--acc) 26%, transparent); }
.hx-offer + .hx-sub { margin-top:14px; }
.jf { scroll-margin-top:92px; }
.jf-steps { display:grid; grid-template-columns:auto 1fr; align-items:baseline; gap:6px 10px; margin:0 0 4px; font-size:13px; color:var(--sub); font-weight:700; }
.jf-steps b { color:var(--ink); font-weight:900; font-size:14px; }
.jf-steps i { grid-column:1 / -1; display:block; height:5px; border-radius:99px; background:var(--soft); overflow:hidden; }
.jf-steps u { display:block; height:100%; border-radius:99px; background:var(--grad); transition:width .3s ease; text-decoration:none; }
.jf-link p { margin:0; min-height:46px; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:13.5px; font-weight:800; color:var(--ink); overflow-wrap:anywhere; }
.jf-link button { font:inherit; font-size:12.5px; font-weight:900; color:var(--acc); background:none; border:0; padding:0; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.jf-back { font:inherit; font-size:13px; font-weight:800; color:var(--sub); background:none; border:0; padding:2px; cursor:pointer; align-self:center; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:760px) { .hx .eb.hx-in-1 { display:none; } .hx-offer { margin-top:12px; } }

@media (prefers-reduced-motion:reduce) {
  .ac-panel, .ac-dot i { animation:none; }
  .jp .rv { opacity:1; transform:none; filter:none; transition:none; }
  .hx-in-1,.hx-in-2,.hx-in-3,.hx-field,.hx-card,.hx-in-5 { animation:none; }
  .cd-float, .cd-floor, .cd-hint svg, .db-map, .db-route, .db-pulse, .db-drone, .db-truck, .mq-row, .ob-ring, .ob-node b, .ob-core::after, .mk-sc-chart span, .mk-jr-fill, .ft-tag-new, .hp-live i, .hp-typing i, .hp-msg { animation:none; }
  .th-c, .th-desk, .th-phone { transition:none; }
  .lg, .lg-card { animation:none; }
}
