@import"https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&family=Tajawal:wght@200;300;400;500;700;800;900&display=swap";*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth;font-family:Cairo,sans-serif}body{background:linear-gradient(135deg,#f0f4ff,#fff);color:#222}header{background:#fff;padding:20px;position:sticky;top:0;box-shadow:0 2px 10px #0000000d;z-index:1000}header h1{color:#2563eb}.hero{background:linear-gradient(to right,#2563eb,#4f46e5);color:#fff;text-align:center;padding:100px 20px}.hero h2{font-size:3rem;margin-bottom:15px}.hero p{font-size:1.2rem}section{padding:60px 20px;max-width:1000px;margin:auto}section h3{font-size:2rem;margin-bottom:20px;color:#111827}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:20px;margin-top:20px}.skill-box{background:#fff;border-radius:12px;padding:15px;text-align:center;box-shadow:0 6px 20px #0000000f;transition:.3s}.skill-box:hover{transform:translateY(-5px);box-shadow:0 8px 30px #00000014}.project-card{background:#fff;padding:20px;border-radius:12px;margin-bottom:20px;box-shadow:0 6px 20px #0000000d;transition:.3s}.project-card:hover{transform:scale(1.02)}.contact-btn{background:#2563eb;color:#fff;padding:12px 25px;border-radius:8px;text-decoration:none;transition:background .3s}.contact-btn:hover{background:#1e40af}#projects{border-radius:15px}footer{text-align:center;padding:20px;font-size:.9rem;color:#6b7280;background:#f9fafb}