/* ============================================ رقمنة | ملف التنسيقات الرئيسي ============================================ */ /* === متغيرات ألوان الموقع === عدّل القيم أدناه فقط للتحكم بجميع ألوان الموقع من مكان واحد. طابع داكن عصري مع لمسة نيلي/بنفسجي. ============================================ */ :root { /* اللون الأساسي / التمييز (عناوين، أزرار، روابط) */ --raqmana-primary: #00ff67; --raqmana-secondary: #00d9ff; /* الخلفية الرئيسية - نيلي داكن حيوي */ --raqmana-bg: #0f1222; /* البطاقات والعناصر المرتفعة */ --raqmana-card: #1a1f38; --raqmana-card-alt: #15182e; --raqmana-card-dark: #12152a; --raqmana-card-alpha: #1a1f38cc; --raqmana-card-secondary: #222840; /* الحدود */ --raqmana-border: #EBEBEB1A; --raqmana-border-light: #FFFFFF1A; /* النصوص */ --raqmana-text: #ffffff; --raqmana-text-muted: #9DA2B3; --raqmana-text-light: #BEC4E0; --raqmana-text-gray: #6C7278; /* أخرى */ --raqmana-whyus-border: #1e1a42; --raqmana-scrollbar-thumb: #1a1f38; --raqmana-overlay: #5C647942; --raqmana-surface: #FFFFFF0D; /* الخط العربي - Expo Arabic Book (محلي) */ --font-arabic: 'Expo Arabic Book', __expoArabic_008078, __expoArabic_Fallback_008078, sans-serif; } /* خط إكسبو عربي - من ملف محلي */ @font-face { font-family: 'Expo Arabic Book'; src: url('../fonts/ArbFONTS-ExpoArabic-Book.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } /* ========== أساسيات الصفحة (Body) ========== */ body { transition: opacity ease-in 0.2s; font-family: var(--font-arabic); } body[unresolved] { opacity: 0; display: block; overflow: hidden; position: relative; } /* ========== وضوح نصوص الهيدر ========== */ header .rounded-\[20px\] { color: var(--raqmana-text); } header .logo, header .logo h1 { color: var(--raqmana-text) !important; font-weight: 600; } header nav ul li a { color: var(--raqmana-text-light) !important; font-weight: 500; font-size: 1rem; } header nav ul li a:hover { color: var(--raqmana-text) !important; } header .bg-primaryColor { color: #fff !important; font-weight: 600; } /* ========== أنماط امتدادات المتصفح (يمكن تجاهلها) ========== */ [bt-global-status="dual"] [bt-translate-status]:not([bt-translate-status="translated"]) .bt-copied-node-wrapper { display: none; } .bt-global-loading { display: inline-block; width: 12px; height: 12px; border: 2px solid #f3f3f3; border-top: 1px solid #aaa; border-radius: 50%; animation: bt-global-spin 1s linear infinite; margin-left: 10px; vertical-align: middle; } @keyframes bt-global-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .bt-error-wrapper { position: relative; display: inline-flex; padding: 6px; margin: 0 8px; white-space: nowrap; font-size: 16px; align-items: center; color: #00AAB5; vertical-align: middle; } .bt-error-wrapper font { display: flex; align-items: center; margin: 0 4px; cursor: pointer; } .bt-error-wrapper svg { width: 0.8em; height: 0.8em; margin: 0 4px; } .bt-global-retry svg:hover { animation: bt-global-spin 1s ease infinite; } .bt-block-wrapper { margin: 8px 0; display: inline-block; } .bt-inline-wrapper { margin: 0 8px; } .bt-max-height-unset { max-height: unset; } .bt-webkit-line-clamp-unset { -webkit-line-clamp: unset; } :root{ --font--dash--border:#59c1bd; --font--underLine-border:#72ece9; --font-marker--bg:0,0,0; --font--blockquote--left--bg:#FF0000; --font--spit--line--border: #000000; } .translatedTextContainer{ margin: 8px 0; display: inline-block; } .fontFamilyDashRest{ background: linear-gradient(to right, var(--font--dash--border) 0%, var(--font--dash--border) 50%, transparent 50%, transparent 100%) repeat-x left bottom; background-size: 8px 2px; padding-bottom: 2px; } .fontFamilyUnderlineRest{ border-bottom: 1px solid var(--font--underLine-border); } .fontFamilyMaskRest{ filter: blur(5px); transition: filter 0.3s ease; border-radius: 10px; display: inline-block; } .fontFamilyMaskRest:hover{ filter: none; } .fontFamilySpitLineRest{ color: #f50a0a; } .fontFamilySpitLineRest::before{ content: ""; display: block; max-width: 80px; width: 10%; border-top: 1px dashed var(--font--spit--line--border); padding-top: 8px; } .poppins-semibold { font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; } .fontFamilyMarkerReset{ background: linear-gradient(to right, rgba(var(--font-marker--bg), 0.1), rgba(var(--font-marker--bg), 0.9) 3%, rgba(var(--font-marker--bg), 0.9) 35%, rgba(var(--font-marker--bg), 0.9) 70%, rgba(var(--font-marker--bg), 0.8) 95%, rgba(var(--font-marker--bg), 0.3)); box-decoration-break: clone; -webkit-box-decoration-break: clone; } .fontFamilyBlockQuoteReset{ border-left: 4px solid var(--font--blockquote--left--bg); padding-left: 12px; margin-top: 4px; margin-bottom: 4px; padding-top: 4px; padding-bottom: 4px; } [data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos] { transition-duration: 50ms } [data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate { transition-delay: 50ms } [data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos] { transition-duration: .1s } [data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate { transition-delay: .1s } [data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos] { transition-duration: .15s } [data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate { transition-delay: .15s } [data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos] { transition-duration: .2s } [data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate { transition-delay: .2s } [data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos] { transition-duration: .25s } [data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate { transition-delay: .25s } [data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos] { transition-duration: .3s } [data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate { transition-delay: .3s } [data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos] { transition-duration: .35s } [data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate { transition-delay: .35s } [data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos] { transition-duration: .4s } [data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate { transition-delay: .4s } [data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos] { transition-duration: .45s } [data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate { transition-delay: .45s } [data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos] { transition-duration: .5s } [data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate { transition-delay: .5s } [data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos] { transition-duration: .55s } [data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate { transition-delay: .55s } [data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos] { transition-duration: .6s } [data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate { transition-delay: .6s } [data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos] { transition-duration: .65s } [data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate { transition-delay: .65s } [data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos] { transition-duration: .7s } [data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate { transition-delay: .7s } [data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos] { transition-duration: .75s } [data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate { transition-delay: .75s } [data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos] { transition-duration: .8s } [data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate { transition-delay: .8s } [data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos] { transition-duration: .85s } [data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate { transition-delay: .85s } [data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos] { transition-duration: .9s } [data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate { transition-delay: .9s } [data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos] { transition-duration: .95s } [data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate { transition-delay: .95s } [data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos] { transition-duration: 1s } [data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate { transition-delay: 1s } [data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos] { transition-duration: 1.05s } [data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate { transition-delay: 1.05s } [data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos] { transition-duration: 1.1s } [data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate { transition-delay: 1.1s } [data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos] { transition-duration: 1.15s } [data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate { transition-delay: 1.15s } [data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos] { transition-duration: 1.2s } [data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate { transition-delay: 1.2s } [data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos] { transition-duration: 1.25s } [data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate { transition-delay: 1.25s } [data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos] { transition-duration: 1.3s } [data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate { transition-delay: 1.3s } [data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos] { transition-duration: 1.35s } [data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate { transition-delay: 1.35s } [data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos] { transition-duration: 1.4s } [data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate { transition-delay: 1.4s } [data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos] { transition-duration: 1.45s } [data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate { transition-delay: 1.45s } [data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos] { transition-duration: 1.5s } [data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate { transition-delay: 1.5s } [data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos] { transition-duration: 1.55s } [data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate { transition-delay: 1.55s } [data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos] { transition-duration: 1.6s } [data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate { transition-delay: 1.6s } [data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos] { transition-duration: 1.65s } [data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate { transition-delay: 1.65s } [data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos] { transition-duration: 1.7s } [data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate { transition-delay: 1.7s } [data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos] { transition-duration: 1.75s } [data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate { transition-delay: 1.75s } [data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos] { transition-duration: 1.8s } [data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate { transition-delay: 1.8s } [data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos] { transition-duration: 1.85s } [data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate { transition-delay: 1.85s } [data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos] { transition-duration: 1.9s } [data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate { transition-delay: 1.9s } [data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos] { transition-duration: 1.95s } [data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate { transition-delay: 1.95s } [data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos] { transition-duration: 2s } [data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate { transition-delay: 2s } [data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos] { transition-duration: 2.05s } [data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate { transition-delay: 2.05s } [data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos] { transition-duration: 2.1s } [data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate { transition-delay: 2.1s } [data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos] { transition-duration: 2.15s } [data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate { transition-delay: 2.15s } [data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos] { transition-duration: 2.2s } [data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate { transition-delay: 2.2s } [data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos] { transition-duration: 2.25s } [data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate { transition-delay: 2.25s } [data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos] { transition-duration: 2.3s } [data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate { transition-delay: 2.3s } [data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos] { transition-duration: 2.35s } [data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate { transition-delay: 2.35s } [data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos] { transition-duration: 2.4s } [data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate { transition-delay: 2.4s } [data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos] { transition-duration: 2.45s } [data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate { transition-delay: 2.45s } [data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos] { transition-duration: 2.5s } [data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate { transition-delay: 2.5s } [data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos] { transition-duration: 2.55s } [data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate { transition-delay: 2.55s } [data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos] { transition-duration: 2.6s } [data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate { transition-delay: 2.6s } [data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos] { transition-duration: 2.65s } [data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate { transition-delay: 2.65s } [data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos] { transition-duration: 2.7s } [data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate { transition-delay: 2.7s } [data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos] { transition-duration: 2.75s } [data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate { transition-delay: 2.75s } [data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos] { transition-duration: 2.8s } [data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate { transition-delay: 2.8s } [data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos] { transition-duration: 2.85s } [data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate { transition-delay: 2.85s } [data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos] { transition-duration: 2.9s } [data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate { transition-delay: 2.9s } [data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos] { transition-duration: 2.95s } [data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate { transition-delay: 2.95s } [data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos] { transition-duration: 3s } [data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos] { transition-delay: 0 } [data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate { transition-delay: 3s } [data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos] { transition-timing-function: cubic-bezier(.25,.25,.75,.75) } [data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos] { transition-timing-function: ease } [data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos] { transition-timing-function: ease-in } [data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos] { transition-timing-function: ease-out } [data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos] { transition-timing-function: ease-in-out } [data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos] { transition-timing-function: cubic-bezier(.6,-.28,.735,.045) } [data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos] { transition-timing-function: cubic-bezier(.175,.885,.32,1.275) } [data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos] { transition-timing-function: cubic-bezier(.68,-.55,.265,1.55) } [data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos] { transition-timing-function: cubic-bezier(.47,0,.745,.715) } [data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos] { transition-timing-function: cubic-bezier(.39,.575,.565,1) } [data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos] { transition-timing-function: cubic-bezier(.445,.05,.55,.95) } [data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos] { transition-timing-function: cubic-bezier(.55,.085,.68,.53) } [data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos] { transition-timing-function: cubic-bezier(.25,.46,.45,.94) } [data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos] { transition-timing-function: cubic-bezier(.455,.03,.515,.955) } [data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos] { transition-timing-function: cubic-bezier(.55,.085,.68,.53) } [data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos] { transition-timing-function: cubic-bezier(.25,.46,.45,.94) } [data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos] { transition-timing-function: cubic-bezier(.455,.03,.515,.955) } [data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos] { transition-timing-function: cubic-bezier(.55,.085,.68,.53) } [data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos] { transition-timing-function: cubic-bezier(.25,.46,.45,.94) } [data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos] { transition-timing-function: cubic-bezier(.455,.03,.515,.955) } [data-aos^=fade][data-aos^=fade] { opacity: 0; transition-property: opacity,transform } [data-aos^=fade][data-aos^=fade].aos-animate { opacity: 1; transform: translateZ(0) } [data-aos=fade-up] { transform: translate3d(0,100px,0) } [data-aos=fade-down] { transform: translate3d(0,-100px,0) } [data-aos=fade-right] { transform: translate3d(-100px,0,0) } [data-aos=fade-left] { transform: translate3d(100px,0,0) } [data-aos=fade-up-right] { transform: translate3d(-100px,100px,0) } [data-aos=fade-up-left] { transform: translate3d(100px,100px,0) } [data-aos=fade-down-right] { transform: translate3d(-100px,-100px,0) } [data-aos=fade-down-left] { transform: translate3d(100px,-100px,0) } [data-aos^=zoom][data-aos^=zoom] { opacity: 0; transition-property: opacity,transform } [data-aos^=zoom][data-aos^=zoom].aos-animate { opacity: 1; transform: translateZ(0) scale(1) } [data-aos=zoom-in] { transform: scale(.6) } [data-aos=zoom-in-up] { transform: translate3d(0,100px,0) scale(.6) } [data-aos=zoom-in-down] { transform: translate3d(0,-100px,0) scale(.6) } [data-aos=zoom-in-right] { transform: translate3d(-100px,0,0) scale(.6) } [data-aos=zoom-in-left] { transform: translate3d(100px,0,0) scale(.6) } [data-aos=zoom-out] { transform: scale(1.2) } [data-aos=zoom-out-up] { transform: translate3d(0,100px,0) scale(1.2) } [data-aos=zoom-out-down] { transform: translate3d(0,-100px,0) scale(1.2) } [data-aos=zoom-out-right] { transform: translate3d(-100px,0,0) scale(1.2) } [data-aos=zoom-out-left] { transform: translate3d(100px,0,0) scale(1.2) } [data-aos^=slide][data-aos^=slide] { transition-property: transform } [data-aos^=slide][data-aos^=slide].aos-animate { transform: translateZ(0) } [data-aos=slide-up] { transform: translate3d(0,100%,0) } [data-aos=slide-down] { transform: translate3d(0,-100%,0) } [data-aos=slide-right] { transform: translate3d(-100%,0,0) } [data-aos=slide-left] { transform: translate3d(100%,0,0) } [data-aos^=flip][data-aos^=flip] { backface-visibility: hidden; transition-property: transform } [data-aos=flip-left] { transform: perspective(2500px) rotateY(-100deg) } [data-aos=flip-left].aos-animate { transform: perspective(2500px) rotateY(0) } [data-aos=flip-right] { transform: perspective(2500px) rotateY(100deg) } [data-aos=flip-right].aos-animate { transform: perspective(2500px) rotateY(0) } [data-aos=flip-up] { transform: perspective(2500px) rotateX(-100deg) } [data-aos=flip-up].aos-animate { transform: perspective(2500px) rotateX(0) } [data-aos=flip-down] { transform: perspective(2500px) rotateX(100deg) } [data-aos=flip-down].aos-animate { transform: perspective(2500px) rotateX(0) } /* ========== Swiper (السلايدر / الكاروسيل) ========== */ @font-face { font-family: swiper-icons; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA"); font-weight: 400; font-style: normal } :root { --swiper-theme-color: #007aff } :host { position: relative; display: block; margin-left: auto; margin-right: auto; z-index: 1 } .swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; display: block } .swiper-vertical>.swiper-wrapper { flex-direction: column } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function,initial); box-sizing: content-box } .swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper { transform: translateZ(0) } .swiper-horizontal { touch-action: pan-y } .swiper-vertical { touch-action: pan-x } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; display: block } .swiper-slide-invisible-blank { visibility: hidden } .swiper-autoheight,.swiper-autoheight .swiper-slide { height: auto } .swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform,height } .swiper-backface-hidden .swiper-slide { transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden } .swiper-3d.swiper-css-mode .swiper-wrapper { perspective: 1200px } .swiper-3d .swiper-wrapper { transform-style: preserve-3d } .swiper-3d { perspective: 1200px } .swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide { transform-style: preserve-3d } .swiper-css-mode>.swiper-wrapper { overflow: auto; scrollbar-width: none; -ms-overflow-style: none } .swiper-css-mode>.swiper-wrapper::-webkit-scrollbar { display: none } .swiper-css-mode>.swiper-wrapper>.swiper-slide { scroll-snap-align: start start } .swiper-css-mode.swiper-horizontal>.swiper-wrapper { scroll-snap-type: x mandatory } .swiper-css-mode.swiper-vertical>.swiper-wrapper { scroll-snap-type: y mandatory } .swiper-css-mode.swiper-free-mode>.swiper-wrapper { scroll-snap-type: none } .swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide { scroll-snap-align: none } .swiper-css-mode.swiper-centered>.swiper-wrapper:before { content: ""; flex-shrink: 0; order: 9999 } .swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide { scroll-snap-align: center center; scroll-snap-stop:always} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child { margin-inline-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper: before { height:100%; min-height: 1px; width: var(--swiper-centered-offset-after) } .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child { margin-block-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper: before { width:100%; min-width: 1px; height: var(--swiper-centered-offset-after) } .swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10 } .swiper-3d .swiper-slide-shadow { background: rgba(0,0,0,.15) } .swiper-3d .swiper-slide-shadow-left { background-image: linear-gradient(270deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-right { background-image: linear-gradient(90deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-top { background-image: linear-gradient(0deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-bottom { background-image: linear-gradient(180deg,rgba(0,0,0,.5),transparent) } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; box-sizing: border-box; border-radius: 50%; border: 4px solid var(--swiper-preloader-color,var(--swiper-theme-color)); border-top: 4px solid transparent } .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader { animation: swiper-preloader-spin 1s linear infinite } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff } .swiper-lazy-preloader-black { --swiper-preloader-color: #000 } @keyframes swiper-preloader-spin { 0% { transform: rotate(0deg) } to { transform: rotate(1turn) } } .swiper-pagination { position: absolute; text-align: center; transition: opacity .3s; transform: translateZ(0); z-index: 10 } .swiper-pagination.swiper-pagination-hidden { opacity: 0 } .swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled { display: none } .swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction { bottom: var(--swiper-pagination-bottom,8px); top: var(--swiper-pagination-top,auto); left: 0; width: 100% } .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0 } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transform: scale(.33); position: relative } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { transform: scale(1) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { transform: scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { transform: scale(.33) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { transform: scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { transform: scale(.33) } .swiper-pagination-bullet { width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px)); height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px)); display: inline-block; border-radius: var(--swiper-pagination-bullet-border-radius,50%); background: var(--swiper-pagination-bullet-inactive-color,#000); opacity: var(--swiper-pagination-bullet-inactive-opacity,.2) } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer } .swiper-pagination-bullet:only-child { display: none } .swiper-pagination-bullet-active { opacity: var(--swiper-pagination-bullet-opacity,1); background: var(--swiper-pagination-color,var(--swiper-theme-color)) } .swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets { right: var(--swiper-pagination-right,8px); left: var(--swiper-pagination-left,auto); top: 50%; transform: translate3d(0,-50%,0) } .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin: var(--swiper-pagination-bullet-vertical-gap,6px) 0; display: block } .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; transform: translateY(-50%); width: 8px } .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; transition: transform .2s,top .2s } .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px) } .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; transform: translateX(-50%); white-space: nowrap } .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: transform .2s,left .2s } .swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: transform .2s,right .2s } .swiper-pagination-fraction { color: var(--swiper-pagination-fraction-color,inherit) } .swiper-pagination-progressbar { background: var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25)); position: absolute } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color,var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top } .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { transform-origin: right top } .swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: var(--swiper-pagination-progressbar-size,4px); left: 0; top: 0 } .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar { width: var(--swiper-pagination-progressbar-size,4px); height: 100%; left: 0; top: 0 } .swiper-pagination-lock { display: none } @font-face { font-family: __manrope_51b8ac; src: url(../img/fedf2590f65a5730-s.p.ttf) format("truetype"); font-display: swap; font-weight: 200; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/c7470619e3882fe7-s.p.ttf) format("truetype"); font-display: swap; font-weight: 300; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/bd4fdd36d94c3349-s.p.ttf) format("truetype"); font-display: swap; font-weight: 400; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/21bd6fd9e559ed8a-s.p.ttf) format("truetype"); font-display: swap; font-weight: 500; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/a1b1fe1695c8a0a0-s.p.ttf) format("truetype"); font-display: swap; font-weight: 600; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/13e0014e443920ad-s.p.ttf) format("truetype"); font-display: swap; font-weight: 700; font-style: normal } @font-face { font-family: __manrope_51b8ac; src: url(../img/b3116da298432cf5-s.p.ttf) format("truetype"); font-display: swap; font-weight: 800; font-style: normal } @font-face { font-family: __manrope_Fallback_51b8ac; src: local("Arial"); ascent-override:102.74%;descent-override:28.91%;line-gap-override:0.00%;size-adjust:103.76%} /* ========== الخطوط (Fonts) ========== */ @font-face { font-family: __expoArabic_008078; src: url(../img/12cc825a4ea1cb9f-s.p.ttf) format("truetype"); font-display: swap; font-weight: 400; font-style: normal } @font-face { font-family: __expoArabic_Fallback_008078; src: local("Arial"); ascent-override:78.50%;descent-override:32.32%;line-gap-override:0.00%;size-adjust:108.29%} /* ! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com */ /* ========== Tailwind CSS (الأنماط الأساسية والمكونات) ========== */ *,:after,:before { box-sizing: border-box; border: 0 solid #e5e7eb } :after,:before { --tw-content: "" } :host,html { line-height: 1.5; -webkit-text-size-adjust: 100%; -moz-tab-size: 4; tab-size: 4; font-family: ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji; font-feature-settings: normal; font-variation-settings: normal; -webkit-tap-highlight-color: transparent } body { margin: 0; line-height: inherit } hr { height: 0; color: inherit; border-top-width: 1px } abbr:where([title]) { text-decoration: underline dotted } h1,h2,h3,h4,h5,h6 { font-size: inherit; font-weight: inherit } a { color: inherit; text-decoration: inherit } b,strong { font-weight: bolder } code,kbd,pre,samp { font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em } small { font-size: 80% } sub,sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sub { bottom: -.25em } sup { top: -.5em } table { text-indent: 0; border-color: inherit; border-collapse: collapse } button,input,optgroup,select,textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0; padding: 0 } button,select { text-transform: none } button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]) { -webkit-appearance: button; background-color: transparent; background-image: none } :-moz-focusring { outline: auto } :-moz-ui-invalid { box-shadow: none } progress { vertical-align: baseline } ::-webkit-inner-spin-button,::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } ::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } summary { display: list-item } blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre { margin: 0 } fieldset { margin: 0 } fieldset,legend { padding: 0 } menu,ol,ul { list-style: none; margin: 0; padding: 0 } dialog { padding: 0 } textarea { resize: vertical } input::placeholder,textarea::placeholder { opacity: 1; color: #9ca3af } [role=button],button { cursor: pointer } :disabled { cursor: default } audio,canvas,embed,iframe,img,object,svg,video { display: block; vertical-align: middle } img,video { max-width: 100%; height: auto } [hidden] { display: none } *,:after,:before { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: } .container { width: 100%; margin-right: auto; margin-left: auto; padding-right: 1rem; padding-left: 1rem } @media (min-width: 640px) { .container { max-width:640px; padding-right: 2rem; padding-left: 2rem } } @media (min-width: 768px) { .container { max-width:768px } } @media (min-width: 1024px) { .container { max-width:1024px; padding-right: 4rem; padding-left: 4rem } } @media (min-width: 1280px) { .container { max-width:1280px; padding-right: 3rem; padding-left: 3rem } } @media (min-width: 1536px) { .container { max-width:1536px; padding-right: 6rem; padding-left: 6rem } } .main-btn { border-radius: 9999px; padding: .25rem .5rem } .main-btn:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000); --tw-ring-color: rgb(167 139 250/var(--tw-ring-opacity)); --tw-ring-opacity: 0.75 } @media (min-width: 768px) { .main-btn { padding-left:1.25rem; padding-right: 1.25rem } } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0 } .pointer-events-none { pointer-events: none } .fixed { position: fixed } .absolute { position: absolute } .relative { position: relative } .sticky { position: sticky } .inset-0 { inset: 0 } .inset-y-0 { top: 0; bottom: 0 } .left-0 { left: 0 } .left-1\/2 { left: 50% } .left-4 { left: 1rem } .left-\[50\%\] { left: 50% } .right-0 { right: 0 } .right-4 { right: 1rem } .top-0 { top: 0 } .top-4 { top: 1rem } .top-\[50\%\] { top: 50% } .z-10 { z-index: 10 } .z-20 { z-index: 20 } .z-40 { z-index: 40 } .z-50 { z-index: 50 } .mx-0 { margin-left: 0; margin-right: 0 } .mx-2 { margin-left: .5rem; margin-right: .5rem } .mx-auto { margin-left: auto; margin-right: auto } .my-3 { margin-top: .75rem; margin-bottom: .75rem } .my-4 { margin-top: 1rem; margin-bottom: 1rem } .mb-10 { margin-bottom: 2.5rem } .mb-2 { margin-bottom: .5rem } .mb-4 { margin-bottom: 1rem } .mb-5 { margin-bottom: 1.25rem } .mb-6 { margin-bottom: 1.5rem } .mb-8 { margin-bottom: 2rem } .mb-\[100px\] { margin-bottom: 100px } .mb-\[30px\] { margin-bottom: 30px } .me-2 { margin-inline-end:.5rem} .mr-1 { margin-right: .25rem } .mr-6 { margin-right: 1.5rem } .mt-1 { margin-top: .25rem } .mt-10 { margin-top: 2.5rem } .mt-4 { margin-top: 1rem } .mt-5 { margin-top: 1.25rem } .mt-6 { margin-top: 1.5rem } .mt-8 { margin-top: 2rem } .mt-\[20px\] { margin-top: 20px } .block { display: block } .inline-block { display: inline-block } .inline { display: inline } .flex { display: flex } .inline-flex { display: inline-flex } .grid { display: grid } .hidden { display: none } .h-10 { height: 2.5rem } .h-11 { height: 2.75rem } .h-4 { height: 1rem } .h-6 { height: 1.5rem } .h-8 { height: 2rem } .h-9 { height: 2.25rem } .h-\[108px\] { height: 108px } .h-\[110px\] { height: 110px } .h-\[45rem\] { height: 45rem } .h-\[60px\] { height: 60px } .h-\[66px\] { height: 66px } .h-\[92\%\] { height: 92% } .h-auto { height: auto } .h-fit { height: fit-content } .h-full { height: 100% } .w-0\.5 { width: .125rem } .w-10 { width: 2.5rem } .w-16 { width: 4rem } .w-4 { width: 1rem } .w-6 { width: 1.5rem } .w-64 { width: 16rem } .w-8 { width: 2rem } .w-\[180px\] { width: 180px } .w-\[66px\] { width: 66px } .w-fit { width: fit-content } .w-full { width: 100% } .min-w-\[60px\] { min-width: 60px } .max-w-4xl { max-width: 56rem } .max-w-\[1362px\] { max-width: 1362px } .max-w-\[480px\] { max-width: 480px } .max-w-\[830px\] { max-width: 830px } .max-w-lg { max-width: 32rem } .flex-1 { flex: 1 1 0% } .flex-shrink-0,.shrink-0 { flex-shrink: 0 } .-translate-x-1\/2 { --tw-translate-x: -50% } .-translate-x-1\/2,.-translate-x-full { transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .-translate-x-full { --tw-translate-x: -100% } .-translate-y-1\/2 { --tw-translate-y: -50% } .-translate-y-1\/2,.translate-x-0 { transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .translate-x-0 { --tw-translate-x: 0px } .translate-x-\[-50\%\] { --tw-translate-x: -50% } .translate-x-\[-50\%\],.translate-x-full { transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .translate-x-full { --tw-translate-x: 100% } .translate-y-\[-50\%\] { --tw-translate-y: -50% } .-rotate-45,.translate-y-\[-50\%\] { transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .-rotate-45 { --tw-rotate: -45deg } .transform { transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .cursor-pointer { cursor: pointer } .grid-cols-1 { grid-template-columns: repeat(1,minmax(0,1fr)) } .flex-col { flex-direction: column } .flex-col-reverse { flex-direction: column-reverse } .flex-wrap { flex-wrap: wrap } .items-start { align-items: flex-start } .items-center { align-items: center } .justify-start { justify-content: flex-start } .justify-end { justify-content: flex-end } .justify-center { justify-content: center } .justify-between { justify-content: space-between } .gap-2 { gap: .5rem } .gap-3 { gap: .75rem } .gap-4 { gap: 1rem } .gap-5 { gap: 1.25rem } .gap-6 { gap: 1.5rem } .gap-8 { gap: 2rem } .gap-\[20px\] { gap: 20px } .gap-\[30px\] { gap: 30px } .gap-\[4rem\] { gap: 4rem } .space-y-1\.5>:not([hidden])~:not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(.375rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(.375rem * var(--tw-space-y-reverse)) } .space-y-2>:not([hidden])~:not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(.5rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(.5rem * var(--tw-space-y-reverse)) } .space-y-4>:not([hidden])~:not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1rem * var(--tw-space-y-reverse)) } .overflow-hidden { overflow: hidden } .overflow-clip { overflow: clip } .overflow-x-clip { overflow-x: clip } .scroll-smooth { scroll-behavior: smooth } .whitespace-nowrap { white-space: nowrap } .text-wrap { text-wrap: wrap } .text-nowrap { text-wrap: nowrap } .rounded { border-radius: .25rem } .rounded-3xl { border-radius: 1.5rem } .rounded-\[10px\] { border-radius: 10px } .rounded-\[12px\] { border-radius: 12px } .rounded-\[15px\] { border-radius: 15px } .rounded-\[20px\] { border-radius: 20px } .rounded-\[30px\] { border-radius: 30px } .rounded-full { border-radius: 9999px } .rounded-lg { border-radius: .5rem } .rounded-md { border-radius: .375rem } .rounded-sm { border-radius: .125rem } .rounded-b-lg { border-bottom-right-radius: .5rem; border-bottom-left-radius: .5rem } .border { border-width: 1px } .border-b { border-bottom-width: 1px } .border-t { border-top-width: 1px } .border-none { border-style: none } /* ========== أنماط الخلفيات والحدود والنصوص (Utilities) ========== */ .border-\[\#EBEBEB1A\] { border-color: var(--raqmana-border) } .border-\[\#FFFFFF1A\] { border-color: var(--raqmana-border-light) } .border-slate-200 { --tw-border-opacity: 1; border-color: rgb(226 232 240/var(--tw-border-opacity)) } .border-white\/20 { border-color: hsla(0,0%,100%,.2) } .border-t-\[\#252830\] { --tw-border-opacity: 1; border-top-color: rgb(37 40 48/var(--tw-border-opacity)) } .bg-\[\#161A26\] { background-color: var(--raqmana-bg) } .bg-\[\#1A1F2D\] { background-color: var(--raqmana-card-alt) } .bg-\[\#1B1F2B\] { background-color: var(--raqmana-card-dark) } .bg-\[\#252A3BCC\] { background-color: var(--raqmana-card-alpha) } .bg-\[\#252A3B\],.bg-\[\#252a3b\] { background-color: var(--raqmana-card) } .bg-\[\#2c3142\] { background-color: var(--raqmana-card-secondary) } .bg-\[\#5337ff\] { background-color: var(--raqmana-primary) } .bg-\[\#5C647942\] { background-color: var(--raqmana-overlay) } .bg-\[\#7C889D\] { --tw-bg-opacity: 1; background-color: rgb(124 136 157/var(--tw-bg-opacity)) } .bg-\[\#FFFFFF0D\] { background-color: var(--raqmana-surface) } .bg-black { --tw-bg-opacity: 1; background-color: rgb(0 0 0/var(--tw-bg-opacity)) } .bg-black\/80 { background-color: rgba(0,0,0,.8) } .bg-gray-800 { --tw-bg-opacity: 1; background-color: rgb(31 41 55/var(--tw-bg-opacity)) } .bg-primaryColor { --tw-bg-opacity: 1; background-color: rgb(83 55 255/var(--tw-bg-opacity)) } .bg-red-500 { --tw-bg-opacity: 1; background-color: rgb(239 68 68/var(--tw-bg-opacity)) } .bg-slate-100 { --tw-bg-opacity: 1; background-color: rgb(241 245 249/var(--tw-bg-opacity)) } .bg-slate-900 { --tw-bg-opacity: 1; background-color: rgb(15 23 42/var(--tw-bg-opacity)) } .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255/var(--tw-bg-opacity)) } .bg-opacity-20 { --tw-bg-opacity: 0.2 } .bg-opacity-50 { --tw-bg-opacity: 0.5 } .bg-contain { background-size: contain } .object-contain { object-fit: contain } .object-cover { object-fit: cover } .p-2 { padding: .5rem } .p-3 { padding: .75rem } .p-5 { padding: 1.25rem } .p-6 { padding: 1.5rem } .p-\[14px\] { padding: 14px } .p-\[30px\] { padding: 30px } .px-10 { padding-left: 2.5rem; padding-right: 2.5rem } .px-3 { padding-left: .75rem; padding-right: .75rem } .px-4 { padding-left: 1rem; padding-right: 1rem } .px-6 { padding-left: 1.5rem; padding-right: 1.5rem } .px-8 { padding-left: 2rem; padding-right: 2rem } .py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem } .py-12 { padding-top: 3rem; padding-bottom: 3rem } .py-2 { padding-top: .5rem; padding-bottom: .5rem } .py-3 { padding-top: .75rem; padding-bottom: .75rem } .py-4 { padding-top: 1rem; padding-bottom: 1rem } .py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem } .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem } .py-8 { padding-top: 2rem; padding-bottom: 2rem } .pb-10 { padding-bottom: 2.5rem } .pb-20 { padding-bottom: 5rem } .pb-4 { padding-bottom: 1rem } .pb-5 { padding-bottom: 1.25rem } .pb-\[10\.5rem\] { padding-bottom: 10.5rem } .pe-4 { padding-inline-end:1rem} .ps-4 { padding-inline-start:1rem} .pt-0 { padding-top: 0 } .pt-8 { padding-top: 2rem } .pt-\[7\.5rem\] { padding-top: 7.5rem } .text-center { text-align: center } .text-start { text-align: start } .text-2xl { font-size: 1.5rem; line-height: 2rem } .text-3xl { font-size: 1.875rem; line-height: 2.25rem } .text-\[12px\] { font-size: 12px } .text-\[14px\] { font-size: 14px } .text-\[16px\] { font-size: 16px } .text-\[18px\] { font-size: 18px } .text-\[19px\] { font-size: 19px } .text-\[20px\] { font-size: 20px } .text-\[23px\] { font-size: 23px } .text-\[40px\] { font-size: 40px } .text-base { font-size: 1rem; line-height: 1.5rem } .text-lg { font-size: 1.125rem; line-height: 1.75rem } .text-sm { font-size: .875rem; line-height: 1.25rem } .text-xl { font-size: 1.25rem; line-height: 1.75rem } .font-\[400\] { font-weight: 400 } .font-\[500\] { font-weight: 500 } .font-bold { font-weight: 700 } .font-medium { font-weight: 500 } .font-normal { font-weight: 400 } .font-semibold { font-weight: 600 } .capitalize { text-transform: capitalize } .\!leading-\[50px\] { line-height: 50px } .leading-7 { line-height: 1.75rem } .leading-\[52\.32px\] { line-height: 52.32px } .leading-none { line-height: 1 } .tracking-tight { letter-spacing: -.025em } .text-\[\#5337FF\],.text-\[\#5337ff\] { color: var(--raqmana-primary) } .text-\[\#6C7278\] { color: var(--raqmana-text-gray) } .text-\[\#9DA2B3\],.text-\[\#9da2b3\] { --tw-text-opacity: 1; color: rgb(157 162 179/var(--tw-text-opacity)) } .text-\[\#BEC4E0\] { color: var(--raqmana-text-light) } .text-blue-500 { --tw-text-opacity: 1; color: rgb(59 130 246/var(--tw-text-opacity)) } .text-gray-300 { --tw-text-opacity: 1; color: rgb(209 213 219/var(--tw-text-opacity)) } .text-gray-400 { --tw-text-opacity: 1; color: rgb(156 163 175/var(--tw-text-opacity)) } .text-slate-50 { --tw-text-opacity: 1; color: rgb(248 250 252/var(--tw-text-opacity)) } .text-slate-500 { --tw-text-opacity: 1; color: rgb(100 116 139/var(--tw-text-opacity)) } .text-slate-900 { --tw-text-opacity: 1; color: rgb(15 23 42/var(--tw-text-opacity)) } .text-white { --tw-text-opacity: 1; color: rgb(255 255 255/var(--tw-text-opacity)) } .text-yellow-400 { --tw-text-opacity: 1; color: rgb(250 204 21/var(--tw-text-opacity)) } .underline-offset-4 { text-underline-offset: 4px } .opacity-70 { opacity: .7 } .opacity-75 { opacity: .75 } .opacity-\[76\%\] { opacity: 76% } .shadow-lg { --tw-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color) } .shadow-lg,.shadow-md { box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow) } .shadow-md { --tw-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color) } .outline { outline-style: solid } .ring-offset-white { --tw-ring-offset-color: #fff } .blur-\[160px\] { --tw-blur: blur(160px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) } .backdrop-blur-sm { --tw-backdrop-blur: blur(4px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) } .transition-all { transition-property: all; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s } .transition-colors { transition-property: color,background-color,border-color,text-decoration-color,fill,stroke; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s } .transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s } .transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s } .duration-200 { transition-duration: .2s } .duration-300 { transition-duration: .3s } .ease-in-out { transition-timing-function: cubic-bezier(.4,0,.2,1) } @keyframes enter { 0% { opacity: var(--tw-enter-opacity,1); transform: translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0)) } } @keyframes exit { to { opacity: var(--tw-exit-opacity,1); transform: translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0)) } } .zoom-in { --tw-enter-scale: 0 } .duration-200 { animation-duration: .2s } .duration-300 { animation-duration: .3s } .ease-in-out { animation-timing-function: cubic-bezier(.4,0,.2,1) } html { scroll-behavior: smooth } /* ========== مكونات الموقع (Hero, Why Us, Blog, Scrollbar) ========== */ body { background-color: var(--raqmana-bg); color: var(--raqmana-text); overflow-x: hidden } .hero h2 { background: linear-gradient(0deg,#fff -4.78%,hsla(0,0%,100%,0) 223.03%); background-clip: text; -webkit-background-clip: text } .hero h2,.hero p { -webkit-text-fill-color: transparent } .hero p { background: linear-gradient(180deg,#eaeaea,hsla(0,0%,92%,0) 321.67%); background-clip: text; -webkit-background-clip: text } .gradient-text { background-clip: text; color: transparent; background-image: linear-gradient(180deg,hsla(0,0%,92%,.5),hsla(0,0%,92%,0) 321.67%) } .whyUs-card { border: .89px solid var(--raqmana-whyus-border); background: var(--raqmana-card-alt); border-radius: .5rem; --tw-backdrop-blur: blur(8px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) } .blog-content { width: 100% } .blog-content * { color: var(--raqmana-text) } .blog-content img { max-width: 70%; object-fit: contain; margin-inline:auto;height: auto } body::-webkit-scrollbar { width: 12px } body::-webkit-scrollbar-track { background: var(--raqmana-bg) } body::-webkit-scrollbar-thumb { background-color: var(--raqmana-scrollbar-thumb); border-radius: 20px } .hover\:bg-red-500\/90:hover { background-color: rgba(239,68,68,.9) } .hover\:bg-slate-100:hover { --tw-bg-opacity: 1; background-color: rgb(241 245 249/var(--tw-bg-opacity)) } .hover\:bg-slate-100\/80:hover { background-color: rgba(241,245,249,.8) } .hover\:bg-slate-900\/90:hover { background-color: rgba(15,23,42,.9) } .hover\:text-slate-900:hover { --tw-text-opacity: 1; color: rgb(15 23 42/var(--tw-text-opacity)) } .hover\:underline:hover { text-decoration-line: underline } .hover\:no-underline:hover { text-decoration-line: none } .hover\:opacity-100:hover { opacity: 1 } .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px } .focus\:ring-2:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000) } .focus\:ring-slate-950:focus { --tw-ring-opacity: 1; --tw-ring-color: rgb(2 6 23/var(--tw-ring-opacity)) } .focus\:ring-offset-2:focus { --tw-ring-offset-width: 2px } .focus-visible\:outline-none:focus-visible { outline: 2px solid transparent; outline-offset: 2px } .focus-visible\:ring-2:focus-visible { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000) } .focus-visible\:ring-slate-950:focus-visible { --tw-ring-opacity: 1; --tw-ring-color: rgb(2 6 23/var(--tw-ring-opacity)) } .focus-visible\:ring-offset-2:focus-visible { --tw-ring-offset-width: 2px } .disabled\:pointer-events-none:disabled { pointer-events: none } .disabled\:opacity-50:disabled { opacity: .5 } .group:hover .group-hover\:scale-\[1\.09\] { --tw-scale-x: 1.09; --tw-scale-y: 1.09; transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .data-\[state\=open\]\:bg-slate-100[data-state=open] { --tw-bg-opacity: 1; background-color: rgb(241 245 249/var(--tw-bg-opacity)) } .data-\[state\=open\]\:text-slate-500[data-state=open] { --tw-text-opacity: 1; color: rgb(100 116 139/var(--tw-text-opacity)) } .data-\[state\=open\]\:animate-in[data-state=open] { animation-name: enter; animation-duration: .15s; --tw-enter-opacity: initial; --tw-enter-scale: initial; --tw-enter-rotate: initial; --tw-enter-translate-x: initial; --tw-enter-translate-y: initial } .data-\[state\=closed\]\:animate-out[data-state=closed] { animation-name: exit; animation-duration: .15s; --tw-exit-opacity: initial; --tw-exit-scale: initial; --tw-exit-rotate: initial; --tw-exit-translate-x: initial; --tw-exit-translate-y: initial } .data-\[state\=closed\]\:fade-out-0[data-state=closed] { --tw-exit-opacity: 0 } .data-\[state\=open\]\:fade-in-0[data-state=open] { --tw-enter-opacity: 0 } .data-\[state\=closed\]\:zoom-out-95[data-state=closed] { --tw-exit-scale: .95 } .data-\[state\=open\]\:zoom-in-95[data-state=open] { --tw-enter-scale: .95 } .data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state=closed] { --tw-exit-translate-x: -50% } .data-\[state\=closed\]\:slide-out-to-top-\[48\%\][data-state=closed] { --tw-exit-translate-y: -48% } .data-\[state\=open\]\:slide-in-from-left-1\/2[data-state=open] { --tw-enter-translate-x: -50% } .data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state=open] { --tw-enter-translate-y: -48% } .dark\:border-slate-800:is(.dark *) { --tw-border-opacity: 1; border-color: rgb(30 41 59/var(--tw-border-opacity)) } .dark\:bg-red-900:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(127 29 29/var(--tw-bg-opacity)) } .dark\:bg-slate-50:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(248 250 252/var(--tw-bg-opacity)) } .dark\:bg-slate-800:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(30 41 59/var(--tw-bg-opacity)) } .dark\:bg-slate-950:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(2 6 23/var(--tw-bg-opacity)) } .dark\:text-slate-400:is(.dark *) { --tw-text-opacity: 1; color: rgb(148 163 184/var(--tw-text-opacity)) } .dark\:text-slate-50:is(.dark *) { --tw-text-opacity: 1; color: rgb(248 250 252/var(--tw-text-opacity)) } .dark\:text-slate-900:is(.dark *) { --tw-text-opacity: 1; color: rgb(15 23 42/var(--tw-text-opacity)) } .dark\:ring-offset-slate-950:is(.dark *) { --tw-ring-offset-color: #020617 } .dark\:hover\:bg-red-900\/90:hover:is(.dark *) { background-color: rgba(127,29,29,.9) } .dark\:hover\:bg-slate-50\/90:hover:is(.dark *) { background-color: rgba(248,250,252,.9) } .dark\:hover\:bg-slate-800:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(30 41 59/var(--tw-bg-opacity)) } .dark\:hover\:bg-slate-800\/80:hover:is(.dark *) { background-color: rgba(30,41,59,.8) } .dark\:hover\:text-slate-50:hover:is(.dark *) { --tw-text-opacity: 1; color: rgb(248 250 252/var(--tw-text-opacity)) } .dark\:focus\:ring-slate-300:focus:is(.dark *) { --tw-ring-opacity: 1; --tw-ring-color: rgb(203 213 225/var(--tw-ring-opacity)) } .dark\:focus-visible\:ring-slate-300:focus-visible:is(.dark *) { --tw-ring-opacity: 1; --tw-ring-color: rgb(203 213 225/var(--tw-ring-opacity)) } .dark\:data-\[state\=open\]\:bg-slate-800[data-state=open]:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(30 41 59/var(--tw-bg-opacity)) } .dark\:data-\[state\=open\]\:text-slate-400[data-state=open]:is(.dark *) { --tw-text-opacity: 1; color: rgb(148 163 184/var(--tw-text-opacity)) } @media (min-width: 640px) { .sm\:min-h-\[50px\] { min-height:50px } .sm\:w-1\/4 { width: 25% } .sm\:flex-row { flex-direction: row } .sm\:justify-end { justify-content: flex-end } .sm\:gap-4 { gap: 1rem } .sm\:space-x-2>:not([hidden])~:not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(.5rem * var(--tw-space-x-reverse)); margin-left: calc(.5rem * calc(1 - var(--tw-space-x-reverse))) } .sm\:rounded-lg { border-radius: .5rem } .sm\:text-left { text-align: left } } @media (min-width: 768px) { .md\:mb-16 { margin-bottom:4rem } .md\:me-8 { margin-inline-end:2rem} .md\:mr-\[32px\] { margin-right: 32px } .md\:ms-0 { margin-inline-start:0} .md\:ms-8 { margin-inline-start:2rem} .md\:mt-0 { margin-top: 0 } .md\:mt-\[50px\] { margin-top: 50px } .md\:block { display: block } .md\:flex { display: flex } .md\:hidden { display: none } .md\:h-\[71px\] { height: 71px } .md\:w-24 { width: 6rem } .md\:w-\[300px\] { width: 300px } .md\:w-\[700px\] { width: 700px } .md\:max-w-\[300px\] { max-width: 300px } .md\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .md\:flex-row { flex-direction: row } .md\:flex-row-reverse { flex-direction: row-reverse } .md\:flex-col { flex-direction: column } .md\:items-start { align-items: flex-start } .md\:justify-start { justify-content: flex-start } .md\:gap-12 { gap: 3rem } .md\:gap-4 { gap: 1rem } .md\:rounded-\[15px\] { border-radius: 15px } .md\:pe-8 { padding-inline-end:2rem} .md\:ps-0 { padding-inline-start:0} .md\:ps-8 { padding-inline-start:2rem} .md\:text-left { text-align: left } .md\:text-start { text-align: start } .md\:text-4xl { font-size: 2.25rem; line-height: 2.5rem } .md\:text-6xl { font-size: 3.75rem; line-height: 1 } .md\:text-\[25px\] { font-size: 25px } .md\:text-base { font-size: 1rem; line-height: 1.5rem } .md\:text-lg { font-size: 1.125rem; line-height: 1.75rem } .md\:text-xl { font-size: 1.25rem; line-height: 1.75rem } .md\:\!leading-\[80px\] { line-height: 80px } } @media (min-width: 1024px) { .lg\:mx-16 { margin-left:4rem; margin-right: 4rem } .lg\:block { display: block } .lg\:hidden { display: none } .lg\:h-full { height: 100% } .lg\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .lg\:grid-cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)) } .lg\:flex-row { flex-direction: row } .lg\:items-center { align-items: center } .lg\:gap-\[8rem\] { gap: 8rem } .lg\:bg-cover { background-size: cover } .lg\:p-6 { padding: 1.5rem } } @media (min-width: 1280px) { .xl\:max-w-\[540px\] { max-width:540px } .xl\:gap-\[10rem\] { gap: 10rem } } /* Overrides for Raqmana Identity Update */ .bg-primaryColor { background: linear-gradient(135deg, var(--raqmana-primary) 0%, var(--raqmana-secondary) 100%) !important; color: var(--raqmana-bg) !important; } .text-\[\#5337FF\],.text-\[\#5337ff\] { background: linear-gradient(135deg, var(--raqmana-primary) 0%, var(--raqmana-secondary) 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; color: transparent !important; } .\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg { --tw-rotate: 180deg; transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .border-gradient-card { border: 1px solid transparent !important; background-image: linear-gradient(#1a1f38, #1a1f38), linear-gradient(135deg, var(--raqmana-primary), var(--raqmana-secondary)) !important; background-origin: border-box !important; background-clip: padding-box, border-box !important; transition: all 0.3s ease; } .border-gradient-card:hover { border-color: transparent !important; background-image: linear-gradient(#1a1f38, #1a1f38), linear-gradient(135deg, var(--raqmana-secondary), var(--raqmana-primary)) !important; box-shadow: 0 0 2px rgba(0, 255, 103, 0.15), 0 0 15px rgba(0, 217, 255, 0.08); }