@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.header{position:fixed;top:0;width:100%;background-color:#000203;display:flex;justify-content:center;align-items:center;padding:15px 80px;box-shadow:0 4px 6px #0000001a;z-index:1000;gap:45%}.logo{font-size:1.5rem;font-weight:700;color:#64ffda;border:2px solid #64ffda;padding:8px 15px;border-radius:50%;flex-grow:0}.nav{flex-grow:0}.nav ul{list-style:none;display:flex;gap:25px;margin-left:-25%}.nav ul li a{text-decoration:none;color:#ccd6f6;font-size:.9rem;font-weight:500;transition:color .3s ease}.nav ul li a:hover{color:#64ffda}@media (max-width: 768px){.header{display:none;overflow-x:hidden;width:100%}}.hero{color:#fff;min-height:100vh;display:flex;align-items:center;padding-left:80px;font-family:Poppins,sans-serif}.container{max-width:950px;position:relative;margin-left:12%;margin-top:5%}.hero-div{max-width:100%;animation:slideIn 1s ease-in-out;margin-left:10%}.intro{color:#64ffda;font-size:1.2rem}.my-name{font-size:3.5rem;font-weight:700;margin-top:10px;color:#fff}.subtitle{font-size:2.5rem;color:#8892b0;font-weight:600}.description{color:#ccd6f6;font-size:1rem;line-height:1.5;max-width:500px}.highlight{color:#0ff}.socials-links{position:absolute;left:-50px;top:39%;display:flex;flex-direction:column;gap:20px}.socials-icon{font-size:1.2rem;color:#fff;transition:color .3s}.socials-icon:hover{color:#64ffda}.reach-me{position:relative;margin-top:30px;margin-left:10%;font-size:1.2rem;color:#64ffda;display:flex;align-items:center;gap:10px;font-weight:700;cursor:pointer;transition:color .3s ease-in-out}.broken-box{width:200px;height:70px;position:absolute;border:2px solid #64ffda;left:-10px;top:-10px;clip-path:polygon(0% 0%,80% 0%,80% 20%,20% 20%,20% 80%,80% 80%,80% 100%,0% 100%);transition:all .3s ease-in-out}.reach-me:hover{color:#fff}.reach-me:hover .broken-box{transform:scale(1.1);border-color:#fff;animation:glitch-hover .3s infinite alternate}.ready-to-work{text-decoration:none;color:#ececec}@keyframes glitch-hover{0%{transform:translate(2px,-2px)}to{transform:translate(-2px,2px)}}@media (max-width: 768px){.container{max-width:760px;width:auto;display:flex;flex-direction:column;margin:.5rem auto}.subtitle{font-size:2rem}.my-name{font-size:2.5rem}.hero{padding:1.5rem;padding-left:0}.socials-links{display:none;position:relative;left:0;top:0;flex-direction:row;justify-content:space-around;gap:20px}.broken-box{height:90px}}.about-me{padding:80px 10%;text-align:center;margin:auto}.section-title{font-size:32px;font-weight:700;color:#fff;letter-spacing:2px;margin-bottom:30px}.about-container{display:flex;align-items:center;justify-content:center;gap:50px}.image-container{position:relative;max-width:300px;border-radius:8px}.image-container img{width:100%;height:auto;border-radius:8px}.image-container:before{content:"";position:absolute;top:-10px;left:-10px;width:100%;height:100%;border:3px solid #00ffcc;border-radius:8px;z-index:-1}.text-container{max-width:auto;text-align:left;width:500px}.text-container p{margin-bottom:15px;font-size:18px;line-height:1.6;color:#ccd6f6}.highlight{color:#0fc}@media (max-width: 768px){.about-me{margin-top:-20px;padding:20px auto}.about-container{flex-direction:column;margin-top:2rem;gap:1rem}.text-container{width:auto}}.works-container{padding:80px 10%;text-align:center}.section-title{color:#fff;font-size:32px;font-weight:700;letter-spacing:2px;margin-bottom:4rem}.works-subtitle{color:#b3b6e2;font-weight:500}.works-grid{display:flex;flex-direction:column;gap:2rem;align-items:center;margin-top:2rem}.works{display:flex;width:90%;max-width:900px;gap:10%;padding:.5rem;justify-content:center;border:2px solid #00ffcc;border-radius:10px;transition:transform .3s ease}.works:hover{transform:translateY(-5)}.description-and-stack{margin-top:-10px}img{max-width:260px;height:200px;width:auto;border-radius:8px}.work-description{max-width:400px;text-align:center;color:#ccc}.work-description p{color:#ccd6f6}.links{display:flex;flex-direction:row;justify-content:center;gap:1rem;margin-top:10px}.links a{text-decoration:none;color:#dadada;border:1px solid #00ffcc;padding:.4rem;border-radius:8px}.stacks{display:flex;justify-content:center;gap:10px;color:#70bdad;padding:5px;font-size:19px;font-weight:600}.image-and-links{margin-top:10px}@media (max-width: 768px){.works{flex-direction:column;gap:1rem;align-items:center}.work-description{max-width:100%;text-align:left}.description-and-stack{max-width:90%}.work-title{text-align:center}img{max-width:200px;height:170px}}.skills-section{padding:4rem 2rem;text-align:center}.skills-title{font-size:2.2rem;color:#f0f8ff;font-weight:700;margin-bottom:.5rem}.skills-subtitle{color:#b3b6e2;margin-bottom:3rem}.skills-container{display:flex;flex-wrap:wrap;justify-content:center;gap:3rem}.skills-box{border:2px solid #00ffcc;border-radius:8px;padding:2rem 3rem;min-width:280px;max-width:400px;transition:.3s ease}.skills-box h3{font-size:1.2rem;font-weight:500;color:#ccc;margin-bottom:1.5rem;margin-top:-.8rem}.skills-list{display:grid;grid-template-columns:1fr 1fr;list-style:none;padding:0;margin:0;text-align:left;gap:2rem}.skills-list p{color:#ccd6f6}.badge{display:flex;flex-direction:column;align-items:center;gap:.1rem;font-size:1.1rem;font-weight:700}.badge img{height:30px;width:30px}.basic-skills-list{display:grid;grid-template-columns:1fr 1fr;list-style:none;padding:0;margin:0;text-align:left;gap:4rem}.basic-skills{display:flex;flex-direction:column;align-items:center;gap:.5rem;font-size:1.1rem;font-weight:700;color:#ccd6f6}@media (max-width: 768px){.skills-section{padding:2rem 1rem;text-align:center}.skills-container{display:flex;flex-wrap:wrap;justify-content:center;gap:3rem;margin:auto;width:auto}.skills-box{border:2px solid #00ffcc;border-radius:8px;padding:2rem .5rem;width:auto;transition:.3s ease}.basic-skills-list{gap:1rem}}.certifications-section{text-align:center;padding:4rem 0}.section-title{color:#fff;font-size:32px;font-weight:700;letter-spacing:2px;margin-bottom:10px}.certificate-subtitle{color:#b3b6e2;margin-bottom:30px}.certs-and-experience{display:flex;flex-direction:row;gap:4rem;justify-content:center}.certs-and-experience div{color:#ccd6f6;font-size:1.3rem}.edu-timeline{display:flex;justify-content:center;position:relative;max-width:600px;margin:3rem auto}.cert-line{position:relative;background-color:#00ffe0;width:2px;margin-top:2rem}.cert{flex:1;display:flex;flex-direction:column;gap:3rem}.edu{display:flex;gap:3rem}.cert-item{text-align:left;color:#fff}.cert-item p{color:#ccd6f6}.cert-dot{position:relative;background-color:#00ffe0;width:12px;height:12px;border-radius:50%;left:-.4rem;margin:1.5rem 0}.cert-dotLeft{position:relative;background-color:#00ffe0;width:12px;height:12px;border-radius:50%;right:-6.2rem;margin:1.5rem 0}@media (max-width: 768px){.certifications-section{text-align:center;padding:4rem 0;width:auto}}.contact-section{padding:4rem 2rem;text-align:center;color:wheat}.contacts-container{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;max-width:1000px;margin:auto}.contact-title{font-size:2rem;color:#f0f8ff;font-weight:700}.contact-subtitle{color:#ccd6f6}.socials{flex:1;display:flex;flex-direction:column;gap:2rem;margin-top:1rem}.social{border:2px solid #009b7c;color:#ffffffb9;border-radius:8px;width:15rem;padding:1rem;text-align:center;transition:all .3s ease}.social:hover{background-color:#0453ad;transform:scale(1.03)}.social i{font-size:1.5rem}.social h3{margin:.5rem 0;font-size:1.2rem}.social p{color:#faebd7;text-decoration:none;font-weight:400}.social a{color:#ccd6f6;text-decoration:none;font-weight:500}.social .contact-icon{color:#ccd6f6;font-weight:500}.write-me{flex:1}.form{flex:1;display:flex;flex-direction:column;gap:2rem;margin-top:1rem}.form input,textarea{background:transparent;border:2px solid #00ffcc;border-radius:5px;padding:1rem;color:#fff;outline:none;font-size:1rem}.form textarea{resize:none;height:120px}.form button{background:transparent;color:#fff;border:2px solid #00ffcc;padding:.8rem 1.5rem;border-radius:5px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.form button:hover{background-color:#0453ad;transform:scale(1.03);color:#0a0a23}@media (max-width: 768px){.contacts-container{flex-direction:column}.socials,.write-me{width:100%}.socials{display:flex;flex-direction:column;align-items:center}}.footer-container{text-align:center}.footer-container p{color:#8f8d97b9}@media (max-width: 768px){.footer-container{width:auto}}.loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;background:#020508}.my-logo{width:200px;height:200px;background:url(/assets/MyLogo-DXBzn6_t.png) no-repeat center;background-size:contain;animation:logo-spin infinite 2s linear}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.app-container{animation:slideIn 1s ease-in-out}@keyframes slideIn{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}body{background:linear-gradient(300deg,#1e5263,#000,#020508);background-size:180% 180%;animation:gradient-animation 18s ease infinite}@keyframes gradient-animation{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}html{scroll-behavior:smooth}
