*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#07090b;color:#f5f7fa;font-family:Inter,"Noto Sans Arabic",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:99;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}.cursor-glow{position:fixed;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(91,114,255,.09),transparent 65%);transform:translate(-50%,-50%);pointer-events:none;z-index:0}.nav-wrap{position:fixed;top:18px;left:0;right:0;z-index:50;display:flex;justify-content:center;padding:0 18px}.nav{width:min(920px,100%);height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 14px 0 20px;border:1px solid #ffffff12;border-radius:18px}.glass{background:#0b0e12cc;backdrop-filter:blur(18px);box-shadow:0 14px 50px #0008}.brand{color:white;text-decoration:none;font-weight:800;letter-spacing:.08em;display:flex;gap:9px;align-items:center}.brand-dot{width:9px;height:9px;border-radius:50%;background:#7b8cff;box-shadow:0 0 18px #7b8cff}.nav-links{display:flex;gap:26px}.nav-links a{color:#9da5b2;text-decoration:none;font-size:13px;font-weight:600;transition:.25s}.nav-links a:hover{color:#fff}.lang-btn{border:1px solid #ffffff17;background:#ffffff09;color:#fff;border-radius:12px;padding:9px 12px;font-weight:800;cursor:pointer;transition:.25s}.lang-btn:hover{background:#fff;color:#090b0e}.section{position:relative;width:min(1160px,calc(100% - 40px));margin:auto;padding:120px 0}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center}.hero-content{position:relative;z-index:2;max-width:900px}.eyebrow{display:inline-flex;gap:9px;align-items:center;color:#aab2c0;border:1px solid #ffffff13;background:#ffffff08;border-radius:99px;padding:9px 13px;font-size:11px;font-weight:700;letter-spacing:.15em}.pulse{width:7px;height:7px;border-radius:50%;background:#72ff9a;box-shadow:0 0 14px #72ff9a}.hero h1{font-size:clamp(62px,11vw,142px);line-height:.9;letter-spacing:-.075em;margin:30px 0 26px}.gradient-text{background:linear-gradient(115deg,#fff 15%,#8f9cff 55%,#65e7ff);-webkit-background-clip:text;color:transparent}.hero-sub{max-width:690px;margin:auto;color:#9aa3b0;font-size:clamp(17px,2vw,21px);line-height:1.7}.hero-actions{display:flex;justify-content:center;gap:12px;margin-top:34px}.btn{padding:14px 20px;border-radius:14px;text-decoration:none;font-weight:700;font-size:14px;transition:.25s}.primary{background:#f4f6f8;color:#080a0c}.primary:hover{transform:translateY(-3px);box-shadow:0 10px 35px #ffffff22}.ghost{border:1px solid #ffffff17;color:#d8dde5;background:#ffffff07}.ghost:hover{background:#ffffff10}.chips{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:36px}.chips span,.tags span{font-size:11px;color:#a7afbc;border:1px solid #ffffff10;background:#ffffff06;padding:8px 11px;border-radius:10px}.orb{position:absolute;border-radius:50%;filter:blur(10px);opacity:.3}.orb-a{width:420px;height:420px;background:#3047ff22;top:18%;left:8%}.orb-b{width:340px;height:340px;background:#00e5ff14;right:8%;bottom:12%}.scroll-hint{position:absolute;bottom:28px;color:#5e6672;font-size:28px;animation:bob 1.8s infinite}@keyframes bob{50%{transform:translateY(7px)}}.section-head{max-width:800px;margin-bottom:48px}.kicker{font-size:11px;font-weight:800;letter-spacing:.18em}.cyan{color:#55dcff}.violet{color:#a994ff}.lime{color:#b8ff38}.pink{color:#ff70bd}.section h2{font-size:clamp(38px,6vw,72px);letter-spacing:-.055em;line-height:1.02;margin:15px 0}.about-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.card,.mini-card,.visual-card,.xg-mark{border:1px solid #ffffff10;background:linear-gradient(145deg,#101419,#0a0d11);border-radius:24px}.about-card{padding:34px}.about-card p{font-size:17px;line-height:1.85;color:#aab2be;margin:0 0 18px}.skill-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini-card{padding:22px;display:flex;flex-direction:column;justify-content:flex-end;min-height:135px;transition:.3s}.mini-card:hover{transform:translateY(-5px);border-color:#55dcff44}.mini-card b{font-size:15px;margin-bottom:7px}.mini-card span{font-size:12px;color:#737d8c}.project{min-height:720px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.project-copy{position:relative;z-index:2}.project-copy p{font-size:17px;line-height:1.8;color:#9ca5b2;max-width:620px}.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.lumax{width:100%;max-width:none;padding-left:max(20px,calc((100vw - 1160px)/2));padding-right:max(20px,calc((100vw - 1160px)/2));background:radial-gradient(circle at 80% 50%,#6d45ff17,transparent 35%),#090a0e}.project-glow{position:absolute;right:7%;width:450px;height:450px;border-radius:50%;background:#7254ff13;filter:blur(30px)}.visual-card{height:410px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:inset 0 0 80px #6b4fff0c}.lumax-logo{font-size:90px;font-weight:800;letter-spacing:-.09em;z-index:2}.lumax-logo span{color:#9d83ff}.rings{position:absolute;width:280px;height:280px;border:1px solid #9b83ff55;border-radius:50%;box-shadow:0 0 70px #7656ff28,inset 0 0 60px #7656ff12}.rings:before,.rings:after{content:"";position:absolute;border:1px solid #ffffff0d;border-radius:50%;inset:28px}.rings:after{inset:62px}.visual-card small{position:absolute;bottom:28px;color:#676e7a;letter-spacing:.18em}.xg{width:100%;max-width:none;padding-left:max(20px,calc((100vw - 1160px)/2));padding-right:max(20px,calc((100vw - 1160px)/2));background:#050705;overflow:hidden}.xg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 50%,#aaff0020,transparent 34%);pointer-events:none}.xg-grid{position:absolute;inset:0;opacity:.06;background-image:linear-gradient(#b6ff3c 1px,transparent 1px),linear-gradient(90deg,#b6ff3c 1px,transparent 1px);background-size:50px 50px;mask-image:linear-gradient(90deg,transparent,#000,transparent)}.xg h2 span{color:#b8ff38}.xg-tags span{border-color:#b8ff3822;color:#c9ff70}.xg-mark{height:410px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#080b07;border-color:#b8ff3820;position:relative;z-index:2;box-shadow:0 0 100px #8dff0010}.xg-mark strong{font-size:120px;letter-spacing:-.1em;color:#b8ff38;text-shadow:0 0 50px #b8ff3840}.xg-mark span{font-size:11px;color:#819363;letter-spacing:.22em}.contact{padding-bottom:90px}.contact .section-head p{color:#8993a0}.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.social{position:relative;min-height:155px;padding:22px;border:1px solid #ffffff10;border-radius:20px;background:#0d1014;color:white;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;transition:.3s}.social:before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-40px;top:-40px;background:var(--c);filter:blur(45px);opacity:.2;transition:.3s}.social:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--c) 45%,transparent)}.social:hover:before{opacity:.4}.social>span{position:absolute;top:20px;left:20px;font-weight:800;color:var(--c)}.social b{font-size:15px}.social small{color:#6f7885;margin-top:5px}.whatsapp{--c:#25d366}.telegram{--c:#29a9ea}.instagram{--c:#ff4d9d}.discord{--c:#7289ff}.youtube{--c:#ff3434}.tiktok{--c:#69f6f0}.email{--c:#f4f4f4}.email{grid-column:span 2}footer{width:min(1160px,calc(100% - 40px));margin:auto;padding:30px 0 45px;border-top:1px solid #ffffff0d;display:flex;justify-content:space-between;color:#626b77;font-size:12px}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:none}[dir="rtl"] .hero h1{letter-spacing:-.035em}[dir="rtl"] .nav{padding:0 20px 0 14px}[dir="rtl"] .social>span{left:auto;right:20px}
@media(max-width:800px){.nav-links{display:none}.section{padding:90px 0}.hero{padding-top:120px}.hero h1{font-size:64px}.hero-actions{flex-direction:column;align-items:stretch;max-width:320px;margin:30px auto 0}.about-grid,.project{grid-template-columns:1fr}.project{gap:28px;min-height:auto;padding-top:90px;padding-bottom:90px}.visual-card,.xg-mark{height:320px}.social-grid{grid-template-columns:1fr 1fr}.email{grid-column:span 2}.cursor-glow{display:none}}@media(max-width:480px){.section{width:calc(100% - 28px)}.hero h1{font-size:54px}.skill-grid,.social-grid{grid-template-columns:1fr}.email{grid-column:auto}.about-card{padding:25px}.lumax,.xg{padding-left:14px;padding-right:14px}.xg-mark strong{font-size:90px}footer{width:calc(100% - 28px);flex-direction:column;gap:8px}}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:100;background:#fff;color:#000;padding:10px 14px;border-radius:10px}
.skip-link:focus{left:8px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{transition:none;opacity:1;transform:none}.scroll-hint{animation:none}}

