/* ============ محور — نظام التصميم «برج التحكّم» ============ */
/* الخط مُستضاف ذاتياً (static/fonts) — لا اعتماد CDN، أمان أعلى وأداء أسرع */
@font-face{ font-family:"IBM Plex Sans Arabic"; font-weight:400; font-display:swap;
  src:url("../fonts/ibm-plex-arabic-400.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans Arabic"; font-weight:500; font-display:swap;
  src:url("../fonts/ibm-plex-arabic-500.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans Arabic"; font-weight:600; font-display:swap;
  src:url("../fonts/ibm-plex-arabic-600.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Sans Arabic"; font-weight:700; font-display:swap;
  src:url("../fonts/ibm-plex-arabic-700.woff2") format("woff2"); }

:root{
  /* ألوان — الوضع الداكن (الأساسي) */
  --ink-900:#0A1420; --ink-800:#0E1826; --ink-700:#16233A; --ink-600:#1C2C46;
  --line:#243349; --line-soft:#1B2942;
  --fg:#E6ECF5; --fg-mut:#8A9BB5; --fg-dim:#5A6B85;
  --accent:#22D3B7; --accent-deep:#0FA890; --accent-ink:#052B25;
  --glow:color-mix(in srgb, var(--accent) 22%, transparent);
  --ok:#2FBF71; --warn:#F5A524; --danger:#F0506E; --info:#3B82F6;
  --page-bg:var(--ink-800); --surface:var(--ink-700); --surface-2:var(--ink-600);
  /* مقاسات ومسافات */
  --r-sm:9px; --r:14px; --r-lg:20px; --r-pill:30px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px; --sp-8:32px; --sp-12:48px; --sp-16:64px;
  --sh-1:0 2px 14px -6px rgba(0,0,0,.5); --sh-2:0 24px 60px -30px rgba(0,0,0,.6);
  --font:"IBM Plex Sans Arabic","Segoe UI",Tahoma,system-ui,sans-serif;
}
/* الوضع الفاتح (لصفحات القراءة الطويلة) */
:root[data-theme="light"]{
  --page-bg:#F7F9FC; --surface:#FFFFFF; --surface-2:#EEF2F8;
  --line:#E2E8F1; --line-soft:#EEF2F8;
  --fg:#12233B; --fg-mut:#5A6B85; --fg-dim:#8A9BB5;
  --accent:#0E9E86; --accent-ink:#FFFFFF;
  --sh-1:0 2px 14px -8px rgba(16,40,70,.18); --sh-2:0 24px 60px -30px rgba(16,40,70,.22);
}
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]){
    --page-bg:#F7F9FC; --surface:#FFFFFF; --surface-2:#EEF2F8;
    --line:#E2E8F1; --line-soft:#EEF2F8; --fg:#12233B; --fg-mut:#5A6B85; --fg-dim:#8A9BB5;
    --accent:#0E9E86; --accent-ink:#FFFFFF;
  }
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.mv-body{ margin:0; background:var(--page-bg); color:var(--fg);
  font-family:var(--font); line-height:1.7; -webkit-font-smoothing:antialiased; }
.mv-container{ max-width:1120px; margin:0 auto; padding-inline:22px; }
.mv-section{ padding-block:var(--sp-16); }
.mv-eyebrow{ font-size:.74rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--accent); font-weight:700; }
.mv-h1{ font-size:clamp(2rem,4.6vw,3.2rem); font-weight:800; line-height:1.2;
  letter-spacing:-.02em; text-wrap:balance; margin:.3em 0; }
.mv-h2{ font-size:clamp(1.5rem,3vw,2.2rem); font-weight:800; letter-spacing:-.02em;
  text-wrap:balance; margin:0 0 .4em; }
a{ color:var(--accent); text-decoration:none; }

/* شبكة خفيفة كخلفية غرفة عمليات */
.mv-grid-bg{ position:relative; }
.mv-grid-bg::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(var(--line-soft) 1px,transparent 1px) 0 0/100% 64px,
             linear-gradient(90deg,var(--line-soft) 1px,transparent 1px) 0 0/64px 100%;
  -webkit-mask-image:radial-gradient(circle at 70% 0,#000,transparent 70%);
          mask-image:radial-gradient(circle at 70% 0,#000,transparent 70%); opacity:.5; }
.mv-grid-bg > *{ position:relative; z-index:1; }

/* أزرار */
.mv-btn,.mv-btn-ghost,.mv-btn-quiet{ display:inline-flex; align-items:center; gap:8px;
  font:inherit; font-weight:700; border-radius:var(--r); padding:12px 26px; cursor:pointer;
  border:1px solid transparent; transition:transform .15s, box-shadow .15s, background .15s; }
.mv-btn{ background:var(--accent); color:var(--accent-ink); box-shadow:0 10px 30px -10px var(--glow); }
.mv-btn:hover{ transform:translateY(-2px); filter:brightness(1.06); color:var(--accent-ink); }
.mv-btn-ghost{ background:transparent; color:var(--fg); border-color:var(--line); }
.mv-btn-ghost:hover{ border-color:var(--accent); color:var(--fg); }
.mv-btn-quiet{ background:transparent; color:var(--fg-mut); }
.mv-btn:focus-visible,.mv-btn-ghost:focus-visible,.mv-field:focus-visible,a:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; }

/* بطاقات وشارات ورقائق */
.mv-card{ background:color-mix(in srgb,var(--surface) 92%,transparent);
  border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--sp-6);
  backdrop-filter:blur(8px); box-shadow:var(--sh-1); }
