@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap";*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;list-style:none;border:none;outline:none}:root{--nav-bg-color: rgba(255,255,255,.1);--bg-color: #212433;--second-bg-color: #1f2733;--third-bg-color: #2d3542;--main-color: #2adfb5;--white-color: #fff;--tab-list-color: #7c8594;font-family:Poppins,sans-serif}::selection{background:var(--main-color);color:var(--bg-color)}::-webkit-scrollbar{width:.5rem}::-webkit-scrollbar-thumb{background:var(--main-color);border-radius:1rem}::placeholder{color:var(--white-color)}html{font-size:62.5%}body{color:var(--white-color);overflow:hidden}p{font-size:1.6rem}.nav{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);width:40rem;padding:2rem 0;background:var(--nav-bg-color);border-radius:5rem;z-index:100;animation:animate-nav 1s ease-in-out backwards;animation-delay:4s}@keyframes animate-nav{0%{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}.nav .nav-list{display:flex;justify-content:space-evenly}.nav-list li{position:relative;display:flex;font-size:3rem;cursor:pointer}.nav-list li:hover,.nav-list li.active{color:var(--main-color)}.tooltip{position:absolute;top:-4rem;left:50%;transform:translate(-50%);padding:.2rem 1rem;background:var(--main-color);border-radius:.4rem;font-size:1.6rem;color:var(--bg-color);font-weight:500;white-space:nowrap;visibility:hidden;opacity:0;transition:.3s}.nav-list li:hover .tooltip,a:hover .tooltip,.portfolio-item:hover .work-info{visibility:visible;opacity:1}.container{width:100vw;height:100vh;perspective:1500px;perspective-origin:50%}.box{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform-origin:50% 50% -50vw;transform:rotateY(0);transition:2s;animation:animate-cube 4s ease-in-out backwards}@keyframes animate-cube{0%{transform:scale(0) rotateY(-360deg)}to{transform:scale(1) rotateY(0)}}.section{position:absolute;width:100%;height:100%;background:var(--bg-color);padding:0 10%;backface-visibility:hidden}.section:nth-child(2n){background:var(--second-bg-color)}.section.about{transform:translate(50vw) translateZ(-50vw) rotateY(90deg)}.section.resume{transform:translateZ(-100vw) rotateY(-180deg);transform-origin:50%}.section.portfolio{transform:translate(-50vw) translateZ(-50vw) rotateY(-90deg)}.section.contact{visibility:hidden;transition-delay:.5s}.section.contact.active{visibility:visible}.section.contact.action-contact{transition-delay:1.5s}.section.contact.action-contact.active{transition-delay:0s}.home,.about{display:flex;align-items:center;gap:5rem}.home-info h1{font-size:5.5rem;color:var(--main-color);line-height:1}.home-info h3{font-size:3rem}.desc{margin:1rem 0 2rem}.home-info .btn-sci{display:flex;align-items:center}.btn{display:inline-flex;padding:1.2rem 3rem;background:var(--main-color);border-radius:5rem;box-shadow:0 0 1rem var(--main-color);font-size:1.6rem;color:var(--bg-color);font-weight:600}.btn:hover{box-shadow:none}.home-info .btn-sci .sci{margin-left:2rem}.home-info .btn-sci .sci a{position:relative;display:inline-flex;padding:.8rem;border:.2rem solid var(--main-color);border-radius:50%;font-size:2rem;color:var(--main-color);margin:0 .8rem;transition:.3s}.home-info .btn-sci .sci a:hover{background:var(--main-color);color:var(--bg-color)}.img-box{position:relative;width:40vw;height:75vh;background:linear-gradient(var(--bg-color),var(--main-color));border-radius:50%;border:.5rem solid var(--main-color);box-shadow:0 0 2rem var(--main-color);display:flex;justify-content:center;overflow:hidden;transition:1s}.img-box.home-img:hover{box-shadow:0 0 8rem var(--main-color)}.img-box img{position:absolute;align-items:center;display:block;width:100%;object-fit:cover}.img-box.about-img{background:transparent;box-shadow:0 0 2rem var(--main-color),inset 0 0 1rem var(--main-color)}.img-box.about-img img{z-index:-1}.title{font-size:4rem;text-align:center}.about-info .title{text-align:left}.about-info h3{font-size:2.5rem;color:var(--main-color);margin-top:-1rem}.about-info .btn{padding:1.2rem 4rem}.resume,.portfolio{padding-top:2rem;padding-bottom:28rem}.tab-box{display:flex;width:100%;height:5rem;margin-top:1rem;margin-bottom:2rem}.tab-list{display:flex;align-items:center;width:100%;cursor:pointer;border-bottom:.3rem solid var(--tab-list-color);color:var(--tab-list-color);transition:.5s}.tab-list.resume-list.active,.tab-list.portfolio-list.active{border-color:var(--main-color);color:var(--main-color)}.resume-list:nth-child(2){justify-content:center}.resume-list:nth-child(3){justify-content:flex-end}.tab-list h3{font-size:2.5rem}.tab-wrapper{position:relative;width:100%;height:100%}.tab-grid{position:absolute;width:100%;height:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(30rem,1fr));gap:2rem;overflow-y:auto;overflow-x:hidden;visibility:hidden;opacity:0;transform:scale(.8)}.tab-grid.resume-box.active,.tab-grid.portfolio-box.active{visibility:visible;opacity:1;transition:.5s;transform:scale(1)}.tab-item{display:flex;flex-direction:column;justify-content:center;background:var(--third-bg-color);border-radius:.8rem;padding:2rem}.tab-item h4{font-size:2.3rem}.resume-item h4:nth-child(1),.resume-item h4:nth-child(3){font-size:1.7rem;color:var(--main-color);font-weight:400}.resume-item h4:nth-child(3){position:relative;color:var(--white-color);margin-left:2rem}.resume-item h4:nth-child(3):before{content:"";position:absolute;left:-2rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;background:var(--main-color);border-radius:50%}.tab-item p{margin-top:1rem}.resume-box.skills{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}.resume-box.skills .resume-item{align-items:center}.resume-box.skills .resume-item i{font-size:8rem;transition:.3s}.resume-box.skills .resume-item:hover i{color:var(--main-color)}.resume-box.skills .resume-item p{margin-top:0}.portfolio-list:nth-child(2){justify-content:flex-end}.portfolio-box.work .portfolio-item{position:relative}.portfolio-box.work .portfolio-item:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:var(--third-bg-color);border-radius:.8rem;z-index:1;opacity:0;transition:.3s}.portfolio-box.work .portfolio-item:hover:before{opacity:.9}.portfolio-item .work-img{position:absolute;left:0;top:0;width:100%;height:100%;border-radius:.8rem;overflow:hidden}.portfolio-item .work-img img{display:block;width:100%;height:100%;object-fit:cover;transition:.3s}.portfolio-item:hover .work-img img{transform:scale(1.2)}.portfolio-item .work-info{z-index:1;visibility:hidden;opacity:0;transition:.3s}.portfolio-item .work-info h4{line-height:1}.portfolio-item .work-info .tech-used{color:var(--main-color);border-bottom:.1rem solid var(--white-color);padding-bottom:1rem;margin-bottom:1rem}.portfolio-item .portfolio-icon a{position:relative;display:inline-flex;padding:1rem;background:var(--white-color);border-radius:50%;font-size:2.5rem;color:var(--bg-color);transition:.3s}.portfolio-item .work-icon a:hover{background:var(--main-color)}.portfolio-item .work-icon a:nth-child(1){margin-right:1rem}.portfolio-item .work-icon a:nth-child(1) i{transform:rotate(135deg)}.portfolio-item .service-icon{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.portfolio-item .service-icon .icon{font-size:5rem;margin-left:-.3rem;transition:.3s}.portfolio-item:hover .service-icon .icon{color:var(--main-color)}.portfolio-item:hover .service-icon a{background:var(--main-color)}.portfolio-item .service-icon a i{transform:rotate(-135deg);transition:.3s}.portfolio-item .service-icon a:hover i{transform:rotate(-180deg)}.portfolio-box.service .portfolio-item h4{transition:.3s}.portfolio-box.service .portfolio-item:hover h4{color:var(--main-color)}.contact{padding-top:2rem;padding-bottom:18rem}.contact-wrapper{display:flex;justify-content:center;height:100%}.contact-form{display:flex;flex-direction:column;justify-content:center;align-items:center;width:70rem}.contact-form h3{font-size:3rem;color:var(--main-color);margin-bottom:1rem}.contact-form .field-box{display:flex;flex-wrap:wrap;gap:2rem}.contact-form .field-box input,.contact-form .field-box textarea{flex:1 1 30rem;padding:2rem;background:var(--third-bg-color);border-radius:.6rem;font-size:1.6rem;color:var(--white-color)}.contact-form .field-box textarea{height:20rem;resize:none}.contact-form .contact-btn{margin-top:2rem}.contact-form .contact-btn .btn{cursor:pointer}@media screen and (max-width: 1200px){html{font-size:55%}}@media screen and (max-width: 992px){.section{padding:0 4%}.resume,.portfolio{padding-top:1.5rem;padding-bottom:27rem}.contact{padding-top:1.5rem;padding-bottom:18rem}}@media screen and (max-width: 768px){html{font-size:50%}.nav{bottom:0}.home,.about{flex-direction:column-reverse;justify-content:center;gap:2rem;padding-bottom:6rem}.about-info{width:35rem}.img-box{width:35rem;height:35rem}.resume,.portfolio{padding-bottom:25rem}.contact{padding-bottom:16rem}}@media screen and (max-width: 600px){.resume,.portfolio{padding-top:1rem;padding-bottom:22rem}.tab-box{margin-top:0}.contact{padding-top:1rem}}@media screen and (max-width: 400px){.nav{width:100%;border-radius:0}.home-info,.about-info{text-align:center}.home-info h1{font-size:5rem}.home-info .btn-sci{flex-direction:column-reverse}.home-info .btn-sci .sci{margin-left:0;margin-bottom:2rem}.img-box{width:30rem;height:30rem}.about-info .title{text-align:center}}@media screen and (max-width: 350px){.img-box{width:25rem;height:25rem}.tab-list h3{font-size:2.3rem}}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#0009;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);justify-content:center;align-items:center}.modal-content{background-color:var(--white-color);padding:2rem;border-radius:10px;max-width:600px;color:var(--second-bg-color);box-shadow:0 4px 8px var(--bg-color)}.close-btn{float:right;font-size:24px;cursor:pointer;color:#051037}.project-details{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:1000;justify-content:center;align-items:center;font-size:2rem}.project-details .modal-content{background:var(--third-bg-color);border-radius:8px;max-width:100%;margin:20px;padding:20px;text-align:left;box-shadow:0 4px 8px var(--main-color)}.project-details .close-btn{font-size:3rem;color:var(--main-color);cursor:pointer;position:absolute;top:10px;right:20px}.project-details .title{font-size:3rem;margin-bottom:20px;color:var(--tab-list-color)}.project-details .btn{padding:10px 20px;background-color:var(--main-color);color:var(--bg-color);border:none;border-radius:5rem;cursor:pointer;text-align:center;display:inline-block;margin-top:20px}.project-details .btn:hover{box-shadow:none}.project-details .modal-content p,.project-details .modal-content .concepts-list{color:var(--white-color);font-size:1.6rem}.project-details .modal-content img{width:30%;height:auto;margin:0 auto 20px;display:block}.project-details .modal-content strong{color:var(--main-color)}@media (max-width: 768px){.project-details .modal-content{width:90%}}.preview-section{margin-bottom:2rem;text-align:center}.project-details .modal-content .preview-section .desktop{width:90%;max-width:800px;height:auto;border:1px solid #ccc;border-radius:8px}.preview-section h3{margin-top:.5rem;font-size:1.5rem;color:var(--main-color)}.custom-paragraph ul{list-style-type:disc;padding-left:2rem;color:#fff;margin-top:.5rem;margin-bottom:1.5rem;font-size:1.6rem}.custom-paragraph li{margin-bottom:.5rem}.couple-img{display:flex;gap:5px;justify-content:center;align-items:center;flex-wrap:wrap}.couple-img img{width:45%;height:auto;border-radius:10px;box-shadow:0 0 10px #0003}@media only screen and (max-width: 768px){.about .img-wrapper{display:none}.section.about{height:auto;min-height:100vh;padding-top:1rem;padding-bottom:1rem;margin:0!important;display:block;text-align:center}.about-info{margin:0 auto;padding:0 1.5rem}}