/* Ambient animated background */
body::before{content:"";position:fixed;inset:-18%;z-index:-2;pointer-events:none;background:radial-gradient(circle at 18% 24%,rgba(86,112,255,.16),transparent 28%),radial-gradient(circle at 82% 32%,rgba(0,220,255,.10),transparent 25%),radial-gradient(circle at 72% 82%,rgba(164,92,255,.10),transparent 27%);filter:blur(18px);transform:translate3d(0,0,0);animation:ambientFlow 18s ease-in-out infinite alternate}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 88%);animation:gridDrift 28s linear infinite}
.orb-a{animation:floatA 11s ease-in-out infinite alternate}.orb-b{animation:floatB 14s ease-in-out infinite alternate}.rings{animation:ringBreathe 5s ease-in-out infinite}.xg-grid{animation:xgGridMove 20s linear infinite}
@keyframes ambientFlow{0%{transform:translate3d(-2%,-1%,0) scale(1)}50%{transform:translate3d(3%,2%,0) scale(1.05)}100%{transform:translate3d(-1%,4%,0) scale(1.02)}}
@keyframes gridDrift{to{background-position:58px 58px}}@keyframes floatA{to{transform:translate3d(45px,28px,0) scale(1.08)}}@keyframes floatB{to{transform:translate3d(-38px,-24px,0) scale(.94)}}@keyframes ringBreathe{50%{transform:scale(1.035);box-shadow:0 0 95px #7656ff35,inset 0 0 72px #7656ff18}}@keyframes xgGridMove{to{background-position:50px 50px}}
@media(prefers-reduced-motion:reduce){body::before,body::after,.orb-a,.orb-b,.rings,.xg-grid{animation:none!important}}

/* ===== PIXS Experience polish ===== */
:root{--mx:50vw;--my:25vh}
html{scroll-padding-top:86px}
body{overflow-x:hidden}
.scroll-progress{position:fixed;left:0;top:0;height:3px;width:var(--scroll,0%);z-index:9999;background:linear-gradient(90deg,#4ddcff,#8a66ff,#b7ff36);box-shadow:0 0 18px rgba(112,205,255,.55);pointer-events:none}
.ambient-particles{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(90,130,255,.095),transparent 72%);transition:background .12s linear}
.hero-status{display:inline-flex;align-items:center;gap:9px;padding:7px 11px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);backdrop-filter:blur(10px);border-radius:999px;color:#cfd4e8;font-size:.78rem;margin-bottom:18px}
.status-dot{width:7px;height:7px;border-radius:50%;background:#b7ff36;box-shadow:0 0 14px #b7ff36;animation:statusPulse 2s ease-in-out infinite}
@keyframes statusPulse{50%{opacity:.45;transform:scale(.75)}}
.nav{backdrop-filter:blur(18px) saturate(135%);background:rgba(7,8,13,.62)!important}
.card,.social-card,.stat,.skill{transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s ease,box-shadow .28s ease,background .28s ease}
.card:hover,.social-card:hover,.stat:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.16);box-shadow:0 18px 55px rgba(0,0,0,.24)}
.social-card:hover{background:rgba(255,255,255,.07)}
.section{position:relative}
.section::after{content:"";position:absolute;left:50%;bottom:0;width:min(82vw,1050px);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent)}
.section-title{letter-spacing:-.035em}
.btn,.lang-btn{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.btn:hover,.lang-btn:hover{transform:translateY(-2px)}
.btn:active,.lang-btn:active,.social-card:active{transform:translateY(0) scale(.98)}
a:focus-visible,button:focus-visible{outline:2px solid #6de5ff;outline-offset:4px}
::selection{background:#7656ff;color:white}
@media(max-width:720px){
 .ambient-particles{display:none}
 .hero-status{font-size:.72rem}
 .card:hover,.social-card:hover,.stat:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
 .status-dot{animation:none}.ambient-particles{display:none}
 .card,.social-card,.stat,.skill,.btn,.lang-btn{transition:none!important}
}
