/* ═══════════════════════════════════════════════════════
 *  about.css — أُستخرِج آليًا من pages/about.php
 *  المقطع 1 من 1 · سطور 46–46 في الأصل.
 *  ⚠️ الترتيب بين المقاطع مقصود: بينها كتل <style> مشروطة
 *     باقية في الصفحة، والتتالي يعتمد على تسلسلها.
 *  ⚠️ نُقلت إلى لغة تصميم الصفحة الرئيسية (٥ سبتمبر ٢٠٢٦): الرموز المحلّية
 *     بقيت أسماءها وصارت جسرًا إلى رموز wtq-v4-base.css. لا كحلي ولا بنفسجي
 *     ولا كهرماني ولا تدرّج، ولا زاوية أكبر من var(--r) إلا كبسولة 999px،
 *     ولا ظلّ لبطاقة — الحدّ الرفيع وحده. الأوزان على السلّم: 800 لـh1/h2 فقط.
 *  ⚠️ إعادة بناء قويّة (٦ سبتمبر ٢٠٢٦): لم يعد الأمر تلوينًا. كل قسم صار
 *     مكوّنًا واحدًا واضحًا من كتالوج الرئيسية:
 *       · مشهد الهيرو  ⇐ نافذة محاكاة (شريط علوي بثلاث نقاط) بداخلها تسلسل موصول.
 *       · صفّ الأرقام  ⇐ شريط واحد مقسوم بخطوط شعرية، لا ثلاث بطاقات عائمة.
 *       · نشأة المنصّة ⇐ قسم مقسوم: رأس القسم في عمود، وخطوات مرقّمة موصولة في الآخر.
 *       · رسالتنا      ⇐ بيان بعلامة زرقاء جانبية 2px، لا صندوق ملوّن.
 *       · كل البطاقات  ⇐ وصفة .hc: بلاطة أيقونة بجانب العنوان، ثم المتن،
 *                        ثم صفّ سفلي مثبَّت (المعالجة على سطح فرعي · الرابط بعد خطّ شعري).
 *       · حدود الخدمة ⇐ بطاقة بيضاء برأس مفصول، وبنودها على السطح الفرعي بعلامة نفي مقروءة.
 *     ولم يُحذف من الصفحة عنصر ولا كلمة؛ ما لا يناسب اللغة حُيِّد بالقواعد.
 * ═══════════════════════════════════════════════════════ */
