:root{--font-size-base: 16px;--spacing-unit: 8px;--border-radius: 8px;--touch-target-min: 44px;--color-primary: #6366f1;--color-secondary: #8b5cf6;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04)}@media(max-width:479px){:root{--font-size-base: 14px;--spacing-unit: 6px;--touch-target-min: 48px}.text-xs{font-size:12px;line-height:16px}.text-sm,.text-base{font-size:14px;line-height:20px}.text-lg{font-size:16px;line-height:24px}.text-xl{font-size:18px;line-height:28px}.text-2xl{font-size:20px;line-height:28px}.text-3xl{font-size:24px;line-height:32px}}@media(min-width:480px)and (max-width:767px){:root{--font-size-base: 15px;--spacing-unit: 8px;--touch-target-min: 46px}.text-xs{font-size:13px;line-height:18px}.text-sm{font-size:14px;line-height:20px}.text-base{font-size:15px;line-height:24px}.text-lg{font-size:17px;line-height:28px}.text-xl{font-size:19px;line-height:28px}.text-2xl{font-size:22px;line-height:32px}.text-3xl{font-size:26px;line-height:36px}}@media(min-width:768px)and (max-width:1023px){:root{--font-size-base: 16px;--spacing-unit: 10px;--touch-target-min: 44px}.text-xs{font-size:14px;line-height:20px}.text-sm{font-size:15px;line-height:22px}.text-base{font-size:16px;line-height:24px}.text-lg{font-size:18px;line-height:28px}.text-xl{font-size:20px;line-height:32px}.text-2xl{font-size:24px;line-height:36px}.text-3xl{font-size:30px;line-height:40px}}@media(min-width:1024px){.text-xs{font-size:14px;line-height:20px}.text-sm,.text-base{font-size:16px;line-height:24px}.text-lg{font-size:18px;line-height:28px}.text-xl{font-size:22px;line-height:32px}.text-2xl{font-size:26px;line-height:36px}.text-3xl{font-size:32px;line-height:40px}}@media(max-width:479px){.p-xs{padding:var(--spacing-unit)}.p-sm{padding:calc(var(--spacing-unit) * 2)}.p-md{padding:calc(var(--spacing-unit) * 3)}.p-lg{padding:calc(var(--spacing-unit) * 4)}.m-xs{margin:var(--spacing-unit)}.m-sm{margin:calc(var(--spacing-unit) * 2)}.m-md{margin:calc(var(--spacing-unit) * 3)}.m-lg{margin:calc(var(--spacing-unit) * 4)}.gap-xs{gap:var(--spacing-unit)}.gap-sm{gap:calc(var(--spacing-unit) * 2)}.gap-md{gap:calc(var(--spacing-unit) * 3)}.gap-lg{gap:calc(var(--spacing-unit) * 4)}}@media(min-width:480px){.sm\:p-xs{padding:var(--spacing-unit)}.sm\:p-sm{padding:calc(var(--spacing-unit) * 2)}.sm\:p-md{padding:calc(var(--spacing-unit) * 3)}.sm\:p-lg{padding:calc(var(--spacing-unit) * 4)}.sm\:m-xs{margin:var(--spacing-unit)}.sm\:m-sm{margin:calc(var(--spacing-unit) * 2)}.sm\:m-md{margin:calc(var(--spacing-unit) * 3)}.sm\:m-lg{margin:calc(var(--spacing-unit) * 4)}.sm\:gap-xs{gap:var(--spacing-unit)}.sm\:gap-sm{gap:calc(var(--spacing-unit) * 2)}.sm\:gap-md{gap:calc(var(--spacing-unit) * 3)}.sm\:gap-lg{gap:calc(var(--spacing-unit) * 4)}}@media(min-width:768px){.md\:p-xs{padding:var(--spacing-unit)}.md\:p-sm{padding:calc(var(--spacing-unit) * 2)}.md\:p-md{padding:calc(var(--spacing-unit) * 3)}.md\:p-lg{padding:calc(var(--spacing-unit) * 4)}.md\:m-xs{margin:var(--spacing-unit)}.md\:m-sm{margin:calc(var(--spacing-unit) * 2)}.md\:m-md{margin:calc(var(--spacing-unit) * 3)}.md\:m-lg{margin:calc(var(--spacing-unit) * 4)}.md\:gap-xs{gap:var(--spacing-unit)}.md\:gap-sm{gap:calc(var(--spacing-unit) * 2)}.md\:gap-md{gap:calc(var(--spacing-unit) * 3)}.md\:gap-lg{gap:calc(var(--spacing-unit) * 4)}}@media(min-width:1024px){.lg\:p-xs{padding:var(--spacing-unit)}.lg\:p-sm{padding:calc(var(--spacing-unit) * 2)}.lg\:p-md{padding:calc(var(--spacing-unit) * 3)}.lg\:p-lg{padding:calc(var(--spacing-unit) * 4)}.lg\:m-xs{margin:var(--spacing-unit)}.lg\:m-sm{margin:calc(var(--spacing-unit) * 2)}.lg\:m-md{margin:calc(var(--spacing-unit) * 3)}.lg\:m-lg{margin:calc(var(--spacing-unit) * 4)}.lg\:gap-xs{gap:var(--spacing-unit)}.lg\:gap-sm{gap:calc(var(--spacing-unit) * 2)}.lg\:gap-md{gap:calc(var(--spacing-unit) * 3)}.lg\:gap-lg{gap:calc(var(--spacing-unit) * 4)}}.grid-responsive{display:grid;gap:1rem;grid-template-columns:1fr}@media(min-width:640px){.grid-responsive{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.grid-responsive{grid-template-columns:repeat(3,1fr)}}@media(min-width:1280px){.grid-responsive{grid-template-columns:repeat(4,1fr)}}.course-card{display:flex;flex-direction:column;height:100%;transition:all .3s ease}@media(max-width:767px){.course-card{margin-bottom:1rem}.course-card .card-image{height:200px}.course-card .card-content{padding:1rem}}@media(min-width:768px){.course-card .card-image{height:180px}}@media(min-width:1024px){.course-card .card-image{height:160px}}.modal-responsive{width:100%;height:100%;max-width:100%;max-height:100%;margin:0}@media(min-width:640px){.modal-responsive{width:90%;height:90%;max-width:640px;max-height:90%;margin:auto}}@media(min-width:1024px){.modal-responsive{width:80%;height:80%;max-width:800px;max-height:600px}}.modal-content{display:flex;flex-direction:column;height:100%;overflow-y:auto}.modal-header{padding:1rem;border-bottom:1px solid #e5e7eb}.modal-body{flex:1;padding:1rem;overflow-y:auto}.modal-footer{padding:1rem;border-top:1px solid #e5e7eb}@media(max-width:767px){.modal-header,.modal-body,.modal-footer{padding:.75rem}}.filters-responsive{display:flex;flex-direction:column;gap:1rem}@media(min-width:768px){.filters-responsive{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}}.filter-item{display:flex;flex-direction:column;min-width:0}@media(max-width:767px){.filters-responsive .filter-item{margin-bottom:.5rem}}.nav-responsive{display:flex;flex-direction:column;padding:1rem}@media(min-width:768px){.nav-responsive{flex-direction:row;align-items:center;justify-content:space-between}}.nav-item{display:block;padding:.75rem 1rem;text-decoration:none;color:#6b7280;border-radius:.5rem;transition:all .2s;min-height:var(--touch-target-min);display:flex;align-items:center}@media(max-width:767px){.nav-item{margin-bottom:.5rem;font-size:16px}}.nav-item:hover,.nav-item.active{color:var(--color-primary);background-color:#6366f11a}@media(hover:none){.hover\:scale-105:hover{transform:none}.hover\:shadow-lg:hover{box-shadow:var(--shadow-md)}}@media(pointer:coarse){button,.btn,input,select,textarea{min-height:var(--touch-target-min);font-size:16px}.touch-target{min-height:var(--touch-target-min);min-width:var(--touch-target-min)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(prefers-contrast:high){:root{--color-primary: #000080;--color-secondary: #800080;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .5);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .5), 0 2px 4px -1px rgba(0, 0, 0, .5);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .5)}.text-slate-600,.text-slate-500,.text-gray-500{color:#000!important}.bg-slate-50,.bg-gray-50{background-color:#fff!important;border:1px solid #000!important}}.loading-responsive{display:flex;align-items:center;justify-content:center;min-height:200px;padding:2rem 1rem}@media(max-width:767px){.loading-responsive{min-height:150px;padding:1.5rem 1rem}}.loading-spinner{width:40px;height:40px;border:3px solid #f3f4f6;border-top:3px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@media(max-width:767px){.loading-spinner{width:32px;height:32px;border-width:2px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.container-responsive{width:100%;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}@media(min-width:640px){.container-responsive{max-width:640px;padding-left:1.5rem;padding-right:1.5rem}}@media(min-width:768px){.container-responsive{max-width:768px}}@media(min-width:1024px){.container-responsive{max-width:1024px;padding-left:2rem;padding-right:2rem}}@media(min-width:1280px){.container-responsive{max-width:1200px}}@media(min-width:1536px){.container-responsive{max-width:1280px}}@media print{.no-print{display:none!important}.course-card{break-inside:avoid;margin-bottom:1rem;box-shadow:none!important;border:1px solid #000}.modal,.fixed,.absolute{position:static!important}}:root{--web3-primary: #6366f1;--web3-primary-glow: #818cf8;--web3-secondary: #8b5cf6;--web3-secondary-glow: #a78bfa;--web3-accent: #06b6d4;--web3-accent-glow: #22d3ee;--neon-blue: #00d4ff;--neon-purple: #9d4edd;--neon-cyan: #00f5ff;--neon-pink: #ff0080;--neon-green: #00ff88;--bg-primary: #0a0a0f;--bg-secondary: #111118;--bg-tertiary: #1a1a24;--bg-card: rgba(26, 26, 36, .8);--bg-glass: rgba(255, 255, 255, .05);--bg-glass-strong: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .1);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .3);--glass-backdrop: blur(16px);--gradient-primary: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--gradient-secondary: linear-gradient(135deg, #06b6d4 0%, #6366f1 100%);--gradient-accent: linear-gradient(135deg, #00d4ff 0%, #9d4edd 100%);--gradient-bg: linear-gradient(135deg, #0a0a0f 0%, #111118 50%, #1a1a24 100%);--shadow-neon: 0 0 20px rgba(99, 102, 241, .3);--shadow-neon-strong: 0 0 30px rgba(99, 102, 241, .5);--shadow-glow: 0 0 15px rgba(6, 182, 212, .4);--font-mono: "JetBrains Mono", "Fira Code", monospace;--font-display: "Inter", "SF Pro Display", sans-serif;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1)}.glass-card{background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow)}.glass-card-strong{background:var(--bg-glass-strong);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-shadow)}.glass-button{background:var(--bg-glass);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);border-radius:12px;box-shadow:var(--glass-shadow);transition:all var(--transition-normal)}.glass-button:hover{background:var(--bg-glass-strong);box-shadow:var(--shadow-neon);transform:translateY(-2px)}.neon-glow{box-shadow:var(--shadow-neon);transition:box-shadow var(--transition-normal)}.neon-glow:hover{box-shadow:var(--shadow-neon-strong)}.neon-text{text-shadow:0 0 10px currentColor}.neon-border{border:1px solid;border-image:linear-gradient(45deg,var(--neon-blue),var(--neon-purple)) 1;animation:neon-pulse 2s ease-in-out infinite alternate}.gradient-primary{background:var(--gradient-primary)}.gradient-secondary{background:var(--gradient-secondary)}.gradient-accent{background:var(--gradient-accent)}.gradient-bg{background:var(--gradient-bg)}.gradient-text{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@keyframes neon-pulse{0%{box-shadow:0 0 5px var(--neon-blue),0 0 10px var(--neon-blue),0 0 15px var(--neon-blue)}to{box-shadow:0 0 10px var(--neon-purple),0 0 20px var(--neon-purple),0 0 30px var(--neon-purple)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.animate-float{animation:float 3s ease-in-out infinite}.animate-glow-pulse{animation:glow-pulse 2s ease-in-out infinite}.animate-slide-in-up{animation:slide-in-up .6s ease-out}.animate-fade-in{animation:fade-in .5s ease-out}.btn-web3{background:var(--gradient-primary);border:none;border-radius:12px;color:#fff;font-weight:600;padding:12px 24px;position:relative;overflow:hidden;transition:all var(--transition-normal)}.btn-web3:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-web3:hover:before{left:100%}.btn-web3:hover{box-shadow:var(--shadow-neon-strong);transform:translateY(-2px)}.btn-web3-outline{background:transparent;border:2px solid var(--web3-primary);color:var(--web3-primary);box-shadow:var(--shadow-neon)}.btn-web3-outline:hover{background:var(--web3-primary);color:#fff}.card-web3{background:var(--bg-card);border:1px solid var(--glass-border);border-radius:16px;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);box-shadow:var(--glass-shadow);transition:all var(--transition-normal);position:relative;overflow:hidden}.card-web3:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gradient-primary);opacity:0;transition:opacity var(--transition-normal)}.card-web3:hover:before{opacity:1}.card-web3:hover{transform:translateY(-4px);box-shadow:var(--shadow-neon),var(--glass-shadow)}.input-web3{background:var(--bg-glass);border:1px solid var(--glass-border);border-radius:12px;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);color:#fff;padding:12px 16px;transition:all var(--transition-normal)}.input-web3:focus{border-color:var(--web3-primary);box-shadow:var(--shadow-neon);outline:none}.text-web3-primary{color:var(--web3-primary)}.text-web3-secondary{color:var(--web3-secondary)}.text-web3-accent{color:var(--web3-accent)}.font-display{font-family:var(--font-display)}.font-mono{font-family:var(--font-mono)}@media(prefers-color-scheme:dark){:root{--bg-primary: #0a0a0f;--bg-secondary: #111118;--bg-tertiary: #1a1a24}}[dir=rtl] .glass-card,[dir=rtl] .glass-button,[dir=rtl] .card-web3{direction:rtl}[dir=rtl] .btn-web3:before{left:auto;right:-100%}[dir=rtl] .btn-web3:hover:before{left:auto;right:100%}@media(max-width:768px){.glass-card,.glass-card-strong,.card-web3{border-radius:12px}.btn-web3{padding:10px 20px;font-size:14px}}@media(prefers-reduced-motion:reduce){.animate-float,.animate-glow-pulse,.animate-slide-in-up,.animate-fade-in{animation:none}.glass-button:hover,.card-web3:hover,.btn-web3:hover{transform:none}}.geometric-bg:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 25% 25%,rgba(99,102,241,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(139,92,246,.1) 0%,transparent 50%);pointer-events:none}.grid-pattern{background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:20px 20px}.loading-web3{position:relative;overflow:hidden}.loading-web3:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(99,102,241,.1),transparent);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{left:-100%}to{left:100%}}[dir=rtl] .card-web3,[dir=rtl] .glass-card,[dir=rtl] .glass-button{text-align:right}[dir=rtl] .course-card .card-image .absolute{right:3;left:auto}[dir=rtl] .course-card .flex.items-center.justify-between{flex-direction:row-reverse}[dir=rtl] .course-card .text-right{text-align:left}[dir=rtl] .course-card .ml-1,[dir=rtl] .course-card .ml-3{margin-left:0;margin-right:.25rem}[dir=rtl] .course-card .ml-1{margin-right:.25rem}[dir=rtl] .course-card .ml-3{margin-right:.75rem}[dir=rtl] body,[dir=rtl] p,[dir=rtl] span,[dir=rtl] div,[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3,[dir=rtl] h4,[dir=rtl] h5,[dir=rtl] h6,[dir=rtl] a,[dir=rtl] button,[dir=rtl] input,[dir=rtl] textarea,[dir=rtl] select{font-family:Cairo,Tajawal,Amiri,Noto Sans Arabic,sans-serif;font-weight:400;letter-spacing:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.font-display,[dir=rtl] .font-display{font-family:Cairo,Tajawal,Amiri,Noto Sans Arabic,sans-serif;font-weight:400;letter-spacing:0}.font-mono,[dir=rtl] .font-mono{font-family:Cairo,Tajawal,Amiri,Noto Sans Arabic,monospace;letter-spacing:0}[dir=rtl] .text-lg,[dir=rtl] .text-xl,[dir=rtl] .text-2xl{line-height:1.6}[dir=rtl] .text-sm,[dir=rtl] .text-xs{line-height:1.5}[dir=rtl] .space-y-3>*+*{margin-top:.75rem}[dir=rtl] .space-y-4>*+*{margin-top:1rem}[dir=rtl] .gap-2{gap:.5rem}[dir=rtl] .gap-4{gap:1rem}.particles-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:hidden}.particle{position:absolute;background:var(--web3-primary);border-radius:50%;opacity:.1;animation:float-particle 10s infinite linear}.particle:nth-child(2n){background:var(--web3-secondary);animation-duration:12s;animation-delay:-2s}.particle:nth-child(3n){background:var(--web3-accent);animation-duration:15s;animation-delay:-4s}@keyframes float-particle{0%{transform:translateY(100vh) rotate(0);opacity:0}10%{opacity:.1}90%{opacity:.1}to{transform:translateY(-100px) rotate(360deg);opacity:0}}.geometric-pattern{position:relative}.geometric-pattern:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 80%,rgba(99,102,241,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(139,92,246,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(6,182,212,.05) 0%,transparent 50%);pointer-events:none}.hover-lift{transition:transform var(--transition-normal),box-shadow var(--transition-normal)}.hover-lift:hover{transform:translateY(-8px);box-shadow:var(--shadow-glow)}.focus-web3:focus{outline:none;box-shadow:0 0 0 2px var(--web3-primary),var(--shadow-neon)}.will-change-transform{will-change:transform}.will-change-opacity{will-change:opacity}@media(max-width:640px){.card-web3{margin:.5rem}.glass-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.neon-glow{box-shadow:0 0 10px #6366f133}}@media(max-width:480px){.text-xl{font-size:1.125rem}.text-2xl{font-size:1.25rem}.card-web3 .p-6{padding:1rem}}.App{text-align:center;min-height:100vh;background:var(--gradient-bg);color:#fff}.App-logo{height:40vmin;pointer-events:none}@media(prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin infinite 20s linear}}.App-header{background:var(--bg-primary);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff;position:relative}.App-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--gradient-bg);opacity:.1;pointer-events:none}.App-link{color:var(--neon-blue);text-shadow:0 0 10px var(--neon-blue);transition:all var(--transition-normal)}.App-link:hover{color:var(--neon-cyan);text-shadow:0 0 15px var(--neon-cyan)}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{background:var(--bg-primary);color:#fff;font-family:Cairo,Tajawal,Amiri,Noto Sans Arabic,sans-serif;transition:background-color var(--transition-normal);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{font-family:inherit}p,span,div,h1,h2,h3,h4,h5,h6,a,button,input,textarea,select{font-family:Cairo,Tajawal,Amiri,Noto Sans Arabic,sans-serif}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--gradient-primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--gradient-secondary)}