.mv-card-raised{ background:var(--surface-2); }
.mv-badge{ display:inline-flex; align-items:center; gap:7px; font-size:.78rem; font-weight:700;
  padding:5px 13px; border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--accent) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent); color:var(--accent); }
.mv-chip{ display:inline-flex; align-items:center; gap:8px; font-size:.84rem;
  background:var(--surface); border:1px solid var(--line); color:var(--fg);
  border-radius:var(--r); padding:9px 15px; }
.mv-pulse{ width:7px; height:7px; border-radius:50%; background:var(--accent);
  animation:mvPulse 2s infinite; }
@keyframes mvPulse{ 0%{box-shadow:0 0 0 0 var(--glow);} 70%{box-shadow:0 0 0 8px transparent;} 100%{box-shadow:0 0 0 0 transparent;} }

/* حقول النماذج */
.mv-field{ width:100%; font:inherit; color:var(--fg); background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r); padding:12px 15px; transition:border-color .15s, box-shadow .15s; }
.mv-field::placeholder{ color:var(--fg-dim); }
.mv-field:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--glow); }
.mv-label{ display:block; font-size:.86rem; color:var(--fg-mut); margin-bottom:6px; }

/* الشريط العلوي العام */
.mv-topbar{ position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:20px;
  padding:14px 22px; background:color-mix(in srgb,var(--page-bg) 78%,transparent);
  border-bottom:1px solid transparent; backdrop-filter:blur(12px); transition:border-color .2s, background .2s; }
.mv-topbar.scrolled{ border-bottom-color:var(--line); background:color-mix(in srgb,var(--page-bg) 92%,transparent); }
.mv-topbar .mv-brand{ font-size:1.28rem; font-weight:800; color:var(--fg); }
.mv-topbar .mv-brand b{ color:var(--accent); }
.mv-topbar nav{ display:flex; gap:22px; }
.mv-topbar nav a{ color:var(--fg-mut); font-size:.9rem; }
.mv-topbar nav a:hover{ color:var(--fg); }
.mv-topbar .mv-actions{ margin-inline-start:auto; display:flex; gap:10px; align-items:center; }

/* التذييل */
.mv-footer{ background:var(--ink-900); border-top:1px solid var(--line); padding-block:var(--sp-12) var(--sp-8);
  color:var(--fg-mut); }
.mv-footer .cols{ display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:32px; }
.mv-footer h6{ color:var(--fg); font-size:.95rem; margin:0 0 12px; }
.mv-footer a{ display:block; color:var(--fg-mut); font-size:.88rem; padding:4px 0; }
.mv-footer a:hover{ color:var(--accent); }
.mv-footer .base{ border-top:1px solid var(--line); margin-top:28px; padding-top:18px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.82rem; }

/* لوحة الكونسول الحيّة */
.mv-console{ background:var(--ink-700); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px; }
.mv-console .sync{ display:flex; align-items:center; gap:9px; font-size:.82rem; color:var(--fg-mut); margin-bottom:10px; }
.mv-console .sync .live{ color:var(--accent); font-weight:700; }
.mv-console .crow{ display:flex; align-items:center; justify-content:space-between; padding:9px 4px; }
.mv-console .crow+.crow{ border-top:1px dashed var(--line); }
.mv-console .stage{ display:flex; align-items:center; gap:9px; font-size:.9rem; }
.mv-console .stage b{ width:9px; height:9px; border-radius:3px; display:inline-block; }
.mv-console .num{ font-variant-numeric:tabular-nums; font-weight:800; }

/* تدفق التكامل */
.mv-flow{ display:flex; align-items:center; justify-content:space-between; gap:6px;
  background:var(--ink-800); border:1px solid var(--line); border-radius:var(--r); padding:14px; margin-top:12px; }
.mv-flow .node{ text-align:center; font-size:.74rem; color:var(--fg-mut); }
.mv-flow .node .ic{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center;
  margin:0 auto 6px; font-size:1.15rem; background:color-mix(in srgb,var(--accent) 12%,transparent); color:var(--accent); }
.mv-flow .node.hub .ic{ background:var(--accent); color:var(--accent-ink); }
.mv-flow .arr{ color:var(--line); }

/* خانة رقم وبطاقة سعر */
.mv-stat{ text-align:center; padding:20px; }
.mv-stat .n{ font-size:1.9rem; font-weight:800; color:var(--accent); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.mv-stat .l{ color:var(--fg-mut); font-size:.84rem; margin-top:3px; }
.mv-price-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:26px; display:flex; flex-direction:column; gap:14px; transition:transform .18s, border-color .18s; }
.mv-price-card:hover{ transform:translateY(-4px); border-color:color-mix(in srgb,var(--accent) 40%,transparent); }
.mv-price-card.featured{ border-color:var(--accent); box-shadow:0 20px 50px -24px var(--glow); }
.mv-price-card .price{ font-size:2.2rem; font-weight:800; font-variant-numeric:tabular-nums; }
.mv-price-card ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:9px; }
.mv-price-card li{ display:flex; gap:9px; color:var(--fg-mut); font-size:.9rem; }
.mv-price-card li::before{ content:"◆"; color:var(--accent); }

/* كشف عند التمرير */
.mv-reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.mv-reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .mv-reveal{ opacity:1; transform:none; transition:none; } html{ scroll-behavior:auto; }
  .mv-pulse{ animation:none; } }

@media (max-width:760px){
  .mv-footer .cols{ grid-template-columns:1fr 1fr; }
  .mv-topbar nav{ display:none; }
}