*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:Montserrat,system-ui,sans-serif;background:#111;color:#d9d9d9;font-size:20px}a{text-decoration:none;color:inherit}article{width:400px}label{padding:10px;border:2px solid #4e4f4f;border-radius:16px;display:flex;gap:10px;justify-content:flex-start;align-items:center}input,textarea,button{font-family:inherit;font-size:20px;border:none;background:transparent;color:#d9d9d9;line-height:1em;padding:0;display:block;width:100%;box-sizing:border-box}input:focus,textarea:focus,button:focus{outline:none;border:none}button{cursor:pointer;border:2px solid #89D7FF;padding:10px;border-radius:16px;color:#89d7ff}button:hover{background:#89d7ff21}.nav{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;font-weight:600;padding:1.5rem 4vw}.nav .logo{font-size:1.3rem;font-weight:600}.nav .logo.active{border:none}.nav a{margin-left:2rem}.nav a.active{border-bottom:2px solid #89D7FF}.card{background-color:transparent;border:2px solid #4e4f4f;border-radius:16px;padding:20px;flex-direction:column;gap:1rem}.card .title{font-weight:600;font-size:20px;display:flex;align-items:center;justify-content:space-between;line-height:100%}.card .desc{line-height:100%;font-size:12px;font-weight:400}.card .icons{font-size:15px;display:flex;justify-content:flex-start;align-items:center;gap:5px}.card .icons .icon{max-width:1em;max-height:1em}.home{display:flex;justify-content:center;align-items:center;height:calc(100vh - 90px);text-align:center}.home .hey-img{width:250px;margin-bottom:1rem}.about{max-width:680px;margin:3rem auto;line-height:1.7}.about .tech-grid{display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0}.about .icon{width:32px;height:32px}.about .hint{color:#5a5a5a;font-style:italic}.about .say-hi{display:inline-block;margin-top:2rem;color:#89d7ff}.projects .grid{gap:24px;display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:center}.projects-header{display:flex;justify-content:space-between;align-items:start}.projects-header h3{font-size:1.1rem}.projects .desc{font-size:.9rem;flex-grow:1}.projects-footer{display:flex;justify-content:space-between;align-items:center}.projects-footer .tech-wrap{display:flex;line-height:1em;gap:.4rem}.projects-footer .demo-btn{font-size:1.4rem}.contact{display:flex;justify-content:center;padding:3rem 0}.contact .contact-form{width:min(420px,90%);display:flex;flex-direction:column;gap:1rem}.contact .contact-form textarea{height:120px;resize:vertical}.contact .ok{color:#89ff8d}.contact .err{color:#ff8989}