@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Press+Start+2P&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:JetBrains Mono,monospace}:root{--primary: #00ffff;--dark: #0a192f;--light: #ffffff;--gray: #8892b0;--glow-color: rgba(0, 255, 255, .6)}body{background-image:url(/assets/background-BSfyIUaH.jpg);color:var(--light);line-height:1.6}.container{max-width:1200px;margin:0 auto;padding:0 20px}nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0}.logo{color:var(--primary);font-size:24px;font-weight:700;transition:text-shadow .3s ease}.logo:hover{text-shadow:0 0 10px var(--glow-color)}.nav-links{display:flex;gap:32px;font-size:16px}.nav-links a{color:var(--light);text-decoration:none;transition:all .3s ease;cursor:pointer;font-family:"Press Start 2P",serif}.nav-links a.active,.nav-links a:hover{color:var(--primary);text-shadow:0 0 10px var(--glow-color)}.menu-btn{display:none;cursor:pointer;font-size:24px}@keyframes hologramFlicker{0%{opacity:.97}50%{opacity:.8}to{opacity:.97}}@keyframes hologramScan{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}.hologram-container{position:relative;background:#00ffff0d;padding:5%;margin:20px 0;overflow:hidden;animation:hologramFlicker 2s infinite;display:flex!important;justify-content:space-between;align-items:center;gap:40px}.hologram-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,255,255,.2),transparent);animation:hologramScan 2s linear infinite;pointer-events:none}.hologram-container:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border:1px solid rgba(0,255,255,.3);pointer-events:none}.content-section{display:none;opacity:0;transition:opacity .3s ease-in-out}.content-section p{font-family:jetbrains mono,monospace}.content-section.active{display:block;opacity:1}.hero-content h1,h2{flex:1;font-family:"Press Start 2P",serif}.hero-content h1{font-size:32px;margin-bottom:16px;transition:text-shadow .3s ease;-webkit-transition:text-shadow .3s ease;-moz-transition:text-shadow .3s ease;-ms-transition:text-shadow .3s ease;-o-transition:text-shadow .3s ease}.hero-content h1:hover{text-shadow:0 0 15px var(--glow-color)}.hero-content h2{color:var(--primary);font-size:22px;margin-bottom:16px;transition:text-shadow .3s ease}.typewriter-text{font-family:"Press Start 2P",serif}.hero-content h2:hover{text-shadow:0 0 10px var(--glow-color)}.hero-content p{color:var(--gray);margin-bottom:32px;max-width:550px;font-size:17px;line-height:2;transition:color .3s ease}.hero-content p:hover{color:var(--light)}.btn{display:inline-block;padding:12px 32px;background-color:var(--primary);color:var(--dark);text-decoration:none;border-radius:50px;font-weight:700;transition:all .3s ease}.btn:hover{background-color:#0cc;box-shadow:0 0 20px var(--glow-color);transform:scale(1.05)}.social-links{display:flex;gap:16px;margin-top:24px}.social-links a{color:var(--gray);font-size:24px;transition:all .3s ease}.social-links a:hover{color:var(--primary);text-shadow:0 0 10px var(--glow-color);transform:translateY(-2px)}.profile-image{position:relative;width:320px;height:320px;flex-shrink:0;perspective:1000px}.profile-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s}.profile-image:hover .profile-inner{transform:rotateY(180deg)}.profile-circle,.profile-back{width:100%;height:100%;position:absolute;border-radius:50%;backface-visibility:hidden;display:flex;justify-content:center;align-items:center}.profile-circle{background-color:#00ffff1a}.profile-back{background-color:#ff00001a;transform:rotateY(180deg);box-shadow:0 0 20px var(--glow-color)}.profile-circle img,.profile-back img{width:100%;height:100%;border-radius:50%;object-fit:cover}.profile-circle img:hover{box-shadow:0 0 20px var(--glow-color)}.projects-grid{display:flex;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.project-card{border:1px solid var(--primary);padding:20px;background:#00ffff0d;transition:all .3s ease}.project-card:hover{box-shadow:0 0 20px var(--glow-color);transform:translateY(-5px)}.project-card h3{color:var(--primary);margin-bottom:10px;transition:text-shadow .3s ease}.project-card h3:hover{text-shadow:0 0 10px var(--glow-color)}.skills-grid{display:flex;justify-content:space-between;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:100px;padding:40px;max-width:1000px;margin:0 auto}.skill-category{flex:1;max-width:45%}.skill-category h3{color:var(--primary);margin-bottom:10%;font-size:24px;text-align:center;transition:text-shadow .3s ease}.skill-category h3:hover{text-shadow:0 0 10px var(--glow-color)}.skill-list{list-style:none}.skill-list li{margin-bottom:25px;font-size:16px}.skill-bar{width:100%;height:12px;background:#00ffff1a;border:1px solid var(--primary);margin-top:8px;position:relative;overflow:hidden;transition:all .3s ease;min-width:250px}.skill-bar:hover{box-shadow:0 0 15px var(--glow-color)}.skill-progress{height:100%;background:var(--primary);position:absolute;left:0;top:0;transition:width 1s ease-in-out;box-shadow:0 0 10px var(--glow-color)}.timeline{max-width:800px;margin:0 auto}.timeline-item{padding:20px;margin-bottom:20px;border:1px solid var(--primary);background:#00ffff0d;transition:all .3s ease}.timeline-item:hover{box-shadow:0 0 20px var(--glow-color);transform:translate(5px)}@media (max-width: 1020px){.logo{font-size:18px}.nav-links{display:none;position:fixed;top:80px;left:0;right:0;background-color:#000;opacity:90%;padding:20px;flex-direction:column;text-align:center;box-shadow:0 2px 5px #0003;z-index:1000;font-size:14px}.nav-links.active{display:flex}.menu-btn{display:block}.hologram-container{flex-direction:column;text-align:center}.hero-content{order:2}.profile-image{order:1}.social-links{justify-content:center}.hero-content h1{font-size:28px}.hero-content h2{font-size:20px}.hero-content p,.btn{font-size:16px}.projects-grid{flex-direction:column}.skills-grid{flex-direction:column;gap:40px;padding:20px;grid-template-columns:1fr}.skill-category{max-width:100%}}@media (max-width: 480px){.hero-content h1{font-size:20px}.hero-content h2{font-size:16px}.hero-content p,.btn{font-size:12px}}