*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#080810;--bg2:#0d0d18;--card:#10101e;--border:#1e1e35;
  --accent:#ff6b35;--accent2:#f7931e;--blue:#4f8ef7;--green:#00e676;
  --text:#eeeef5;--muted:#7777a0;
  --fhead:'Bebas Neue',sans-serif;--fbody:'Outfit',sans-serif;--fmono:'JetBrains Mono',monospace;
}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:var(--fbody);overflow-x:hidden;cursor:none;}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--accent);border-radius:99px;}

.cursor{width:10px;height:10px;background:var(--accent);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .2s,height .2s;}
.cursor-follower{width:35px;height:35px;border:1.5px solid var(--accent);border-radius:50%;opacity:.5;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:all 0.12s ease;}

.loader{position:fixed;inset:0;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:99999;transition:opacity .6s,visibility .6s;}
.loader.hidden{opacity:0;visibility:hidden;pointer-events:none;}
.loader-text{font-family:var(--fhead);font-size:5rem;letter-spacing:.1em;}
.loader-text span{display:inline-block;animation:loaderBounce .6s ease infinite alternate;}
.loader-text span:nth-child(2){animation-delay:.1s;}
.loader-text span:nth-child(3){animation-delay:.2s;color:var(--accent);}
.loader-bar{width:200px;height:3px;background:var(--border);border-radius:99px;margin-top:2rem;overflow:hidden;}
.loader-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:99px;animation:loaderFill 1.5s ease forwards;}
@keyframes loaderBounce{from{transform:translateY(0)}to{transform:translateY(-12px)}}
@keyframes loaderFill{from{width:0}to{width:100%}}

.navbar{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:1.4rem 5%;transition:padding .3s,background .3s,box-shadow .3s;}
.navbar.scrolled{background:rgba(8,8,16,.92);backdrop-filter:blur(20px);padding:.9rem 5%;box-shadow:0 4px 40px rgba(0,0,0,.4);border-bottom:1px solid var(--border);}
.nav-logo{font-family:var(--fhead);font-size:1.8rem;}
.nav-logo span{color:var(--accent);}
.nav-links{list-style:none;display:flex;gap:1.8rem;}
.nav-links a{text-decoration:none;color:var(--muted);font-size:.85rem;font-weight:500;letter-spacing:.04em;transition:color .3s;position:relative;}
.nav-links a::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:2px;background:var(--accent);transition:width .3s;border-radius:99px;}
.nav-links a:hover,.nav-links a.active{color:var(--text);}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;}
.hamburger span{display:block;width:24px;height:2px;background:var(--text);border-radius:99px;transition:all .3s;}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.hero{min-height:100vh;display:flex;align-items:center;justify-content:space-between;padding:9rem 5% 4rem;position:relative;overflow:hidden;gap:2rem;}
#particleCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
.orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(80px);}
.orb1{width:500px;height:500px;background:rgba(255,107,53,.08);top:-100px;right:-100px;animation:orbFloat 8s ease-in-out infinite;}
.orb2{width:350px;height:350px;background:rgba(79,142,247,.06);bottom:-50px;left:10%;animation:orbFloat 10s ease-in-out infinite reverse;}
.orb3{width:250px;height:250px;background:rgba(247,147,30,.06);top:50%;left:40%;animation:orbFloat 7s ease-in-out infinite 2s;}
@keyframes orbFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,-30px) scale(1.1)}}

.hero-content{position:relative;z-index:2;max-width:580px;}
.hero-badge{display:inline-flex;align-items:center;gap:.6rem;padding:.45rem 1.2rem;background:rgba(255,107,53,.1);border:1px solid rgba(255,107,53,.3);border-radius:99px;font-size:.82rem;font-weight:600;color:var(--accent);margin-bottom:1.5rem;font-family:var(--fmono);}
.badge-dot{width:7px;height:7px;background:var(--accent);border-radius:50%;animation:pulse 1.5s infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,107,53,.5)}50%{box-shadow:0 0 0 6px rgba(255,107,53,0)}}
.hero-name{font-family:var(--fhead);font-size:clamp(4rem,9vw,7.5rem);line-height:.95;letter-spacing:.02em;margin-bottom:1.5rem;display:flex;flex-direction:column;}
.name-line{display:block;}
.stroke{-webkit-text-stroke:2px var(--accent);color:transparent;}
.orange-dot{color:var(--accent);-webkit-text-stroke:0;}
.hero-role{font-family:var(--fmono);font-size:1.05rem;color:var(--muted);margin-bottom:1rem;min-height:1.6rem;}
.typed{color:var(--accent2);font-weight:700;}
.type-cursor{color:var(--accent);animation:blink .8s step-end infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.hero-desc{color:var(--muted);font-size:.95rem;line-height:1.8;margin-bottom:2.5rem;}
.hero-btns{display:flex;gap:1rem;flex-wrap:wrap;}

.btn-primary{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.2rem;background:var(--accent);color:#fff;border:none;border-radius:12px;font-family:var(--fbody);font-weight:600;font-size:.95rem;text-decoration:none;cursor:pointer;transition:transform .3s,box-shadow .3s;box-shadow:0 8px 30px rgba(255,107,53,.3);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(255,107,53,.45);}
.btn-ghost{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.2rem;background:transparent;color:var(--text);border:1.5px solid var(--border);border-radius:12px;font-family:var(--fbody);font-weight:500;font-size:.95rem;text-decoration:none;cursor:pointer;transition:all .3s;}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-3px);}

