@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap";:root{--bg-color-0: #f5f5f5;--bg-color-1: white;--color-primary: #333;--color-2: #5b21b6;--ft-family-primary: "Poppins", sans-serif;--border-color: #ccc;--color-purple-500: #3b0764}html{font-size:62.5%;scroll-behavior:smooth}*{padding:0;margin:0;box-sizing:border-box;font-family:var(--ft-family-primary);background-color:var(--bg-color-0);color:var(--color-primary);line-height:1.2}.grid{display:grid;padding:0 1rem}.grid--col-2{grid-template-columns:repeat(2,1fr);gap:9.6rem}.grid--col-3{grid-template-columns:repeat(3,1fr);gap:6.4rem}.paragraph{font-size:1.8rem;margin-bottom:2rem;line-height:1.5}.paragraph.margin-bottom-3rem{margin-bottom:3.2rem}.heading-primary{font-size:4.4rem;margin-bottom:2rem;color:var(--color-2)}.heading-secondary{font-size:3.2rem;margin-bottom:2rem}.heading-tertiary{font-size:2.4rem;margin-bottom:2rem}.grid-align-center{align-items:center}.bold-font{font-weight:600}.heading-container{text-align:center}.header{background-color:var(--bg-color-1);box-shadow:0 0 10px #000000bf;position:sticky;top:0}.container{max-width:130rem;margin:0 auto}.nav-bar{padding:2rem 1rem;box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;background-color:var(--bg-color-1)}.logo{font-size:3rem;font-weight:600;text-transform:uppercase;background-color:inherit;cursor:pointer;color:var(--color-2)}.nav-list{display:flex;gap:3rem;list-style:none;background-color:inherit;font-size:2rem}.nav-list-item{background-color:inherit;font-weight:500}a{text-decoration:none;background-color:inherit;transition:.3s}a:hover{color:var(--color-2)}.toggle{display:none;background-color:inherit}.menu-icon{font-size:4.4rem;background-color:inherit;cursor:pointer;transition:.3s}.menu-icon:hover{fill:var(--color-2)}.mobile-nav-list{position:absolute;height:100vh;width:100%;padding:1rem 0 0 1rem;background-color:var(--bg-color-1);top:95%;left:0;opacity:0;pointer-events:none;visibility:hidden;transition:all .6s}.mobile-nav{background-color:inherit;font-size:2.4rem;display:flex;flex-direction:column;gap:3rem;margin-top:6.4rem;text-transform:uppercase}.show-nav .mobile-nav-list{opacity:1;pointer-events:auto;visibility:visible}.hero-section{padding:9.6rem 0 12.8rem}.social-container{display:flex;align-items:center;gap:2.4rem}.social-icon{font-size:3rem;cursor:pointer;transition:.3s}.social-icon:hover{fill:var(--color-2);transform:scale(1.3)}.hero-img{width:80%;display:block;margin:0 auto;border-radius:33% 67% 53% 47%/44% 33% 67% 56%;animation:animate 1.5s ease-in-out infinite alternate}@keyframes animate{0%{border-radius:33% 67% 53% 47%/44% 33% 67% 56%}50%{border-radius:59% 41% 45% 55%/41% 26% 74% 59%}to{border-radius:51% 49% 48% 52%/41% 51% 49% 59%}}.about-section{padding:9.6rem 0}.skills-container{display:flex;align-items:center;gap:3rem}.skill-img{width:4rem}.skill-img.js-img{width:4.8rem}.skill-img.tailwing-img,.skill-img.node-img{width:5.4rem}.about-me-img{width:100%;border-radius:2rem}.project-section{padding:14.4rem 0}.list-item{list-style:none;box-shadow:0 0 10px #000000bf;padding:1rem;border-radius:1rem}.item-img-container{margin-bottom:3rem}.item-img{width:100%;border-radius:1rem}.project-url{color:var(--color-2);transition:.3s}.project-url:hover{color:var(--color-primary)}.contacts-section{padding:14.4rem 0}.contact-form-container{max-width:60rem;margin:0 auto}.input{width:100%;padding:1.2rem 2rem;margin:2rem 0;display:inline-block;border:1px solid var(--border-color);border-radius:.5rem;outline:none}.text-area{width:100%;height:10rem;padding:1.2rem 2rem;margin:2rem 0;display:inline-block;border:1px solid var(--border-color);border-radius:.5rem;outline:none}.btn{width:100%;padding:1.2rem 0;border-radius:.5rem;font-size:1.8rem;border:none;background-color:var(--color-2);color:var(--bg-color-0);cursor:pointer;transition:.3s}.btn:hover{background-color:var(--color-purple-500)}@media (max-width: 68em){.hero-img{width:90%}.heading-tertiary{font-size:2rem}}@media (max-width: 58em){.grid--col-2{grid-template-columns:1fr}.grid--col-3{grid-template-columns:repeat(2,1fr)}.hero-img-container{grid-row:1}.contact-form-container,.heading-container{padding:0 1rem}}@media (max-width: 39em){.grid--col-3{grid-template-columns:1fr}.nav-list{display:none}.toggle{display:block}.skills-container{flex-wrap:wrap;justify-content:center}}