.abx{--pb:var(--blue);--pb2:var(--blue-700);--nv:var(--ink);--mut:var(--muted);--soft:var(--panel);--soft2:var(--blue-50);--edge:#C7D7FB;--sub:#FBFBFA;--sub-line:#EFEFEC;--dash:#C9D3EA;--ok:#15803D;color-scheme:light}
.abx{color:var(--ink);line-height:1.75;background:#fff}
.abx .wrapx{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.abx a{text-decoration:none}
.abx h2{letter-spacing:-.03em}
/* ── الأيقونات — أسلوب الرئيسية: SVG خطّي مضمَّن (stroke-width:1.8) داخل .ico ──
   كانت الصفحة كلها Font Awesome صلبًا وصفر وسم <svg>، وهو أوضح ما يشي بأن
   الصفحتين ليستا من يد واحدة. ولأن الحذف ممنوع: كل وسم <i class="fas …"> باقٍ
   في الترميز كما هو، ورسمته محيَّدة هنا — أُخرِج من التدفّق تمامًا كي لا يسهم
   في فجوة flex، ومحرف ::before ملغى فلا يبقى مربّع فارغ. (النمط نفسه المستعمل
   من قبل لأيقونة العلم في .ab-ey ولبلاطة رأس «حدود الخدمة».) */
.abx .ico{width:15px;height:15px;display:inline-block;vertical-align:-.15em;flex:none}
.abx i.fas,.abx i.far,.abx i.fab{position:absolute;width:0;height:0;overflow:hidden;opacity:0;color:transparent;pointer-events:none}
.abx i.fas::before,.abx i.far::before,.abx i.fab::before{content:none}
/* breadcrumb */
.ab-bc{padding:16px 0 0;font-size:12.5px;font-weight:400;color:var(--mut)}
.ab-bc ol{list-style:none;display:flex;gap:8px;padding:0;margin:0;flex-wrap:wrap}
.ab-bc a{color:var(--pb);font-weight:500}
/* hero — main.css .hero لا تطابق .ab-hero فلا أرضية كحلية موروثة (قِيس) */
.ab-hero{padding:30px 0 24px}
.ab-hero .in{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:center}
/* eyebrow — نقطة زرقاء بهالة كما في الرئيسية؛ أيقونة العلم بقيت في الترميز
   وحُيِّدت رسمتها بـcontent:none (لا حذف) كي لا تجتمع علامتان في رأس واحد. */
.ab-ey{display:inline-flex;align-items:center;gap:8px;color:var(--mut);font-weight:500;font-size:12.5px;line-height:1.7;margin-bottom:14px}
.ab-ey::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--pb);box-shadow:0 0 0 3px rgba(37,99,235,.15);flex:none}
.ab-ey i{color:var(--pb);font-size:12px;width:0;overflow:hidden}
.ab-ey i::before{content:none}
.ab-hero h1{font-size:clamp(32px,4.2vw,48px);font-weight:800;color:var(--ink);line-height:1.28;margin:0 0 16px;letter-spacing:-.03em}
.ab-hero h1 .g{color:var(--faint);font-weight:inherit}
.ab-hero p.lead{font-size:clamp(13.5px,1.05vw,15.5px);color:var(--mut);font-weight:300;line-height:1.9;max-width:62ch;margin:0 0 22px}
.ab-chips{display:flex;flex-wrap:wrap;gap:9px}
.ab-chip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 15px;font-size:12px;font-weight:500;color:var(--mut);line-height:1.7;display:inline-flex;align-items:center;gap:8px}
.ab-chip i{color:var(--pb);font-size:12px}
.ab-chip .ico{width:14px;height:14px;color:var(--pb)}
.ab-chip.g i{color:var(--green)}
.ab-chip.g .ico{color:var(--ok)}
/* مشهد الهيرو — نافذة محاكاة: الظلّ الوحيد المسموح خارج البطاقات (وصفة .pw-win) */
.ab-art{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:0 2px 6px rgba(11,11,11,.05),0 44px 84px -44px rgba(11,11,11,.45)}
.ab-bbar{height:36px;display:flex;align-items:center;padding:0 14px;background:#F6F6F4;border-bottom:1px solid #E6E6E2}
.ab-bbar i{width:9px;height:9px;border-radius:50%;background:#DCDCD8;margin-inline-end:6px;flex:none}
.ab-flow{background:var(--sub);padding:18px}
/* الصفوف تسلسل لا قائمة: خطّ رابط متقطّع بين كل صفّ وتاليه (وصفة .jr-step::after) */
.ab-art .row{position:relative;display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-bottom:15px}
.ab-art .row:last-child{margin-bottom:0}
.ab-art .row+.row::before{content:"";position:absolute;top:-16px;inset-inline-start:30px;width:0;height:15px;border-inline-start:1.5px dashed var(--dash)}
/* بلاطة الأيقونة صارت span.ic — الوسم <i> باقٍ داخلها ورسمته محيَّدة */
.ab-art .row .ic{width:32px;height:32px;border-radius:var(--r);background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ab-art .row .ic .ico{width:16px;height:16px}
.ab-art .row .tx{display:block;min-width:0}
.ab-art .row b{display:block;font-size:13.5px;color:var(--ink);font-weight:500;line-height:1.7}
.ab-art .row .tx>span{display:block;font-size:12.5px;color:var(--mut);font-weight:400;line-height:1.7}
/* stats — شريط واحد مقسوم بخطوط شعرية، لا بطاقات متفرّقة.
   الرقم يميّزه الحجم لا الوزن؛ ورقمه لاتيني معزول كي لا تنقلب الفاصلة. */
.ab-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:34px 0 0;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.abx .ab-stats2{grid-template-columns:repeat(2,1fr)}
/* ⚠️ الخليّة عمود مرن بمحاذاة flex-start لا كتلة بـtext-align وحدها:
   .v تحمل direction:ltr لعزل فاصلة الألوف، وtext-align:start داخلها يعني
   «اليسار» بينما هو «اليمين» للّصيقة — فينفصل الرقم عن لصيقته في العربية وحدها
   (قِيس: الرقم عند 532 واللصيقة عند 750 في خليّة 516..765). مع العمود المرن
   يصير صندوق كلٍّ منهما بعرض محتواه وموضعه من اتجاه الخليّة لا من اتجاهه هو. */
.ab-stat{padding:22px 24px;text-align:start;display:flex;flex-direction:column;align-items:flex-start}
.ab-stat+.ab-stat{border-inline-start:1px solid var(--line)}
.ab-stat .v{font-size:34px;font-weight:500;color:var(--ink);line-height:1.2;letter-spacing:-.03em;direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums}
.ab-stat .l{color:var(--mut);font-size:13px;font-weight:400;line-height:1.7;margin-top:6px;max-width:26ch}
/* sections — الفصل بالفراغ وتناوب سطحين، لا حدّ مرسوم بين الأقسام.
   الأقسام داخل .wrapx فلا تبلغ حافّة النافذة: الظلّ الممتدّ يرسم الأرضية
   خارج الحاوية بلا أي أثر في التخطيط (لا فيض أفقي ولا 100vw وشريط التمرير). */
.abx section{padding:96px 0;background:#fff}
.abx section.ab-alt,.abx .ab-cta{background:var(--soft);box-shadow:0 0 0 100vmax var(--soft);clip-path:inset(0 -100vmax)}
.ab-h{font-size:clamp(28px,3.4vw,44px);font-weight:800;color:var(--ink);line-height:1.7;letter-spacing:-.03em;margin:0 0 10px}
.ab-sub{color:var(--mut);font-size:clamp(13.5px,1.05vw,15.5px);font-weight:300;line-height:1.9;margin:0 0 34px;max-width:62ch}
.ab-center{text-align:center}
.ab-center .ab-sub{margin:0 auto 36px}
/* رأس قسم بمحاذاة البداية للأقسام المقسومة عمودين (وصفة .hd.start) */
.ab-hd{max-width:62ch}
.ab-hd.start{text-align:start}
.ab-hd .ab-sub{margin-bottom:0}
/* نشأة المنصّة — قسم مقسوم: الرأس في عمود، والخطوات المرقّمة الموصولة في الآخر */
/* الرأس يتوسّط عمودَه رأسيًّا (وصفة .glb-grid في الرئيسية: align-items:center):
   قِيس رأس 133px مقابل عمود خطوات 540px، فكان الرأس معلَّقًا في الأعلى ويبقى
   تحته ~407px بياضًا. لا يجوز ملء العمود بنصّ جديد، فالموازنة بالمحاذاة. */
.ab-split{display:grid;grid-template-columns:.82fr 1.18fr;gap:46px;align-items:center}
.ab-story{display:flex;flex-direction:column}
.ab-scard{position:relative;display:grid;grid-template-columns:28px 1fr;column-gap:16px;row-gap:5px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-bottom:16px}
.ab-scard:last-child{margin-bottom:0}
.ab-scard+.ab-scard::before{content:"";position:absolute;top:-17px;inset-inline-start:34px;width:0;height:16px;border-inline-start:1.5px dashed var(--dash)}
.ab-scard .n{grid-column:1;grid-row:1/span 2;width:28px;height:28px;border-radius:var(--r);background:var(--pb);color:#fff;font-weight:500;font-size:13px;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.ab-scard h3{grid-column:2;grid-row:1;font-size:15.5px;font-weight:500;color:var(--ink);margin:0;line-height:1.7;letter-spacing:-.01em}
.ab-scard p{grid-column:2;grid-row:2;color:var(--mut);font-size:13px;font-weight:300;line-height:1.85;margin:0}
/* grid cards — وصفة .hc: بلاطة الأيقونة بجانب العنوان لا فوقه، والصفّ السفلي مثبَّت */
.ab-g{display:grid;gap:18px}
.abx .g2{grid-template-columns:1fr 1fr}.abx .g3{grid-template-columns:repeat(3,1fr)}.abx .g4{grid-template-columns:repeat(4,1fr)}
.ab-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 22px 20px;transition:border-color .25s,transform .25s}
.ab-card:hover{border-color:var(--edge);transform:translateY(-3px)}
.ab-card .hdr{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}
.ab-card .ci{width:40px;height:40px;border-radius:var(--r);background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:17px;flex:none;margin-top:2px}
.ab-card .ci .ico{width:19px;height:19px}
.ab-card h3{font-size:15.5px;font-weight:500;color:var(--ink);margin:0;line-height:1.7;letter-spacing:-.01em}
.ab-card p{color:var(--mut);font-size:13px;font-weight:300;line-height:1.85;margin:0 0 14px}
.ab-card p:last-child{margin-bottom:0}
/* سطر «المعالجة» — كان سمة style مضمَّنة بوزن 700 ولون كحلي؛ صار السطح الفرعي
   المعتمد داخل البطاقة (#FBFBFA على #EFEFEC) مثبَّتًا في قاع البطاقة فتتحاذى الصفوف. */
.ab-card p.ab-fix{margin-top:auto;margin-bottom:0;color:var(--ink);font-weight:400;font-size:12.5px;line-height:1.8;background:var(--sub);border:1px solid var(--sub-line);border-radius:var(--r);padding:11px 13px}
.ab-card .lk{margin-top:auto;padding-top:13px;border-top:1px solid var(--line);display:flex;align-items:center;gap:7px;color:var(--pb);font-weight:500;font-size:13px}
.ab-card .lk i{font-size:12px;transition:transform .2s}
.ab-card .lk .ico{width:14px;height:14px;transition:transform .2s}
.ab-card:hover .lk i{transform:translateX(-3px)}
.ab-card:hover .lk .ico{transform:translateX(-3px)}
/* ── التحدّيات — قائمة مقارنة ───────────────────────────────────────────────
   كانت أربع بطاقات في شبكة g4، وهي الوصفة نفسها التي تتكرّر في ثلاثة أقسام
   أخرى (قِيس: خمس شبكات متطابقة من تسعة أقسام). صارت صفوف مقارنة في لوح واحد:
   التحدّي بأيقونته في العمود الأول، والمعالجة على سطح فرعي في الآخر بعلامة
   صحّ خضراء مقروءة (#15803D على أبيض = 4.5:1). لم يتغيّر ترتيب ولا كلمة. */
.ab-cmp{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ab-crow{display:grid;grid-template-columns:1.06fr .94fr;align-items:stretch}
.ab-crow+.ab-crow{border-top:1px solid var(--line)}
.ab-cmp .pr{padding:20px 22px;display:flex;flex-direction:column;justify-content:center}
.ab-cmp .hdr{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.ab-cmp .ci{width:40px;height:40px;border-radius:var(--r);background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;flex:none}
.ab-cmp .ci .ico{width:19px;height:19px}
.ab-cmp h3{font-size:15.5px;font-weight:500;color:var(--ink);margin:0;line-height:1.7;letter-spacing:-.01em}
.ab-cmp .pr p{color:var(--mut);font-size:13px;font-weight:300;line-height:1.85;margin:0}
.ab-cmp .fx{display:flex;align-items:center;gap:12px;padding:20px 22px;background:var(--sub);border-inline-start:1px solid var(--line)}
/* قرص العلامة أبيض بحدّ رفيع لا مصبوغ بالأخضر الفاتح: على green-50 يهبط
   #15803D إلى 4.42:1 (محسوب)، وعلى الأبيض يبلغ 5.02:1 — والقاعدة ≥4.5 */
.ab-cmp .fx .mk{width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid #CDEBD6;color:var(--ok);display:flex;align-items:center;justify-content:center;flex:none}
.ab-cmp .fx .mk .ico{width:13px;height:13px}
.abx .ab-cmp p.ab-fix{margin:0;background:transparent;border:0;padding:0;color:var(--ink);font-weight:400;font-size:13px;line-height:1.85}
/* ── الأثر — شريط واحد مقسوم بخطوط شعرية (وصفة .ab-stats) لا شبكة بطاقات ──
   الفصل بـgap:1px على أرضية لون الخطّ: يبقى الخطّ صحيحًا في كل عدد أعمدة
   على أي عرض، بخلاف border على الشقيق الذي يرسم خطًّا في أوّل كل صفّ. */
.ab-imp{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ab-icell{background:#fff;padding:24px 22px}
.ab-imp .hdr{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:10px}
.ab-imp .ci{width:36px;height:36px;border-radius:var(--r);background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;flex:none}
.ab-imp .ci .ico{width:18px;height:18px}
.ab-imp h3{font-size:15.5px;font-weight:500;color:var(--ink);margin:0;line-height:1.7;letter-spacing:-.01em}
.ab-imp p{color:var(--mut);font-size:13px;font-weight:300;line-height:1.85;margin:0}
/* ── التحقّق المستقلّ — ثلاثة صفوف عريضة في لوح واحد ─────────────────────────
   كانت ثلاث بطاقات في شبكة g3 (الظهور الخامس للوصفة نفسها). الصفّ الآن:
   بلاطة الأيقونة والعنوان ثمّ الوصف ثمّ الرابط في طرف الصفّ — بلا رفع عند
   المرور بل تظليل سطح فرعي، فيقرأ كقائمة أبواب لا كبطاقات عائمة. */
.ab-vrf{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.abx .ab-vrf .ab-card{flex-direction:row;align-items:center;gap:20px;border:0;border-radius:0;padding:20px 22px;transition:background .2s}
.abx .ab-vrf .ab-card:hover{transform:none;background:var(--sub)}
.ab-vrf .ab-card+.ab-card{border-top:1px solid var(--line)}
.ab-vrf .hdr{margin:0;flex:none;width:300px;align-items:center}
.abx .ab-vrf .ab-card p{margin:0;flex:1;min-width:0}
.abx .ab-vrf .lk{margin:0;padding:0;border:0;flex:none;white-space:nowrap}
/* mission band — كانت شريطًا كحليًّا بنصّ أبيض وعلامة اقتباس عملاقة صُمّمت لتلك الأرضية.
   صارت «بيانًا»: بلا صندوق ولا أرضية، وعلامة واحدة جانبية زرقاء 2px على المتن. */
.ab-band{background:transparent;border:0;border-radius:0;padding:0;color:var(--ink);position:relative;overflow:visible;max-width:820px}
.ab-band:before{content:none}
.ab-band .ey{display:inline-flex;align-items:center;gap:8px;color:var(--mut);font-size:12.5px;font-weight:500;line-height:1.7;margin-bottom:14px}
.ab-band .ey::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--pb);box-shadow:0 0 0 3px rgba(37,99,235,.15);flex:none}
.ab-band h2{font-size:clamp(26px,3vw,38px);font-weight:800;color:var(--ink);margin:0;line-height:1.7;position:relative}
.ab-band p{color:var(--mut);font-size:clamp(15px,1.25vw,18px);font-weight:300;line-height:1.9;margin:22px 0 0;position:relative;max-width:62ch;border-inline-start:2px solid var(--pb);padding-inline-start:20px}
/* honest — رأس القسم: كان هذا القسم وحده يفتح بلا رأس، فيصطدم عنوان 15.5px داخل
   بطاقته بأربعة أقسام قبله يفتح كلٌّ منها بعنوان 44px. رُفع العنوان الموجود سلفًا
   (h3 داخل البطاقة) إلى رأس القسم (h2) — العنصر نفسه انتقل، لا نصّ جديد ولا محذوف.
   وبلاطة الأيقونة رافقته وحُيِّدت رسمتها (width:0 + content:none كما في .ab-ey)
   لأن رأس القسم في لغة الرئيسية بلا بلاطة أيقونة.
   والبطاقة بعده: قائمة تحقّق بعلامة نفي رمادية مقروءة (لا لون تحت 4.5:1 كنصّ). */
/* ⚠️ ٦ سبتمبر ٢٠٢٦ — هذا القسم وحده كان يخرج «بلا eyebrow وبلا سطر شرح» في
   العروض الستّة: عنوان 42px ثمّ فراغ 36px ثمّ بند 13px مباشرةً. وسطر الشرح
   نصٌّ جديد لا يجوز لوكيل اختراعه (مسجَّل في needsOwner)، فعولجت القفزة
   بالبناء لا بالنصّ: صار القسم مقسومًا — العنوان في عمود يوازي البنود
   ويتوسّطه رأسيًّا، فلا يبقى رأس يتيم فوق لوح ولا قفزة رأسية من 42px إلى 13px. */
.ab-hon{grid-template-columns:.62fr 1.38fr}
.ab-hon-hd{margin-bottom:36px}
.ab-hon .ab-hon-hd{margin-bottom:0}
.ab-hon-hd .ab-h{margin-bottom:0}
.ab-hon-hd .ci{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;border-radius:var(--r);background:var(--soft2);color:var(--pb);vertical-align:middle;margin-inline-end:10px}
.ab-hon-hd .ci .ico{width:18px;height:18px}
.ab-hon-hd .ci i{display:inline-block;width:0;overflow:hidden;color:transparent}
.ab-hon-hd .ci i::before{content:none}
.ab-honest{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 28px 24px}
.ab-honest ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ab-honest li{display:flex;gap:11px;align-items:flex-start;font-size:13px;font-weight:300;line-height:1.85;color:var(--mut);background:var(--sub);border:1px solid var(--sub-line);border-radius:var(--r);padding:14px 16px}
/* القرص أبيض بحدّ رفيع: علامة النفي #6E6E6B على --soft تخرج 4.49:1 (محسوب)
   وهو دون الحدّ بهامش، وعلى الأبيض 5.03:1 — والحدّ يبقيها ظاهرة على السطح الفرعي */
.ab-honest li .mk{width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid var(--sub-line);color:var(--mut);display:flex;align-items:center;justify-content:center;flex:none;margin-top:3px}
.ab-honest li .mk i{color:var(--mut);font-size:11px;margin-top:0}
.ab-honest li .mk .ico{width:12px;height:12px}
/* audience — كانت سحابة كبسولات، ثمّ صارت شبكة بطاقات بوصفة .ab-card نفسها،
   فبلغ عدد الشبكات المتطابقة خمسًا من تسعة أقسام (قِيس). صارت الآن **دليل
   روابط**: لوح واحد وخاناته مفصولة بخطّ شعري واحد (gap:1px على أرضية الخطّ)،
   الأيقونة خطّية بلا بلاطة، والمرور يظلّل الخانة ولا يرفعها. اثنا عشر رابطًا
   كما هي — لم يُحذف رابط ولا أيقونة ولا كلمة. */
.ab-aud{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;max-width:none;margin:0;text-align:start}
.ab-aud a{background:#fff;border:0;border-radius:0;padding:15px 17px;font-size:13.5px;font-weight:500;color:var(--ink);line-height:1.7;display:flex;align-items:center;gap:11px;transition:background .2s,color .2s}
.ab-aud a:hover{color:var(--pb);background:var(--soft2);transform:none}
.ab-aud a i{width:40px;height:40px;border-radius:var(--r);background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:16px;flex:none}
.ab-aud a .ico{width:17px;height:17px;color:var(--pb);flex:none}
/* cta — قسم بعرض الشاشة بحشو 96px بلا زاوية، لا صندوق مدوَّر داخل قسم أبيض */
.ab-cta{padding:96px 0;text-align:center;margin-bottom:0}
.ab-cta h2{font-size:clamp(28px,3.4vw,44px);font-weight:800;color:var(--ink);line-height:1.7;letter-spacing:-.03em;margin:0 0 10px}
.ab-cta p{color:var(--mut);font-size:clamp(13.5px,1.05vw,15.5px);font-weight:300;line-height:1.9;margin:0 auto 26px;max-width:62ch}
.ab-acts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.ab-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--pb);border:1px solid var(--pb);color:#fff;font-weight:500;font-size:14.5px;padding:12px 26px;border-radius:var(--r);transition:background .16s,border-color .16s,transform .15s}
.ab-btn:hover{background:var(--pb2);border-color:var(--pb2);transform:translateY(-1px)}
.ab-btn.gh{background:#fff;color:var(--pb);border-color:var(--edge)}
.ab-btn.gh:hover{background:var(--soft2);border-color:var(--pb)}
@media(max-width:1000px){
  .abx .ab-split{grid-template-columns:1fr;gap:34px}
  .ab-hd{max-width:none}
  .ab-hd .ab-sub{margin-bottom:0}
  .ab-hon .ab-hon-hd{margin-bottom:0}
  .ab-vrf .hdr{width:240px}
}
@media(max-width:900px){
  .abx section{padding:64px 0}
  .abx .wrapx{padding:0 20px}
  .ab-cta{padding:64px 0}
  .ab-hero .in{grid-template-columns:1fr}
  .abx .g4{grid-template-columns:1fr 1fr}
  .abx .g3{grid-template-columns:1fr 1fr}
  .abx .ab-aud{grid-template-columns:1fr 1fr}
  .abx .ab-imp{grid-template-columns:1fr 1fr}
  /* الصفّ ينقسم رأسيًّا: التحدّي فوق والمعالجة تحته بخطّ فاصل أفقي */
  .ab-crow{grid-template-columns:1fr}
  .ab-cmp .fx{border-inline-start:0;border-top:1px solid var(--line)}
  .abx .ab-vrf .ab-card{flex-wrap:wrap;gap:12px 18px}
  .ab-vrf .hdr{width:100%}
  .abx .ab-vrf .ab-card p{flex:1 1 100%}
}
@media(max-width:640px){
  /* الفعل الثانوي والأساسي كاملا العرض على الهاتف — لا عرضان ثابتان يلتفّان */
  .ab-acts{flex-direction:column}
  .ab-btn{display:flex;width:100%}
}
@media(max-width:620px){
  .abx .ab-stats,.abx .ab-stats2{grid-template-columns:1fr}
  .ab-stat+.ab-stat{border-inline-start:0;border-top:1px solid var(--line)}
  .abx .g2,.abx .g3,.abx .g4,.abx .ab-aud{grid-template-columns:1fr}
  .abx .ab-imp{grid-template-columns:1fr}
  .ab-honest ul{grid-template-columns:1fr}
  .ab-honest{padding:22px 20px 20px}
  .ab-band p{padding-inline-start:16px}
  .ab-cmp .pr,.ab-cmp .fx,.ab-icell,.abx .ab-vrf .ab-card{padding:18px 18px}
}