Files
anwar-pi-website/about.html
T
ahmed 5254209f7b
Deploy GitHub Pages / deploy (push) Canceled after 0s
Add team about page
2026-10-02 14:06:20 +03:00

185 lines
13 KiB
HTML

<!doctype html>
<html lang="ar" dir="rtl">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="strict-origin-when-cross-origin" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self'; connect-src 'none'; object-src 'none'; base-uri 'self'; form-action 'self'; frame-src 'none'; worker-src 'none'" />
<meta name="description" content="تعرّف على أنور عنبتاوي وأحمد محمد، الفريق الذي يقف خلف أنور بي آي." />
<title>عن الفريق — أنور بي آي</title>
<style>
:root {
--bg: oklch(16% 0.03 225);
--surface: oklch(22% 0.04 220);
--fg: oklch(96% 0.015 210);
--muted: oklch(74% 0.03 215);
--border: oklch(36% 0.05 215);
--accent: oklch(78% 0.17 190);
--font-display: "SF Arabic", "Noto Sans Arabic", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--font-body: "SF Arabic", "Noto Sans Arabic", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--font-mono: ui-monospace, "SF Mono", Menlo, monospace;
--container: 1120px;
--gutter: 32px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.75 var(--font-body);text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--font-display);text-wrap:balance}
p{text-wrap:pretty}
:focus-visible{outline:3px solid color-mix(in oklch,var(--accent) 55%,transparent);outline-offset:3px}
.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.topnav{position:sticky;top:0;z-index:20;background:color-mix(in oklch,var(--bg) 92%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav-inner{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:inline-flex;align-items:center;gap:10px;font-size:23px;font-weight:700}
.logo-mark{width:30px;height:34px;object-fit:contain;flex:none;border-radius:4px}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{min-height:44px;display:inline-flex;align-items:center;color:var(--muted)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--fg)}
.hero{padding-block:clamp(70px,10vw,132px);border-bottom:1px solid var(--border)}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(48px,9vw,112px);align-items:end}
.eyebrow{font:12px/1.5 var(--font-mono);letter-spacing:.04em;color:var(--accent);margin:0 0 22px}
.hero h1{font-size:clamp(48px,7.5vw,92px);line-height:1.06;letter-spacing:-.025em;max-width:10ch;margin:0}
.lead{font-size:clamp(19px,2vw,23px);line-height:1.75;color:var(--muted);max-width:54ch;margin:28px 0 0}
.hero-note{border-top:1px solid var(--fg);padding-top:24px}
.hero-note strong{display:block;font-size:clamp(24px,3vw,34px);line-height:1.35}
.hero-note p{color:var(--muted);margin:10px 0 0}
.team{padding-block:clamp(64px,9vw,104px);border-bottom:1px solid var(--border)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:46px}
.section-head h2{font-size:clamp(38px,5vw,62px);line-height:1.12;max-width:12ch;margin:0}
.section-head p{color:var(--muted);max-width:48ch;margin:0}
.profile-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:42px;border-top:1px solid var(--fg)}
.profile{padding:34px 0 0;display:flex;flex-direction:column;min-width:0}
.profile+.profile{padding-inline-start:42px;border-inline-start:1px solid var(--border)}
.profile-label{font:12px/1.5 var(--font-mono);color:var(--muted)}
.profile-main .profile-label{color:var(--accent)}
.profile h3{font-size:clamp(32px,4vw,48px);line-height:1.15;margin:20px 0 8px}
.role{color:var(--fg);font-weight:700;margin:0 0 22px}
.bio{color:var(--muted);font-size:17px;margin:0;max-width:58ch}
.topics{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 32px}
.topic{display:inline-flex;align-items:center;min-height:34px;padding:6px 12px;border:1px solid var(--border);color:var(--muted);font-size:13px}
.profile-link{min-height:50px;display:inline-flex;align-items:center;justify-content:space-between;gap:20px;margin-top:auto;padding:12px 16px;border:1px solid var(--fg);font-weight:700}
.profile-link:hover{background:var(--fg);color:var(--surface)}
.principles{padding-block:clamp(64px,9vw,104px)}
.principle-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(48px,9vw,112px);align-items:start}
.principle-grid h2{font-size:clamp(38px,5vw,60px);line-height:1.14;margin:0;max-width:11ch}
.principle-list{border-top:1px solid var(--fg)}
.principle{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:26px 0;border-bottom:1px solid var(--border)}
.principle-index{font:12px/1.5 var(--font-mono);color:var(--muted);padding-top:7px}
.principle h3{font-size:24px;margin:0 0 8px}
.principle p{color:var(--muted);margin:0}
.pagefoot{padding-block:50px;border-top:1px solid var(--border);color:var(--muted)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.footer-links{display:flex;gap:20px;flex-wrap:wrap}
.footer-links a{min-height:44px;display:inline-flex;align-items:center}
.footer-links a:hover{color:var(--fg);text-decoration:underline;text-underline-offset:4px}
@media(max-width:920px){
:root{--gutter:22px}
.hero-grid,.profile-grid,.principle-grid{grid-template-columns:1fr}
.profile-grid{gap:0}
.profile+.profile{padding-inline-start:0;border-inline-start:0;border-top:1px solid var(--border);margin-top:42px;padding-top:42px}
.section-head{align-items:start;flex-direction:column}
.hero-note{max-width:560px}
}
@media(max-width:620px){
:root{--gutter:18px}
.hero{padding-block:54px}
.team,.principles{padding-block:58px}
.profile h3{font-size:36px}
.principle{grid-template-columns:42px 1fr}
.footer-bottom,.footer-links{align-items:stretch;flex-direction:column;gap:8px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}
</style>
<link rel="stylesheet" href="assets/anwarpi.css?v=5" />
<script src="assets/anwarpi.js?v=4" defer></script>
</head>
<body data-anw-dim>
<header class="topnav" data-od-id="topnav">
<div class="container nav-inner">
<a class="logo" href="index.html" data-od-id="brand"><img class="logo-mark" src="assets/anwarpi-logo.jpg" alt="" width="1200" height="1352">أنور بي آي</a>
<nav class="nav-links" aria-label="التنقل الرئيسي">
<a href="arabic-ai-learning-catalog.html#catalog">المكتبة</a>
<a href="article-agent-guide.html">المقالات</a>
<a href="subscription.html">العضوية</a>
<a href="about.html" aria-current="page">عن الفريق</a>
</nav>
</div>
</header>
<main>
<section class="hero" data-od-id="about-hero">
<div class="container hero-grid">
<div>
<p class="eyebrow">عن أنور بي آي · خبرة تبني وتشرح</p>
<h1 data-od-id="about-title">خبرة تقنية تتحول إلى معرفة عملية.</h1>
<p class="lead">يقود أنور عنبتاوي المنصة، ويشاركه أحمد محمد شغف تحويل تقنيات الذكاء الاصطناعي والبنية التحتية إلى تطبيقات مفهومة ونافعة للأعمال.</p>
</div>
<div class="hero-note" data-od-id="team-mission">
<strong>لا نكتفي بعرض الأدوات.</strong>
<p>نشرح كيف تختارها، تربطها بسير العمل، وتشغّلها بوعي على بنية يمكن الاعتماد عليها.</p>
</div>
</div>
</section>
<section class="team" data-od-id="team">
<div class="container">
<div class="section-head">
<h2>العقول خلف أنور بي آي.</h2>
<p>يجمع الفريق بين خبرة طويلة في البنية التحتية واهتمام تطبيقي بالنماذج المفتوحة والوكلاء وأنظمة الاسترجاع.</p>
</div>
<div class="profile-grid">
<article class="profile profile-main" data-od-id="profile-anwar">
<span class="profile-label">المؤسس الرئيسي · خبرة ٢٠ عاماً</span>
<h3>أنور عنبتاوي</h3>
<p class="role">متخصص بنية تحتية وتقنيات معلومات</p>
<p class="bio">يقود أنور الرؤية الأساسية للمنصة بخبرة تمتد لعقدين في البنية التحتية لتقنية المعلومات. يهتم بتشغيل النماذج الكبيرة محلياً، واستكشاف النماذج المفتوحة، وبناء بيئات قوية تجعل التجربة التقنية قابلة للتشغيل الحقيقي لا للعرض فقط.</p>
<div class="topics" aria-label="مجالات اهتمام أنور">
<span class="topic">البنية التحتية</span>
<span class="topic">النماذج المفتوحة</span>
<span class="topic">تشغيل النماذج محلياً</span>
<span class="topic">الأنظمة الموثوقة</span>
</div>
<a class="profile-link" href="https://www.linkedin.com/in/anwaranabtawi/" target="_blank" rel="noopener noreferrer" data-od-id="anwar-linkedin"><span>ملف أنور على LinkedIn</span><span aria-hidden="true">↗</span></a>
</article>
<article class="profile" data-od-id="profile-ahmed">
<span class="profile-label">ذكاء اصطناعي تطبيقي · تكامل الأعمال</span>
<h3>أحمد محمد</h3>
<p class="role">مهتم بهندسة حلول الذكاء الاصطناعي</p>
<p class="bio">يركز أحمد على ضبط النماذج، وأطر الذكاء الاصطناعي الوكيل، وتنسيق الوكلاء، وأنظمة <bdi dir="ltr">RAG</bdi>. اهتمامه الأساسي هو دمج الذكاء الاصطناعي داخل تدفقات الأعمال بحيث يتحول من تجربة منفصلة إلى جزء فعّال من طريقة إنجاز العمل.</p>
<div class="topics" aria-label="مجالات اهتمام أحمد">
<span class="topic">ضبط النماذج</span>
<span class="topic">أطر الوكلاء</span>
<span class="topic">تنسيق الوكلاء</span>
<span class="topic"><bdi dir="ltr">RAG</bdi></span>
</div>
<a class="profile-link" href="https://www.linkedin.com/in/ahmed-mohamed-423583151/" target="_blank" rel="noopener noreferrer" data-od-id="ahmed-linkedin"><span>ملف أحمد على LinkedIn</span><span aria-hidden="true">↗</span></a>
</article>
</div>
</div>
</section>
<section class="principles" data-od-id="team-principles">
<div class="container principle-grid">
<div>
<p class="eyebrow">طريقة العمل</p>
<h2>من المختبر إلى سير العمل.</h2>
</div>
<div class="principle-list">
<article class="principle" data-od-id="principle-practical"><span class="principle-index">01</span><div><h3>التطبيق قبل الاستعراض</h3><p>نقيس قيمة التقنية بقدرتها على حل مشكلة واضحة أو تحسين خطوة حقيقية في العمل.</p></div></article>
<article class="principle" data-od-id="principle-open"><span class="principle-index">02</span><div><h3>فهم ما يحدث تحت الغطاء</h3><p>نفضّل الأدوات المفتوحة والتشغيل الذي يمنح المستخدم فهماً وتحكماً أكبر في بياناته وموارده.</p></div></article>
<article class="principle" data-od-id="principle-reliable"><span class="principle-index">03</span><div><h3>أنظمة يمكن الاعتماد عليها</h3><p>الوكيل أو النموذج لا يكتمل من دون بنية ومراقبة وحدود واضحة تمنع الفشل الصامت.</p></div></article>
</div>
</div>
</section>
</main>
<footer class="pagefoot" data-od-id="footer">
<div class="container footer-bottom">
<span>© أنور بي آي ٢٠٢٦</span>
<nav class="footer-links" aria-label="روابط التذييل"><a href="arabic-ai-learning-catalog.html#catalog">المكتبة</a><a href="subscription.html">العضوية</a><a href="mailto:hello@anwarpi.ai">تواصل معنا</a></nav>
</div>
</footer>
</body>
</html>