:root{--bg:#102c2a;--surface:#063f35;--text:#fff;--accent:#b9e8d3;--text-muted:#ffffffb3;--radius:12px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Inter,sans-serif;line-height:1.6;overflow-x:clip}html[lang=ar] body{font-family:Cairo,sans-serif}a{color:inherit;text-decoration:none}.container{max-width:1100px;margin:0 auto;padding:0 20px}section{scroll-margin-top:70px}.btn{cursor:pointer;border-radius:999px;padding:12px 28px;font-family:inherit;font-weight:600;transition:all .25s;display:inline-block}.btn--primary{background:var(--accent);color:var(--bg);border:2px solid var(--accent)}.btn--primary:hover{color:var(--accent);background:0 0}.btn--outline{color:var(--text);background:0 0;border:2px solid #ffffff4d}.btn--outline:hover{border-color:var(--accent);color:var(--accent)}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.section{padding-block:100px}.reveal{opacity:0;transition:opacity .7s ease-out,transform .7s ease-out;transform:translateY(40px)}.reveal--visible{opacity:1;transform:translateY(0)}.btn--sm{align-items:center;gap:8px;padding:8px 18px;font-size:.9rem;display:inline-flex}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.btn{justify-content:center;align-items:center;gap:8px;display:inline-flex}.navbar{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#102c2ad9;border-bottom:1px solid #b9e8d31a;position:sticky;top:0}.navbar__inner{justify-content:space-between;align-items:center;height:70px;display:flex}.navbar__logo{color:var(--accent);font-size:1.5rem;font-weight:700}.navbar__links{gap:32px;list-style:none;display:flex}.navbar__links a{color:var(--text-muted);font-weight:600;transition:color .2s}.navbar__links a:hover{color:var(--accent)}.navbar__actions{align-items:center;gap:12px;display:flex}.navbar__lang{border:1px solid var(--accent);color:var(--accent);cursor:pointer;background:0 0;border-radius:999px;padding:6px 16px;font-family:inherit;font-weight:600;transition:all .2s}.navbar__lang:hover{background:var(--accent);color:var(--bg)}.navbar__burger{color:var(--text);cursor:pointer;background:0 0;border:none;font-size:1.5rem;display:none}.navbar__inner img{width:75px}@media (width<=768px){.navbar__burger{display:block}.navbar__links{top:70px;background:var(--surface);flex-direction:column;align-items:center;gap:24px;padding:24px 0;display:none;position:absolute;inset-inline:0}.navbar__links--open{display:flex}.navbar__cv{padding:8px}.navbar__cv-text{display:none}}.navbar__cv{background:var(--accent);color:var(--bg);border:1px solid var(--accent);border-radius:999px;align-items:center;gap:6px;padding:6px 14px;font-size:.9rem;font-weight:600;transition:all .2s;display:inline-flex}.navbar__cv:hover{color:var(--accent);background:0 0}.hero{align-items:center;min-height:calc(100vh - 70px);display:flex;position:relative;overflow:hidden}.hero__inner{grid-template-columns:1.2fr 1fr;align-items:center;gap:48px;padding-block:60px;display:grid}.hero__content{animation:.8s ease-out fadeUp}.hero__status{color:var(--accent);background:#063f3599;border:1px solid #b9e8d340;border-radius:999px;align-items:center;gap:10px;margin-bottom:24px;padding:6px 16px;font-size:.85rem;display:inline-flex}.hero__status-dot{background:#4ade80;border-radius:50%;width:8px;height:8px;animation:2s infinite pulse;box-shadow:0 0 #4ade80b3}@keyframes pulse{70%{box-shadow:0 0 0 10px #4ade8000}to{box-shadow:0 0 #4ade8000}}.hero__greeting{color:var(--accent);margin-bottom:8px;font-size:1.2rem;font-weight:600}.hero__name{margin-bottom:16px;font-size:clamp(2.5rem,6vw,4rem);line-height:1.1}.hero__title{min-height:1.6em;color:var(--accent);margin-bottom:20px;font-family:Consolas,Courier New,monospace;font-size:clamp(1rem,2.5vw,1.3rem);font-weight:600}html[lang=ar] .hero__title{font-family:Cairo,sans-serif}.hero__prompt{color:var(--text-muted)}.hero__cursor{vertical-align:middle;background:var(--accent);width:3px;height:1.1em;margin-inline-start:4px;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.hero__description{color:var(--text-muted);max-width:520px;margin-bottom:32px;font-size:1.05rem}.hero__buttons{flex-wrap:wrap;gap:16px;display:flex}.hero__visual{justify-content:center;animation:.8s ease-out .2s both fadeUp;display:flex}.hero__photo-wrap{aspect-ratio:1;width:min(340px,70vw);position:relative}.hero__ring{background:conic-gradient(from 0deg, var(--accent), transparent 25%, var(--surface) 50%, var(--accent) 75%, transparent);border-radius:50%;animation:6s linear infinite spin;position:absolute;inset:-6px}.hero__orbit{border:1px dashed #b9e8d34d;border-radius:50%;animation:30s linear infinite reverse spin;position:absolute;inset:-36px}.hero__photo{object-fit:cover;border:6px solid var(--bg);border-radius:50%;width:100%;height:100%;position:relative}@keyframes spin{to{transform:rotate(360deg)}}.hero__badge{z-index:2;background:var(--surface);color:var(--accent);border:1px solid #b9e8d34d;border-radius:10px;padding:8px 14px;font-family:Consolas,monospace;font-size:.9rem;font-weight:700;animation:4s ease-in-out infinite float;position:absolute;box-shadow:0 10px 30px #00000059}.hero__badge--1{top:4%;left:-8%}.hero__badge--2{animation-delay:1s;top:12%;right:-10%}.hero__badge--3{animation-delay:2s;bottom:14%;left:-12%}.hero__badge--4{animation-delay:3s;bottom:2%;right:-2%}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@media (width<=900px){.hero__inner{text-align:center;grid-template-columns:1fr}.hero__visual{order:-1;margin-top:32px}.hero__description{margin-inline:auto}.hero__buttons{justify-content:center}}@media (width<=480px){.hero__badge{padding:6px 10px;font-size:.75rem}}.section-title{text-align:center;margin-bottom:56px}.section-title h2{margin-bottom:12px;font-size:clamp(2rem,4vw,2.5rem)}.section-title__bar{background:var(--accent);border-radius:2px;width:60px;height:4px;display:inline-block}.section-title__code{color:var(--accent);opacity:.7;margin-bottom:8px;font-family:Consolas,monospace;font-size:.95rem;display:block}.code-card{background:var(--surface);border-radius:var(--radius);border:1px solid #b9e8d326;width:100%;min-width:0;max-width:480px;overflow:hidden;box-shadow:0 20px 60px #0006}.code-card__header{background:#0003;align-items:center;gap:8px;padding:12px 16px;display:flex}.dot{border-radius:50%;width:12px;height:12px}.dot--red{background:#ff5f57}.dot--yellow{background:#febc2e}.dot--green{background:#28c840}.code-card__filename{color:var(--text-muted);margin-inline-start:12px;font-family:Consolas,Courier New,monospace;font-size:.85rem}.code-card__body{text-align:left;min-height:330px;padding:24px;font-family:Consolas,Courier New,monospace;font-size:.95rem;line-height:1.8;overflow-x:auto}.kw{color:#7fb8ff}.type{color:var(--accent)}.str{color:#f3c98b}.cm{color:#6a9955}.code-card__cursor{vertical-align:text-bottom;background:var(--accent);width:8px;height:1.1em;animation:1s step-end infinite blink;display:inline-block}@media (width<=600px){.code-card__body{min-height:260px;padding:16px;font-size:.78rem}}.about__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;display:grid}.about__code,.about__content{min-width:0}.about__code{justify-content:center;display:flex}.about__text{color:var(--text-muted);border-inline-start:2px solid #b9e8d34d;margin-bottom:28px;padding-inline-start:20px;font-size:1.1rem;line-height:2}.about__highlights{flex-direction:column;gap:14px;display:flex}.about__card{background:var(--surface);border-radius:var(--radius);border:1px solid #b9e8d31a;align-items:flex-start;gap:16px;padding:18px 20px;transition:border-color .25s,transform .25s;display:flex}.about__card:hover{border-color:#b9e8d366;transform:translateY(-3px)}.about__icon{width:46px;height:46px;color:var(--accent);background:#b9e8d31a;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.about__card h3{margin-bottom:4px;font-size:1.05rem}.about__card p{color:var(--text-muted);font-size:.92rem}@media (width<=900px){.about__grid{grid-template-columns:minmax(0,1fr)}}.skills{background:#063f354d}.skills__grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px;display:grid}.skills__card{background:var(--surface);border-radius:var(--radius);border:1px solid #b9e8d31f;overflow:hidden}.skills__card:hover{border-color:#b9e8d366}.skills__tab{color:var(--text-muted);background:#00000040;border-bottom:1px solid #b9e8d31a;align-items:center;gap:8px;padding:10px 16px;font-family:Consolas,monospace;font-size:.85rem;display:flex}.skills__tab-icon{color:var(--accent);display:flex}.skills__content{padding:20px 16px 24px}.skills__content h3{color:var(--accent);margin-bottom:14px;padding-inline:10px;font-size:1.15rem}.skills__list{list-style:none}.skills__list li{border-radius:6px;align-items:center;gap:16px;padding:7px 10px;transition:background .2s;display:flex}.skills__list li:hover{background:#b9e8d314}.skills__ln{color:#b9e8d366;min-width:22px;font-family:Consolas,monospace;font-size:.8rem}.project-card{background:var(--surface);border-radius:var(--radius);border:1px solid #b9e8d31a;flex-direction:column;height:100%;transition:transform .3s,border-color .3s,box-shadow .3s;display:flex;overflow:hidden}.project-card:hover{border-color:#b9e8d366;transform:translateY(-8px);box-shadow:0 20px 40px #0000004d}.project-card__image{aspect-ratio:16/9;background:var(--bg);overflow:hidden}.project-card__image img{object-fit:cover;object-position:top;width:100%;height:100%;transition:transform .5s}.project-card:hover .project-card__image img{transform:scale(1.05)}.project-card__placeholder{width:100%;height:100%;color:var(--accent);background:linear-gradient(135deg, var(--surface), var(--bg));justify-content:center;align-items:center;font-size:4rem;font-weight:700;display:flex}.project-card__body{flex-direction:column;flex:1;padding:24px;display:flex}.project-card__name{margin-bottom:12px;font-size:1.3rem}.project-card__description{color:var(--text-muted);flex:1;margin-bottom:20px}.project-card__tech{flex-wrap:wrap;gap:8px;margin-bottom:24px;list-style:none;display:flex}.project-card__tech li{color:var(--accent);background:#b9e8d31a;border-radius:6px;padding:4px 10px;font-size:.8rem}.project-card__actions{flex-wrap:wrap;gap:12px;display:flex}.projects__grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:32px;display:grid}.projects__more{text-align:center;margin-top:48px}.social-links{gap:12px;list-style:none;display:flex}.social-links__item{color:var(--text-muted);border:1px solid #b9e8d340;border-radius:50%;justify-content:center;align-items:center;transition:all .25s;display:flex}.social-links__item:hover{background:var(--accent);border-color:var(--accent);color:var(--bg);transform:translateY(-3px)}.contact{background:#063f354d}.contact__card{text-align:center;background:var(--surface);border-radius:calc(var(--radius) * 2);border:1px solid #b9e8d326;max-width:640px;margin:0 auto;padding:48px 32px;position:relative;overflow:hidden}.contact__card:before{content:"";pointer-events:none;background:radial-gradient(circle,#b9e8d326,#0000 70%);width:300px;height:300px;position:absolute;top:-150px;left:50%;transform:translate(-50%)}.contact__text{color:var(--text-muted);margin-bottom:32px;font-size:1.1rem;position:relative}.contact__email{background:var(--bg);border:1px solid #b9e8d333;border-radius:999px;justify-content:space-between;align-items:center;gap:12px;max-width:420px;margin:0 auto 24px;padding:8px 8px 8px 20px;display:flex;position:relative}.contact__email span{text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;overflow:hidden}.contact__copy{color:var(--accent);cursor:pointer;background:#b9e8d326;border:none;border-radius:999px;flex-shrink:0;padding:8px 18px;font-family:inherit;font-weight:600;transition:all .2s}.contact__copy:hover,.contact__copy--done{background:var(--accent);color:var(--bg)}.contact__cta{position:relative}.contact__socials{justify-content:center;margin-top:32px;display:flex;position:relative}@media (width<=480px){.contact__card{padding:36px 20px}}.footer{border-top:1px solid #b9e8d31a;padding-block:32px}.footer__inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.footer__copy{color:var(--text-muted);font-size:.9rem}.footer__top{color:var(--accent);font-size:.9rem;font-weight:600;transition:opacity .2s}.footer__top:hover{opacity:.7}@media (width<=640px){.footer__inner{text-align:center;flex-direction:column}}.animated-bg{z-index:-1;pointer-events:none;position:fixed;inset:0}.animated-bg:before{content:"";background-image:linear-gradient(#b9e8d30a 1px,#0000 1px),linear-gradient(90deg,#b9e8d30a 1px,#0000 1px);background-size:50px 50px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 30%,#0000 80%);mask-image:radial-gradient(#000 30%,#0000 80%)}.animated-bg canvas{position:absolute;inset:0}.video-card{aspect-ratio:9/16;background:linear-gradient(160deg, var(--surface), var(--bg));width:100%;color:var(--text);text-align:start;cursor:pointer;border:1px solid #b9e8d31f;border-radius:16px;padding:0;font-family:inherit;transition:transform .3s,border-color .3s,box-shadow .3s;display:block;position:relative;overflow:hidden}.video-card:hover{border-color:#b9e8d373;transform:translateY(-6px);box-shadow:0 20px 40px #00000059}.video-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.video-card__img{object-fit:cover;width:100%;height:100%;transition:transform .6s;position:absolute;inset:0}.video-card:hover .video-card__img{transform:scale(1.06)}.video-card__overlay{background:linear-gradient(#0000 45%,#0a1e1c8c 70%,#0a1e1cf2 100%),linear-gradient(#0a1e1c80,#0000 20%);position:absolute;inset:0}.video-card__badge{top:12px;z-index:1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--accent);background:#102c2abf;border:1px solid #b9e8d34d;border-radius:6px;padding:4px 10px;font-family:Consolas,monospace;font-size:.75rem;font-weight:700;position:absolute;inset-inline-start:12px}.video-card__play{z-index:1;width:54px;height:54px;color:var(--bg);background:#b9e8d3e6;border-radius:50%;justify-content:center;align-items:center;transition:transform .3s,box-shadow .3s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 8px #b9e8d32e}.video-card__play svg{margin-left:3px}.video-card:hover .video-card__play{transform:translate(-50%,-50%)scale(1.12);box-shadow:0 0 0 12px #b9e8d326}.video-card__info{bottom:0;z-index:1;padding:16px;position:absolute;inset-inline:0}.video-card__info h3{text-shadow:0 2px 8px #00000080;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:10px;font-size:.98rem;line-height:1.45;display:-webkit-box;overflow:hidden}.video-card__tags{flex-wrap:wrap;gap:6px;list-style:none;display:flex}.video-card__tags li{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--accent);background:#b9e8d326;border:1px solid #b9e8d333;border-radius:6px;padding:3px 8px;font-family:Consolas,monospace;font-size:.7rem}@media (width<=600px){.video-card{border-radius:12px}.video-card__play{width:40px;height:40px;box-shadow:0 0 0 5px #b9e8d32e}.video-card__play svg{width:16px;height:16px;margin-left:2px}.video-card__badge{top:8px;padding:2px 7px;font-size:.65rem;inset-inline-start:8px}.video-card__info{padding:10px}.video-card__info h3{margin-bottom:6px;font-size:.8rem}.video-card__tags li{padding:2px 6px;font-size:.6rem}.video-card__tags li:nth-child(n+3){display:none}}.video-modal{z-index:1000;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#051413eb;justify-content:center;align-items:center;padding:60px 20px 20px;animation:.25s ease-out modalFade;display:flex;position:fixed;inset:0}.video-modal__frame{aspect-ratio:9/16;background:#000;border-radius:18px;max-width:100%;height:min(85vh,820px);animation:.3s ease-out modalZoom;position:relative;box-shadow:0 30px 80px #0009}.video-modal__frame iframe,.video-modal__frame video{border-radius:inherit;border:0;width:100%;height:100%;display:block}.video-modal__close{top:-50px;background:var(--surface);width:40px;height:40px;color:var(--accent);cursor:pointer;border:1px solid #b9e8d34d;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex;position:absolute;inset-inline-end:0}.video-modal__close:hover{background:var(--accent);color:var(--bg)}@keyframes modalFade{0%{opacity:0}}@keyframes modalZoom{0%{opacity:0;transform:scale(.92)}}@media (width<=600px){.video-modal{padding:0}.video-modal__frame{aspect-ratio:auto;border-radius:0;width:100vw;height:100dvh}.video-modal__close{top:16px;z-index:2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#102c2ab3;inset-inline-end:16px}.video-modal__external{top:16px;z-index:2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#102c2ab3;inset-inline-start:16px}}.video-modal__external{top:-50px;background:var(--surface);height:40px;color:var(--accent);white-space:nowrap;border:1px solid #b9e8d34d;border-radius:999px;align-items:center;gap:8px;padding:0 16px;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex;position:absolute;inset-inline-start:0}.video-modal__external:hover{background:var(--accent);color:var(--bg)}.videos__filters{flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:40px;display:flex}.videos__filter{color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #b9e8d333;border-radius:999px;align-items:center;gap:8px;padding:8px 18px;font-family:inherit;font-weight:600;transition:all .2s;display:inline-flex}.videos__filter:hover{border-color:var(--accent);color:var(--accent)}.videos__filter--active,.videos__filter--active:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}.videos__count{background:#b9e8d326;border-radius:999px;padding:1px 7px;font-family:Consolas,monospace;font-size:.75rem}.videos__filter--active .videos__count{background:#102c2a33}.videos__grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:24px;display:grid}.videos__more{text-align:center;margin-top:40px}@media (width<=600px){.videos__grid{grid-template-columns:repeat(2,1fr);gap:12px}.videos__filters{gap:8px;margin-bottom:28px}.videos__filter{padding:6px 14px;font-size:.85rem}}
