*{margin:0;padding:0}body{height:100vh;color:#fff;font-family:outfit;background-repeat:no-repeat;background-position:center;background-size:cover;background-attachment:fixed;background-color:#000}.navbar{display:flex;align-items:center;justify-content:space-between;margin:20px 170px}.navbar img{flex-shrink:0}.nav-menu{display:flex;align-items:center;list-style:none;gap:40px;font-size:20px;margin:0 auto;flex:1;justify-content:center}.nav-connect{padding:20px 40px;border-radius:50px;background:linear-gradient(267deg,#700e8b,#940b6f);font-size:22px;cursor:pointer;transition:.5s;flex-shrink:0;margin-left:20px}.nav-connect:hover{transform:scale(1.05)}.nav-connect a{color:#fff;text-decoration:none;font-weight:700}.link{color:#fff;text-decoration:none;font-size:18px}.link:hover{color:#7f6888}.hero{display:flex;align-items:center;flex-direction:column;gap:35px}.hero img{margin-top:20px}.hero h1{text-align:center;width:70%;font-size:90px;font-weight:600}.hero h1 span{background:linear-gradient(267deg,#0e2d8b,#940b6f);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}.hero-name span{opacity:0;transform:translateY(20px);display:inline-block;animation:appear 2.5s forwards}@keyframes appear{to{opacity:1;transform:translateY(0)}}.hero p{width:50%;text-align:center;font-size:30px;line-height:40px}.hero-action{display:flex;align-items:center;gap:25px;font-size:24px;font-weight:50px;margin-bottom:50px}.hero-connect{padding:25px;border-radius:50px;background:linear-gradient(267deg,#700e8b,#940b6f);cursor:pointer}.hero-resume{padding:25px;border-radius:50px;border:2px solid white;background:linear-gradient(267deg,#700e8b,#940b6f);cursor:pointer}.hero-connect:hover{border:4px solid white}.hero-resume:hover{border:4px solid blueviolet}.moving-image{width:300px;animation:moveUpDown 3s infinite alternate,glowColorChange 4s infinite alternate;border-radius:100%}@keyframes moveUpDown{0%{transform:translateY(0)}to{transform:translateY(40px)}}img:hover{box-shadow:0 0 20px 10px #530260cc}@keyframes glowColorChange{0%{box-shadow:0 0 20px 10px #690487cc}50%{box-shadow:0 0 20px 10px #fffc}to{box-shadow:0 0 20px 10px #d009d772}}a{color:#fff;text-decoration:none}a:hover{color:#9e70c9}.container{display:flex;align-items:center;flex-direction:column;gap:50px;padding:40px;border-radius:10px;margin:20px auto;width:80%;box-shadow:0 4px 8px #0000001a}.container h1{text-align:center;font-size:50px;color:#fff;text-transform:uppercase;letter-spacing:2px}.subcontainer{background:linear-gradient(267deg,#700e8b33,#ab09baa4);box-shadow:0 4px 20px #726e75db;padding:50px;display:flex;align-items:center;flex-direction:row;width:50%;gap:40px;box-shadow:0 4px 8px #0000001a;border-radius:10px;transition:background .3s,transform .2s,opacity .5s,transform .5s;opacity:0;transform:translateY(50px)}.subcontainer.visible{opacity:1;transform:translateY(0)}.subcontainer:hover{background:linear-gradient(267deg,#560a6b,#6c0851);transform:scale(1.07)}.subcontainer img{padding:5px;width:100px;height:100px;object-fit:cover;border-radius:50%;box-shadow:0 4px 8px #0000001a}.subcontainer div{flex-grow:1}.subcontainer h2{font-size:24px;color:#966ca2;margin-bottom:5px}.subcontainer h3{font-size:18px;color:#7b6e7e;margin-bottom:10px;font-style:italic}.subcontainer p{font-size:16px;color:#767676;margin:0}@keyframes pop-up{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.subcontainer.visible{animation:pop-up 4.5s ease-in-out}.tech-section{display:flex;flex-direction:column;align-items:center;gap:50px;padding:40px;border-radius:10px;margin:20px auto;width:80%;box-shadow:0 4px 8px #0000001a}.tech-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}.tech-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;background-color:#350b34;border-radius:80px;box-shadow:0 4px 8px #0000001a}.tech-item:hover{background:linear-gradient(267deg,#560a6b,#6c0851);transform:scale(1.02)}.icon{font-size:3rem;margin-bottom:10px;color:#70148b}.tech-item span{font-size:1.5rem;color:#966ca2;text-align:center}.tech-section h2{text-align:center;font-size:50px;color:#fff;text-transform:uppercase;letter-spacing:2px}.project-section{display:flex;flex-direction:column;align-items:center;gap:50px;padding:40px;border-radius:20px;margin:20px auto;width:80%;box-shadow:0 4px 20px #531281db}.project-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;margin-top:20px}.project-item{background:linear-gradient(267deg,#700e8b33,#a809a0a4);padding:20px;border-radius:12px;box-shadow:0 6px 12px #00000026;text-align:center}.project-item h3{font-size:26px;color:#e4acf5;margin-bottom:10px;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.project-item p{font-size:18px;color:#fff;line-height:1.5}.project-links{display:flex;justify-content:center;gap:20px;margin-top:20px}.project-links a{color:#f8c3ff;font-size:1.8rem;transition:color .3s ease-in-out}.project-links a:hover{color:#ff70ff}.project-links .icon{font-size:2.2rem;margin-right:10px;color:#cec8d0}.project-section h2{text-align:center;font-size:52px;color:#fff;text-transform:uppercase;letter-spacing:2px;text-shadow:3px 3px 6px rgba(0,0,0,.3)}.project-image{width:100%;height:200px;object-fit:cover;border-radius:8px;margin-bottom:15px;box-shadow:0 4px 10px #0003}.certificate-section{display:flex;flex-direction:column;align-items:center;gap:40px;padding:40px;border-radius:20px;margin:20px auto;width:80%;box-shadow:0 4px 20px #531281db;background-color:#1c1b2f}.certificate-section h1{font-size:36px;color:#fff;text-shadow:2px 2px 5px rgba(255,112,255,.3)}.certificate-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;width:100%}.certificate-item{background:linear-gradient(267deg,#700e8b33,#a809a0a4);padding:20px;border-radius:12px;box-shadow:0 6px 12px #00000026;text-align:center;transition:transform .3s ease}.certificate-item:hover{transform:translateY(-5px)}.certificate-item h3{font-size:22px;color:#e4acf5;margin:10px 0}.certificate-item p{font-size:16px;color:#fff;margin-bottom:10px}.certificate-item a{display:inline-block;margin-top:10px;padding:8px 12px;background-color:#ff70ff;color:#fff;border-radius:6px;text-decoration:none;font-weight:700;transition:background .3s ease-in-out}.certificate-item a:hover{background-color:#f8c3ff;color:#000}.certificate-image{width:100%;height:180px;object-fit:cover;border-radius:8px;margin-bottom:10px;box-shadow:0 3px 8px #0000004d}.certificate-section{margin-top:80px}.contact-wrapper{position:relative}.ballpit-bg{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:0}.contact-section{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:40px;padding:60px 20px;border-radius:16px;margin:40px auto;width:85%;max-width:1000px;background:#2c003e4d;box-shadow:0 8px 24px #a004bb4d;transition:all .3s ease}.contact-section h2{font-size:48px;color:#fff;text-transform:uppercase;letter-spacing:3px;margin-bottom:10px}.contact-form{width:100%;max-width:600px;display:flex;flex-direction:column}.contact-form label{font-size:16px;color:#ffbdf1;margin-bottom:5px;font-weight:500}.contact-form input,.contact-form textarea{width:100%;padding:14px;font-size:16px;border:none;border-radius:8px;background-color:#1e1e2fcc;color:#f1f1f1;margin-bottom:20px;box-shadow:inset 0 2px 5px #0003;transition:box-shadow .3s ease,transform .2s ease}.contact-form input:focus,.contact-form textarea:focus{outline:none;box-shadow:0 0 0 2px #b0f;transform:scale(1.01)}.contact-form textarea{resize:vertical;min-height:120px}.contact-form button{padding:14px;background:linear-gradient(267deg,#a200c7,#f03f88);color:#fff;font-weight:600;font-size:18px;border:none;border-radius:8px;cursor:pointer;box-shadow:0 4px 15px #a200c799;transition:background .3s ease,transform .2s ease,box-shadow .3s ease}.contact-form button:hover{background:linear-gradient(267deg,#f03f88,#a200c7);box-shadow:0 6px 20px #f03f88cc;transform:scale(1.05)}.contact-form button:focus{outline:none;box-shadow:0 0 0 3px #b0f}@media (max-width: 768px){.contact-section{width:95%;padding:40px 15px}.contact-section h2{font-size:36px}.contact-form{max-width:100%}.contact-form button{font-size:16px;padding:12px}}