:root{--foreground-rgb:0,0,0;--background-start-rgb:214,219,220;--background-end-rgb:255,255,255}@media (prefers-color-scheme:dark){:root{--foreground-rgb:255,255,255;--background-start-rgb:0,0,0;--background-end-rgb:0,0,0}}*{box-sizing:border-box}html{scrollbar-width:thin;scroll-behavior:smooth;text-shadow:px 1px 1px rgba(0,0,0,.5)}body{background-color:#ffff;font-family:Poppins,sans-serif;position:relative;margin:0;padding:0}a{text-decoration:none;color:black}header{background-color:#f8f9fa;position:relative;box-shadow:0 0 10px rgba(0,0,0,.09);position:fixed;left:0;top:0;height:auto;width:100%;z-index:200}nav{background-color:#fff;justify-content:space-between}.nav-links,nav{align-items:center;display:flex}.nav-links{list-style:none;margin:20px 35px 25px 0}.nav-links,.nav-links-li{justify-content:space-evenly}.nav-links-li{display:flex;width:400px}.cross-lang{display:flex;align-items:center}header nav ul li:hover{color:#0a84ff}header ul li{cursor:pointer;font-weight:600}header ul li,header ul li a{text-decoration:none}nav h3{margin:20px 0 25px 35px;cursor:pointer;font-size:1.4rem;font-weight:700}header button:hover,nav h3:hover{color:#0a84ff}header button{border:none;background-color:#fff;font-size:1.2rem;cursor:pointer}footer{display:flex;justify-content:space-around;align-items:center;background-color:#2d2e32;color:#fff;padding:3rem;width:100%;font-weight:700;overflow:hidden}footer ul{display:flex;gap:15px;list-style:none}footer ul :hover{transform:scale(1.1)}.layout{display:flex;flex-direction:column;align-items:center;min-height:100vh}.container{display:flex;justify-content:center;margin:0 auto;max-width:80rem;padding:0 2.5rem}.home{position:relative;background-color:#f9f9f9;min-height:100vh;width:100%}.home-content{gap:10rem;height:30rem;margin-top:15rem}.home-content,.home-main{position:relative;display:flex;flex-direction:column;align-items:flex-start}.home-main{justify-content:flex-start;max-width:35rem}.home-main h1{color:#2d2e32;font-size:4.5rem;line-height:1.2;margin:10px 0}.home-main p{color:#767676;font-family:Mulish,sans-serif;font-size:1.3rem;font-weight:500;line-height:1.6;margin:0}.home-main ul{display:flex;gap:1rem;list-style:none;margin:1rem 0;padding:0}.home-main ul li{display:flex;align-items:center;gap:8px}.home-main ul li img{background-color:#4B5563;border-radius:.375rem;transition:all .3s ease-in-out}.home-main ul li img:hover{background-color:#0a84ff;transform:scale(110%)}.logo-container{position:relative;display:inline-block;cursor:pointer;transition:transform .3s ease-in-out}.logo-container:hover{transform:scale(110%)}.logo-text{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.logo-container:hover .logo-text{opacity:1;visibility:visible}.skills{display:flex;align-items:center;color:#767676;font-size:1.7rem}.skills p{border-right:2px solid rgba(45,46,50,.5);color:#2d2e32;font-size:1.3rem;font-family:Mulish,sans-serif;font-weight:600;margin-right:3rem;padding-right:2rem}.skills span{font-size:1.2rem}.logos{display:flex;flex-wrap:wrap;gap:2.5rem;list-style:none}.logos li{display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 0 10px rgba(0,0,0,.09);height:4.5rem;width:4.5rem;cursor:pointer}.about,.logos li{background-color:#fff}.about{padding:10rem 0;width:100%}.about-content{align-items:center;display:grid;grid-template-columns:1fr 1fr}.image-side{height:25rem;position:relative}.image-side img{height:25rem;width:31rem;border-radius:1.7rem}.text-side{padding-right:1rem}.text-side h4{color:#147efb;font-size:1.2rem;font-weight:700;margin:0;text-transform:uppercase}.text-side h3{color:#2d2e32;font-family:Poppins,sans-serif;font-size:1.8rem;line-height:1.4;margin:.8rem 0}.text-side p{color:#767676;font-family:Mulish,sans-serif;font-size:1.2rem;font-weight:500;line-height:1.5}.projects{background-color:#f9f9f9;padding:10rem 0;width:100%}.project-content{display:flex;flex-direction:column}.project-content h4{color:#147efb;font-size:1.2rem;font-weight:700;margin-bottom:1rem;text-transform:uppercase}.project-content h3{color:#2d2e32;font-family:Poppins,sans-serif;font-size:1.5rem;line-height:1.4;width:62rem;margin:.8rem 0 4rem}.projects-grid{display:grid;grid-gap:5rem;gap:5rem;grid-template-columns:1fr;grid-template-rows:auto auto;height:auto;width:100%}.project-card{display:flex;gap:2rem;height:27rem;width:62rem;padding:1rem;background-color:#fff;border-radius:1rem;box-shadow:0 0 10px rgba(0,0,0,.1)}.project-card.reverse-layout .project-preview{order:2}.project-card.reverse-layout .project-text{order:1}.project-preview{background-color:hsla(0,0%,46%,.5);border-radius:1rem;box-shadow:0 0 20px rgba(0,0,0,.5);height:25rem;width:60%;overflow:hidden}.project-text{display:flex;flex-direction:column;justify-content:center;text-align:center;text-transform:none;height:auto;width:40%;padding:1rem}.project-text h3{color:#2d2e32;font-size:1.2rem;margin:0;width:auto;position:relative;text-transform:uppercase}.project-text p{color:#767676;font-size:1.1rem;font-weight:500;text-align:center;text-transform:none;margin:1rem}.project-stack{display:flex;justify-content:center;gap:5px;margin:1rem}.project-stack p{background-color:#fff;box-shadow:0 0 10px rgba(0,0,0,.1);color:#000;font-family:Mulish,sans-serif;font-weight:600;padding:10px;margin:5px}.project-links{display:flex;gap:1rem;justify-content:center}.image-scroll img{transform:translateY(0);transition:transform 10s ease-in-out 0s;width:100%;height:100%}.image-scroll img:hover{transform:translateY(-73%);transition:transform 10s ease-in-out 0s}.project-link{display:flex;gap:5px;align-items:center;transition:color .3s ease-in-out}.project-link:hover{color:#0a84ff}.project-link svg{transition:all .3s ease-in-out;width:35px;height:35px}.github svg{fill:#2d2e32}.github:hover svg{fill:#0a84ff}.link svg{stroke:#2d2e32;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.link:hover svg{stroke:#0a84ff}.try-demo{margin-top:10px;color:#4B5563;cursor:pointer}.try-demo p{display:none}.try-demo:hover p{position:absolute;display:flex;border:1px solid rgba(0,0,0,.09);border-radius:10px;padding:5px;z-index:10}.contact{background-color:#fff;padding:8rem 0;width:100%}.contact-content{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%}.contact-content h4{color:#147efb;font-size:1.2rem;font-weight:700;margin:0;text-transform:uppercase}.contact-content h3{color:#2d2e32;font-size:2rem;margin:0}.contact-icons{flex-wrap:wrap;gap:6rem;margin-top:4rem}.contact-icons,.contact-icons-box{display:flex;align-items:center;justify-content:center}.contact-icons-box{gap:1.5rem}.contact-info h3{font-size:1.2rem}.contact-info a{cursor:pointer;text-decoration:none}.contact-info a,.contact-info p{color:#767676;font-size:1.2rem;margin:0}.contact-icons-box span{display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 0 10px rgba(0,0,0,.1);padding:1rem;height:4.5rem;width:4.5rem}.hamburger{display:none;padding:0}@media screen and (max-width:500px){.hamburger,.nav-links{display:flex}.nav-links{position:fixed;top:0;left:-100%;width:100%;height:100%;flex-direction:column;justify-content:space-between;align-items:center;background-color:rgba(0,0,0,.9);transition:left .3s ease;margin:0}.nav-links.visible{left:0}.nav-links li{margin-bottom:2rem;font-size:1.5rem;color:white;cursor:pointer}.nav-links-li{flex-basis:90%;flex-direction:column;justify-content:center;align-items:center;gap:2rem}.nav-links img{align-self:flex-end;margin:2rem}.cross-lang{justify-content:space-between;width:100%}.cross-lang button{border:none;background-color:transparent;font-size:1.5rem;color:#fff}header ul{width:200px;margin:15px 30px 20px 0}header button,header ul li{font-size:.9rem}nav h3{margin:10px 0 15px 25px;font-size:1rem}footer{padding:1rem}footer span{font-size:.8rem}.container{padding:0 2rem}.home{padding:5rem;height:100%}.home-main h1{font-size:2.5rem}.home-main p{margin-bottom:1rem}.home-content{gap:5px;margin-top:5rem;padding-bottom:5rem;align-items:center;justify-content:center}.skills p{border-right:none;border-bottom:2px solid rgba(45,46,50,.5);margin:0;padding:.5rem 0}.skills,.skills p{flex-direction:column}.skills{justify-content:center}.skills span{opacity:1;visibility:visible;font-size:1rem}.logos{display:grid;grid-template-columns:repeat(3,2fr);padding:1rem 0;margin:0;grid-gap:.5rem;gap:.5rem;height:-moz-fit-content;height:fit-content}.logo-container{position:relative;display:inline-block;cursor:pointer;transition:transform .3s ease-in-out}.logo-container img{height:30px;width:30px}.logos li{height:3.5rem;width:3.5rem;margin:1rem}.about{padding:4rem 0}.about-content{display:flex;flex-direction:column}.image-side{height:15rem;order:2}.image-side img{margin:1rem;height:13rem;width:18rem}.text-side h3{font-size:1.2rem}.text-side p{font-size:.9rem}.projects{padding:5rem 0 3rem}.projects-grid{width:100%}.project-content{width:25rem}.project-content h4{font-size:.9rem;width:80%;margin:.8rem 0}.project-content h3{font-size:1rem;margin-bottom:2rem;width:80%}.project-card{flex-direction:column;align-items:center;width:20rem;height:auto}.project-preview{order:2;height:15rem;width:15rem}.project-text{align-items:center;width:100%}.project-text p{font-size:.8rem;width:15rem}.project-stack{margin:1rem 0;width:15rem}.project-stack p{margin:1rem 0;padding:5px}.project-links{justify-content:space-evenly}.project-links a{font-size:.9rem}.project-link svg{width:25px;height:25px}.contact{padding:2rem 0 4rem}.contact-content h4{font-size:.9rem}.contact-content h3{font-size:1rem}.contact-icons{flex-direction:column;margin-top:2rem;align-items:flex-start;gap:2rem}.contact-icons-box{gap:1rem}.contact-icons-box img{width:25px;height:25px}.contact-icons-box span{height:3.5rem;width:3.5rem}.contact-info a,.contact-info p{font-size:.9rem}}