:root{--bg-main: #f8fafc;--bg-card: rgba(255, 255, 255, .7);--bg-navbar: rgba(248, 250, 252, .8);--border-color: rgba(226, 232, 240, .8);--border-color-hover: rgba(59, 130, 246, .4);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--color-primary: #3b82f6;--color-secondary: #8b5cf6;--color-accent: #10b981;--color-glow: rgba(59, 130, 246, .15);--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .05);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .05), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .05), 0 10px 10px -5px rgba(0, 0, 0, .04);--gradient-primary: linear-gradient(135deg, #3b82f6, #8b5cf6);--gradient-glow: radial-gradient(circle, rgba(139, 92, 246, .15) 0%, rgba(59, 130, 246, .05) 100%);--backdrop-blur: 12px;--transition-speed: .3s;--transition-bezier: cubic-bezier(.4, 0, .2, 1)}body.dark-theme{--bg-main: #0b0f19;--bg-card: rgba(21, 28, 44, .6);--bg-navbar: rgba(11, 15, 25, .8);--border-color: rgba(255, 255, 255, .08);--border-color-hover: rgba(139, 92, 246, .4);--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--color-primary: #60a5fa;--color-secondary: #a78bfa;--color-accent: #34d399;--color-glow: rgba(139, 92, 246, .25);--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .2);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .3), 0 4px 6px -2px rgba(0, 0, 0, .2);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3);--gradient-primary: linear-gradient(135deg, #60a5fa, #a78bfa);--gradient-glow: radial-gradient(circle, rgba(167, 139, 250, .12) 0%, rgba(96, 165, 250, .03) 100%)}*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}html[lang=ar]{font-family:Cairo,sans-serif}html[lang=en]{font-family:Outfit,sans-serif}body{background-color:var(--bg-main);color:var(--text-primary);overflow-x:hidden;line-height:1.6;transition:background-color var(--transition-speed) var(--transition-bezier),color var(--transition-speed) var(--transition-bezier)}#particle-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}::selection{background:var(--color-primary);color:#fff}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 2rem}.section-padding{padding:7rem 0}.glass{background:var(--bg-card);backdrop-filter:blur(var(--backdrop-blur));-webkit-backdrop-filter:blur(var(--backdrop-blur));border:1px solid var(--border-color);box-shadow:var(--shadow-md);transition:transform var(--transition-speed) var(--transition-bezier),border-color var(--transition-speed) var(--transition-bezier),box-shadow var(--transition-speed) var(--transition-bezier)}.glass:hover{border-color:var(--border-color-hover);box-shadow:0 15px 30px #0000001a,var(--color-glow) 0 8px 24px}.card{border-radius:1.5rem;padding:2.2rem;position:relative;overflow:hidden}.text-gradient{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;padding:.85rem 1.8rem;border-radius:50px;font-size:1rem;font-weight:600;cursor:pointer;text-decoration:none;transition:all var(--transition-speed) var(--transition-bezier);border:none}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 10px 20px -5px #3b82f666}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 15px 25px -5px #3b82f680,var(--color-glow) 0 5px 15px}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover{background:var(--text-primary);color:var(--bg-main);border-color:var(--text-primary);transform:translateY(-3px)}.btn-sm{padding:.5rem 1.2rem;font-size:.875rem;border-radius:8px}.btn-full{width:100%}.btn-icon{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-primary);width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-speed) var(--transition-bezier)}.btn-icon:hover{border-color:var(--color-primary);color:var(--color-primary);transform:scale(1.08)}.btn-lang{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-primary);padding:.4rem 1rem;border-radius:50px;font-weight:600;cursor:pointer;transition:all var(--transition-speed) var(--transition-bezier)}.btn-lang:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn-icon *,.btn-lang *{pointer-events:none}html[dir=rtl] .arrow-icon,html[dir=rtl] .view-arrow{transform:rotate(0);transition:transform var(--transition-speed)}html[dir=ltr] .arrow-icon,html[dir=ltr] .view-arrow{transform:rotate(180deg)}.btn:hover .arrow-icon{transform:translate(-5px)}html[dir=ltr] .btn:hover .arrow-icon{transform:translate(5px)}.navbar{position:fixed;top:0;left:0;width:100%;height:5rem;background:var(--bg-navbar);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));border-bottom:1px solid var(--border-color);z-index:1000;transition:all var(--transition-speed)}.navbar.scrolled{height:4.5rem;box-shadow:var(--shadow-sm)}.nav-container{max-width:1200px;margin:0 auto;height:100%;padding:0 2rem;display:flex;align-items:center;justify-content:space-between}.logo{font-size:1.5rem;font-weight:800;text-decoration:none;color:var(--text-primary);display:flex;align-items:center;gap:.2rem}.logo-accent{color:var(--color-primary);font-family:monospace}.nav-menu ul{display:flex;list-style:none;gap:2rem}.nav-link{text-decoration:none;color:var(--text-secondary);font-weight:600;font-size:.95rem;position:relative;padding:.5rem 0;transition:color var(--transition-speed)}.nav-link:hover,.nav-link.active{color:var(--color-primary)}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--gradient-primary);transition:width var(--transition-speed)}.nav-link:hover:after,.nav-link.active:after{width:100%}.nav-actions{display:flex;align-items:center;gap:1rem}.theme-sun-icon{display:none}body.dark-theme .theme-sun-icon{display:block}body.dark-theme .theme-moon-icon,.mobile-toggle{display:none}.hero-section{min-height:100vh;display:flex;align-items:center;position:relative;padding-top:6rem}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:4rem;align-items:center}.badge{display:inline-flex;align-items:center;gap:.6rem;background:var(--bg-card);border:1px solid var(--border-color);padding:.4rem 1rem;border-radius:50px;font-size:.85rem;font-weight:600;color:var(--color-primary);margin-bottom:2rem}.badge-dot{width:8px;height:8px;background-color:var(--color-accent);border-radius:50%;box-shadow:0 0 10px var(--color-accent);animation:pulse 1.8s infinite}.hero-title{font-size:3.5rem;font-weight:800;line-height:1.2;margin-bottom:1.5rem}.highlight-name{display:block;font-size:4rem}.hero-subtitle{font-size:1.8rem;font-weight:700;color:var(--text-secondary);margin-bottom:1.5rem;display:inline-flex;align-items:center;gap:.35rem;min-height:2.6rem;line-height:1.3}.typewriter-text{display:inline-block;color:var(--color-primary);font-weight:700;min-height:1.2em;min-width:2px;vertical-align:middle;text-shadow:0 0 18px var(--color-glow);transition:color .3s ease}.cursor{display:inline-block;color:var(--color-primary);font-weight:400;margin-inline-start:4px;animation:blink .75s step-end infinite;vertical-align:middle}.hero-desc{font-size:1.15rem;color:var(--text-secondary);margin-bottom:2.5rem;max-width:550px}.hero-buttons{display:flex;gap:1.5rem}.hero-visual{position:relative;display:flex;justify-content:center;align-items:center}.blob-wrapper{position:relative;width:320px;height:320px}.blob-glow{position:absolute;top:-10%;left:-10%;width:120%;height:120%;background:var(--gradient-primary);filter:blur(40px);opacity:.15;border-radius:30% 70% 70% 30%/30% 30% 70% 70%;animation:morph 8s ease-in-out infinite alternate}.blob-avatar{position:absolute;width:100%;height:100%;background:var(--bg-card);border:3px solid var(--border-color);border-radius:30% 70% 70% 30%/30% 30% 70% 70%;animation:morph 8s ease-in-out infinite alternate;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--shadow-lg)}.avatar-fallback{font-size:6rem;font-weight:800;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.avatar-image{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform var(--transition-speed) var(--transition-bezier)}.blob-avatar:hover .avatar-image{transform:scale(1.08)}.scroll-down{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;color:var(--text-secondary);font-size:.85rem;font-weight:600;transition:color var(--transition-speed)}.scroll-down:hover{color:var(--color-primary)}.scroll-down i{animation:floatDown 1.5s infinite}.section-header{text-align:center;margin-bottom:4.5rem}.section-title{font-size:2.5rem;font-weight:800;margin-bottom:.75rem;display:inline-block}.section-subtitle{font-size:1.1rem;color:var(--text-secondary);max-width:600px;margin:0 auto}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}.about-info{display:flex;flex-direction:column;gap:1.5rem}.card-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.card-text{color:var(--text-secondary);font-size:1.05rem}.personal-details{margin-top:1rem;display:flex;flex-direction:column;gap:1.2rem}.detail-item{display:flex;align-items:center;gap:1.2rem}.detail-icon{width:2.8rem;height:2.8rem;background:var(--color-glow);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--color-primary);font-size:1.2rem}.detail-label{display:block;font-size:.8rem;color:var(--text-muted);font-weight:600}.detail-val{font-weight:600;color:var(--text-primary)}.skills-heading{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}.skills-container{display:flex;flex-direction:column;gap:1.5rem}.skill-category{padding:1.5rem;border-radius:1rem}.skill-cat-header{display:flex;align-items:center;gap:.8rem;margin-bottom:1.2rem}.cat-icon{font-size:1.3rem;color:var(--color-primary)}.skill-cat-header h4{font-size:1.1rem;font-weight:700}.skills-list{display:flex;flex-wrap:wrap;gap:.75rem}.skill-tag{background:var(--bg-main);border:1px solid var(--border-color);padding:.5rem 1rem;border-radius:50px;font-size:.85rem;font-weight:600;color:var(--text-secondary);transition:all var(--transition-speed)}.skill-tag:hover{border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px)}.projects-filter{display:flex;justify-content:center;gap:1rem;margin-bottom:3.5rem;flex-wrap:wrap}.filter-btn{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-secondary);padding:.6rem 1.4rem;border-radius:50px;font-weight:600;cursor:pointer;transition:all var(--transition-speed) var(--transition-bezier)}.filter-btn:hover,.filter-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent;box-shadow:0 8px 16px -4px #3b82f64d}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2.5rem}.project-card{display:flex;flex-direction:column;padding:0;height:100%}.project-img-wrapper{position:relative;height:200px;border-bottom:1px solid var(--border-color);overflow:hidden;border-radius:1.5rem 1.5rem 0 0}.project-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform var(--transition-speed) var(--transition-bezier)}.project-card:hover .project-img-placeholder{transform:scale(1.05)}.project-icon{font-size:3.5rem;color:#ffffffe6}.project-badge{position:absolute;top:1rem;left:1rem;background:rgba(11,15,25,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1);color:#fff;padding:.3rem .8rem;border-radius:50px;font-size:.75rem;font-weight:600}html[dir=rtl] .project-badge{left:auto;right:1rem}.project-info{padding:2rem;display:flex;flex-direction:column;flex-grow:1}.project-title{font-size:1.3rem;font-weight:700;margin-bottom:.75rem}.project-desc{color:var(--text-secondary);font-size:.95rem;margin-bottom:1.5rem;line-height:1.5;flex-grow:1}.project-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.tech-tag{background:var(--bg-main);color:var(--color-primary);border:1px solid var(--border-color);padding:.25rem .75rem;border-radius:4px;font-size:.75rem;font-weight:600}.btn-text{align-self:flex-start;padding:0;background:transparent;color:var(--color-primary);font-weight:700;font-size:.95rem;display:inline-flex;align-items:center;gap:.5rem;border:none;cursor:pointer}.btn-text:hover{color:var(--color-secondary)}.btn-text i{transition:transform var(--transition-speed)}html[dir=rtl] .btn-text:hover i{transform:translate(-4px)}html[dir=ltr] .btn-text:hover i{transform:translate(4px)}.project-card.fade-out{opacity:0;transform:scale(.85);pointer-events:none;position:absolute;width:0;height:0;overflow:hidden;padding:0;border:none;margin:0}.project-card.fade-in{opacity:1;transform:scale(1);transition:opacity .4s var(--transition-bezier),transform .4s var(--transition-bezier)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem}.tool-card{text-align:center;padding:2.5rem 2rem}.tool-icon-wrapper{width:4.5rem;height:4.5rem;background:var(--bg-main);border:1px solid var(--border-color);border-radius:1.2rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;transition:all var(--transition-speed) var(--transition-bezier)}.tool-card:hover .tool-icon-wrapper{transform:translateY(-8px) rotate(8deg);border-color:var(--color-primary);box-shadow:var(--color-glow) 0 10px 20px}.tool-brand-icon{font-size:2.5rem}.tool-name{font-size:1.25rem;font-weight:700;margin-bottom:.75rem}.tool-desc{color:var(--text-secondary);font-size:.9rem;line-height:1.5}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}.contact-info-wrapper{display:flex;flex-direction:column;gap:1.5rem}.contact-card{display:flex;align-items:flex-start;gap:1.5rem;padding:1.8rem}.contact-icon{width:3rem;height:3rem;background:var(--gradient-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.25rem;flex-shrink:0;box-shadow:0 8px 16px -4px #3b82f64d}.contact-card-content h3{font-size:1.15rem;font-weight:700;margin-bottom:.4rem}.contact-card-content p{color:var(--text-secondary);font-size:.95rem;margin-bottom:.8rem}.contact-form-wrapper{position:relative}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-size:.9rem;font-weight:600;color:var(--text-secondary);margin-bottom:.5rem}.form-group input,.form-group textarea{width:100%;background:var(--bg-main);border:1px solid var(--border-color);color:var(--text-primary);padding:1rem 1.25rem;border-radius:10px;font-size:.95rem;outline:none;transition:all var(--transition-speed)}html[lang=ar] .form-group input,html[lang=ar] .form-group textarea{font-family:Cairo,sans-serif}html[lang=en] .form-group input,html[lang=en] .form-group textarea{font-family:Outfit,sans-serif}.form-group input:focus,.form-group textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-glow);background:var(--bg-card)}.form-status-msg{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;border-radius:1.5rem;z-index:10;opacity:1;transition:opacity var(--transition-speed)}.form-status-msg.hidden{opacity:0;pointer-events:none}.success-icon-wrap{font-size:4rem;color:var(--color-accent);margin-bottom:1.5rem;animation:scaleUp .5s var(--transition-bezier)}.form-status-msg h3{font-size:1.75rem;font-weight:800;margin-bottom:.75rem}.form-status-msg p{color:var(--text-secondary);margin-bottom:2rem;max-width:320px}.hidden{display:none!important}footer{border-top:1px solid var(--border-color);padding:2.5rem 0;background:var(--bg-navbar)}.footer-container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.5rem}.copyright{color:var(--text-secondary);font-size:.9rem}.footer-socials{display:flex;gap:1.5rem}.footer-socials a{color:var(--text-secondary);font-size:1.3rem;transition:color var(--transition-speed),transform var(--transition-speed)}.footer-socials a:hover{color:var(--color-primary);transform:scale(1.15)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(11,15,25,.75);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2000;display:flex;align-items:center;justify-content:center;padding:2rem;opacity:1;transition:opacity var(--transition-speed) var(--transition-bezier)}.modal-overlay.hidden{opacity:0;pointer-events:none}.modal-card{width:100%;max-width:750px;max-height:85vh;border-radius:1.8rem;padding:3rem;overflow-y:auto;position:relative;box-shadow:0 25px 50px -12px #00000080;animation:slideUp .4s var(--transition-bezier)}.modal-close{position:absolute;top:1.5rem;right:1.5rem;z-index:10}html[dir=rtl] .modal-close{right:auto;left:1.5rem}.modal-project-title{font-size:2rem;font-weight:800;margin-bottom:1rem}.modal-project-badge{display:inline-block;padding:.35rem .9rem;background:var(--color-glow);color:var(--color-primary);border-radius:50px;font-size:.8rem;font-weight:600;margin-bottom:1.5rem}.modal-project-img{width:100%;height:280px;border-radius:1.2rem;display:flex;align-items:center;justify-content:center;margin-bottom:2rem}.modal-project-img i{font-size:5rem;color:#fff}.modal-section-title{font-size:1.2rem;font-weight:700;margin-bottom:.75rem}.modal-project-desc{color:var(--text-secondary);font-size:1.05rem;line-height:1.7;margin-bottom:2rem}.modal-tech-list{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem}.modal-btn-group{display:flex;gap:1rem}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.5}to{transform:scale(1);opacity:1}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes morph{0%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}50%{border-radius:70% 30% 30% 70%/70% 70% 30% 30%}to{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}}@keyframes floatDown{0%{transform:translateY(0);opacity:.3}50%{transform:translateY(10px);opacity:1}to{transform:translateY(0);opacity:.3}}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes scaleUp{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@media (max-width: 1024px){.hero-title{font-size:3rem}.highlight-name{font-size:3.5rem}.hero-grid{gap:2rem}.blob-wrapper{width:280px;height:280px}}@media (max-width: 768px){.section-padding{padding:5rem 0}.hero-section{padding-top:5rem;min-height:auto}.hero-grid{grid-template-columns:1fr;text-align:center;gap:3rem;padding:3rem 0}.hero-subtitle{justify-content:center}.hero-desc{margin:0 auto 2.5rem}.hero-buttons{justify-content:center}.hero-visual{order:-1}.blob-wrapper{width:240px;height:240px}.avatar-fallback{font-size:4.5rem}.scroll-down{display:none}.about-grid,.contact-grid{grid-template-columns:1fr;gap:2.5rem}.mobile-toggle{display:flex}.nav-menu{position:fixed;top:5rem;left:-100%;width:80%;max-width:320px;height:calc(100vh - 5rem);background:var(--bg-navbar);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));border-right:1px solid var(--border-color);padding:3rem 2rem;transition:left .4s var(--transition-bezier);box-shadow:var(--shadow-lg)}html[dir=rtl] .nav-menu{left:auto;right:-100%;border-right:none;border-left:1px solid var(--border-color);transition:right .4s var(--transition-bezier)}.nav-menu.active{left:0}html[dir=rtl] .nav-menu.active{right:0}.nav-menu ul{flex-direction:column;gap:2.5rem}.nav-link{font-size:1.2rem}.modal-card{padding:2rem;max-height:90vh}.modal-project-title{font-size:1.6rem}.modal-project-img{height:200px}}@media (max-width: 480px){.container{padding:0 1.25rem}.hero-title{font-size:2.3rem}.highlight-name{font-size:2.7rem}.hero-subtitle{font-size:1.4rem}.hero-buttons{flex-direction:column;gap:1rem}.btn{width:100%}.section-title{font-size:2rem}}