Audit fixes: VIP self-grant, draft leak, onboarding flag, hero personalization, gated downloads

web/src/app/(frontend)/about/page.tsx

@@ -0,0 +1,72 @@
+import Topnav from '@/components/topnav'
+import Footer from '@/components/footer'
+import { getViewer } from '@/lib/viewer'
+
+export const dynamic = 'force-dynamic'
+export const metadata = { title: 'عن الفريق' }
+
+export default async function AboutPage() {
+  const viewer = await getViewer()
+  return (
+    <div id="site" className="site-page v2 v2-about">
+      <Topnav viewer={viewer} />
+      <main id="content">
+        <section className="about-hero" aria-labelledby="about-title">
+          <div className="wrap about-hero-grid">
+            <div>
+              <h1 id="about-title">نكتب عن تجاربنا، ونشارك ما جرّبناه عمليًا</h1>
+              <p className="lede">أنور بآي منصة يقودها أنور عنبتاوي مع أحمد محمد. نحوّل خبرة سنوات في البنية التحتية والذكاء الاصطناعي التطبيقي إلى أدلة عربية يمكن تنفيذها في عملك.</p>
+            </div>
+            {/* eslint-disable-next-line @next/next/no-img-element */}
+            <img className="about-mark" src="/brand/mark-light.svg" alt="" width={436} height={382} />
+          </div>
+        </section>
+
+        <section className="about-team" aria-labelledby="team-title">
+          <div className="wrap">
+            <h2 id="team-title">الفريق</h2>
+            <div className="people">
+              <article className="person">
+                <p className="person-role">المؤسس، 20 عاماً في البنية التحتية</p>
+                <h3>أنور عنبتاوي</h3>
+                <p>يقود رؤية المنصة بخبرة عقدين في البنية التحتية لتقنية المعلومات. يهتم بتشغيل النماذج الكبيرة محلياً، واستكشاف النماذج المفتوحة، وبناء بيئات تجعل التجربة التقنية قابلة للتشغيل الحقيقي.</p>
+                <ul className="tags" aria-label="مجالات اهتمام أنور" role="list">
+                  <li>البنية التحتية</li><li>النماذج المفتوحة</li><li>التشغيل المحلي</li><li>الأنظمة الموثوقة</li>
+                </ul>
+                <a className="text-link" href="https://www.linkedin.com/in/anwaranabtawi/" target="_blank" rel="noopener noreferrer">أنور على LinkedIn</a>
+              </article>
+              <article className="person">
+                <p className="person-role">الذكاء الاصطناعي التطبيقي وتكامل الأعمال</p>
+                <h3>أحمد محمد</h3>
+                <p>يركز على ضبط النماذج، وأطر الوكلاء وتنسيقها، وأنظمة <bdi dir="ltr">RAG</bdi>. يهمه أن يصبح الذكاء الاصطناعي جزءاً فعّالاً من طريقة إنجاز العمل، لا تجربة منفصلة عنه.</p>
+                <ul className="tags" aria-label="مجالات اهتمام أحمد" role="list">
+                  <li>ضبط النماذج</li><li>أطر الوكلاء</li><li>تنسيق الوكلاء</li><li><bdi dir="ltr">RAG</bdi></li>
+                </ul>
+                <a className="text-link" href="https://www.linkedin.com/in/ahmed-mohamed-423583151/" target="_blank" rel="noopener noreferrer">أحمد على LinkedIn</a>
+              </article>
+            </div>
+          </div>
+        </section>
+
+        <section className="about-principles" aria-labelledby="principles-title">
+          <div className="wrap principles-grid">
+            <h2 id="principles-title">كيف نكتب كل دليل</h2>
+            <dl className="principles">
+              <div><dt>التطبيق قبل الاستعراض</dt><dd>نقيس قيمة التقنية بقدرتها على حل مشكلة واضحة أو تحسين خطوة حقيقية في العمل.</dd></div>
+              <div><dt>نشرح ما تحت الغطاء</dt><dd>نفضّل الأدوات المفتوحة والتشغيل الذي يمنحك فهماً وتحكماً أكبر في بياناتك ومواردك.</dd></div>
+              <div><dt>حدود قبل الإطلاق</dt><dd>الوكيل أو النموذج لا يكتمل دون مراقبة وحدود واضحة تمنع الفشل الصامت.</dd></div>
+            </dl>
+          </div>
+        </section>
+
+        <section className="about-contact">
+          <div className="wrap contact-strip">
+            <p>عندك سؤال عن دليل أو فكرة تريد تطبيقها؟</p>
+            <a className="btn btn-quiet" href="mailto:hello@anwarpy.ai" dir="ltr">hello@anwarpy.ai</a>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </div>
+  )
+}