.hero-avatar-wrap{position:relative;z-index:2;width:320px;height:320px;flex-shrink:0;}
.avatar-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(255,107,53,.2) 0%,transparent 70%);border-radius:50%;animation:glowPulse 3s ease-in-out infinite;}
@keyframes glowPulse{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.1);opacity:1}}
.avatar-main{position:absolute;inset:50px;border-radius:50%;background:linear-gradient(135deg,#1a1a2e,#16213e);border:2px solid rgba(255,107,53,.3);display:flex;align-items:center;justify-content:center;font-family:var(--fhead);font-size:4rem;color:var(--accent);box-shadow:inset 0 0 40px rgba(255,107,53,.1),0 0 60px rgba(255,107,53,.1);z-index:2;}
.orbit{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(255,107,53,.2);}
.orbit1{animation:spinO 12s linear infinite;}
.orbit2{inset:-20px;border-color:rgba(79,142,247,.2);animation:spinO 18s linear infinite reverse;}
.orbit3{inset:-45px;border-color:rgba(247,147,30,.15);animation:spinO 25s linear infinite;}
@keyframes spinO{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.orbit-dot{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;background:var(--card);border:1px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.95rem;color:var(--accent2);animation:cSpin1 12s linear infinite;}
.orbit2 .orbit-dot{animation:cSpin2 18s linear infinite;color:var(--blue);}
.orbit3 .orbit-dot{animation:cSpin3 25s linear infinite;color:#f7dc6f;}
@keyframes cSpin1{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes cSpin2{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes cSpin3{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(-360deg)}}

.scroll-down{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:2;color:var(--muted);font-size:.75rem;font-family:var(--fmono);letter-spacing:.15em;animation:scrollBounce 2s ease-in-out infinite;}
.scroll-mouse{width:22px;height:36px;border:2px solid var(--muted);border-radius:99px;display:flex;justify-content:center;padding-top:5px;}
.scroll-wheel{width:3px;height:8px;background:var(--accent);border-radius:99px;animation:scrollWheel 1.5s ease-in-out infinite;}
@keyframes scrollWheel{0%,100%{opacity:1;transform:translateY(0)}50%{opacity:0;transform:translateY(8px)}}
@keyframes scrollBounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}

section{padding:7rem 5%;}
.about,.contact,.certificates{background:var(--bg2);}
.skills,.education,.sports{background:var(--bg);}

.sec-head{display:flex;align-items:flex-end;gap:1.5rem;margin-bottom:4rem;}
.sec-num{font-family:var(--fhead);font-size:5rem;line-height:1;color:rgba(255,107,53,.12);letter-spacing:.05em;user-select:none;}
.sec-tag{display:block;font-family:var(--fmono);font-size:.78rem;color:var(--accent);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.4rem;}
.sec-head h2{font-family:var(--fhead);font-size:clamp(2.5rem,5vw,3.8rem);letter-spacing:.03em;line-height:1;}
.sec-head h2 em{font-style:normal;-webkit-text-stroke:1.5px var(--accent);color:transparent;}

.about-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:4rem;align-items:center;}
.av-card{position:relative;width:500px;height:550px;border-radius:24px;background:var(--card);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.av-bg{position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,107,53,.08),transparent);}
.av-mono{font-family:var(--fhead);font-size:6rem;color:rgba(255,107,53,.15);position:absolute;bottom:-10px;right:-5px;letter-spacing:.05em;}
.av-badge{position:absolute;top:20px;right:-15px;background:var(--accent);color:#fff;font-size:.2.8rem;font-weight:700;padding:.2rem 3rem;border-radius:12px;text-align:center;line-height:1.4;box-shadow:0 4px 20px rgba(255,107,53,.4);animation:badgeFloat 3s ease-in-out infinite;}
@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.a-intro{font-size:1.1rem;line-height:1.8;margin-bottom:1rem;}
.a-intro strong{color:var(--accent2);}
.a-body{color:var(--muted);line-height:1.8;font-size:.97rem;margin-bottom:1rem;}
.highlight{color:var(--accent);font-weight:600;}
.lang-box{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.2rem 1.5rem;margin-bottom:1.2rem;}
.lang-box h4{font-size:.9rem;font-weight:600;margin-bottom:.8rem;}
.lang-chips{display:flex;flex-wrap:wrap;gap:.6rem;}
.lang-chip{padding:.4rem 1rem;background:rgba(255,107,53,.08);border:1px solid rgba(255,107,53,.2);border-radius:99px;font-size:.82rem;color:var(--accent2);font-family:var(--fmono);}
.a-stats{display:flex;gap:2.5rem;align-items:flex-end;margin-top:1.5rem;}
.a-stat{display:flex;flex-direction:column;}
.a-num{font-family:var(--fhead);font-size:2.8rem;color:var(--accent);line-height:1;}
.a-stat>span{font-family:var(--fhead);font-size:1.5rem;color:var(--accent);}
.a-stat p{color:var(--muted);font-size:.85rem;margin-top:.2rem;}

.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;}
.sk-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:2rem 1.8rem;position:relative;overflow:hidden;transition:transform .35s,border-color .35s,box-shadow .35s;}
.sk-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,var(--accent),var(--accent2));transform:scaleX(0);transform-origin:left;transition:transform .4s ease;}
.sk-card:hover{transform:translateY(-8px);border-color:rgba(255,107,53,.3);box-shadow:0 20px 60px rgba(0,0,0,.3);}
.sk-card:hover::after{transform:scaleX(1);}
.sk-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.2rem;}
.sk-ico{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;}
.sk-ico.html{background:rgba(255,107,53,.15);color:var(--accent);}
.sk-ico.css{background:rgba(79,142,247,.15);color:var(--blue);}
.sk-ico.js{background:rgba(247,220,111,.15);color:#f7dc6f;}
.sk-ico.java{background:rgba(247,147,30,.15);color:var(--accent2);}
.sk-ico.excel{background:rgba(0,200,100,.15);color:#00c864;}
.sk-ico.comm{background:rgba(0,230,118,.15);color:var(--green);}
.sk-ico.lead{background:rgba(200,100,255,.15);color:#c864ff;}
.sk-pct{font-family:var(--fmono);font-size:.85rem;color:var(--accent);font-weight:700;}
.sk-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem;}
.sk-card p{color:var(--muted);font-size:.88rem;line-height:1.6;margin-bottom:1.4rem;}
.sk-bar{background:var(--border);height:5px;border-radius:99px;overflow:hidden;margin-bottom:.5rem;}
.sk-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:99px;width:0;transition:width 1.4s cubic-bezier(.16,1,.3,1);}
.sk-lvl{font-size:.75rem;color:var(--muted);font-family:var(--fmono);}

.edu-timeline{display:flex;flex-direction:column;gap:1.5rem;}
.edu-card{display:flex;gap:2rem;align-items:flex-start;background:var(--card);border:1px solid var(--border);border-radius:20px;padding:2rem;transition:border-color .3s,transform .3s;position:relative;overflow:hidden;}
.edu-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent),var(--accent2));border-radius:4px 0 0 4px;}
.edu-card:hover{border-color:rgba(255,107,53,.3);transform:translateX(5px);}
.edu-icon{width:52px;height:52px;border-radius:14px;flex-shrink:0;background:rgba(255,107,53,.12);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:1.3rem;}
.edu-year{font-family:var(--fmono);font-size:.78rem;color:var(--accent);letter-spacing:.1em;display:block;margin-bottom:.5rem;}
.edu-info h3{font-size:1.1rem;font-weight:700;margin-bottom:.4rem;}
.edu-college{color:var(--accent2);font-size:.88rem;font-weight:600;margin-bottom:.5rem;}
.edu-desc{color:var(--muted);font-size:.88rem;line-height:1.6;}

