@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Space Grotesk,sans-serif;background:#f8f8f8;color:#000;line-height:1.5;overflow-x:hidden}.container{max-width:1200px;margin:0 auto;padding:40px 20px}.border-box{border:3px solid #000;background:#fff;position:relative;box-shadow:8px 8px #000}.border-box:after{display:none}.hero{padding:60px 40px;margin-bottom:60px;text-align:center;background:#fff;border:4px solid #000;position:relative;box-shadow:8px 8px #f36}.hero h1{font-size:clamp(3rem,8vw,5rem);font-weight:700;text-transform:uppercase;letter-spacing:-.02em;margin-bottom:20px;color:#000;background:none;border:none}.hero .role{font-size:1.5rem;font-weight:600;text-transform:uppercase;color:#000;margin-bottom:30px;letter-spacing:.1em;padding:15px 25px;border:3px solid #000;background:#ff0;display:inline-block}.hero .bio{font-size:1.1rem;max-width:600px;margin:0 auto;color:#333;font-weight:400;line-height:1.6}.section{margin-bottom:80px}.section-title{font-size:2.5rem;font-weight:700;text-transform:uppercase;margin-bottom:40px;padding:20px 30px;background:#000;color:#fff;display:inline-block;position:relative;box-shadow:6px 6px #f36}.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.tech-category,.project,.experience-item{padding:30px;border:3px solid #000;background:#fff;position:relative;box-shadow:6px 6px #0f8;transition:all .3s ease}.tech-category:hover,.experience-item:hover{transform:translate(-4px,-4px);box-shadow:10px 10px #ff0}.project{overflow:hidden}.project:hover{transform:translate(-4px,-4px) scale(1.02);box-shadow:12px 12px #ff0}.experience-item{margin-bottom:24px}.tech-category h3{font-size:1.3rem;font-weight:600;text-transform:uppercase;margin-bottom:20px;color:#000}.tech-list{display:flex;flex-wrap:wrap;gap:10px}.tech-item{padding:8px 16px;border:2px solid #000;background:#fff;font-weight:500;font-size:.9rem;transition:all .2s ease;cursor:pointer}.tech-item:hover{background:#000;color:#fff;transform:translate(-2px,-2px);box-shadow:4px 4px #f36}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:40px}.project-header{padding:25px 30px;background:#000;color:#fff;border-bottom:4px solid #000}.project-title{font-size:1.4rem;font-weight:600;text-transform:uppercase;margin-bottom:8px}.project-tech{font-size:.9rem;color:#ccc;font-weight:400}.project-body{padding:1rem}.project-description{margin-bottom:25px;color:#333;line-height:1.6}.project-links{display:flex;gap:15px;flex-wrap:wrap}.project-link{padding:12px 24px;border:3px solid #000;background:#fff;color:#000;text-decoration:none;font-weight:600;text-transform:uppercase;font-size:.9rem;transition:all .2s ease;position:relative}.project-link:hover{background:#000;color:#fff;transform:translate(-3px,-3px);box-shadow:6px 6px #f36}.experience-list{display:flex;flex-direction:column;gap:30px}.experience-item{padding:30px;border:3px solid #000;background:#fff;position:relative}.experience-title{font-size:1.3rem;font-weight:600;text-transform:uppercase;margin-bottom:8px}.experience-company{font-size:1rem;font-weight:500;color:#666;margin-bottom:15px;text-transform:uppercase}.experience-description{color:#333;line-height:1.6}.experience-tech{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.experience-tech-item{padding:4px 10px;border:2px solid #000;background:#fff;font-weight:500;font-size:.8rem;transition:all .2s ease}.experience-tech-item:hover{background:#000;color:#fff;transform:translate(-1px,-1px);box-shadow:2px 2px #f36}.contact{padding:50px 40px;text-align:center;border:4px solid #000;background:#000;color:#fff;position:relative;margin-top:60px}.contact:after{content:"";position:absolute;top:8px;left:8px;right:-8px;bottom:-8px;background:#f36;z-index:-1}.contact h2{font-size:2.5rem;font-weight:700;text-transform:uppercase;margin-bottom:20px}.contact p{font-size:1.1rem;margin-bottom:30px;color:#ccc}.contact-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.contact-link{padding:15px 30px;border:3px solid #fff;background:#000;color:#fff;text-decoration:none;font-weight:600;text-transform:uppercase;transition:all .2s ease}.contact-link:hover{background:#fff;color:#000;transform:translate(-3px,-3px);box-shadow:6px 6px #0f8}@media (max-width: 768px){.container{padding:20px 15px}.hero{padding:40px 20px}.hero h1{font-size:2rem}.hero .role{padding:.5rem 1rem}.section-title{font-size:2rem;padding:15px 20px}.section{margin-bottom:2rem}.projects-grid,.tech-grid{grid-template-columns:1fr}.contact-links{flex-direction:column;align-items:center}.project-links{flex-direction:column}.tech-category,.project,.experience-item,.contact{padding:1rem}}.tech-category:nth-child(1){animation-delay:.1s}.tech-category:nth-child(2){animation-delay:.2s}.tech-category:nth-child(3){animation-delay:.3s}.project:nth-child(1){animation-delay:.1s}.project:nth-child(2){animation-delay:.2s}.project:nth-child(3){animation-delay:.3s}@keyframes pulse-shadow{0%,to{box-shadow:0 0 #f366}50%{box-shadow:0 0 20px #f369}}.section-title{animation:pulse-shadow 3s ease-in-out infinite}.tech-item{position:relative;overflow:hidden}.tech-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,51,102,.3),transparent);transition:left .6s ease}.tech-item:hover:before{left:100%}.accent-dot{position:absolute;width:20px;height:20px;background:#f36;border:2px solid #000;animation:rotate 10s linear infinite}.accent-dot.dot-1{top:20px;right:20px;animation-delay:0s}.accent-dot.dot-2{bottom:20px;left:20px;background:#0f8;animation-delay:2s}.accent-dot.dot-3{top:50%;right:10px;background:#ff0;animation-delay:4s}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.parallax-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-10;opacity:.1}.parallax-shape{position:absolute;border:2px solid #000;background:#f36;animation:float-shapes 8s ease-in-out infinite}.shape-1{width:50px;height:50px;top:10%;left:10%;animation-delay:0s}.shape-2{width:30px;height:80px;top:60%;right:15%;background:#0f8;animation-delay:2s}.shape-3{width:70px;height:30px;bottom:20%;left:70%;background:#ff0;animation-delay:4s}@keyframes float-shapes{0%,to{transform:translateY(0) rotate(0);opacity:.1}25%{transform:translateY(-20px) rotate(90deg);opacity:.3}75%{transform:translateY(20px) rotate(-90deg);opacity:.1}}.project-header{position:relative;overflow:hidden}.project-header:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s ease}.project:hover .project-header:before{left:100%}.contact{position:relative;overflow:hidden}.scroll-reveal{opacity:0;transform:translateY(30px);transition:all .6s ease}.scroll-reveal.revealed{opacity:1;transform:translateY(0)}