#root{min-height:100vh}:root{--font-sans:"Plus Jakarta Sans", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--background:#f8fafc;--background-secondary:#f1f5f9;--card:#fff;--card-hover:#fff;--text:#0f172a;--text-secondary:#334155;--muted:#64748b;--muted-light:#94a3b8;--border:#e2e8f0;--border-subtle:#e2e8f0e6;--border-focus:#3b82f6;--primary:#2563eb;--primary-hover:#1d4ed8;--primary-light:#eff6ff;--primary-soft:#dbeafe;--indigo:#4f46e5;--indigo-light:#eef2ff;--violet:#7c3aed;--violet-light:#f5f3ff;--emerald:#059669;--emerald-light:#ecfdf5;--amber:#d97706;--amber-light:#fffbeb;--cyan:#0891b2;--cyan-light:#ecfeff;--primary-gradient:linear-gradient(135deg, #2563eb 0%, #4f46e5 100%);--accent-gradient:linear-gradient(135deg, #2563eb 0%, #06b6d4 100%);--purple-gradient:linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);--dark-gradient:linear-gradient(135deg, #0f172a 0%, #1e293b 100%);--shadow-sm:0 1px 2px 0 #0f172a0d;--shadow-md:0 4px 6px -1px #0f172a0f, 0 2px 4px -2px #0f172a0a;--shadow-lg:0 10px 25px -3px #0f172a12, 0 4px 6px -4px #0f172a08;--shadow-xl:0 20px 35px -5px #0f172a17, 0 8px 10px -6px #0f172a0a;--shadow-card-hover:0 22px 40px -10px #0f172a1f, 0 8px 16px -6px #0f172a0f;--shadow-glow:0 0 25px #2563eb40;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:18px;--radius-pill:9999px;--ease:cubic-bezier(.16, 1, .3, 1);--duration:.22s}[data-theme=dark]{--background:#090d16;--background-secondary:#0e1626;--card:#111a2e;--card-hover:#17223b;--light-section:#0c1322;--text:#f8fafc;--text-secondary:#cbd5e1;--muted:#94a3b8;--muted-light:#64748b;--border:#1e293b;--border-subtle:#ffffff14;--border-focus:#60a5fa;--primary-light:#2563eb29;--primary-soft:#2563eb47;--shadow-sm:0 1px 3px #00000080;--shadow-md:0 4px 12px #0009;--shadow-lg:0 12px 28px #000000b3;--shadow-xl:0 20px 45px #000000d9;--shadow-card-hover:0 22px 45px -10px #000c, 0 0 20px #2563eb33}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{background:var(--background);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.65;transition:background-color .3s,color .3s}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,textarea{font-family:inherit}::selection{background:var(--soft-blue,#dbeafe);color:var(--primary)}.container{width:min(1200px,100% - 48px);margin:0 auto}.section{padding:96px 0;position:relative}.compact-section{padding:56px 0}.light-section{background:var(--light-section,#f1f5f9);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.reveal-on-scroll{opacity:0;transition:opacity .65s var(--ease), transform .65s var(--ease);will-change:opacity, transform;transform:translateY(24px)}.reveal-on-scroll.revealed{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.reveal-on-scroll{opacity:1!important;transition:none!important;transform:none!important}}h1,h2,h3,h4,p{overflow-wrap:anywhere}h1,h2,h3,h4{color:var(--text);letter-spacing:-.025em;margin:0;font-weight:800;line-height:1.15}h1{letter-spacing:-.035em;font-size:clamp(38px,6vw,68px)}h2{letter-spacing:-.025em;font-size:clamp(26px,3.5vw,42px)}h3{font-size:20px}p{color:var(--muted);line-height:1.7}.eyebrow{color:var(--primary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;font-size:12px;font-weight:800;display:inline-block}.section-heading{max-width:800px;margin-bottom:44px}.section-heading p{color:var(--muted);margin:14px 0 0;font-size:17px}.site-header{z-index:50;-webkit-backdrop-filter:blur(16px);transition:background var(--duration) var(--ease), border-color var(--duration) var(--ease);background:#f8fafce0;border-bottom:1px solid #e2e8f0d9;position:sticky;top:0}[data-theme=dark] .site-header{background:#090d16e0;border-bottom-color:#1e293be6}.navbar{justify-content:space-between;align-items:center;gap:20px;width:min(1200px,100% - 48px);min-height:72px;margin:0 auto;display:flex}.brand{align-items:center;gap:12px;text-decoration:none;display:inline-flex}.brand-mark{background:var(--primary-gradient);color:#fff;letter-spacing:-.03em;border-radius:10px;place-items:center;width:40px;height:40px;font-size:15px;font-weight:800;display:grid;box-shadow:0 4px 12px #2563eb47}.brand-text{flex-direction:column;display:flex}.brand-name{color:var(--text);font-size:16px;font-weight:800;line-height:1.2}.brand-role{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:600}.nav-links{align-items:center;gap:6px;display:flex}.nav-link{border-radius:var(--radius-pill);min-height:38px;color:var(--text-secondary);transition:all var(--duration) var(--ease);align-items:center;padding:0 13px;font-size:14px;font-weight:600;text-decoration:none;display:inline-flex}.nav-link:hover{color:var(--primary);background:var(--primary-light)}.nav-cv-btn{border-radius:var(--radius-pill);background:var(--primary-light);color:var(--primary);transition:all var(--duration) var(--ease);border:1px solid #2563eb59;align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:700;text-decoration:none;display:inline-flex}.nav-cv-btn:hover{background:var(--primary);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #2563eb40}.nav-social-divider{background:var(--border);width:1px;height:22px;margin:0 4px}.theme-toggle-btn{border:1px solid var(--border);background:var(--card);width:36px;height:36px;color:var(--text-secondary);cursor:pointer;transition:all var(--duration) var(--ease);border-radius:50%;place-items:center;display:grid}.theme-toggle-btn:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);transform:rotate(18deg)scale(1.05)}.sun-icon{color:#f59e0b}.moon-icon{color:#6366f1}.nav-icon-link{width:36px;height:36px;color:var(--muted);transition:all var(--duration) var(--ease);border:1px solid #0000;border-radius:50%;place-items:center;display:grid}.nav-icon-link:hover{color:var(--primary);background:var(--card);border-color:var(--border);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.hero-section{border-bottom:1px solid var(--border);background:radial-gradient(ellipse at 20% 0%, #2563eb12 0%, transparent 60%), radial-gradient(ellipse at 80% 40%, #4f46e50d 0%, transparent 50%), var(--background);padding:84px 0 68px}[data-theme=dark] .hero-section{background:radial-gradient(ellipse at 20% 0%, #2563eb1f 0%, transparent 60%), radial-gradient(ellipse at 80% 40%, #4f46e514 0%, transparent 50%), var(--background)}.hero-inner{grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);align-items:center;gap:52px;width:min(1200px,100% - 48px);margin:0 auto;display:grid}.status-pill{border-radius:var(--radius-pill);background:var(--card);color:#065f46;border:1px solid #10b98140;align-items:center;gap:8px;margin-bottom:16px;padding:5px 14px;font-size:12px;font-weight:700;display:inline-flex;box-shadow:0 2px 8px #10b9811a}[data-theme=dark] .status-pill{color:#34d399;background:#10b9811a;border-color:#10b9814d}.status-dot{background:#10b981;border-radius:50%;flex-shrink:0;width:8px;height:8px;animation:2s infinite pulse-green;box-shadow:0 0 #10b981b3}@keyframes pulse-green{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 6px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.hero-name{letter-spacing:-.035em;margin-top:4px;font-size:clamp(42px,6vw,76px);line-height:1.05}.hero-title{background:var(--primary-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:12px 0 0;font-size:clamp(20px,2.5vw,28px);font-weight:700;line-height:1.3}.open-roles-strip{flex-wrap:wrap;gap:8px;margin:16px 0 8px;display:flex}.role-tag{border-radius:var(--radius-pill);background:var(--primary-light);color:var(--primary);letter-spacing:-.01em;transition:all var(--duration) var(--ease);border:1px solid #2563eb38;align-items:center;padding:4px 12px;font-size:12.5px;font-weight:700;display:inline-flex}.role-tag:hover{background:var(--primary);color:#fff;transform:translateY(-1px)}.hero-intro{max-width:640px;color:var(--text-secondary);margin:18px 0 0;font-size:17px;line-height:1.75}.hero-intro strong{color:var(--text)}.hero-actions{flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px;display:flex}.tech-strip-wrapper{flex-direction:column;gap:8px;margin-top:28px;display:flex}.tech-strip-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:11.5px;font-weight:700}.tech-strip{flex-wrap:wrap;gap:8px;display:flex}.tech-chip{border-radius:var(--radius-pill);background:var(--card);border:1px solid var(--border);color:var(--text-secondary);box-shadow:var(--shadow-sm);transition:all var(--duration) var(--ease);align-items:center;padding:4px 12px;font-size:12.5px;font-weight:700;display:inline-flex}.tech-chip:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.hero-panel{gap:16px;display:grid}.summary-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all var(--duration) var(--ease);padding:22px}.summary-card:hover{box-shadow:var(--shadow-lg);border-color:#cbd5e1;transform:translateY(-2px)}.main-summary{background:linear-gradient(135deg, #2563eb12 0%, #4f46e50d 100%), var(--card);border-color:#2563eb33;position:relative;overflow:hidden}[data-theme=dark] .main-summary{background:linear-gradient(135deg, #2563eb29 0%, #4f46e51a 100%), var(--card);border-color:#2563eb59}.main-summary:after{content:"";background:var(--primary-gradient);width:4px;height:100%;position:absolute;top:0;left:0}.summary-top-row{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.count-pill{text-transform:uppercase;letter-spacing:.06em;border-radius:var(--radius-pill);background:var(--primary-soft);color:var(--primary);padding:3px 10px;font-size:11px;font-weight:800}.main-summary h2{margin-bottom:6px;font-size:26px}.main-summary p{margin:0;font-size:14px;line-height:1.6}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.summary-card-header{align-items:center;gap:9px;margin-bottom:8px;display:flex}.summary-card-header strong{color:var(--text);font-size:16px;font-weight:800}.summary-icon{color:var(--primary);flex-shrink:0}.summary-grid .summary-card span{color:var(--muted);font-size:12.5px;line-height:1.55;display:block}.stat-mobile .summary-icon{color:#2563eb}.stat-backend .summary-icon{color:#059669}.stat-admin .summary-icon{color:#7c3aed}.stat-data .summary-icon{color:#d97706}.metrics-bar-section{border-bottom:1px solid var(--border);background:var(--card);z-index:10;padding:32px 0 40px;position:relative}[data-theme=dark] .metrics-bar-section{background:#0d1424}.metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.metric-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration) var(--ease);flex-direction:column;padding:24px 20px;display:flex;position:relative;overflow:hidden}.metric-card:before{content:"";background:var(--primary-gradient);opacity:.85;height:3px;position:absolute;top:0;left:0;right:0}.metric-card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1;transform:translateY(-3px)}.metric-header{align-items:baseline;gap:4px;display:flex}.metric-number{letter-spacing:-.035em;background:var(--primary-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:clamp(34px,3.6vw,44px);font-weight:900;line-height:1}.metric-plus{color:var(--primary);font-size:24px;font-weight:800}.metric-label{color:var(--text);text-transform:uppercase;letter-spacing:.04em;margin-top:10px;font-size:14px;font-weight:800}.metric-desc{color:var(--muted);margin:6px 0 0;font-size:13px;line-height:1.5}.button{border-radius:var(--radius-md);cursor:pointer;white-space:nowrap;min-height:44px;transition:all var(--duration) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:0 20px;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex}.button:hover,.button:focus-visible{outline:none;transform:translateY(-2px)}.button.primary{background:var(--primary-gradient);color:#fff;box-shadow:0 4px 14px #2563eb52}.button.primary:hover{filter:brightness(1.06);box-shadow:0 8px 20px #2563eb6b}.button.button-cv{color:#fff;background:linear-gradient(135deg,#059669 0%,#0d9488 100%);border:1px solid #fff3;box-shadow:0 4px 14px #05966952}.button.button-cv:hover{filter:brightness(1.08);color:#fff;box-shadow:0 8px 22px #0596696b}.button.secondary{background:var(--card);color:var(--text);border-color:var(--border);box-shadow:var(--shadow-sm)}.button.secondary:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1}.button.ghost{background:var(--card);color:var(--text-secondary);border-color:var(--border)}.button.ghost:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-light)}.button.small{border-radius:8px;min-height:38px;padding:0 14px;font-size:13px}.button.icon-only{border-radius:8px;width:38px;min-height:38px;padding:0}.premium-download-btn{border-radius:var(--radius-md);color:#fff;cursor:pointer;min-height:48px;transition:all var(--duration) var(--ease);background:linear-gradient(135deg,#090d16 0%,#172033 100%);border:1px solid #ffffff26;align-items:center;gap:12px;padding:8px 18px;text-decoration:none;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 4px 18px #0f172a59,inset 0 1px #ffffff1f}.premium-download-btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff14,#0000);transition:transform .6s;position:absolute;inset:0;transform:translate(-100%)}.premium-download-btn:hover{color:#fff;border-color:#ffffff4d;transform:translateY(-2px);box-shadow:0 8px 25px #0f172a73,0 0 15px #38bdf840}.premium-download-btn:hover:before{transform:translate(100%)}.premium-download-btn .btn-platforms{align-items:center;gap:6px;padding-right:4px;display:flex}.premium-download-btn .ios-icon{color:#fff}.premium-download-btn .platform-sep{color:#ffffff4d;font-size:13px;font-weight:300}.premium-download-btn .android-icon{color:#3ddc84}.premium-download-btn .btn-content{text-align:left;flex-direction:column;display:flex}.premium-download-btn .btn-kicker{text-transform:uppercase;letter-spacing:.08em;color:#ffffffa6;font-size:10px;font-weight:700;line-height:1.1}.premium-download-btn .btn-main-label{color:#fff;align-items:center;gap:8px;font-size:14px;font-weight:800;line-height:1.25;display:flex}.premium-download-btn .btn-platforms-badge{border-radius:var(--radius-pill);color:#e2e8f0;background:#ffffff26;padding:1px 7px;font-size:10px;font-weight:700}.premium-download-btn .btn-action-icon{color:#fff;width:28px;height:28px;transition:transform var(--duration) var(--ease);background:#ffffff1a;border-radius:50%;place-items:center;margin-left:4px;display:grid}.premium-download-btn:hover .btn-action-icon{background:#fff3;transform:translateY(2px)}.premium-download-btn.compact{border-radius:8px;gap:8px;min-height:38px;padding:5px 12px}.premium-download-btn.compact .btn-kicker{font-size:9px}.premium-download-btn.compact .btn-main-label{font-size:12.5px}.premium-download-btn.compact .btn-action-icon{width:22px;height:22px}.mosabaqat-btn{border-radius:var(--radius-md);color:#fff;cursor:pointer;min-height:48px;transition:all var(--duration) var(--ease);background:linear-gradient(135deg,#4338ca 0%,#6d28d9 100%);border:1px solid #ffffff2e;align-items:center;gap:10px;padding:8px 18px;text-decoration:none;display:inline-flex;box-shadow:0 4px 16px #6d28d959}.mosabaqat-btn:hover{filter:brightness(1.08);color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px #6d28d973}.mosabaqat-btn .play-icon-wrap{color:#fff;background:#fff3;border-radius:50%;place-items:center;width:28px;height:28px;display:grid}.mosabaqat-btn .btn-content{text-align:left;flex-direction:column;display:flex}.mosabaqat-btn .btn-kicker{text-transform:uppercase;letter-spacing:.08em;color:#ffffffb3;font-size:10px;font-weight:700;line-height:1.1}.mosabaqat-btn .btn-main-label{color:#fff;font-size:14px;font-weight:800;line-height:1.25}.mosabaqat-btn .btn-arrow{opacity:.8;transition:transform var(--duration) var(--ease);margin-left:2px}.mosabaqat-btn:hover .btn-arrow{opacity:1;transform:translate(2px,-2px)}.mosabaqat-btn.compact{border-radius:8px;gap:8px;min-height:38px;padding:5px 12px}.mosabaqat-btn.compact .btn-kicker{font-size:9px}.mosabaqat-btn.compact .btn-main-label{font-size:12.5px}.mosabaqat-btn.compact .play-icon-wrap{width:22px;height:22px}.projects-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.project-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:all .28s var(--ease);flex-direction:column;display:flex;overflow:hidden}.project-card:hover{box-shadow:var(--shadow-card-hover);border-color:#cbd5e1;transform:translateY(-5px)}[data-theme=dark] .project-card:hover{border-color:#2563eb66}.project-card-media{aspect-ratio:16/9.5;background:#0f172a;width:100%;display:block;position:relative;overflow:hidden}.project-card-thumb{object-fit:cover;object-position:top center;width:100%;height:100%;transition:transform .45s var(--ease), opacity .3s ease}.project-card:hover .project-card-thumb{transform:scale(1.05)}.card-media-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity var(--duration) var(--ease);background:#0f172a73;place-items:center;display:grid;position:absolute;inset:0}.project-card:hover .card-media-overlay{opacity:1}.view-badge{border-radius:var(--radius-pill);color:#0f172a;box-shadow:var(--shadow-md);transition:transform var(--duration) var(--ease);background:#fff;align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:700;display:inline-flex;transform:translateY(6px)}.project-card:hover .view-badge{transform:translateY(0)}.media-tag{z-index:2;text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;background:#0f172ad9;padding:3px 9px;font-size:11px;font-weight:800;position:absolute;bottom:10px;left:12px}.project-card-body{flex-direction:column;flex-grow:1;gap:16px;padding:24px;display:flex}.card-title-link{color:var(--text);transition:color var(--duration) var(--ease)}.card-title-link:hover{color:var(--primary)}.card-desc{color:var(--muted);margin:8px 0 0;font-size:14px;line-height:1.6}.badge-row{flex-wrap:wrap;gap:6px;display:flex}.badge{border-radius:var(--radius-pill);background:var(--background-secondary);border:1px solid var(--border);color:var(--text-secondary);letter-spacing:-.01em;transition:all var(--duration) var(--ease);align-items:center;padding:3px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge:hover{background:var(--primary-light);color:var(--primary);border-color:#2563eb33}.badge-more{color:var(--muted);background:0 0;border-style:dashed}.project-highlights{gap:8px;margin:0;padding:0;list-style:none;display:grid}.project-highlights li{color:var(--muted);padding-left:18px;font-size:13.5px;line-height:1.5;position:relative}.project-highlights li:before{content:"";background:var(--primary);border-radius:50%;width:6px;height:6px;position:absolute;top:.55em;left:2px}.card-actions{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto;padding-top:14px;display:flex}.showcase-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:28px;display:flex}.showcase-desc{max-width:580px;margin:8px 0 0;font-size:16px}.project-selector-tabs{flex-wrap:wrap;gap:8px;display:flex}.tab-button{border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--card);color:var(--text-secondary);cursor:pointer;transition:all var(--duration) var(--ease);box-shadow:var(--shadow-sm);padding:8px 16px;font-size:13.5px;font-weight:700}.tab-button:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.tab-button.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 14px #2563eb4d}.showcase-gallery-wrap{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);padding:24px}.showcase-meta-bar{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:20px;display:flex}.showcase-project-name{color:var(--text);font-size:18px;font-weight:800}.showcase-project-tagline{color:var(--muted);font-size:14px}.showcase-link{color:var(--primary);transition:gap var(--duration) var(--ease);align-items:center;gap:6px;font-size:13.5px;font-weight:700;display:inline-flex}.showcase-link:hover{gap:9px;text-decoration:underline}.screenshot-gallery{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:20px;display:grid}.screenshot-card{background:var(--background);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration) var(--ease);margin:0;overflow:hidden}.screenshot-card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1;transform:translateY(-2px)}.screenshot-image-button{aspect-ratio:4/3;cursor:zoom-in;background:#090d16;border:0;place-items:center;width:100%;padding:12px;display:grid;position:relative;overflow:hidden}.screenshot-card.portrait .screenshot-image-button{aspect-ratio:9/14}.screenshot-card.landscape .screenshot-image-button{aspect-ratio:16/10}.screenshot-image-button img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;transition:transform .35s var(--ease);border-radius:6px;box-shadow:0 4px 16px #0006}.screenshot-image-button:hover img{transform:scale(1.03)}.screenshot-expand{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;width:36px;height:36px;transition:all var(--duration) var(--ease);background:#0f172acc;border-radius:8px;place-items:center;display:grid;position:absolute;top:12px;right:12px;transform:translateY(-4px)}.screenshot-image-button:hover .screenshot-expand{opacity:1;transform:translateY(0)}.screenshot-card figcaption{background:var(--card);border-top:1px solid var(--border);color:var(--text);justify-content:space-between;align-items:center;padding:12px 16px;font-size:13.5px;font-weight:700;display:flex}.screenshot-card figcaption span{text-transform:uppercase;letter-spacing:.05em;color:var(--primary);background:var(--primary-light);border-radius:var(--radius-pill);padding:2px 8px;font-size:11px;font-weight:800}.screenshot-placeholder{aspect-ratio:4/3;background:linear-gradient(135deg, #2563eb14 0%, #4f46e50a 100%), var(--card);flex-direction:column;justify-content:space-between;padding:20px;display:flex;position:relative}.placeholder-toolbar{gap:6px;display:flex}.placeholder-toolbar span{background:#64748b66;border-radius:50%;width:8px;height:8px}.placeholder-content{align-items:center;gap:14px;display:flex}.placeholder-icon{background:var(--card);width:48px;height:48px;color:var(--primary);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:10px;place-items:center;display:grid}.placeholder-kicker{text-transform:uppercase;color:var(--primary);margin:0;font-size:11px;font-weight:800}.placeholder-content h3{margin:2px 0 0;font-size:18px}.placeholder-grid{gap:6px;display:grid}.placeholder-grid span{background:#2563eb1f;border-radius:999px;height:8px}.placeholder-grid span:nth-child(2){width:80%}.placeholder-grid span:nth-child(3){width:60%}.placeholder-number{color:#0f172a1f;font-size:28px;font-weight:900;position:absolute;top:14px;right:18px}.empty-gallery{border:2px dashed var(--border);border-radius:var(--radius-lg);min-height:200px;color:var(--muted);background:var(--background);grid-column:1/-1;place-items:center;gap:10px;display:grid}.screenshot-modal{z-index:100;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.screenshot-modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:zoom-out;background:#090d16d9;border:0;position:absolute;inset:0}.screenshot-modal-content{z-index:1;border-radius:var(--radius-xl);background:#0f172a;border:1px solid #ffffff26;max-width:min(1200px,94vw);max-height:calc(100vh - 48px);display:grid;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #0009}.screenshot-modal-content img{object-fit:contain;max-width:100%;max-height:calc(100vh - 130px);margin:0 auto}.screenshot-modal-close{z-index:2;color:#fff;cursor:pointer;width:38px;height:38px;transition:all var(--duration) var(--ease);background:#0f172ad9;border:1px solid #fff3;border-radius:50%;place-items:center;display:grid;position:absolute;top:14px;right:14px}.screenshot-modal-close:hover{background:#ef4444e6;transform:scale(1.05)}.screenshot-modal-caption{color:#fff;background:#1e293b;border-top:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.screenshot-modal-caption span{text-transform:uppercase;letter-spacing:.08em;color:#38bdf8;font-size:11px;font-weight:800}.screenshot-modal-caption strong{font-size:15px}.skills-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.skill-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration) var(--ease);padding:24px}.skill-card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1;transform:translateY(-3px)}[data-theme=dark] .skill-card:hover{border-color:#2563eb66}.skill-card-header{align-items:center;gap:12px;margin-bottom:18px;display:flex}.skill-icon-wrap{background:var(--primary-light);width:40px;height:40px;color:var(--primary);border:1px solid #2563eb26;border-radius:10px;place-items:center;display:grid}.skill-card h3{font-size:18px}.about-section{grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr);align-items:start;gap:52px;display:grid}.about-education-badge{border-radius:var(--radius-lg);background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);align-items:center;gap:14px;margin-top:28px;padding:16px 20px;display:flex}.edu-icon{font-size:28px}.about-education-badge strong{color:var(--text);font-size:15px;display:block}.about-education-badge p{color:var(--muted);margin:2px 0 0;font-size:13px}.about-copy{gap:16px;margin:0;padding:0;list-style:none;display:grid}.about-copy li{color:var(--text-secondary);padding-left:24px;font-size:17px;line-height:1.75;position:relative}.about-copy li strong{color:var(--text)}.about-copy li:before{content:"✓";color:var(--primary);font-weight:800;position:absolute;top:0;left:0}.contact-card{background:radial-gradient(ellipse at bottom right, #2563eb14, transparent 70%), var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);justify-content:space-between;align-items:center;gap:40px;padding:48px;display:flex}.contact-info{max-width:620px}.contact-info h2{margin-bottom:12px;font-size:32px}.email-copy-box{border-radius:var(--radius-md);background:var(--background-secondary);border:1px solid var(--border);align-items:center;gap:12px;margin-top:18px;padding:8px 16px;display:inline-flex}.email-text{color:var(--text);font-family:monospace;font-size:14.5px;font-weight:700}.copy-btn{border:1px solid var(--border);background:var(--card);color:var(--text-secondary);cursor:pointer;transition:all var(--duration) var(--ease);border-radius:6px;align-items:center;gap:5px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.copy-btn:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary)}.copy-btn .copied{color:#10b981}.contact-actions{flex-direction:column;gap:12px;min-width:220px;display:flex}.next-projects{justify-content:space-between;align-items:center;gap:24px;display:flex}.case-study-links{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.project-pill-link{border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--card);min-height:42px;color:var(--text-secondary);box-shadow:var(--shadow-sm);transition:all var(--duration) var(--ease);align-items:center;gap:8px;padding:0 16px;font-size:13.5px;font-weight:700;display:inline-flex}.project-pill-link:hover{border-color:var(--primary);color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-1px)}.site-footer{border-top:1px solid var(--border);background:var(--background);padding:32px 0}.footer-inner{color:var(--muted);justify-content:space-between;align-items:center;font-size:13.5px;display:flex}.footer-links a{color:var(--text-secondary);transition:color var(--duration) var(--ease);font-weight:700}.footer-links a:hover{color:var(--primary)}.project-page{background:var(--background)}.project-hero{border-bottom:1px solid var(--border);background:radial-gradient(ellipse at top left, #2563eb0d, transparent 60%), var(--background);padding:64px 0 54px}.project-hero-grid{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);align-items:end;gap:48px;display:grid}.back-link{color:var(--muted);transition:all var(--duration) var(--ease);align-items:center;gap:7px;margin-bottom:20px;font-size:13.5px;font-weight:700;display:inline-flex}.back-link:hover{color:var(--primary);transform:translate(-3px)}.eyebrow-row{margin-bottom:4px}.project-hero-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:28px}.meta-item{flex-direction:column;gap:6px;display:flex}.meta-divider{background:var(--border);height:1px;margin:18px 0}.meta-value{color:var(--text-secondary);margin:0;font-size:14.5px;font-weight:600;line-height:1.6}.section-header-compact{margin-bottom:32px}.section-header-compact h2{margin-bottom:6px}.section-header-compact p{margin:0}.project-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.overview-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:28px}.overview-card.wide{grid-column:1/-1}.overview-badge{text-transform:uppercase;letter-spacing:.06em;color:var(--primary);margin-bottom:10px;font-size:11px;font-weight:800;display:inline-block}.overview-card h2{margin-bottom:12px;font-size:24px}.overview-card p{margin:0;font-size:15.5px;line-height:1.7}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.detail-block{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:28px}.detail-block-header{border-bottom:1px solid var(--border);align-items:center;gap:10px;margin-bottom:18px;padding-bottom:14px;display:flex}.detail-icon{color:var(--primary)}.detail-block h2{font-size:20px}.detail-list{gap:12px;margin:0;padding:0;list-style:none;display:grid}.detail-list li{color:var(--text-secondary);align-items:flex-start;gap:10px;font-size:14.5px;line-height:1.6;display:flex}.check-icon{color:var(--emerald);flex-shrink:0;margin-top:3px}.not-found-card{text-align:center;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);margin-top:24px;padding:64px 24px}.not-found-card h1{margin-bottom:12px;font-size:32px}.not-found-card p{margin-bottom:24px}@media (width<=1024px){.hero-inner,.project-hero-grid,.about-section{grid-template-columns:1fr;gap:40px}.metrics-grid,.projects-grid,.skills-grid,.screenshot-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-card{flex-direction:column;align-items:flex-start;padding:36px}.contact-actions{flex-flow:wrap;width:100%}.next-projects{flex-direction:column;align-items:flex-start}.case-study-links{justify-content:flex-start}}@media (width<=768px){.navbar{flex-direction:column;align-items:flex-start;gap:14px;width:min(100% - 32px,1200px);padding:14px 0}.nav-links{flex-wrap:wrap;justify-content:flex-start;width:100%}.nav-social-divider{display:none}.hero-section{padding:52px 0 44px}.section{padding:64px 0}.hero-inner,.container{width:min(100% - 32px,1200px)}.metrics-grid{grid-template-columns:1fr}.hero-actions{flex-direction:column;align-items:stretch}.button,.premium-download-btn,.mosabaqat-btn{justify-content:center;width:100%}.summary-grid,.projects-grid,.skills-grid,.screenshot-gallery,.project-overview-grid,.detail-grid{grid-template-columns:1fr}.showcase-header{flex-direction:column;align-items:flex-start}.contact-actions{flex-direction:column}.contact-actions .button{width:100%}.footer-inner{text-align:center;flex-direction:column;gap:12px}}