Make featured articles clickable

arabic-ai-learning-catalog-v2.html

@@ -106,6 +106,9 @@
     .deck-frame { position: relative; min-height: 470px; border: 1px solid var(--fg); background: var(--surface); overflow: hidden; }
     .deck-slide { position: absolute; inset: 0; padding: clamp(28px, 4vw, 52px); display: none; grid-template-rows: auto 1fr auto; }
     .deck-slide.active { display: grid; }
+    .deck-slide-link { position: absolute; inset: 0; z-index: 2; cursor: pointer; }
+    .deck-slide-link:focus-visible { outline-offset: -8px; }
+    .deck-slide:hover .deck-slide-body h2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
     .deck-slide::after { content: ""; position: absolute; inset-inline-start: 0; bottom: 0; width: 100%; height: 4px; background: var(--fg); }
     .deck-slide-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
     .deck-slide-kicker { font-family: var(--font-mono); font-size: 11px; color: var(--muted); letter-spacing: .05em; }
@@ -237,16 +240,19 @@
         <div class="deck" data-od-id="featured-deck" aria-label="مختارات مميزة">
           <div class="deck-frame" aria-live="polite">
             <article class="deck-slide active" data-slide="0">
+              <a class="deck-slide-link" href="articles.html" aria-label="افتح قسم مقالات الوكلاء في المكتبة"></a>
               <div class="deck-slide-top"><span class="deck-slide-kicker">دليل حصري · المستوى المتوسط</span><span class="deck-slide-index num">01</span></div>
               <div class="deck-slide-body"><h2>ابنِ وكيلك الأول دون فوضى</h2><p>خريطة عملية لتقسيم المهام، اختيار الأدوات، وضبط ذاكرة الوكيل قبل كتابة الكود.</p></div>
               <div class="deck-slide-foot"><span class="deck-slide-format"><span class="play" aria-hidden="true">▶</span>فيديو · 28 دقيقة</span><span class="meta"><bdi dir="ltr">AGENTIC AI</bdi></span></div>
             </article>
             <article class="deck-slide" data-slide="1">
+              <a class="deck-slide-link" href="articles.html" aria-label="افتح قسم مقالات النماذج في المكتبة"></a>
               <div class="deck-slide-top"><span class="deck-slide-kicker">مقال تطبيقي · للمبتدئين</span><span class="deck-slide-index num">02</span></div>
               <div class="deck-slide-body"><h2>كيف تختار نموذجاً لمهمتك؟</h2><p>مقارنة منهجية حسب الجودة، التكلفة، السرعة، والخصوصية — من دون ضجيج تسويقي.</p></div>
               <div class="deck-slide-foot"><span class="deck-slide-format">قراءة · 12 دقيقة</span><span class="meta">النماذج</span></div>
             </article>
             <article class="deck-slide" data-slide="2">
+              <a class="deck-slide-link" href="articles.html" aria-label="افتح قسم مقالات RAG في المكتبة"></a>
               <div class="deck-slide-top"><span class="deck-slide-kicker">مسار متقدم · للأعضاء</span><span class="deck-slide-index num">03</span></div>
               <div class="deck-slide-body"><h2>من <bdi dir="ltr">RAG</bdi> إلى إجابة موثوقة</h2><p>صمّم الاسترجاع، اختبر المصادر، وافهم أين تنهار الإجابة قبل أن تصل إلى المستخدم.</p></div>
               <div class="deck-slide-foot"><span class="deck-slide-format"><span class="play" aria-hidden="true">▶</span>سلسلة · 4 أجزاء</span><span class="meta"><bdi dir="ltr">RAG</bdi></span></div>