/* ========================================================================== ✨ INTISHAR 360° - THE TRI-METALLIC LUXURY DESIGN SYSTEM Palette Definition: - #FFD800 : Radiant Bright Gold (الذهب المشع - High Impact CTAs & Focal Points) - #D4AF37 : Royal Metallic Gold (الذهب الملكي - Borders, Structure & Badges) - #CD7F32 : Warm Bronze (البرونز النحاسي الفاخر - Depth, Warmth & Accents) - #A7AEB5 : Platinum Silver (البلاتين الفضي - Architectural Balance & Dividers) - #0F172A : Executive Deep Slate / Navy (Maximum Contrast Typography) - #FFFFFF : Pure White Card Backgrounds ========================================================================== */ /* -------------------------------------------------------------------------- 0. الخطوط والتنسيقات الأساسية -------------------------------------------------------------------------- */ body.page-id-4368.elementor-page, body.page-id-4368 { font-family: 'Cairo', 'Segoe UI', Tahoma, Arial, sans-serif !important; background-color: #FAFAFA !important; color: #0F172A !important; -webkit-font-smoothing: antialiased; } /* ========================================================================== 🌄 هندسة خلفيات الأقسام (Section Background Architecture) ========================================================================== */ /* 1. قسم خطوات إنشاء الموقع الـ 10 (Container 6d720b8d) - بلاتيني راقٍ بنقش شبكي تقني ناعم */ body.page-id-4368 .elementor-element.elementor-element-6d720b8d, body.page-id-4368 [data-id="6d720b8d"] { background: linear-gradient(180deg, #F3F5F7 0%, #F8FAFC 100%) !important; position: relative !important; padding-top: 75px !important; padding-bottom: 75px !important; border-top: 1px solid #E2E8F0 !important; border-bottom: 1px solid #E2E8F0 !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-6d720b8d::before, body.page-id-4368 [data-id="6d720b8d"]::before { content: '' !important; position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; background-image: radial-gradient(rgba(167, 174, 181, 0.28) 1.2px, transparent 1.2px) !important; background-size: 24px 24px !important; pointer-events: none !important; opacity: 0.8 !important; } /* 2. قسم تصميم موقع ووردبريس كامل / المراحل الـ 5 (Container 2a33d856) - عاجي دافئ فاخر */ body.page-id-4368 .elementor-element.elementor-element-2a33d856, body.page-id-4368 [data-id="2a33d856"] { background: linear-gradient(180deg, #FFFDF8 0%, #FAF6ED 100%) !important; position: relative !important; padding-top: 75px !important; padding-bottom: 75px !important; border-top: 1px solid #F1EAD9 !important; border-bottom: 1px solid #F1EAD9 !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-2a33d856::before, body.page-id-4368 [data-id="2a33d856"]::before { content: '' !important; position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(circle at 50% 30%, rgba(212, 175, 55, 0.05) 0%, transparent 70%) !important; pointer-events: none !important; } /* 3. قسم الفورم والتواصل النهائي (Container bbedf0a) - تمييز تنفيذي داكن فاخر */ body.page-id-4368 .elementor-element.elementor-element-bbedf0a, body.page-id-4368 [data-id="bbedf0a"] { background: linear-gradient(135deg, #090E17 0%, #0F172A 55%, #192338 100%) !important; position: relative !important; padding-top: 85px !important; padding-bottom: 85px !important; border-top: 4px solid transparent !important; border-image: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%) 1 !important; box-shadow: inset 0 20px 40px rgba(0, 0, 0, 0.3) !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-bbedf0a::before, body.page-id-4368 [data-id="bbedf0a"]::before { content: '' !important; position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(circle at 80% 20%, rgba(205, 127, 50, 0.12) 0%, transparent 50%), radial-gradient(circle at 20% 80%, rgba(255, 216, 0, 0.08) 0%, transparent 50%) !important; pointer-events: none !important; } /* Removed old dark section h2 color override */ body.page-id-4368 .elementor-element-6fb9a5c8 .intishar-quote, body.page-id-4368 [data-id="6fb9a5c8"] .intishar-quote { background: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(255, 255, 255, 0.12) !important; border-right: 5px solid #CD7F32 !important; color: #E2E8F0 !important; backdrop-filter: blur(12px) !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25) !important; } body.page-id-4368 .elementor-element.elementor-element-1c913343, body.page-id-4368 [data-id="1c913343"] { background: #FFFFFF !important; box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.6), 0 0 45px rgba(212, 175, 55, 0.2) !important; } /* ========================================================================== ✨ نظام بطاقات التميز التنفيذي لكافة الفقرات (Executive Cards System) تناوب متوازن بين الذهب الملكي (#D4AF37) والبرونز النحاسي (#CD7F32) ========================================================================== */ /* القاعدة المشتركة لجميع بطاقات الفقرات في كل الأقسام */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2) { background: #FFFFFF !important; border: 1.5px solid #E2E8F0 !important; border-radius: 18px !important; padding: 24px 28px !important; box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.02) !important; position: relative !important; font-size: 16.5px !important; line-height: 1.95 !important; color: #1E293B !important; margin: 20px 0 24px 0 !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; box-sizing: border-box !important; } /* تأثير التمرير (Hover) على جميع البطاقات */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1):hover, body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2):hover, body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1):hover, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1):hover, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2):hover, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1):hover, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2):hover, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1):hover, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2):hover { transform: translateY(-3px) !important; box-shadow: 0 16px 35px -5px rgba(212, 175, 55, 0.12) !important; } /* 1. البطاقات ذات الحد الجانبي البرونزي النحاسي (#CD7F32) */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1) { border-right: 5px solid #CD7F32 !important; } /* 2. البطاقات ذات الحد الجانبي الذهب الملكي (#D4AF37) */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2) { border-right: 5px solid #D4AF37 !important; } /* 3. تصميم البادجات العلوية داخل كل بطاقة (Top Badges) */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2)::before { display: table !important; font-size: 13px !important; font-weight: 800 !important; border-radius: 20px !important; padding: 4px 14px !important; margin-bottom: 14px !important; } /* بادجات البرونز النحاسي (#CD7F32) */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1)::before { color: #934C15 !important; background: #FAF0E8 !important; border: 1px solid rgba(205, 127, 50, 0.3) !important; } /* بادجات الذهب الملكي (#D4AF37) */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2)::before, body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1)::before, body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2)::before { color: #8C6D13 !important; background: #FAF5E6 !important; border: 1px solid rgba(212, 175, 55, 0.35) !important; } /* نصوص البادجات المخصصة */ body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1)::before { content: '💡 أهمية الحضور الرقمي للأعمال' !important; } body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2)::before { content: '✨ رؤية انتشار 360° الرقمية' !important; } body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1)::before { content: '🚀 استراتيجية بناء الموقع الرقمي' !important; } body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1)::before { content: '💎 سر الفارق بين الموقع العادي والناجح' !important; } body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2)::before { content: '⭐ معايير الجودة والاحترافية' !important; } body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1)::before { content: '💡 مفهوم الموقع الرقمي المتكامل' !important; } body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2)::before { content: '🚀 حلول متكاملة من البداية حتى الإطلاق' !important; } body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1)::before { content: '👨‍💻 خبرة احترافية تصنع الفارق' !important; } body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2)::before { content: '🎯 هندسة تجربة المستخدم المتخصصة' !important; } /* فقرة الهيرو في أعلى الصفحة */ body.page-id-4368 .elementor-element-75828ce p { font-size: 17.5px !important; line-height: 1.9 !important; color: #334155 !important; background: #FFFFFF !important; border: 1px solid #E2E8F0 !important; border-right: 4.5px solid #D4AF37 !important; border-radius: 14px !important; padding: 16px 22px !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important; margin: 18px 0 24px 0 !important; } /* بطاقة النتيجة التسويقية الفاخرة (VIP Highlight Card) */ body.page-id-4368 .elementor-element-4ae3c947 p[style*="font-weight:700"], body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(3) { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF !important; border-radius: 16px !important; padding: 20px 28px !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.75 !important; border-right: 5px solid #FFD800 !important; box-shadow: 0 10px 25px rgba(15, 23, 42, 0.15) !important; margin: 24px 0 !important; } /* كروت الاستشارة قبل الزر (Consultation Advisory Cards) */ body.page-id-4368 .intishar-subtext { background: #F8FAFC !important; border: 1.5px solid #E2E8F0 !important; border-right: 4.5px solid #CD7F32 !important; border-radius: 16px !important; padding: 20px 26px !important; font-size: 15.5px !important; color: #334155 !important; line-height: 1.85 !important; margin: 26px 0 20px 0 !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important; } /* العناوين الفرعية الداخلية (Subtitles) في صورة بادج مميز */ body.page-id-4368 .intishar-subtitle { display: inline-flex !important; align-items: center !important; gap: 10px !important; font-size: 18px !important; font-weight: 800 !important; color: #0F172A !important; background: #F8FAFC !important; border: 1px solid #E2E8F0 !important; border-right: 4px solid #D4AF37 !important; padding: 10px 22px !important; border-radius: 12px !important; margin: 28px 0 18px 0 !important; } /* البانر الإحصائي الراقي (أكثر من 40%) */ body.page-id-4368 .intishar-stat-banner { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF !important; padding: 20px 28px !important; border-radius: 16px !important; border: 1px solid rgba(255, 216, 0, 0.3) !important; border-right: 5px solid #FFD800 !important; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important; font-size: 16.5px !important; line-height: 1.8 !important; margin: 26px 0 30px 0 !important; } body.page-id-4368 .intishar-stat-banner strong { color: #FFD800 !important; font-size: 22px !important; font-weight: 800 !important; } /* قوائم المزايا ذات علامة الصح الراقية */ body.page-id-4368 .intishar-check-list { list-style: none !important; padding: 0 !important; margin: 18px 0 !important; display: flex !important; flex-direction: column !important; gap: 12px !important; } body.page-id-4368 .intishar-check-list li { display: flex !important; align-items: center !important; gap: 14px !important; font-size: 16px !important; color: #1E293B !important; font-weight: 600 !important; line-height: 1.6 !important; background: #FFFFFF !important; border: 1px solid #F1F5F9 !important; border-radius: 12px !important; padding: 12px 18px !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important; transition: all 0.25s ease !important; } body.page-id-4368 .intishar-check-list li:hover { transform: translateX(-4px) !important; border-color: #D4AF37 !important; } body.page-id-4368 .intishar-check-list li span { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 28px !important; height: 28px !important; border-radius: 50% !important; background: #FAF5E6 !important; color: #8C6D13 !important; font-weight: 800 !important; font-size: 14px !important; flex-shrink: 0 !important; border: 1px solid rgba(212, 175, 55, 0.3) !important; } /* ========================================================================== ⭐ أزرار الهيرو في أعلى الصفحة (Hero CTA Buttons) ========================================================================== */ /* زر طلب عرض سعر مخصص (ثانوي فاخر) */ body.page-id-4368 .elementor-element.elementor-element-155a6a1 a.elementor-button, body.page-id-4368 [data-id="155a6a1"] a.elementor-button, body.page-id-4368 .intishar-btn-outline a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #FFFFFF !important; color: #0F172A !important; border: 2px solid #A7AEB5 !important; font-size: 16px !important; font-weight: 800 !important; border-radius: 9999px !important; padding: 12px 30px !important; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; text-decoration: none !important; white-space: nowrap !important; line-height: 1.4 !important; } body.page-id-4368 .elementor-element.elementor-element-155a6a1 a.elementor-button:hover, body.page-id-4368 [data-id="155a6a1"] a.elementor-button:hover, body.page-id-4368 .intishar-btn-outline a.elementor-button:hover { background: #CD7F32 !important; color: #FFFFFF !important; border-color: #CD7F32 !important; transform: translateY(-3px) scale(1.03) !important; box-shadow: 0 12px 28px rgba(205, 127, 50, 0.35) !important; } body.page-id-4368 .elementor-element-155a6a1 a.elementor-button:hover .elementor-button-text { color: #FFFFFF !important; } /* شريط الثقة في الهيرو */ body.page-id-4368 .intishar-trust-row { font-size: 14.5px !important; color: #475569 !important; font-weight: 600 !important; margin-top: 14px !important; } /* ========================================================================== 1. الصورة الأولى: مزايا ووردبريس الـ 6 (Bento Grid Cards) ========================================================================== */ body.page-id-4368 .elementor-element.elementor-element-3fb216db, body.page-id-4368 [data-id="3fb216db"] { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 24px !important; justify-content: space-between !important; margin-top: 28px !important; margin-bottom: 20px !important; } /* كروت المزايا الستة */ body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con, body.page-id-4368 [data-id="3fb216db"] > .e-con, body.page-id-4368 .elementor-element-2d2c34f9, body.page-id-4368 .elementor-element-2059d844, body.page-id-4368 .elementor-element-417a0c84, body.page-id-4368 .elementor-element-7be3a512, body.page-id-4368 .elementor-element-5287e3b1, body.page-id-4368 .elementor-element-3e0a5028 { width: calc(33.333% - 16px) !important; flex: 0 0 calc(33.333% - 16px) !important; background: #FFFFFF !important; border: 1.5px solid #F1F5F9 !important; border-radius: 20px !important; padding: 34px 26px !important; box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.04) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; position: relative !important; overflow: hidden !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; box-sizing: border-box !important; } /* خط تذهيب علوي رفيع لكل كرت - تدرج برونزي وذهبي */ body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con::before, body.page-id-4368 [data-id="3fb216db"] > .e-con::before { content: '' !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 4px !important; background: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%) !important; opacity: 0.9 !important; transition: all 0.3s ease !important; } /* حركة الكرت عند التمرير */ body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con:hover, body.page-id-4368 [data-id="3fb216db"] > .e-con:hover { transform: translateY(-8px) !important; border-color: rgba(212, 175, 55, 0.5) !important; box-shadow: 0 20px 40px -10px rgba(205, 127, 50, 0.2) !important; } body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con:hover::before, body.page-id-4368 [data-id="3fb216db"] > .e-con:hover::before { height: 6px !important; opacity: 1 !important; } /* دوائر الأيقونات الذهبية والبرونزية */ body.page-id-4368 .elementor-element.elementor-element-3fb216db .elementor-icon, body.page-id-4368 [data-id="3fb216db"] .elementor-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 68px !important; height: 68px !important; border-radius: 50% !important; background: linear-gradient(135deg, #FAF5E6 0%, #F5E8C7 100%) !important; border: 1.5px solid #D4AF37 !important; margin-bottom: 20px !important; box-shadow: 0 8px 20px rgba(212, 175, 55, 0.18) !important; transition: all 0.3s ease !important; } body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con:hover .elementor-icon, body.page-id-4368 [data-id="3fb216db"] > .e-con:hover .elementor-icon { transform: scale(1.1) rotate(5deg) !important; background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; border-color: #D4AF37 !important; box-shadow: 0 10px 25px rgba(255, 216, 0, 0.35) !important; } /* لون الأيقونة البرونزي النحاسي */ body.page-id-4368 .elementor-element.elementor-element-3fb216db .elementor-icon svg, body.page-id-4368 [data-id="3fb216db"] .elementor-icon svg { fill: #CD7F32 !important; width: 30px !important; height: 30px !important; transition: all 0.3s ease !important; } body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con:hover .elementor-icon svg, body.page-id-4368 [data-id="3fb216db"] > .e-con:hover .elementor-icon svg { fill: #000000 !important; } /* نصوص وعناوين الكروت الستة */ body.page-id-4368 .elementor-element.elementor-element-3fb216db .elementor-icon-box-title, body.page-id-4368 [data-id="3fb216db"] .elementor-icon-box-title { font-size: 20px !important; font-weight: 800 !important; color: #0F172A !important; margin-bottom: 12px !important; line-height: 1.4 !important; } body.page-id-4368 .elementor-element.elementor-element-3fb216db .elementor-icon-box-description, body.page-id-4368 [data-id="3fb216db"] .elementor-icon-box-description { font-size: 15px !important; color: #475569 !important; line-height: 1.8 !important; margin: 0 !important; } /* شريط الإجراء السفلي للقسم الأول */ body.page-id-4368 .elementor-element.elementor-element-46055352, body.page-id-4368 [data-id="46055352"] { width: 100% !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; background: #F8FAFC !important; border: 1.5px solid #E2E8F0 !important; border-right: 5px solid #D4AF37 !important; border-radius: 20px !important; padding: 26px 36px !important; margin-top: 30px !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.02) !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-46055352 .intishar-callout-text { color: #334155 !important; font-size: 15.5px !important; line-height: 1.8 !important; margin: 0 !important; } /* ========================================================================== 2. الصورة الثانية: خطوات إنشاء الموقع الـ 10 (Roadmap Cards) ========================================================================== */ body.page-id-4368 .elementor-element.elementor-element-17c0e82e, body.page-id-4368 [data-id="17c0e82e"] { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 16px !important; justify-content: space-between !important; margin-top: 32px !important; margin-bottom: 20px !important; } /* كروت الخطوات العشرة */ body.page-id-4368 .elementor-element.elementor-element-17c0e82e > .e-con, body.page-id-4368 [data-id="17c0e82e"] > .e-con, body.page-id-4368 .elementor-element-1e805327, body.page-id-4368 .elementor-element-38f80f3e, body.page-id-4368 .elementor-element-3d1a90f9, body.page-id-4368 .elementor-element-49653d9d, body.page-id-4368 .elementor-element-6843ef40, body.page-id-4368 .elementor-element-16461108, body.page-id-4368 .elementor-element-42a9eaaf, body.page-id-4368 .elementor-element-31470fcf, body.page-id-4368 .elementor-element-ce36d16, body.page-id-4368 .elementor-element-6544c9c3 { width: calc(50% - 8px) !important; flex: 0 0 calc(50% - 8px) !important; background: #FFFFFF !important; border: 1px solid #E2E8F0 !important; border-radius: 16px !important; padding: 20px 24px !important; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.03) !important; border-right: 4px solid #D4AF37 !important; transition: all 0.3s ease !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; } body.page-id-4368 .elementor-element.elementor-element-17c0e82e > .e-con:hover, body.page-id-4368 [data-id="17c0e82e"] > .e-con:hover { transform: translateX(-6px) !important; border-color: #CD7F32 !important; box-shadow: 0 12px 28px rgba(205, 127, 50, 0.15) !important; } /* بنية محتوى الخطوة */ body.page-id-4368 .step-inner { display: flex !important; align-items: center !important; gap: 18px !important; width: 100% !important; } /* بادج رقم الخطوة - تدرج ذهبي برونزي */ body.page-id-4368 .step-num { background: linear-gradient(135deg, #D4AF37 0%, #CD7F32 100%) !important; color: #FFFFFF !important; font-weight: 800 !important; font-size: 15px !important; width: 42px !important; height: 42px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; box-shadow: 0 4px 12px rgba(205, 127, 50, 0.35) !important; } /* نص الخطوة */ body.page-id-4368 .step-text { font-size: 15.5px !important; color: #1E293B !important; font-weight: 600 !important; line-height: 1.6 !important; margin: 0 !important; flex: 1 !important; } /* تمييز الخطوة العاشرة (الهدية المجانية) كرت VIP مميز */ body.page-id-4368 .elementor-element-6544c9c3, body.page-id-4368 [data-id="6544c9c3"] { background: linear-gradient(135deg, #FFFDF0 0%, #FEF9C3 100%) !important; border: 1.5px solid #D4AF37 !important; border-right: 5px solid #FFD800 !important; box-shadow: 0 8px 22px rgba(212, 175, 55, 0.22) !important; } body.page-id-4368 .elementor-element-6544c9c3 .step-num, body.page-id-4368 [data-id="6544c9c3"] .step-num { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #000000 !important; box-shadow: 0 4px 12px rgba(255, 216, 0, 0.4) !important; } body.page-id-4368 .elementor-element-6544c9c3 .step-text, body.page-id-4368 [data-id="6544c9c3"] .step-text { color: #78350F !important; font-weight: 700 !important; } /* شريط الإجراء السفلي للخطوات الـ 10 (الكونتينر b313bff) */ body.page-id-4368 .elementor-element.elementor-element-b313bff, body.page-id-4368 [data-id="b313bff"] { width: 100% !important; flex: 0 0 100% !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; border: 1px solid rgba(212, 175, 55, 0.3) !important; border-right: 5px solid #D4AF37 !important; border-radius: 20px !important; padding: 26px 36px !important; margin-top: 24px !important; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08) !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-b313bff .intishar-callout-text { color: #F8FAFC !important; font-size: 16px !important; line-height: 1.8 !important; margin: 0 !important; } body.page-id-4368 .elementor-element.elementor-element-b313bff .intishar-callout-text strong { color: #FFD800 !important; } /* ========================================================================== 3. الصورة الثالثة: إمكانيات ومراحل تصميم الموقع الـ 5 ========================================================================== */ body.page-id-4368 .elementor-element.elementor-element-55315507, body.page-id-4368 [data-id="55315507"] { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 16px !important; justify-content: space-between !important; margin-top: 32px !important; margin-bottom: 24px !important; } /* ========================================================================== 3. بطاقات مراحل تصميم الموقع الـ 5 (Solid Full-Color Cards without White Gaps) Colors matching Image 2: - Card 1: #FFD800 (المساعدة في اختيار اسم النطاق المناسب - أصفر مشع) - Card 2: #3AA3AD (إعداد الاستضافة وربط الموقع - تيل بحري) - Card 3: #D4AF37 (تصميم الصفحات الأساسية للموقع - ذهب ملكي) - Card 4: #CD7F32 (تجهيز الموقع ليكون مهيأ لمحركات البحث - برونز نحاسي) - Card 5: #3AA3AD (اختبار الموقع قبل الإطلاق - تيل بحري) ========================================================================== */ /* القاعدة المشتركة للبطاقات الـ 5: إزالة أي خلفية بيضاء أو إطار أبيض خارجي */ body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con, body.page-id-4368 [data-id="55315507"] > .e-con, body.page-id-4368 .elementor-element-4ead9ba3, body.page-id-4368 .elementor-element-5ae91faa, body.page-id-4368 .elementor-element-331348a6, body.page-id-4368 .elementor-element-5095064, body.page-id-4368 .elementor-element-73201136 { flex: 1 1 0 !important; width: 0 !important; border: none !important; border-radius: 18px !important; padding: 24px 14px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; position: relative !important; overflow: hidden !important; } /* تلوين خلفية كل بطاقة بلونها المميز بالكامل */ /* 1. المساعدة في اختيار اسم النطاق المناسب (الأصفر المشع) */ body.page-id-4368 .elementor-element-4ead9ba3, body.page-id-4368 [data-id="4ead9ba3"], body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:nth-child(1) { background: #FFD800 !important; } /* 2. إعداد الاستضافة وربط الموقع (تيل بحري فاخر) */ body.page-id-4368 .elementor-element-5ae91faa, body.page-id-4368 [data-id="5ae91faa"], body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:nth-child(2) { background: #3AA3AD !important; } /* 3. تصميم الصفحات الأساسية للموقع (الذهب الملكي) */ body.page-id-4368 .elementor-element-331348a6, body.page-id-4368 [data-id="331348a6"], body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:nth-child(3) { background: #D4AF37 !important; } /* 4. تجهيز الموقع ليكون مهيأ لمحركات البحث (البرونز النحاسي الفاخر) */ body.page-id-4368 .elementor-element-5095064, body.page-id-4368 [data-id="5095064"], body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:nth-child(4) { background: #CD7F32 !important; } /* 5. اختبار الموقع قبل الإطلاق (تيل بحري فاخر) */ body.page-id-4368 .elementor-element-73201136, body.page-id-4368 [data-id="73201136"], body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:nth-child(5) { background: #3AA3AD !important; } /* تفريغ وتجريد الودجتس الداخلية من أي خلفيات أو حواف مكررة */ body.page-id-4368 .elementor-element.elementor-element-55315507 .elementor-widget-text-editor, body.page-id-4368 .elementor-element.elementor-element-55315507 .elementor-widget, body.page-id-4368 .elementor-element-624770f8, body.page-id-4368 .elementor-element-753eb386, body.page-id-4368 .elementor-element-4d65b080, body.page-id-4368 .elementor-element-4624dfed, body.page-id-4368 .elementor-element-2f5d8094, body.page-id-4368 .elementor-element.elementor-element-55315507 .cap-inner { background: transparent !important; background-color: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; width: 100% !important; } /* تأثير التمرير (Hover) على البطاقات */ body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:hover, body.page-id-4368 [data-id="55315507"] > .e-con:hover { transform: translateY(-8px) scale(1.02) !important; box-shadow: 0 16px 36px rgba(0, 0, 0, 0.15) !important; } /* بنية محتوى الكرت */ body.page-id-4368 .cap-inner { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 14px !important; width: 100% !important; } /* دائرة الأيقونة: قرص أبيض ناصع يبرز الأيقونة */ body.page-id-4368 .cap-icon { font-size: 28px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 60px !important; height: 60px !important; border-radius: 50% !important; background: #FFFFFF !important; border: none !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important; transition: all 0.3s ease !important; flex-shrink: 0 !important; } body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con:hover .cap-icon, body.page-id-4368 [data-id="55315507"] > .e-con:hover .cap-icon { transform: scale(1.1) !important; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18) !important; } /* عنوان نص المرحلة: داكن عريض وواضح للغاية */ body.page-id-4368 .cap-inner p { font-size: 15.5px !important; font-weight: 800 !important; color: #0F172A !important; margin: 0 !important; line-height: 1.5 !important; text-align: center !important; } /* شريط الإجراء السفلي للمراحل الـ 5 (الكونتينر 46f11f99) */ body.page-id-4368 .elementor-element.elementor-element-46f11f99, body.page-id-4368 [data-id="46f11f99"] { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; background: #F8FAFC !important; border: 1.5px solid #E2E8F0 !important; border-right: 5px solid #CD7F32 !important; border-radius: 20px !important; padding: 26px 36px !important; margin-top: 24px !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.02) !important; box-sizing: border-box !important; } body.page-id-4368 .elementor-element.elementor-element-46f11f99 .intishar-callout-text { color: #334155 !important; font-size: 15.5px !important; line-height: 1.8 !important; margin: 0 !important; } /* ========================================================================== 📝 قسم الفورم والتواصل (Luxury Contact Form & Right Column) ========================================================================== */ body.page-id-4368 .elementor-element.elementor-element-1c913343::before, body.page-id-4368 [data-id="1c913343"]::before { content: '' !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 5px !important; background: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%) !important; } body.page-id-4368 .elementor-element-4a06c93b .elementor-heading-title { font-size: 25px !important; font-weight: 800 !important; color: #0F172A !important; margin-bottom: 6px !important; text-align: right !important; } body.page-id-4368 .form-sub-hint { font-size: 15px !important; color: #64748B !important; line-height: 1.6 !important; margin-bottom: 22px !important; text-align: right !important; } body.page-id-4368 .forminator-ui.forminator-custom-form { direction: rtl !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-row { margin-bottom: 18px !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-label { font-size: 15px !important; font-weight: 700 !important; color: #0F172A !important; margin-bottom: 8px !important; display: block !important; text-align: right !important; letter-spacing: normal !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-input, body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-textarea { background-color: #F8FAFC !important; border: 1.5px solid #E2E8F0 !important; border-radius: 12px !important; padding: 14px 18px !important; font-size: 15px !important; color: #0F172A !important; box-shadow: none !important; transition: all 0.25s ease !important; width: 100% !important; box-sizing: border-box !important; direction: rtl !important; text-align: right !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-input:focus, body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-textarea:focus { background-color: #FFFFFF !important; border-color: #D4AF37 !important; box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.18) !important; outline: none !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-textarea { min-height: 115px !important; resize: vertical !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-description { font-size: 12.5px !important; color: #94A3B8 !important; text-align: left !important; margin-top: 5px !important; display: block !important; } /* زر إرسال الفورم الذهبي الفاخر الممتد */ body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-button-submit { width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #000000 !important; font-size: 18px !important; font-weight: 800 !important; font-family: 'Cairo', 'Segoe UI', sans-serif !important; border: none !important; border-radius: 14px !important; padding: 16px 24px !important; cursor: pointer !important; box-shadow: 0 10px 25px rgba(212, 175, 55, 0.35) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; margin-top: 10px !important; letter-spacing: normal !important; } body.page-id-4368 .forminator-ui.forminator-custom-form .forminator-button-submit:hover { background: linear-gradient(135deg, #FFE033 0%, #CD7F32 100%) !important; transform: translateY(-2px) !important; box-shadow: 0 14px 32px rgba(205, 127, 50, 0.45) !important; color: #000000 !important; } /* زر استشارة مجانية بجوار الفورم */ body.page-id-4368 .elementor-element.elementor-element-35dceac3 a.elementor-button, body.page-id-4368 [data-id="35dceac3"] a.elementor-button, body.page-id-4368 .intishar-btn-whatsapp-luxury a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #000000 !important; font-size: 16px !important; font-weight: 800 !important; border-radius: 9999px !important; padding: 16px 36px !important; border: none !important; box-shadow: 0 10px 25px rgba(212, 175, 55, 0.35) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; text-decoration: none !important; white-space: nowrap !important; } body.page-id-4368 .elementor-element.elementor-element-35dceac3 a.elementor-button:hover, body.page-id-4368 [data-id="35dceac3"] a.elementor-button:hover, body.page-id-4368 .intishar-btn-whatsapp-luxury a.elementor-button:hover { transform: translateY(-3px) scale(1.03) !important; box-shadow: 0 14px 32px rgba(205, 127, 50, 0.45) !important; background: linear-gradient(135deg, #FFE033 0%, #CD7F32 100%) !important; color: #000000 !important; } /* ========================================================================== 4. الأزرار الذهبية الفاخرة العامة (All Gold Luxury Buttons) ========================================================================== */ body.page-id-4368 .intishar-btn-gold-luxury a.elementor-button, body.page-id-4368 .elementor-element-701051f6 a.elementor-button, body.page-id-4368 .elementor-element-97ce12 a.elementor-button, body.page-id-4368 .elementor-element-78677c01 a.elementor-button, body.page-id-4368 .elementor-element-14b62e8c a.elementor-button, body.page-id-4368 .elementor-element-20f10ee7 a.elementor-button, body.page-id-4368 .elementor-element-412b86b9 a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #000000 !important; font-size: 16px !important; font-weight: 800 !important; border-radius: 9999px !important; padding: 16px 36px !important; border: none !important; box-shadow: 0 10px 25px rgba(212, 175, 55, 0.35) !important; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; text-decoration: none !important; white-space: nowrap !important; flex-shrink: 0 !important; } body.page-id-4368 .intishar-btn-gold-luxury a.elementor-button:hover, body.page-id-4368 .elementor-element-701051f6 a.elementor-button:hover, body.page-id-4368 .elementor-element-97ce12 a.elementor-button:hover, body.page-id-4368 .elementor-element-78677c01 a.elementor-button:hover, body.page-id-4368 .elementor-element-14b62e8c a.elementor-button:hover, body.page-id-4368 .elementor-element-20f10ee7 a.elementor-button:hover, body.page-id-4368 .elementor-element-412b86b9 a.elementor-button:hover { transform: translateY(-3px) scale(1.03) !important; box-shadow: 0 14px 32px rgba(205, 127, 50, 0.45) !important; background: linear-gradient(135deg, #FFE033 0%, #CD7F32 100%) !important; color: #000000 !important; } /* ========================================================================== 5. التجاوب مع شاشات الموبايل والتابلت (Mobile & Tablet Responsive) ========================================================================== */ @media (max-width: 1024px) { body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con, body.page-id-4368 [data-id="3fb216db"] > .e-con { width: calc(50% - 12px) !important; flex: 0 0 calc(50% - 12px) !important; } body.page-id-4368 .elementor-element.elementor-element-55315507, body.page-id-4368 [data-id="55315507"] { flex-wrap: wrap !important; } body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con, body.page-id-4368 [data-id="55315507"] > .e-con { flex: 0 0 calc(33.333% - 11px) !important; width: calc(33.333% - 11px) !important; margin-bottom: 12px !important; } } @media (max-width: 767px) { body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-2eb8124 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4fc009fc p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4f01d2a4 p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-1ed47c1a p.intishar-para:nth-of-type(2), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(1), body.page-id-4368 .elementor-element-4ae3c947 p.intishar-para:nth-of-type(2) { padding: 20px 18px !important; font-size: 15.5px !important; } body.page-id-4368 .elementor-element.elementor-element-6d720b8d, body.page-id-4368 [data-id="6d720b8d"], body.page-id-4368 .elementor-element.elementor-element-2a33d856, body.page-id-4368 [data-id="2a33d856"], body.page-id-4368 .elementor-element.elementor-element-bbedf0a, body.page-id-4368 [data-id="bbedf0a"] { padding-top: 50px !important; padding-bottom: 50px !important; } body.page-id-4368 .elementor-element.elementor-element-3fb216db > .e-con, body.page-id-4368 [data-id="3fb216db"] > .e-con { width: 100% !important; flex: 0 0 100% !important; padding: 24px 20px !important; } body.page-id-4368 .elementor-element.elementor-element-17c0e82e > .e-con, body.page-id-4368 [data-id="17c0e82e"] > .e-con { width: 100% !important; flex: 0 0 100% !important; padding: 16px 18px !important; } body.page-id-4368 .elementor-element.elementor-element-55315507, body.page-id-4368 [data-id="55315507"] { flex-direction: column !important; flex-wrap: nowrap !important; } body.page-id-4368 .elementor-element.elementor-element-55315507 > .e-con, body.page-id-4368 [data-id="55315507"] > .e-con { width: 100% !important; flex: 0 0 100% !important; margin-bottom: 12px !important; } body.page-id-4368 .elementor-element.elementor-element-1c913343, body.page-id-4368 [data-id="1c913343"] { padding: 26px 20px !important; margin-top: 24px !important; } body.page-id-4368 .elementor-element.elementor-element-46055352, body.page-id-4368 [data-id="46055352"], body.page-id-4368 .elementor-element.elementor-element-b313bff, body.page-id-4368 [data-id="b313bff"], body.page-id-4368 .elementor-element.elementor-element-46f11f99, body.page-id-4368 [data-id="46f11f99"] { flex-direction: column !important; text-align: center !important; gap: 18px !important; padding: 24px 20px !important; } body.page-id-4368 .intishar-btn-gold-luxury a.elementor-button, body.page-id-4368 .elementor-element-701051f6 a.elementor-button, body.page-id-4368 .elementor-element-155a6a1 a.elementor-button, body.page-id-4368 .elementor-element-97ce12 a.elementor-button, body.page-id-4368 .elementor-element-78677c01 a.elementor-button, body.page-id-4368 .elementor-element-14b62e8c a.elementor-button, body.page-id-4368 .elementor-element-20f10ee7 a.elementor-button, body.page-id-4368 .elementor-element-412b86b9 a.elementor-button, body.page-id-4368 .elementor-element-35dceac3 a.elementor-button { width: 100% !important; } } body.page-id-4368 .elementor-element.elementor-element-bbedf0a, body.page-id-4368 [data-id="bbedf0a"] { align-items: center !important; } body.page-id-4368 .elementor-element.elementor-element-6fb9a5c8, body.page-id-4368 [data-id="6fb9a5c8"] { display: flex !important; flex-direction: column !important; justify-content: center !important; padding-left: 20px !important; } body.page-id-4368 .elementor-element-cbd02a0 .elementor-heading-title { margin-bottom: 12px !important; } /* ========================================================================== ⭐ INTISHAR 360° - قسم سابقة الأعمال الفاخر (PORTFOLIO SHOWCASE SECTION) الالتزام بالهوية المعدنية: #FFD800, #D4AF37, #CD7F32, #A7AEB5 ========================================================================== */ body.page-id-4368 .intishar-portfolio-section { font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; padding: 85px 20px !important; background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 50%, #F8FAFC 100%) !important; position: relative !important; border-top: 1px solid #E2E8F0 !important; border-bottom: 1px solid #E2E8F0 !important; } body.page-id-4368 .portfolio-badge { background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(205, 127, 50, 0.15) 100%) !important; color: #B45309; border: 1px solid rgba(212, 175, 55, 0.4) !important;} body.page-id-4368 .filter-btn.active { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF; border-color: #D4AF37 !important; box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18), 0 0 0 2px rgba(212, 175, 55, 0.3) !important;} body.page-id-4368 .portfolio-card:hover { transform: translateY(-8px) !important; border-color: #D4AF37 !important; box-shadow: 0 20px 40px rgba(15, 23, 42, 0.09), 0 0 25px rgba(212, 175, 55, 0.18) !important; } body.page-id-4368 .visit-btn:hover { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #0F172A !important; border-color: #FFD800 !important; box-shadow: 0 4px 15px rgba(212, 175, 55, 0.35) !important; } /* ========================================================================== ⭐ HERO SECTION - LUXURY TRUST BADGE & BALANCED H1 (PROPOSAL 1) Colors: #FFD800, #D4AF37, #CD7F32, #A7AEB5, #0F172A, #FFFFFF ========================================================================== */ /* 1. الشارة الملكية المعتمدة — تثبيت فوق H1 يمين الهيرو */ /* الهيرو inner = containing block للبادج */ body.page-id-4368 .elementor-element.elementor-element-3f280698 > .e-con-inner { position: relative !important; } /* عمود الصورة: static حتى لا يكون containing block للبادج الـ absolute */ body.page-id-4368 .elementor-element.elementor-element-69def794 { position: static !important; } /* البادج: absolute relative للـ hero .e-con-inner right:0 = حافة يمين الـ inner = فوق عمود النص تماماً hero inner: x=150 → x=1290 ، عمود النص: x=697 → x=1290 right:0 ينقل البادج لـ x=1290-350=940 ≈ أعلى يمين عمود النص ✅ */ body.page-id-4368 .elementor-element-668fe2d6, body.page-id-4368 .intishar-pill-badge { position: absolute !important; top: 0 !important; right: 0 !important; left: auto !important; z-index: 10 !important; margin: 0 !important; width: auto !important; } /* عمود النص: مسافة علوية تعوض البادج الـ absolute */ body.page-id-4368 .elementor-element.elementor-element-586bf8b5 { padding-top: 55px !important; } body.page-id-4368 .elementor-element-668fe2d6 .elementor-heading-title, body.page-id-4368 .intishar-pill-badge .elementor-heading-title { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: linear-gradient(135deg, rgba(254, 243, 199, 0.85) 0%, #FFFFFF 100%) !important; border: 1px solid #D4AF37 !important; padding: 7px 18px !important; border-radius: 50px !important; font-size: 14px !important; font-weight: 700 !important; color: #0F172A !important; box-shadow: 0 4px 14px rgba(212, 175, 55, 0.18), 0 1px 3px rgba(15, 23, 42, 0.05) !important; backdrop-filter: blur(8px) !important; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; cursor: default !important; } body.page-id-4368 .elementor-element-668fe2d6 .elementor-heading-title:hover, body.page-id-4368 .intishar-pill-badge .elementor-heading-title:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 22px rgba(212, 175, 55, 0.28) !important; border-color: #FFD800 !important; } body.page-id-4368 .elementor-element-668fe2d6 .badge-gold-star, body.page-id-4368 .intishar-pill-badge .badge-gold-star { color: #FFD800 !important; text-shadow: 0 0 8px rgba(255, 216, 0, 0.9) !important; font-size: 15px !important; display: inline-block !important; } body.page-id-4368 .elementor-element-668fe2d6 .badge-sep, body.page-id-4368 .intishar-pill-badge .badge-sep { color: #A7AEB5 !important; font-size: 12px !important; margin: 0 3px !important; } body.page-id-4368 .elementor-element-668fe2d6 .badge-check-icon, body.page-id-4368 .intishar-pill-badge .badge-check-icon { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #0F172A !important; width: 18px !important; height: 18px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 11px !important; font-weight: 900 !important; margin-right: 4px !important; box-shadow: 0 2px 6px rgba(212, 175, 55, 0.4) !important; } /* 2. العنوان الرئيسي في الهيرو بتصميم البادج الفاخر المطابق للصورة */ body.page-id-4368 .elementor-element-2ab5ad00, body.page-id-4368 .intishar-hero-title { margin-bottom: 20px !important; } body.page-id-4368 .elementor-element-2ab5ad00 h1.elementor-heading-title, body.page-id-4368 .intishar-hero-title h1.elementor-heading-title, body.page-id-4368 h1.elementor-heading-title { display: inline-flex !important; align-items: center !important; background: #F8FAFC !important; border: 1px solid #E2E8F0 !important; border-right: 5px solid #D4AF37 !important; border-radius: 14px !important; padding: 10px 22px !important; font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; font-size: clamp(18px, 1.8vw, 23px) !important; font-weight: 800 !important; color: #0F172A !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.02) !important; margin: 0 0 20px 0 !important; line-height: 1.45 !important; width: fit-content !important; max-width: 100% !important; white-space: nowrap !important; box-sizing: border-box !important; text-shadow: none !important; letter-spacing: normal !important; transition: all 0.3s ease !important; } body.page-id-4368 .elementor-element-2ab5ad00 h1.elementor-heading-title:hover, body.page-id-4368 .intishar-hero-title h1.elementor-heading-title:hover, body.page-id-4368 h1.elementor-heading-title:hover { border-color: #CBD5E1 !important; border-right-color: #FFD800 !important; box-shadow: 0 6px 18px rgba(212, 175, 55, 0.1) !important; } body.page-id-4368 h1 .intishar-gold-highlight { color: #0F172A !important; -webkit-text-fill-color: #0F172A !important; background: none !important; filter: none !important; font-weight: 800 !important; display: inline !important; } body.page-id-4368 h1 .intishar-gold-highlight::after { display: none !important; content: none !important; width: 0 !important; height: 0 !important; } /* ========================================================================== ✨ INTISHAR 360° - LUXURY DARK GLASSMORPHISM CTA & FORM SECTION Colors: #FFD800, #D4AF37, #CD7F32, #A7AEB5, #0F172A, #FFFFFF ========================================================================== */ /* ========================================================================== ✨ INTISHAR 360° - LUXURY PILL-BADGE H2 HEADINGS (EXACT MATCH FOR IMAGE 1) Light clean background, subtle border, curved royal gold right border strip. ========================================================================== */ body.page-id-4368 h2.elementor-heading-title, body.page-id-4368 .intishar-section-title h2, body.page-id-4368 .intishar-section-title .elementor-heading-title, body.page-id-4368 .faq-header h2, body.page-id-4368 .intishar-luxury-h2, body.page-id-4368 .elementor-element-cbd02a0 h2.elementor-heading-title, body.page-id-4368 h2.elementor-heading-title { display: inline-flex !important; align-items: center !important; background: #F8FAFC !important; border: 1px solid #E2E8F0 !important; border-right: 5px solid #D4AF37 !important; /* الخط الذهبي المقوس على اليمين */ border-radius: 14px !important; padding: 12px 24px !important; font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; font-size: clamp(20px, 2.6vw, 27px) !important; font-weight: 800 !important; color: #0F172A !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.02) !important; margin-bottom: 22px !important; line-height: 1.45 !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; text-shadow: none !important; letter-spacing: normal !important; transition: all 0.3s ease !important; } /* تأثير التمرير الخفيف على عناوين H2 */ body.page-id-4368 h2.elementor-heading-title:hover, body.page-id-4368 .intishar-section-title h2:hover { border-color: #CBD5E1 !important; border-right-color: #FFD800 !important; box-shadow: 0 6px 18px rgba(212, 175, 55, 0.1) !important; } /* توسيط عناوين الأقسام المركزية (الأسئلة الشائعة والقسم المركزي) */ .page-id-4368 .faq-header, .page-id-4368 .elementor-element-3998775 { display: flex !important; justify-content: center !important; width: 100% !important; text-align: center !important; } .page-id-4368 .faq-header h2, body.page-id-4368 .elementor-element-3998775 h2.elementor-heading-title { margin-left: auto !important; margin-right: auto !important; justify-content: center !important; text-align: center !important; } /* ========================================================================== ✨ INTISHAR 360° - LUXURY PORTFOLIO SECTION REFINEMENT ========================================================================== */ .page-id-4368 .portfolio-header { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; gap: 14px !important; margin-bottom: 42px !important; width: 100% !important; position: relative !important; z-index: 2 !important; } /* 1. Top Mini Badge (سابقة أعمالنا الاستثنائية) */ .page-id-4368 .portfolio-header .portfolio-badge { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; background: linear-gradient(135deg, rgba(255, 216, 0, 0.14) 0%, rgba(212, 175, 55, 0.18) 100%) !important; color: #B45309; border: 1px solid rgba(212, 175, 55, 0.4) !important; padding: 7px 20px !important; border-radius: 50px !important; font-family: 'Cairo', sans-serif !important; font-size: 13.5px; font-weight: 700; letter-spacing: 0.3px !important; margin: 0 auto !important; box-shadow: 0 2px 10px rgba(212, 175, 55, 0.12) !important; transition: all 0.3s ease !important;} .page-id-4368 .portfolio-header .portfolio-badge:hover { background: linear-gradient(135deg, rgba(255, 216, 0, 0.22) 0%, rgba(212, 175, 55, 0.28) 100%) !important; box-shadow: 0 4px 14px rgba(212, 175, 55, 0.2) !important; transform: translateY(-1px) !important; } .page-id-4368 .portfolio-header .portfolio-badge .badge-star { color: #FFD800; text-shadow: 0 0 8px rgba(255, 216, 0, 0.7) !important; font-size: 13px;} /* 2. Main Title H2 (مشاريع ووردبريس ومتاجر صُنعت لتتصدر وتلهم) */ body.page-id-4368 .portfolio-header h2.portfolio-title, body.page-id-4368 .portfolio-header h2 { display: inline-block !important; text-align: center !important; background: #F8FAFC !important; border: 1px solid #E2E8F0 !important; border-right: 5px solid #D4AF37 !important; border-radius: 14px !important; padding: 12px 28px !important; font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; font-size: clamp(22px, 2.6vw, 29px); font-weight: 800; color: #0F172A; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03) !important; margin: 2px auto 0 !important; line-height: 1.45; width: fit-content !important; max-width: 96% !important; white-space: nowrap !important; box-sizing: border-box !important; text-shadow: none !important; transition: all 0.3s ease !important;} body.page-id-4368 .portfolio-header h2.portfolio-title:hover { border-color: #CBD5E1 !important; border-right-color: #FFD800 !important; box-shadow: 0 6px 18px rgba(212, 175, 55, 0.12) !important; } body.page-id-4368 .portfolio-header h2 * { display: inline !important; white-space: inherit !important; } /* Space for highlight */ body.page-id-4368 .portfolio-header h2 .intishar-gold-highlight { margin-right: 6px !important; } /* 3. Subtitle Description */ .page-id-4368 .portfolio-header .portfolio-subtitle { font-family: 'Cairo', sans-serif !important; font-size: 15.5px; font-weight: 500; color: #64748B; line-height: 1.75; max-width: 680px !important; margin: 0 auto !important; text-align: center !important;} /* 4. Filter Buttons Luxury Polish */ .page-id-4368 .portfolio-filters { display: flex !important; justify-content: center !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap !important; margin-bottom: 40px !important; } .page-id-4368 .portfolio-filters .filter-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 22px !important; border-radius: 50px !important; font-family: 'Cairo', sans-serif !important; font-size: 14.5px; font-weight: 700; background: #FFFFFF !important; color: #475569; border: 1px solid #E2E8F0 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;} .page-id-4368 .portfolio-filters .filter-btn:hover { color: #0F172A !important; border-color: #CBD5E1 !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important; } .page-id-4368 .portfolio-filters .filter-btn.active { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF; border-color: #0F172A !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18) !important;} .page-id-4368 .portfolio-filters .filter-btn.active .filter-dot { background: #FFD800 !important; box-shadow: 0 0 8px rgba(255, 216, 0, 0.8) !important; } .page-id-4368 .portfolio-filters .filter-btn.active .filter-count { color: #FFD800;} /* 5. Portfolio Cards Refined Hover & Borders */ .page-id-4368 .portfolio-card { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease !important; } .page-id-4368 .portfolio-card:hover { transform: translateY(-6px) !important; } .page-id-4368 .portfolio-card .card-inner { border: 1px solid #E2E8F0 !important; border-radius: 18px !important; transition: all 0.3s ease !important; overflow: hidden !important; background: #FFFFFF !important; } .page-id-4368 .portfolio-card:hover .card-inner { border-color: rgba(212, 175, 55, 0.45) !important; box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08), 0 0 15px rgba(212, 175, 55, 0.12) !important; } /* توحيد نصوص العناوين باللون الداكن الفخم وإلغاء أي خط سفلي مكرر */ .page-id-4368 .intishar-h2-base { color: #0F172A !important; font-weight: 800 !important; } body.page-id-4368 h2 .intishar-gold-highlight { color: #0F172A !important; -webkit-text-fill-color: #0F172A !important; background: none !important; filter: none !important; font-weight: 800 !important; display: inline !important; } body.page-id-4368 h2 .intishar-gold-highlight::after, body.page-id-4368 h2 .brand-accent-line, body.page-id-4368 h2::after { display: none !important; content: none !important; width: 0 !important; height: 0 !important; } /* Hide old redundant static underline bars with highest specificity */ body.page-id-4368 .portfolio-title::after, body.page-id-4368 .portfolio-header h2::after, body.page-id-4368 .faq-main-title::after, body.page-id-4368 .faq-header h2::after, body.page-id-4368 .intishar-section-title h2::after, body.page-id-4368 h2.elementor-heading-title::after { display: none !important; content: none !important; width: 0 !important; height: 0 !important; border: none !important; } @media (max-width: 768px) { body.page-id-4368 .elementor-element-2ab5ad00 h1.elementor-heading-title, body.page-id-4368 .intishar-hero-title h1.elementor-heading-title, body.page-id-4368 h1.elementor-heading-title { font-size: 19px ; padding: 8px 16px !important; white-space: nowrap !important; margin: 0 auto 16px !important; display: inline-flex !important; justify-content: center !important; } /* Portfolio Header Mobile */ .page-id-4368 .portfolio-header { gap: 10px !important; margin-bottom: 30px !important; padding: 0 10px !important; } .page-id-4368 .portfolio-header .portfolio-badge { font-size: 12.5px; padding: 6px 15px !important;} body.page-id-4368 .portfolio-header h2.portfolio-title, body.page-id-4368 .portfolio-header h2 { font-size: 18.5px; padding: 12px 18px !important; white-space: normal !important; line-height: 1.5; text-align: center !important; width: fit-content !important; margin: 0 auto !important;} .page-id-4368 .portfolio-header .portfolio-subtitle { font-size: 13.5px; line-height: 1.65;} body.page-id-4368 h2.elementor-heading-title, body.page-id-4368 .intishar-section-title h2, body.page-id-4368 .intishar-section-title .elementor-heading-title, body.page-id-4368 .faq-header h2, body.page-id-4368 .intishar-luxury-h2, body.page-id-4368 .elementor-element-cbd02a0 h2.elementor-heading-title, body.page-id-4368 h2.elementor-heading-title { font-size: 19px !important; padding: 10px 18px !important; margin-left: auto !important; margin-right: auto !important; } } @media (max-width: 360px) { body.page-id-4368 .elementor-element-2ab5ad00 h1.elementor-heading-title, body.page-id-4368 .intishar-hero-title h1.elementor-heading-title, body.page-id-4368 h1.elementor-heading-title { font-size: 13.5px !important; padding: 6px 12px !important; } } /* ========================================================================== ✨ INTISHAR 360° - LUXURY LIGHT ROYAL CTA & FORM SECTION Colors: #FFD800, #D4AF37, #CD7F32, #A7AEB5, #0F172A, #FFFFFF ========================================================================== */ /* 1. Master Section Framing (Light Luxury Background) */ body.page-id-4368 .elementor-element.elementor-element-bbedf0a { background: radial-gradient(circle at 90% 15%, rgba(212, 175, 55, 0.07) 0%, transparent 45%), radial-gradient(circle at 10% 85%, rgba(205, 127, 50, 0.06) 0%, transparent 45%), linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 50%, #F8FAFC 100%) !important; padding: 85px 20px !important; position: relative !important; border-top: 1px solid rgba(212, 175, 55, 0.2) !important; border-bottom: 1px solid rgba(212, 175, 55, 0.2) !important; } /* 2. Right Column - Benefits & WhatsApp */ body.page-id-4368 .elementor-element-cbd02a0 h2.elementor-heading-title { color: #0F172A !important; font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; font-size: clamp(28px, 3.8vw, 40px) !important; font-weight: 900 !important; line-height: 1.35 !important; margin-bottom: 22px !important; text-shadow: none !important; } /* Benefit Cards */ .page-id-4368 .intishar-cta-benefits { display: flex; flex-direction: column; gap: 15px; margin: 20px 0 28px 0; } .page-id-4368 .benefit-item { display: flex; align-items: flex-start; gap: 15px; background: #FFFFFF !important; border: 1px solid rgba(212, 175, 55, 0.25) !important; border-radius: 14px; padding: 16px 20px; transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: 0 4px 15px rgba(15, 23, 42, 0.04) !important; } .page-id-4368 .benefit-item:hover { background: #FFFDF8 !important; border-color: #D4AF37 !important; transform: translateX(-4px); box-shadow: 0 8px 22px rgba(212, 175, 55, 0.16) !important; } .page-id-4368 .benefit-icon-wrap { width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, rgba(255, 216, 0, 0.18) 0%, rgba(212, 175, 55, 0.08) 100%) !important; border: 1px solid rgba(212, 175, 55, 0.38) !important; display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(212, 175, 55, 0.15); } .page-id-4368 .benefit-body { flex: 1; } .page-id-4368 .benefit-title { color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 16px !important; font-weight: 800 !important; margin: 0 0 4px 0 !important; } .page-id-4368 .benefit-desc { color: #475569 !important; font-family: 'Cairo', sans-serif !important; font-size: 13.5px !important; line-height: 1.6 !important; margin: 0 !important; } /* Secondary CTA Button (WhatsApp Direct) */ body.page-id-4368 .elementor-element-35dceac3 .elementor-button { background: linear-gradient(135deg, #25D366 0%, #1EBE5D 100%) !important; border: none !important; color: #FFFFFF !important; font-family: 'Cairo', sans-serif !important; font-weight: 800 !important; font-size: 15px !important; padding: 14px 28px !important; border-radius: 50px !important; box-shadow: 0 6px 20px rgba(37, 211, 102, 0.35) !important; transition: all 0.3s ease !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; text-decoration: none !important; } body.page-id-4368 .elementor-element-35dceac3 .elementor-button:hover { background: linear-gradient(135deg, #1EBE5D 0%, #189E4C 100%) !important; color: #FFFFFF !important; box-shadow: 0 8px 25px rgba(37, 211, 102, 0.5) !important; transform: translateY(-2px) !important; } /* 3. Left Column - Luxury Light Royal Form Card */ body.page-id-4368 .elementor-element.elementor-element-1c913343, body.page-id-4368 [data-id="1c913343"] { background: #FFFFFF !important; border: 1.5px solid rgba(212, 175, 55, 0.35) !important; border-radius: 24px !important; padding: 40px 34px 34px !important; box-shadow: 0 25px 60px -15px rgba(15, 23, 42, 0.08), 0 2px 14px rgba(212, 175, 55, 0.12) !important; position: relative !important; overflow: hidden !important; } body.page-id-4368 .elementor-element.elementor-element-1c913343::before { content: '' !important; position: absolute !important; top: 0; left: 0; right: 0; height: 4px !important; background: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%) !important; } /* Card Header */ body.page-id-4368 .elementor-element-4a06c93b .elementor-heading-title { color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 24px !important; font-weight: 900 !important; text-align: center !important; margin-bottom: 8px !important; letter-spacing: -0.01em !important; } body.page-id-4368 .elementor-element-637e8a65 p, body.page-id-4368 .elementor-element-637e8a65 .form-sub-hint { color: #64748B !important; font-family: 'Cairo', sans-serif !important; font-size: 14px !important; text-align: center !important; margin-bottom: 22px !important; line-height: 1.6 !important; } /* Forminator Form Styling - Clean High-Contrast Light Inputs */ body.page-id-4368 .forminator-custom-form-2771 .forminator-label { color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 14px !important; font-weight: 800 !important; margin-bottom: 8px !important; display: block !important; } body.page-id-4368 .forminator-custom-form-2771 .forminator-input, body.page-id-4368 .forminator-custom-form-2771 .forminator-textarea { background: #F8FAFC !important; border: 1.5px solid #E2E8F0 !important; border-radius: 12px !important; color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 15px !important; padding: 13px 16px !important; transition: all 0.25s ease !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important; } body.page-id-4368 .forminator-custom-form-2771 .forminator-input:focus, body.page-id-4368 .forminator-custom-form-2771 .forminator-textarea:focus { background: #FFFFFF !important; border-color: #D4AF37 !important; box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.22) !important; outline: none !important; color: #0F172A !important; } body.page-id-4368 .forminator-custom-form-2771 .forminator-input::placeholder, body.page-id-4368 .forminator-custom-form-2771 .forminator-textarea::placeholder { color: #94A3B8 !important; } /* Submit Button */ body.page-id-4368 .forminator-custom-form-2771 .forminator-button-submit { width: 100% !important; background: linear-gradient(135deg, #FFD800 0%, #D4AF37 50%, #CD7F32 100%) !important; color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 17px !important; font-weight: 900 !important; border: none !important; border-radius: 50px !important; padding: 15px 24px !important; box-shadow: 0 6px 20px rgba(212, 175, 55, 0.35) !important; cursor: pointer !important; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; margin-top: 12px !important; } body.page-id-4368 .forminator-custom-form-2771 .forminator-button-submit:hover { transform: translateY(-2px) !important; box-shadow: 0 10px 28px rgba(212, 175, 55, 0.5) !important; filter: brightness(1.05) !important; } /* Security footer text */ body.page-id-4368 .elementor-element-bbedf0a .elementor-widget-text-editor p, body.page-id-4368 .elementor-element-1c913343 .elementor-widget-text-editor p { color: #64748B !important; text-align: center !important; font-size: 13px !important; margin-top: 12px !important; } @media (max-width: 768px) { body.page-id-4368 .elementor-element.elementor-element-bbedf0a { padding: 60px 15px !important; } body.page-id-4368 .elementor-element.elementor-element-1c913343 { padding: 28px 20px !important; } .page-id-4368 .benefit-item { padding: 14px 15px !important; } } /* ========================================================================== HERO SECTION: LUXURY CENTERPIECE MOCKUP & FLOATING TRUST BADGES ========================================================================== */ /* ترتيب الأعمدة: النص على اليمين (order:1) والصورة على اليسار (order:2) */ body.page-id-4368 .elementor-element.elementor-element-586bf8b5 { order: 1 !important; } body.page-id-4368 .elementor-element.elementor-element-69def794 { order: 2 !important; } /* Left Column Container — Image */ body.page-id-4368 .elementor-element.elementor-element-69def794 { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; min-height: 640px !important; } /* Ambient Gold Glow behind Hero Mockup */ body.page-id-4368 .elementor-element.elementor-element-69def794::before { content: '' !important; position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: 420px !important; height: 420px !important; background: radial-gradient(circle, rgba(255, 216, 0, 0.15) 0%, rgba(212, 175, 55, 0.06) 50%, transparent 75%) !important; border-radius: 50% !important; pointer-events: none !important; z-index: 1 !important; filter: blur(40px) !important; } /* Centerpiece Mockup Image Widget */ body.page-id-4368 .elementor-element.elementor-element-9fc191a { position: relative !important; z-index: 2 !important; text-align: center !important; width: 100% !important; margin: 0 !important; } body.page-id-4368 .elementor-element.elementor-element-9fc191a img { width: 100% !important; max-width: 440px !important; height: auto !important; border-radius: 26px !important; border: 2px solid rgba(212, 175, 55, 0.45) !important; box-shadow: 0 25px 65px -15px rgba(15, 23, 42, 0.22), 0 0 35px rgba(212, 175, 55, 0.16) !important; transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease, border-color 0.4s ease !important; display: inline-block !important; } body.page-id-4368 .elementor-element.elementor-element-9fc191a img:hover { transform: translateY(-6px) scale(1.015) !important; box-shadow: 0 35px 80px -15px rgba(15, 23, 42, 0.28), 0 0 50px rgba(255, 216, 0, 0.25) !important; border-color: rgba(255, 216, 0, 0.8) !important; } /* Floating Trust Badges */ body.page-id-4368 .intishar-floating-badge { position: absolute !important; z-index: 10 !important; width: auto !important; margin: 0 !important; } body.page-id-4368 .badge-speed { top: 35px !important; right: -15px !important; } body.page-id-4368 .badge-seo { bottom: 45px !important; left: -15px !important; } body.page-id-4368 .intishar-floating-badge .elementor-heading-title { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: rgba(255, 255, 255, 0.95) !important; backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px) !important; border: 1.5px solid rgba(212, 175, 55, 0.5) !important; box-shadow: 0 16px 36px -6px rgba(15, 23, 42, 0.16), 0 0 22px rgba(212, 175, 55, 0.18) !important; padding: 11px 24px !important; border-radius: 50px !important; font-family: 'Cairo', sans-serif !important; font-size: 14.5px !important; font-weight: 800 !important; color: #0F172A !important; white-space: nowrap !important; line-height: 1.5 !important; cursor: default !important; transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important; } @keyframes floatSpeedBadge { 0% { transform: translateY(0px) rotate(0deg); } 50% { transform: translateY(-8px) rotate(0.8deg); } 100% { transform: translateY(0px) rotate(0deg); } } @keyframes floatSeoBadge { 0% { transform: translateY(0px) rotate(0deg); } 50% { transform: translateY(8px) rotate(-0.8deg); } 100% { transform: translateY(0px) rotate(0deg); } } body.page-id-4368 .badge-speed .elementor-heading-title { animation: floatSpeedBadge 4.5s ease-in-out infinite !important; border-color: rgba(255, 216, 0, 0.65) !important; } body.page-id-4368 .badge-seo .elementor-heading-title { animation: floatSeoBadge 5.2s ease-in-out infinite !important; border-color: rgba(212, 175, 55, 0.55) !important; } body.page-id-4368 .intishar-floating-badge:hover { z-index: 20 !important; } body.page-id-4368 .intishar-floating-badge .elementor-heading-title:hover { transform: translateY(-5px) scale(1.04) !important; box-shadow: 0 22px 45px -5px rgba(15, 23, 42, 0.25), 0 0 35px rgba(255, 216, 0, 0.4) !important; border-color: #FFD800 !important; background: #FFFFFF !important; } /* Mobile & Tablet Responsiveness */ @media (max-width: 768px) { body.page-id-4368 .elementor-element.elementor-element-69def794 { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 12px !important; margin-top: 30px !important; min-height: auto !important; } body.page-id-4368 .elementor-element.elementor-element-69def794::before { display: none !important; } body.page-id-4368 .badge-speed, body.page-id-4368 .badge-seo { position: static !important; width: 100% !important; max-width: 320px !important; text-align: center !important; margin: 0 !important; } body.page-id-4368 .badge-speed { order: 1 !important; } body.page-id-4368 .badge-seo { order: 2 !important; } body.page-id-4368 .elementor-element.elementor-element-9fc191a { order: 3 !important; width: 100% !important; text-align: center !important; margin-top: 10px !important; } body.page-id-4368 .intishar-floating-badge .elementor-heading-title { display: flex !important; justify-content: center !important; width: 100% !important; font-size: 13px !important; padding: 9px 16px !important; animation: none !important; } body.page-id-4368 .elementor-element.elementor-element-9fc191a img { max-width: 90% !important; border-radius: 20px !important; } } /* ========================================================================== PRO SERVICE SECTION: LUXURY ROYAL FORM CARD (.elementor-element-7f5b451a) ========================================================================== */ body.page-id-4368 .elementor-element.elementor-element-7f5b451a, body.page-id-4368 [data-id="7f5b451a"] { background: #FFFFFF !important; border: 1.5px solid rgba(212, 175, 55, 0.35) !important; border-radius: 24px !important; padding: 40px 34px 34px !important; box-shadow: 0 25px 60px -15px rgba(15, 23, 42, 0.08), 0 2px 14px rgba(212, 175, 55, 0.12) !important; position: sticky !important; top: 110px !important; align-self: flex-start !important; overflow: hidden !important; z-index: 10 !important; } body.page-id-4368 .elementor-element.elementor-element-7f5b451a::before { content: '' !important; position: absolute !important; top: 0; left: 0; right: 0; height: 4px !important; background: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%) !important; } /* Header & Sub-text */ body.page-id-4368 .elementor-element-c2d42db .elementor-heading-title { color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 24px !important; font-weight: 900 !important; text-align: center !important; margin-bottom: 8px !important; letter-spacing: -0.01em !important; } body.page-id-4368 .elementor-element-9cb3f92 p, body.page-id-4368 .elementor-element-9cb3f92 .form-sub-hint { color: #64748B !important; font-family: 'Cairo', sans-serif !important; font-size: 14px !important; text-align: center !important; margin-bottom: 22px !important; line-height: 1.6 !important; } /* Security Note */ body.page-id-4368 .elementor-element-f0f6c5f p { color: #64748B !important; text-align: center !important; font-size: 13px !important; margin-top: 12px !important; } /* Mobile Responsive */ @media (max-width: 768px) { body.page-id-4368 .elementor-element.elementor-element-7f5b451a { position: static !important; padding: 28px 20px !important; margin-top: 25px !important; width: 100% !important; } } /* ========================================================================== FAQ SECTION: NATIVE ELEMENTOR ACCORDION & HEADER (.elementor-element-a50f0dd) ========================================================================== */ /* Main FAQ Container */ body.page-id-4368 .elementor-element.elementor-element-a50f0dd { padding: 85px 20px 90px !important; background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 50%, #FFFFFF 100%) !important; position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; } /* Limit max width of FAQ contents for optimal centered readability */ body.page-id-4368 .elementor-element-a50f0dd > .e-con-inner, body.page-id-4368 .elementor-element.elementor-element-a50f0dd > div, body.page-id-4368 .elementor-element-a50f0dd .elementor-widget { max-width: 980px !important; width: 100% !important; margin-left: auto !important; margin-right: auto !important; } /* 1. FAQ Badge Widget */ body.page-id-4368 .elementor-element-ba2807f { text-align: center !important; margin-bottom: 14px !important; } body.page-id-4368 .elementor-element-ba2807f .elementor-heading-title { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: rgba(255, 216, 0, 0.1) !important; border: 1px solid rgba(212, 175, 55, 0.4) !important; color: #B45309 !important; font-family: 'Cairo', sans-serif !important; font-size: 13.5px !important; font-weight: 800 !important; padding: 7px 20px !important; border-radius: 50px !important; box-shadow: 0 2px 10px rgba(212, 175, 55, 0.12) !important; } /* 2. FAQ Main Title Widget */ body.page-id-4368 .elementor-element-3998775 { text-align: center !important; margin-bottom: 14px !important; } body.page-id-4368 .elementor-element-3998775 .elementor-heading-title { font-family: 'Cairo', sans-serif !important; font-size: clamp(28px, 4vw, 38px) !important; font-weight: 900 !important; color: #0F172A !important; text-align: center !important; letter-spacing: -0.01em !important; } /* 3. FAQ Subtitle Widget */ body.page-id-4368 .elementor-element-f9d1242 { max-width: 680px !important; margin: 0 auto 40px !important; text-align: center !important; } body.page-id-4368 .elementor-element-f9d1242 p { font-family: 'Cairo', sans-serif !important; font-size: 15.5px !important; color: #64748B !important; line-height: 1.7 !important; margin: 0 !important; text-align: center !important; } /* 4. Native Accordion Container */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion { border: none !important; display: flex !important; flex-direction: column !important; gap: 16px !important; } /* Individual Accordion Card */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-item, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-item { background: #FFFFFF !important; border: 1.5px solid rgba(212, 175, 55, 0.3) !important; border-radius: 18px !important; box-shadow: 0 4px 18px -4px rgba(15, 23, 42, 0.05), 0 1px 6px rgba(212, 175, 55, 0.06) !important; overflow: hidden !important; transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important; margin-bottom: 0 !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-item:hover, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-item:hover { border-color: rgba(212, 175, 55, 0.65) !important; box-shadow: 0 10px 28px -4px rgba(15, 23, 42, 0.08), 0 0 20px rgba(212, 175, 55, 0.15) !important; transform: translateY(-2px) !important; } /* Active Open Card */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title.elementor-active { background: #FFFFFF !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-item:has(.elementor-active), body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-item:has(.elementor-active) { border-color: #D4AF37 !important; box-shadow: 0 14px 35px -5px rgba(212, 175, 55, 0.22), 0 0 15px rgba(255, 216, 0, 0.12) !important; } /* Accordion Header / Question Button */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title { padding: 20px 26px !important; background: transparent !important; border: none !important; display: flex !important; align-items: center !important; justify-content: space-between !important; cursor: pointer !important; transition: all 0.25s ease !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-title, body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title a, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-title, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title a { font-family: 'Cairo', sans-serif !important; font-size: 16.5px !important; font-weight: 800 !important; color: #0F172A !important; text-decoration: none !important; transition: color 0.25s ease !important; flex-grow: 1 !important; text-align: right !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-title, body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title.elementor-active a, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-title, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title.elementor-active a { color: #B45309 !important; } /* Accordion Icon */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-icon, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-icon { width: 34px !important; height: 34px !important; border-radius: 50% !important; background: rgba(255, 216, 0, 0.12) !important; border: 1px solid rgba(212, 175, 55, 0.4) !important; color: #D4AF37 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 13px !important; flex-shrink: 0 !important; margin-right: 15px !important; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #0F172A !important; border-color: #FFD800 !important; transform: rotate(180deg) !important; } /* Accordion Answer Content */ body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-content, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-content { background: #FFFFFF !important; border-top: 1px solid rgba(212, 175, 55, 0.15) !important; border-bottom: none !important; padding: 20px 26px 26px !important; font-family: 'Cairo', sans-serif !important; font-size: 15px !important; color: #475569 !important; line-height: 1.8 !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-content strong, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-content strong { color: #0F172A !important; font-weight: 800 !important; } @media (max-width: 768px) { body.page-id-4368 .elementor-element.elementor-element-a50f0dd { padding: 55px 15px !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title { padding: 16px 18px !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-accordion-title, body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-title a, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-accordion-title, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-title a { font-size: 14.5px !important; } body.page-id-4368 .elementor-element-7116405 .elementor-accordion .elementor-tab-content, body.page-id-4368 .elementor-element-a50f0dd .elementor-accordion .elementor-tab-content { padding: 16px 18px 20px !important; font-size: 14px !important; } } /* ============================================================================ استرجاع قواعد من Additional CSS (حُذفت يدوياً 2026-09-30 قبل الترحيل) قواعد خاصة بصفحة 4368 — القيم الحية قبل الحذف هي المرجع ============================================================================ */ /* body.page-id-4368 */ body.elementor-page, body.page-id-4368 { font-family: 'Cairo', 'Segoe UI', Tahoma, Arial, sans-serif !important; background-color: #FAFAFA !important; color: #0F172A !important; -webkit-font-smoothing: antialiased; } /* .portfolio-badge */ body .portfolio-badge { background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(205, 127, 50, 0.15) 100%) !important; color: #B45309; border: 1px solid rgba(212, 175, 55, 0.4) !important;} /* .filter-btn.active */ body .filter-btn.active { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF; border-color: #D4AF37 !important; box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18), 0 0 0 2px rgba(212, 175, 55, 0.3) !important;} /* .portfolio-card:hover */ .portfolio-card:hover { transform: translateY(-6px) !important; } body .portfolio-card:hover { transform: translateY(-8px) !important; border-color: #D4AF37 !important; box-shadow: 0 20px 40px rgba(15, 23, 42, 0.09), 0 0 25px rgba(212, 175, 55, 0.18) !important; } /* .visit-btn:hover */ body .visit-btn:hover { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%) !important; color: #0F172A !important; border-color: #FFD800 !important; box-shadow: 0 4px 15px rgba(212, 175, 55, 0.35) !important; } /* .elementor-element-668fe2d6 */ body .elementor-element-668fe2d6, body .intishar-pill-badge { margin-bottom: 16px !important; } /* .intishar-pill-badge */ body .elementor-element-668fe2d6, body .intishar-pill-badge { margin-bottom: 16px !important; } /* .faq-header h2 */ .faq-header h2, body .elementor-element-3998775 h2.elementor-heading-title { margin-left: auto !important; margin-right: auto !important; justify-content: center !important; text-align: center !important; } body.page-id-4368 h2.elementor-heading-title, body .intishar-section-title h2, body .intishar-section-title .elementor-heading-title, body .faq-header h2, body .intishar-luxury-h2, body .elementor-element-cbd02a0 h2.elementor-heading-title, body h2.elementor-heading-title { font-size: 19px !important; padding: 10px 18px !important; margin-left: auto !important; margin-right: auto !important; } body.page-id-4368 h2.elementor-heading-title, body .intishar-section-title h2, body .intishar-section-title .elementor-heading-title, body .faq-header h2, body .intishar-luxury-h2, body .elementor-element-cbd02a0 h2.elementor-heading-title, body h2.elementor-heading-title { display: inline-flex !important; align-items: center !important; background: #F8FAFC !important; border: 1px solid #E2E8F0 !important; border-right: 5px solid #D4AF37 !important; border-radius: 14px !important; padding: 12px 24px !important; font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; font-size: clamp(20px, 2.6vw, 27px) !important; font-weight: 800 !important; color: #0F172A !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.02) !important; margin-bottom: 22px !important; line-height: 1.45 !important; width: fit-content !important; max-width: 100% !important; box-sizing: border-box !important; text-shadow: none !important; letter-spacing: normal !important; transition: all 0.3s ease !important; } /* .faq-header */ .faq-header, .elementor-element-3998775 { display: flex !important; justify-content: center !important; width: 100% !important; text-align: center !important; } /* .elementor-element-3998775 */ body .elementor-element-3998775 { text-align: center !important; margin-bottom: 14px !important; } .faq-header, .elementor-element-3998775 { display: flex !important; justify-content: center !important; width: 100% !important; text-align: center !important; } /* .portfolio-header */ .portfolio-header { gap: 10px !important; margin-bottom: 30px !important; padding: 0 10px !important; } .portfolio-header { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; gap: 14px !important; margin-bottom: 42px !important; width: 100% !important; position: relative !important; z-index: 2 !important; } /* .portfolio-header .portfolio-badge */ .portfolio-header .portfolio-badge { font-size: 12.5px; padding: 6px 15px !important;} .portfolio-header .portfolio-badge { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; background: linear-gradient(135deg, rgba(255, 216, 0, 0.14) 0%, rgba(212, 175, 55, 0.18) 100%) !important; color: #B45309; border: 1px solid rgba(212, 175, 55, 0.4) !important; padding: 7px 20px !important; border-radius: 50px !important; font-family: 'Cairo', sans-serif !important; font-size: 13.5px; font-weight: 700; letter-spacing: 0.3px !important; margin: 0 auto !important; box-shadow: 0 2px 10px rgba(212, 175, 55, 0.12) !important; transition: all 0.3s ease !important;} /* .portfolio-header .portfolio-badge:hover */ .portfolio-header .portfolio-badge:hover { background: linear-gradient(135deg, rgba(255, 216, 0, 0.22) 0%, rgba(212, 175, 55, 0.28) 100%) !important; box-shadow: 0 4px 14px rgba(212, 175, 55, 0.2) !important; transform: translateY(-1px) !important; } /* .portfolio-header .portfolio-badge .badge-star */ .portfolio-header .portfolio-badge .badge-star { color: #FFD800; text-shadow: 0 0 8px rgba(255, 216, 0, 0.7) !important; font-size: 13px;} /* .portfolio-header .portfolio-subtitle */ .portfolio-header .portfolio-subtitle { font-size: 13.5px; line-height: 1.65;} .portfolio-header .portfolio-subtitle { font-family: 'Cairo', sans-serif !important; font-size: 15.5px; font-weight: 500; color: #64748B; line-height: 1.75; max-width: 680px !important; margin: 0 auto !important; text-align: center !important;} /* .portfolio-filters */ .portfolio-filters { display: flex !important; justify-content: center !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap !important; margin-bottom: 40px !important; } /* .portfolio-filters .filter-btn */ .portfolio-filters .filter-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 22px !important; border-radius: 50px !important; font-family: 'Cairo', sans-serif !important; font-size: 14.5px; font-weight: 700; background: #FFFFFF !important; color: #475569; border: 1px solid #E2E8F0 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important; cursor: pointer !important; transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;} /* .portfolio-filters .filter-btn:hover */ .portfolio-filters .filter-btn:hover { color: #0F172A !important; border-color: #CBD5E1 !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important; } /* .portfolio-filters .filter-btn.active */ .portfolio-filters .filter-btn.active { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; color: #FFFFFF; border-color: #0F172A !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18) !important;} /* .portfolio-filters .filter-btn.active .filter-dot */ .portfolio-filters .filter-btn.active .filter-dot { background: #FFD800 !important; box-shadow: 0 0 8px rgba(255, 216, 0, 0.8) !important; } /* .portfolio-filters .filter-btn.active .filter-count */ .portfolio-filters .filter-btn.active .filter-count { color: #FFD800;} /* .portfolio-card */ .portfolio-card { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease !important; } /* .portfolio-card .card-inner */ .portfolio-card .card-inner { border: 1px solid #E2E8F0 !important; border-radius: 18px !important; transition: all 0.3s ease !important; overflow: hidden !important; background: #FFFFFF !important; } /* .portfolio-card:hover .card-inner */ .portfolio-card:hover .card-inner { border-color: rgba(212, 175, 55, 0.45) !important; box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08), 0 0 15px rgba(212, 175, 55, 0.12) !important; } /* .portfolio-title::after */ body .portfolio-title::after, body .portfolio-header h2::after, body .faq-main-title::after, body .faq-header h2::after, body .intishar-section-title h2::after, body h2.elementor-heading-title::after { display: none !important; content: none !important; width: 0 !important; height: 0 !important; border: none !important; } /* .benefit-item */ .benefit-item { padding: 14px 15px !important; } .benefit-item { display: flex; align-items: flex-start; gap: 15px; background: #FFFFFF !important; border: 1px solid rgba(212, 175, 55, 0.25) !important; border-radius: 14px; padding: 16px 20px; transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: 0 4px 15px rgba(15, 23, 42, 0.04) !important; } /* .benefit-item:hover */ .benefit-item:hover { background: #FFFDF8 !important; border-color: #D4AF37 !important; transform: translateX(-4px); box-shadow: 0 8px 22px rgba(212, 175, 55, 0.16) !important; } /* .benefit-icon-wrap */ .benefit-icon-wrap { width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, rgba(255, 216, 0, 0.18) 0%, rgba(212, 175, 55, 0.08) 100%) !important; border: 1px solid rgba(212, 175, 55, 0.38) !important; display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(212, 175, 55, 0.15); } /* .benefit-body */ .benefit-body { flex: 1; } /* .benefit-title */ .benefit-title { color: #0F172A !important; font-family: 'Cairo', sans-serif !important; font-size: 16px !important; font-weight: 800 !important; margin: 0 0 4px 0 !important; } /* .benefit-desc */ .benefit-desc { color: #475569 !important; font-family: 'Cairo', sans-serif !important; font-size: 13.5px !important; line-height: 1.6 !important; margin: 0 !important; } /* نقل من كتلة الاسترجاع العالمية: قواعد خاصة بصفحة 4368 فقط */ /* .intishar-portfolio-section */ body .intishar-portfolio-section { font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important; padding: 85px 20px !important; background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 50%, #F8FAFC 100%) !important; position: relative !important; border-top: 1px solid #E2E8F0 !important; border-bottom: 1px solid #E2E8F0 !important; } /* .intishar-h2-base */ .intishar-h2-base { color: #0F172A !important; font-weight: 800 !important; } /* .intishar-cta-benefits */ .intishar-cta-benefits { display: flex; flex-direction: column; gap: 15px; margin: 20px 0 28px 0; } /* صناديق الإحصائيات/اللافتات — كانت style="" مضمنة في ودجات HTML خام (Task 7) النصوص وأحجام الخطوط صارت مملوكة لإعدادات المحرر داخل الودجات */ body.page-id-4368 .intishar-stat-card { background: #CD7F32; border-radius: 16px; padding: 22px 30px; text-align: center; direction: rtl; border-right: 10px solid #F2C94C; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); } body.page-id-4368 .intishar-stat-card .elementor-text-editor p { margin: 0; } /* ==== قسم سابقة الأعمال — منقول من ودجت HTML الخام (Task 8) 2026-09-30 ==== الكلاسات بأسمائها الأصلية؛ قواعد التوفيق مع الودجات الأصلية في نهاية الملف */ /* ========================================================================== ✨ INTISHAR 360° - LUXURY PORTFOLIO SECTION STYLING Colors: #FFD800, #D4AF37, #CD7F32, #A7AEB5, #0F172A, #FFFFFF ========================================================================== */ .intishar-portfolio-section { font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif; padding: 85px 20px; background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 50%, #F8FAFC 100%); position: relative; overflow: hidden; border-top: 1px solid #E2E8F0; border-bottom: 1px solid #E2E8F0; } .intishar-portfolio-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: radial-gradient(rgba(212, 175, 55, 0.08) 1.2px, transparent 1.2px); background-size: 28px 28px; pointer-events: none; opacity: 0.7; } .portfolio-container { max-width: 1240px; margin: 0 auto; position: relative; z-index: 2; } /* Header */ .portfolio-header { text-align: center; margin-bottom: 45px; } .portfolio-badge { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(205, 127, 50, 0.15) 100%); color: #B45309; border: 1px solid rgba(212, 175, 55, 0.4); padding: 6px 18px; border-radius: 50px; font-size: 14px; font-weight: 700; letter-spacing: 0.5px; margin-bottom: 16px; box-shadow: 0 2px 10px rgba(212, 175, 55, 0.1); } .portfolio-badge .badge-star { color: #FFD800; text-shadow: 0 0 6px rgba(255, 216, 0, 0.6); } .portfolio-title { font-size: 34px; font-weight: 800; color: #0F172A; margin-bottom: 16px; line-height: 1.35; position: relative; display: inline-block; } .portfolio-title::after { content: ''; display: block; width: 80px; height: 4px; background: linear-gradient(90deg, #CD7F32 0%, #D4AF37 50%, #FFD800 100%); border-radius: 4px; margin: 12px auto 0; } .portfolio-subtitle { font-size: 16px; color: #64748B; max-width: 720px; margin: 0 auto; line-height: 1.7; } /* Filters */ .portfolio-filters { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 45px; } .filter-btn { background: #FFFFFF; border: 1px solid #E2E8F0; color: #475569; padding: 10px 22px; border-radius: 30px; font-size: 15px; font-weight: 700; cursor: pointer; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04); } .filter-btn .filter-dot { width: 7px; height: 7px; border-radius: 50%; background: #A7AEB5; transition: all 0.3s ease; } .filter-btn .filter-count { font-size: 13px; opacity: 0.75; } .filter-btn:hover { border-color: #D4AF37; color: #0F172A; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(212, 175, 55, 0.15); } .filter-btn.active { background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%); color: #FFFFFF; border-color: #D4AF37; box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18), 0 0 0 2px rgba(212, 175, 55, 0.3); } .filter-btn.active .filter-dot { background: #FFD800; box-shadow: 0 0 8px #FFD800; } .filter-btn.active .filter-count { color: #FFD800; opacity: 1; } /* Grid */ .portfolio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; transition: all 0.4s ease; } /* Cards */ .portfolio-card { background: #FFFFFF; border-radius: 18px; border: 1px solid #E2E8F0; overflow: hidden; transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04); display: flex; flex-direction: column; position: relative; } .portfolio-card.is-hidden { display: none !important; } .portfolio-card:hover { transform: translateY(-8px); border-color: #D4AF37; box-shadow: 0 20px 40px rgba(15, 23, 42, 0.09), 0 0 25px rgba(212, 175, 55, 0.18); } .card-inner { display: flex; flex-direction: column; height: 100%; } /* Mockup Media */ .card-mockup-wrapper { position: relative; background: #0F172A; overflow: hidden; padding: 10px 10px 0 10px; border-bottom: 1px solid #E2E8F0; } .mockup-link { display: block; position: relative; overflow: hidden; border-radius: 12px 12px 0 0; } .mockup-img { width: 100%; height: auto; display: block; transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); object-fit: cover; } .portfolio-card:hover .mockup-img { transform: scale(1.03); } .mockup-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15, 23, 42, 0.6); backdrop-filter: blur(3px); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s ease; } .portfolio-card:hover .mockup-overlay { opacity: 1; } .overlay-btn { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%); color: #0F172A; font-weight: 800; font-size: 14px; padding: 10px 22px; border-radius: 25px; box-shadow: 0 4px 15px rgba(255, 216, 0, 0.4); transform: translateY(10px); transition: transform 0.3s ease; } .portfolio-card:hover .overlay-btn { transform: translateY(0); } .category-pill { position: absolute; top: 18px; right: 18px; background: rgba(15, 23, 42, 0.85); backdrop-filter: blur(6px); color: #FFD800; border: 1px solid rgba(212, 175, 55, 0.4); font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: 20px; z-index: 3; } /* Card Content */ .card-content { padding: 22px; display: flex; flex-direction: column; flex-grow: 1; } .card-title { font-size: 19px; font-weight: 800; margin: 0 0 10px 0; line-height: 1.4; } .card-title a { color: #0F172A; text-decoration: none; transition: color 0.2s ease; } .card-title a:hover { color: #D4AF37; } .card-summary { font-size: 14px; color: #64748B; line-height: 1.65; margin-bottom: 16px; flex-grow: 1; } /* Tags */ .card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; } .portfolio-tag { background: #F1F5F9; color: #475569; border: 1px solid #E2E8F0; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 6px; transition: all 0.2s ease; } .portfolio-card:hover .portfolio-tag { border-color: rgba(212, 175, 55, 0.3); color: #0F172A; } /* Footer & Button */ .card-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 14px; border-top: 1px solid #F1F5F9; } .visit-btn { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%); text-decoration: none; padding: 9px 18px; border-radius: 8px; border: 1px solid #D4AF37; transition: all 0.3s ease; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08); } .visit-btn:hover { background: linear-gradient(135deg, #FFD800 0%, #D4AF37 100%); color: #0F172A; border-color: #FFD800; box-shadow: 0 4px 15px rgba(212, 175, 55, 0.35); transform: translateY(-2px); } .visit-icon { transition: transform 0.3s ease; } .visit-btn:hover .visit-icon { transform: translateX(-3px) translateY(-3px); } .domain-label { font-size: 12px; color: #94A3B8; font-family: monospace; direction: ltr; } /* ========================================================================== Responsive Breakpoints ========================================================================== */ @media (max-width: 1024px) { .portfolio-grid { grid-template-columns: repeat(2, 1fr); gap: 22px; } .portfolio-title { font-size: 28px; } } @media (max-width: 640px) { .intishar-portfolio-section { padding: 55px 15px; } .portfolio-grid { grid-template-columns: 1fr; gap: 20px; } .portfolio-title { font-size: 24px; } .portfolio-subtitle { font-size: 14px; } .filter-btn { padding: 8px 16px; font-size: 13px; } } /* ==== توفيق قسم البورتفوليو الأصلي مع هيكل Elementor native (Task 8) ==== الكونتينرات تفرض display:flex — نعيد فرض تخطيطات الشبكة الأصلية، ونضبط صور/عناوين الودجات لتطابق البنية الخام السابقة */ body.page-id-4368 .portfolio-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 28px !important; } body.page-id-4368 .portfolio-filters { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; justify-content: center !important; } body.page-id-4368 .portfolio-header { text-align: center; } body.page-id-4368 .filter-btn { cursor: pointer; } body.page-id-4368 .card-mockup-wrapper .elementor-widget-image { display: block; width: 100%; } body.page-id-4368 .card-mockup-wrapper img { width: 100% !important; height: auto !important; display: block !important; object-fit: cover !important; } body.page-id-4368 .portfolio-card .card-title .elementor-heading-title { margin: 0; } body.page-id-4368 .portfolio-card .card-tags { display: block !important; } body.page-id-4368 .portfolio-card .card-tags .elementor-heading-title { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0 !important; } body.page-id-4368 .card-footer .elementor-widget:first-child .elementor-heading-title { display: inline-flex; align-items: center; } body.page-id-4368 .mockup-overlay { z-index: 2; } body.page-id-4368 .category-pill { z-index: 2; } @media (max-width: 991px) { body.page-id-4368 .portfolio-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 22px !important; } } @media (max-width: 640px) { body.page-id-4368 .portfolio-grid { grid-template-columns: 1fr !important; } } /* توفيق زر الزيارة: صياغة Blocksy/Elementor تتغلب على القاعدة المفردة — إعادة إعلان بخصوصية مضاعفة (Task 8) */ body.page-id-4368 .portfolio-card .card-footer a.visit-btn { display: inline-flex !important; align-items: center; gap: 8px; background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%) !important; text-decoration: none; padding: 9px 18px !important; border-radius: 8px !important; border: 1px solid #D4AF37 !important; transition: all 0.3s ease; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08) !important;} body.page-id-4368 .portfolio-card .card-title .elementor-heading-title { font-size: 19px; font-weight: 800; line-height: 1.4; margin: 0 !important;} /* أزرار الفلترة: الودجات تأخذ عرض الكونتينر كاملاً — أعيدها صفّاً أفقياً (Task 8) */ body.page-id-4368 .portfolio-filters .elementor-widget { width: auto !important; flex: 0 0 auto !important; max-width: none !important; } body.page-id-4368 .portfolio-filters .elementor-widget .elementor-heading-title { display: inline-flex !important; align-items: center !important; } /* اتجاه الصف للفلاتر وفوتر الكارت (كانا يرثان column من الكونتينر) */ body.page-id-4368 .portfolio-filters, body.page-id-4368 .portfolio-card .card-footer { flex-direction: row !important; align-items: center !important; } body.page-id-4368 .portfolio-card .card-footer { justify-content: space-between !important; width: 100%; } /* فوتر الكارت: الودجان بعرض المحتوى لا عرض كامل */ body.page-id-4368 .portfolio-card .card-footer .elementor-widget { width: auto !important; max-width: none !important; } /* منع لفّ نصوص الأزرار والدومين (كانت تلتف لسطرين بعرض الودجت الضيق) */ body.page-id-4368 .portfolio-filters .filter-btn .elementor-heading-title { white-space: nowrap !important; } body.page-id-4368 .portfolio-card .card-footer a.visit-btn { white-space: nowrap !important; flex-shrink: 0 !important; } body.page-id-4368 .portfolio-card .card-footer .domain-label .elementor-heading-title { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; max-width: 130px; } /* فقرات intishar-para: النص العريض كان style="" مضمناً في ودجت نص (Task 12) */ body.page-id-4368 p.intishar-para { font-weight: 700; }