.cert-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;}
.cert-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:2rem;display:flex;gap:1.5rem;align-items:flex-start;position:relative;overflow:hidden;transition:transform .3s,border-color .3s;}
.cert-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2));transform:scaleX(0);transform-origin:left;transition:transform .4s;}
.cert-card:hover{transform:translateY(-6px);border-color:rgba(255,107,53,.3);}
.cert-card:hover::after{transform:scaleX(1);}
.cert-icon{width:52px;height:52px;border-radius:14px;flex-shrink:0;background:rgba(255,107,53,.12);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:1.5rem;}
.cert-info h3{font-size:1.05rem;font-weight:700;margin-bottom:.3rem;}
.cert-issuer{color:var(--accent2);font-size:.82rem;font-weight:600;margin-bottom:.5rem;}
.cert-desc{color:var(--muted);font-size:.85rem;line-height:1.6;}
.cert-badge{position:absolute;top:1.2rem;right:1.2rem;background:rgba(0,230,118,.1);color:var(--green);border:1px solid rgba(0,230,118,.3);font-size:.72rem;font-weight:700;font-family:var(--fmono);padding:.3rem .8rem;border-radius:99px;}

.contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:4rem;align-items:start;}
.c-desc{color:var(--muted);font-size:1rem;line-height:1.8;margin-bottom:2.5rem;}
.c-links{display:flex;flex-direction:column;gap:1rem;}
.c-link{display:flex;align-items:center;gap:1.2rem;padding:1.2rem 1.5rem;background:var(--card);border:1px solid var(--border);border-radius:16px;text-decoration:none;color:inherit;transition:border-color .3s,transform .3s;}
.c-link:hover{border-color:var(--accent);transform:translateX(5px);}
.c-link-ico{width:42px;height:42px;background:rgba(255,107,53,.12);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:1rem;flex-shrink:0;}
.c-link-info{flex:1;}
.c-link-info span{display:block;font-weight:600;font-size:.9rem;}
.c-link-info small{color:var(--muted);font-size:.8rem;}
.c-arr{color:var(--muted);font-size:.8rem;}
.cform{display:flex;flex-direction:column;gap:1.5rem;}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;}
.cf-field{position:relative;}
.cf-field input,.cf-field textarea{width:100%;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.3rem 1rem .6rem;color:var(--text);font-family:var(--fbody);font-size:.95rem;outline:none;resize:vertical;transition:border-color .3s;}
.cf-field input:focus,.cf-field textarea:focus{border-color:var(--accent);}
.cf-field label{position:absolute;top:1rem;left:1rem;color:var(--muted);font-size:.88rem;pointer-events:none;transition:all .25s ease;}
.cf-field input:focus~label,.cf-field input:not(:placeholder-shown)~label,.cf-field textarea:focus~label,.cf-field textarea:not(:placeholder-shown)~label{top:.3rem;font-size:.72rem;color:var(--accent);}
.form-status{font-size:.9rem;min-height:1.4rem;padding:.3rem 0;}
.form-status.success{color:var(--green);}
.form-status.error{color:#ff5252;}

.footer{padding:3rem 5%;border-top:1px solid var(--border);background:var(--bg);}
.f-inner{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center;}
.f-logo{font-family:var(--fhead);font-size:2rem;letter-spacing:.1em;}
.f-logo em{font-style:normal;color:var(--accent);}
.footer p{color:var(--muted);font-size:.85rem;}
.footer strong{color:var(--text);}
.heart{color:var(--accent);display:inline-block;animation:hb 1.2s ease-in-out infinite;}
@keyframes hb{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}

.reveal,.reveal-left,.reveal-right{opacity:0;transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1);}
.reveal{transform:translateY(40px);}
.reveal-left{transform:translateX(-50px);}
.reveal-right{transform:translateX(50px);}
.reveal.visible,.reveal-left.visible,.reveal-right.visible{opacity:1;transform:translate(0);}
.delay-1{transition-delay:.1s!important;}
.delay-2{transition-delay:.2s!important;}
.delay-3{transition-delay:.3s!important;}
.delay-4{transition-delay:.4s!important;}

@media(max-width:900px){
  .hero{flex-direction:column;text-align:center;padding:8rem 5% 5rem;}
  .hero-btns{justify-content:center;}
  .hero-avatar-wrap{width:250px;height:250px;}
  .avatar-main{font-size:3rem;}
  .about-grid,.contact-grid{grid-template-columns:1fr;gap:2.5rem;}
  .av-card{width:100%;height:220px;}
  .av-badge{right:10px;}
  .a-stats{gap:1.5rem;}
  .edu-card{flex-direction:column;gap:1rem;}
}
@media(max-width:600px){
  .nav-links{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg2);padding:1.5rem 5%;border-bottom:1px solid var(--border);gap:1.2rem;}
  .nav-links.open{display:flex;}
  .hamburger{display:flex;}
  .sec-num{font-size:3rem;}
  .cf-row{grid-template-columns:1fr;}
  .hero-name{font-size:clamp(3rem,15vw,5rem);}
  .cert-card{flex-direction:column;}
  #particleCanvas{display:none;}
}