:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.code-symbol:hover{transform:scale(1.2);transition:transform .3s ease-in-out;color:#0ff}.navbar-header{top:0;background-color:#000000b3;position:fixed;display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;width:100%;height:50px;transition:background-color .3s ease;box-shadow:0 4px 6px #0000001a;z-index:999}.navbar-brand{color:#fff;font-size:1.1rem}.navbar h1{margin-left:18rem;display:flex;gap:1rem;font-size:1.5rem}.navbar h1:hover{color:#00bcd4}.navbar li{list-style-type:none}.navbar-links{display:flex;list-style:none;gap:3rem;text-align:left}.navbar-links li{margin:0}.navbar-links a{text-decoration:none;color:#fff;font-size:1.2rem;transition:color .3s ease}.navbar-links li:hover{transform:scale(1.2);transition:transform .3s ease-in-out;color:#0ff;cursor:pointer}.navbar a{margin-inline-end:5rem}.navbar-links a:hover{color:#00bcd4}#dev{list-style:none;margin-left:10rem;position:absolute;margin-top:1rem}.main-content{font-size:22px;font-style:italic}.main-content:hover{color:#7fffd4}@media screen and (max-width: 768px){.navbar-header{height:4rem}.navbar{flex-direction:flex;height:auto;padding:.5rem;align-items:center;text-align:center}.navbar h1{margin:0;font-size:1.1rem}.navbar-links{align-items:center;text-align:center;flex-direction:column;gap:.5rem;margin-top:1rem;margin-right:6em}.navbar-links a{font-size:1rem}.navbar-links li:hover{transform:scale(1.1)}.navbar-brand{font-size:1rem}#dev{margin-left:.1rem;font-size:2.5rem}}@media screen and (max-width: 480px){.navbar{padding:.5rem}.navbar h1{font-size:1rem}.navbar-links{gap:.3rem;margin-right:5rem}.navbar-links a{font-size:.9rem}.navbar-links li:hover{transform:scale(1.05)}.navbar-brand{font-size:.9rem}}@media screen and (max-width: 768px) and (orientation: landscape){.navbar{flex-direction:row;justify-content:center;padding:.5rem 1rem}.navbar-links{flex-direction:row;gap:1rem;margin-right:1rem}.navbar-links a{font-size:1rem}}.navbar-links li:hover{transform:scale(1.05)}.navbar-brand{font-size:.9rem}.laser-cursor{position:fixed;width:10px;height:10px;background:radial-gradient(circle,#fff,#f003 70%);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);z-index:9999;box-shadow:0 0 20px #fefefecc,0 0 40px #ff000080;animation:laserPulse .8s infinite}@keyframes laserPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(1.5);opacity:.6}to{transform:translate(-50%,-50%) scale(1);opacity:1}}.laser-trail{position:fixed;width:10px;height:10px;background:#f003;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);z-index:9998;transition:all .2s ease-out}.home{text-align:left;padding:20px;animation:fadeIn 1s ease-in-out}.my-name{font-size:4rem;margin-bottom:1rem;text-align:left;animation:slideInFromLeft 1.1s ease-out;color:#ef8354}.description{font-size:1.4rem;color:#fff;border-radius:20px;text-align:left;width:45rem;animation:fadeIn 2s ease-in;word-spacing:3px}hr{width:20%;height:5px;margin:0 0 50px;background-color:#f0f8ff;border:10px;border-radius:5px;animation:expandWidth 1.5s ease-out}.image{align-items:center;text-align:left;position:relative;animation:fadeIn 2s ease-in}.image img{background-size:cover;background-position:center;background-repeat:no-repeat;height:50vh;animation:zoomIn 1.5s ease-in-out;border-radius:40px}.circle-image img{width:300px;height:300px;border-radius:50%;object-fit:cover;border:5px solid #333;position:absolute;position:fixed;top:100px;right:30px;box-shadow:0 4px 8px #0003;animation:float 3s ease-in-out infinite}.skills{margin-top:30px;display:flex;flex-wrap:wrap;gap:5rem}.title h2{margin:5rem 1rem 1rem;text-align:left;font-size:3rem;color:#ef8354}.title p{font-size:1rem;margin-left:3rem;margin:1rem}.tools{display:flex;gap:5rem}.tools p{font-size:1.3rem;font-weight:700}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInFromLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}@keyframes expandWidth{0%{width:0}to{width:20%}}@keyframes zoomIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.download-button{top:20px;left:10px;position:fixed;padding:10px 20px;font-size:16px;color:#fff;background-color:#575151;text-decoration:none;border-radius:5px;transition:background-color .3s ease}.download-button:hover{background-color:#000102}.logos{display:flex;flex-wrap:wrap;gap:10px}.logo-item{display:flex;flex-direction:column;width:120px}.logo-item img{width:70px;height:70px;margin-bottom:10px}.logo-item p{font-size:1rem;color:#555}.main-content{padding:10rem;text-align:center;margin-bottom:0}.topics{margin-top:50px;padding:20px;text-align:center;border-radius:10px;box-shadow:0 4px 6px #0000001a}.topics h3{font-size:1.8rem;margin-bottom:20px;color:#fff}.topics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.topic-item{background:#5555;border-radius:10px;padding:20px;text-align:center;box-shadow:0 2px 4px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.topic-item img{width:100%;max-height:200px;object-fit:cover;border-radius:10px;margin-bottom:10px}.topic-item h4{font-size:1.2rem;margin-bottom:10px;color:#007bff}.topic-item p{font-size:1rem;color:#fff}.topic-item:hover{transform:translateY(-5px);box-shadow:0 4px 8px #0003}@media screen and (max-width: 768px){.home{padding:5px 5px 100px;position:absolute;top:14rem;left:1px;text-align:center}.my-name{font-size:2rem}.description{font-size:1rem;width:90%;text-align:justify}hr{font-size:1rem;width:50%}#dev1{font-size:2rem;text-align:left}.image img{height:25vh;border-radius:20px}.circle-image img{width:100px;height:100px;top:8rem}.logos{justify-content:center;gap:5px}.logo-item{width:80px}.logo-item img{width:50px;height:50px}.topics-grid{grid-template-columns:1fr}.topic-item img{max-height:150px}.topic-item h4{font-size:1rem}.topic-item p{font-size:.9rem}}@media screen and (max-width: 932px) and (orientation: landscape){.image img{height:10vh;border-radius:20px}.circle-image img{width:100px;height:100px;top:8rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translatey(0)}}.fade-in{animation:fadeIn 1s ease-in-out}.portfolio{padding:5px;position:absolute;top:10rem;left:8px;text-align:center}#tech-canvas{position:fixed;top:0;left:0;width:100vw;height:180vh;background:#333;z-index:-1;mask-image:linear-gradient(to right,transparent,black);-webkit-mask-image:linear-gradient(to right,transparent,black)}.content{position:relative;z-index:1;color:#fff;text-align:center;margin-top:20vh;font-family:Arial,sans-serif}@media screen and (max-width: 768px){#tech-canvas{mask-image:linear-gradient(to bottom,transparent,black);-webkit-mask-image:linear-gradient(to left,transparent,black)}.content{margin-top:10vh;padding:10px;font-size:.9rem;position:fixed}}@media screen and (max-width: 480px) and (orientation: landscape){.content{margin-top:5vh;font-size:.8rem;line-height:1.4}#tech-canvas{position:fixed;top:0;left:0;width:100vh;height:180vh;background:#333;z-index:-1;mask-image:linear-gradient(to right,transparent,black);-webkit-mask-image:linear-gradient(to right,transparent,black)}}@media screen and (max-width: 896px) and (orientation: landscape){.content{margin-top:5vh;font-size:.8rem;line-height:1.4}#tech-canvas{position:fixed;top:0;left:0;width:100%;height:180vh;background:#333;z-index:-1;mask-image:linear-gradient(to right,transparent,black);-webkit-mask-image:linear-gradient(to right,transparent,black)}}@media screen and (max-width: 932px) and (orientation: landscape){.content{margin-top:5vh;font-size:.8rem;line-height:1.4}#tech-canvas{position:fixed;top:0;left:0;width:100%;height:180vh;background:#333;z-index:-1;mask-image:linear-gradient(to right,transparent,black);-webkit-mask-image:linear-gradient(to right,transparent,black)}}.projects{padding:20px 20px 100px;text-align:center;border-radius:30px}.projects h2{font-size:2rem;margin-bottom:20px;color:#fff}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:50px}.project-card{background:#333;border:1px solid #ddd;border-radius:10px;box-shadow:0 4px 6px #0000001a;padding:20px;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-5px);box-shadow:0 6px 12px #0003}.project-card h3{font-size:1.5rem;color:#fff}.project-card p{color:#fff;margin:10px 0}.project-links a{display:inline-block;margin:5px;padding:8px 12px;background:#c2b7b7;color:#fff;border-radius:5px;text-decoration:none;transition:background .3s ease}.project-links a:hover{background:#000}.form-content{font-family:Arial,sans-serif;background-color:#121212;color:#fff;margin:0;padding:0;display:flex;justify-content:center;align-items:center;min-height:100vh}form{background-color:#1f1f1f;padding:20px 30px;border-radius:10px;box-shadow:0 8px 16px #0003;width:100%;max-width:600px;box-sizing:border-box}h2,legend{font-size:1.5rem;margin-bottom:20px;color:#4caf50;text-align:center}.form-content p{text-align:justify;align-items:center;width:20em;margin-left:1em;margin-right:1em;color:#777}input,textarea,select{width:100%;padding:10px;margin:10px 0 20px;border:1px solid #333;border-radius:5px;background-color:#2c2c2c;color:#fff;font-size:1rem;box-sizing:border-box;outline:none;transition:all .3s ease}input:focus,textarea:focus,select:focus{border-color:#4caf50;box-shadow:0 0 8px #4caf5080}button{width:100%;background-color:#4caf50;color:#fff;padding:10px;border:none;border-radius:5px;font-size:1.2rem;cursor:pointer;transition:background-color .3s ease,transform .2s ease}button:hover{background-color:#3e8e41;transform:translateY(-2px)}button:active{transform:translateY(0)}fieldset{border:none;margin:20px 0;padding:0}fieldset legend{margin-bottom:10px;font-size:1.2rem;font-weight:700}p{font-size:.9rem;color:#aaa}@media (max-width: 768px){form{padding:15px}h2,legend{font-size:1.2rem}button{font-size:1rem}}.about{text-align:justify;display:flex;flex-direction:column;gap:10px;align-items:center;max-width:500px}.about h1{top:200px;left:100px;position:fixed}.about h4 p{text-align:left;padding:100px;margin-left:100px}.logo img{width:300px;height:300px;border-radius:50%;object-fit:cover;border:5px solid #333;position:absolute;position:fixed;top:100px;right:30px;box-shadow:0 4px 8px #0003;animation:float 3s ease-in-out infinite}@media screen and (max-width: 768px){.about{padding:5px 5px 80px;position:absolute;top:10rem;left:8px;text-align:center}.about-me{position:relative;text-align:justify}p{text-align:justify;width:90%;font-weight:700;font-size:1rem}.logo img{width:100px;height:100px;right:5px;top:9rem;border-radius:20px}}@media screen and (max-width: 932px) and (orientation: landscape){.logo img{width:100px;height:100px;right:20px;top:9rem;border-radius:20px}}.footer{align-items:center;text-align:center;color:#fff}.social-icons a{margin:0 10px;color:#fff;text-decoration:none;text-align:right}.social-icons a:hover{color:#0077b5}.social-icons span a:hover{color:#8c231e}footer{display:flex;justify-content:center;align-items:center;padding:1rem;color:#fff;bottom:0;left:0rem;width:100%;background-color:#000000b3;box-shadow:0 -5px 5px #0000004d;height:60px;z-index:999;position:fixed}footer p{flex:1;text-align:center;margin:0;align-items:center}.social-icons{display:flex;gap:2rem;position:absolute;right:11rem;bottom:50%;transform:translateY(50%)}.social-icons a{color:#fff;font-size:1.5rem;transition:transform .3s ease,color .3s ease}.social-icons a:hover{transform:scale(1.2);color:#00bcd4}@media screen and (max-width: 768px){footer{display:flex;justify-content:center;align-items:center;padding:1rem;color:#fff;bottom:0;left:0rem;width:100%;background-color:#000000b3;box-shadow:0 -5px 5px #0000004d;height:60px;z-index:999;position:fixed}footer p{flex:1rem;margin:0;margin-right:1.3rem}.social-icons{display:flex;gap:5rem;position:absolute;bottom:75%;transform:translateY(50%);left:3rem}.social-icons a{color:#fff;font-size:1.5rem;transition:transform .3s ease,color .3s ease}.social-icons a:hover{transform:scale(1.2);color:#00bcd4}}@media screen and (max-width: 768px) and (orientation: landscape){footer{display:flex;justify-content:center;align-items:center;padding:1rem;color:#fff;bottom:0;left:0rem;width:100%;background-color:#000000b3;box-shadow:0 -5px 5px #0000004d;height:60px;z-index:999;position:fixed}footer p{flex:1;text-align:center;margin:0;align-items:center}.social-icons{display:flex;gap:2rem;position:absolute;bottom:75%;transform:translateY(50%);margin-left:12rem}.social-icons a{color:#fff;font-size:1.5rem;transition:transform .3s ease,color .3s ease}.social-icons a:hover{transform:scale(1.2);color:#00bcd4}}
