feat(resume): complete Epic 4 - Resume Content Strategy and Guidelines

- Update resume data with comprehensive professional summary and optimized work experience highlights
- Add resume content tech-spec and strategy documentation for 2025 best practices
- Create resume guidelines reference document for content consistency
- Enhance PDF composable with openPdf preview function alongside downloadPdf
- Expand CSS banner hiding rules to block certificates.dev promotional content
- Add research documentation on resume best practices and ATS optimization
- Update i18n translations for resume content in English and Persian
- Include sample Ali Arghyani resume PDF template in design assets
- Refactor resume.en.ts with improved professional positioning and achievement metrics
- Update API route documentation for PDF generation story artifacts
- Establish foundation for Epic 4 sprint planning with tech specifications

app/plugins/remove-banners.client.ts

@@ -2,6 +2,19 @@ export default defineNuxtPlugin(() => {
   if (import.meta.client) {
     // Remove promotional banners after mount
     const removeBanners = () => {
+      // Direct removal of known banner IDs (certificates.dev banner)
+      const directSelectors = [
+        '#bb-banner',
+        '[id*="bb-banner"]',
+        'a[href*="certificates.dev"]',
+        '[class*="bb-campaign"]',
+        '[class*="bb-close"]',
+      ]
+
+      directSelectors.forEach((selector) => {
+        document.querySelectorAll(selector).forEach((el) => el.remove())
+      })
+
       // Target common banner selectors
       const selectors = [
         '[class*="VueSchool"]',
@@ -9,20 +22,22 @@ export default defineNuxtPlugin(() => {
         '[class*="promotional"]',
         '[class*="Banner"]',
         'div[class*="bg-blue-950"]', // Common @nuxt/ui banner style
-        'a[href*="vueschool.io"]'
+        'a[href*="vueschool.io"]',
       ]
 
-      selectors.forEach(selector => {
+      selectors.forEach((selector) => {
         const elements = document.querySelectorAll(selector)
-        elements.forEach(el => {
+        elements.forEach((el) => {
           // Check if this looks like a promotional banner
           const parent = el.closest('div')
-          if (parent && (
-            el.textContent?.toLowerCase().includes('certification') ||
-            el.textContent?.toLowerCase().includes('black friday') ||
-            el.textContent?.toLowerCase().includes('vueschool') ||
-            el.textContent?.toLowerCase().includes('get certified')
-          )) {
+          if (
+            parent &&
+            (el.textContent?.toLowerCase().includes('certification') ||
+              el.textContent?.toLowerCase().includes('black friday') ||
+              el.textContent?.toLowerCase().includes('cyber monday') ||
+              el.textContent?.toLowerCase().includes('vueschool') ||
+              el.textContent?.toLowerCase().includes('get certified'))
+          ) {
             parent.remove()
             el.remove()
           }