:root{--main-color: #00b553;--second-color: #eeeeee;--grey-color: rgba(57, 62, 70, .75);--bg-color: #222831;--hero-fs: clamp(2rem, 4vw, 6rem);--section-fs: clamp(3rem, 3vw, 4.5rem);--small-fs: 18px;--section-padding: 5vw}body{font-family:Poppins,sans-serif;height:100%;max-width:100vw;background-color:var(--bg-color);position:relative;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.app{overflow-x:hidden}.nav-container{display:flex;position:fixed;height:130px;width:100vw;background-color:transparent;align-items:center;transition:top .6s;justify-content:flex-end;border-bottom:1px solid rgba(238,238,238,.1);z-index:100}.brand{display:flex;padding-left:96px;margin-right:auto;gap:.5vw}.mm-logo{width:60px;height:60px}.nav-brand{font-family:Oswald,sans-serif;color:var(--second-color);font-weight:700;font-size:1.5rem}.nav-links{display:flex;padding-right:96px}.nav-links a{cursor:pointer;border:1px solid rgb(203,115,0,0);border-radius:4px;padding:4px 9px;font-weight:400;font-size:18px;white-space:nowrap;color:var(--second-color);text-decoration:none;max-width:400px;margin-left:4rem;transition:border .15s,border-radius .15s,background-color 1.2s,transform .15s}.nav-links #resume{color:var(--main-color)}.nav-links a:hover{transform:scale(1.1);border:1px solid var(--main-color);border-radius:4px;background-color:#0067306f}.nav-links #resume:hover{background-color:transparent}@media screen and (max-width: 887px){.nav-container{justify-content:center;flex-direction:column;gap:.4rem}.brand{margin-right:0;padding-left:0}.nav-links{padding-right:0}.nav-links a{margin-left:0}}*{padding:0;margin:0;box-sizing:border-box}.hero{display:flex;flex-direction:row;position:relative;justify-content:center;align-items:center;margin-top:calc(0vh + 130px);width:100vw;padding-left:var(--section-padding);padding-right:var(--section-padding);height:calc(100vh - 130px);height:-o-calc(100vh - 130px);height:-webkit-calc(100vh - 130px);height:-moz-calc(100vh - 130px)}.hero-text{position:relative;max-height:100vh;margin-bottom:29vh;max-width:50vw;flex:2}.hero-titles{display:flex;flex-direction:column;gap:clamp(2rem,4vh,6vh)}.title1{color:var(--second-color);font-weight:700;font-size:var(--hero-fs);white-space:nowrap;text-align:justify}.title2{margin-top:-50px;color:var(--main-color);font-weight:700;font-size:var(--hero-fs);white-space:nowrap;text-align:justify;text-justify:inter-word}.hero-buttons{display:flex;gap:2rem;margin-top:3rem}.hero-btn{text-decoration:none;border:none;border-radius:24px;padding:10px 2.5rem;font-weight:700;font-size:18px;color:var(--second-color);cursor:pointer;text-shadow:0px 4px 4px rgba(0,0,0,.5);z-index:10}.hero-btn#project-btn{background:var(--main-color);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.hero-btn#lets-talk{background-color:var(--grey-color)}.hero-btn:active{box-shadow:inset 5px 5px 10px -3px #000000b3}#curly-arrow{opacity:.22;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin-left:-57%;height:80%}.hero-images{display:flex;flex-direction:column;max-width:450px;height:50%;position:relative;flex:1;align-items:center}#person-one{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%}#doodle-circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;margin-top:-20%;margin-left:16%;z-index:-5;opacity:.5}#shadow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;margin-top:43%;z-index:-5}@media screen and (max-width: 765px){.hero-buttons{flex-direction:column;width:200px}.hero-btn{text-align:center}}.tip{z-index:1000;text-align:left;position:fixed;display:flex;flex-direction:column;font-size:.8rem;bottom:1rem;left:1rem;width:280px;height:auto;opacity:.98;color:var(--second-color);border-radius:.5rem;padding:.6rem;gap:.6rem;background:linear-gradient(-45deg,#ee5252,#b43ce7,#23a6d5,var(--main-color));background-size:400% 400%;animation:gradient 15s ease infinite;transition:.2s}.tip:hover{transform:scale(1.02)}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.dismiss{position:absolute;cursor:pointer;width:1.5rem;height:1.5rem;font-weight:600;border-radius:1rem;border:1px solid var(--main-color);background-color:var(--grey-color);color:var(--second-color);font-size:.8rem;right:-9px;top:-9px;transition:.15s}.dismiss:hover{transform:scale(1.15);background-color:var(--second-color);color:var(--grey-color)}.vertical-line{border-left:1px solid rgba(238,238,238,.1);height:calc(100% + 130px);position:absolute;top:-130px;left:35%}.down-arrow{position:absolute;height:96px;width:96px}.left-nav{width:40px;position:fixed;bottom:0;left:1vw;right:auto;z-index:10;color:var(--main-color)}.right-nav{width:40px;position:fixed;bottom:0;right:1vw;left:auto;z-index:10;color:var(--main-color)}.left-nav:after,.right-nav:after{box-sizing:inherit;content:"";display:block;width:1px;height:90px;margin:0 auto;background-color:var(--main-color)}.socials,.my-info{list-style:none;color:var(--main-color);display:flex;flex-direction:column;align-items:center}.socials li a,.my-info li a{color:var(--main-color);font-size:.75rem}.my-info li a{writing-mode:vertical-rl;text-decoration:none;line-height:.75rem;font-family:PT Mono,Times New Roman,Times,serif;transition:.15s}.my-info li a:hover{color:#58ed9d}.socials li i{font-size:20px;padding:10px;transition:.15s}.socials li i:hover{transform:translateY(-.5rem);color:#58ed9d}.socials li:last-of-type{margin-bottom:20px}@media screen and (max-width: 750px){.tip{font-size:.65rem;width:229px}}.about-me{min-height:100vh;display:flex;position:relative;justify-content:center;align-items:center;padding-left:var(--section-padding);padding-right:var(--section-padding);border-bottom:1px solid rgba(238,238,238,.1)}.about-me-text{position:relative;flex:3;max-width:480px;margin-bottom:16vh}.about-me-titles{display:flex}.about-me-title{display:inline-block;white-space:nowrap}.about-me-title#about{color:var(--second-color);font-weight:700;font-size:var(--section-fs);margin-right:1rem}.about-me-title#me{color:var(--main-color);font-weight:700;font-size:var(--section-fs)}.about-me-text p{color:#eeeeeebf;font-weight:300;font-size:18px}.about-me-text img{z-index:-5}.about-me-info{background-color:var(--grey-color);padding:1rem;min-width:246px;max-width:500px;border-radius:.5rem;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:.5s}.about-me-info:hover{border:1px solid var(--main-color);transform:scale(1.05)}.about-me-images{position:relative;margin-top:22vh;min-width:100px;max-width:450px;display:flex;flex-direction:column;flex:1;z-index:-2}#person-two{max-width:80%;position:relative;image-rendering:auto;max-height:100%;top:50%;margin-top:80%;left:50%;transform:translate(-50%,-50%);rotate:3.5deg}#doodle-tile{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-5;margin-top:-24%;opacity:.5;height:120%;max-width:140%}#shadow-two{position:absolute;top:50%;left:50%;max-height:32px;transform:translate(-50%,-50%);width:100%;margin-top:46%;z-index:-5}#note{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-top:-29vh;margin-left:-40%}#lightbulb{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-top:-16vh;margin-left:50%}#arrow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-top:31vh;margin-left:15%}@media screen and (max-width: 835px){.about-me-text{margin-bottom:4vh;max-height:90%}.about-me-info{height:29%}}@media screen and (max-width: 500px){.about-me-text p{font-size:.8rem}}*{margin:0;padding:0;box-sizing:border-box}.projects{min-height:100vh;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-left:var(--section-padding);padding-right:var(--section-padding);padding-top:3vh;padding-bottom:3vh}.projects:before{content:"";background-image:url(/assets/doodle-tile-901752e5.svg);background-repeat:repeat;position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;opacity:.2}.projects-text{margin-bottom:3vh}#p-title-1{font-size:var(--section-fs);display:inline-block;margin-right:1rem;color:var(--second-color)}#p-title-2{font-size:var(--section-fs);display:inline-block;color:var(--main-color)}.card{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:4dvw;width:100%;max-width:1600px;padding:1rem;margin-bottom:1rem;border-radius:.5rem;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);overflow:hidden;position:relative;box-shadow:0 0 8px #121212;will-change:transform,opacity;transition:opacity 1s ease-out,transform 1s ease-out}.card-assets{max-width:50%;display:flex;flex-direction:column;align-items:center;flex:2;gap:.5rem}.card-assets img{width:100%;border-radius:.5rem}.card-about{display:flex;flex-direction:column;align-items:center;gap:1rem;flex:1;max-width:600px}.about-text{font-size:20px}.card-btn-wrapper{display:flex;z-index:12;gap:1rem}.card-btn{text-align:center;text-decoration:none;border-bottom:1px solid rgba(0,0,0,0);font-weight:700;font-size:16px;color:var(--second-color);z-index:12;text-shadow:0px 4px 8px rgb(0 0 0 / 50%);transition:.15s}.card-btn:hover{border-bottom:1px solid var(--main-color)}.card-title{color:var(--second-color);font-size:28px;text-shadow:0px 4px 8px rgb(0 0 0 / 50%)}.about-text{color:var(--second-color);text-align:center}@media screen and (max-width: 625px){.card{flex-direction:column!important}.card-assets{max-width:100%}}@media screen and (max-width: 790px){.about-text{font-size:14px}.card-title{font-size:18px}.card-btn{font-size:14px}.card-about{gap:.5rem}}@media screen and (min-width: 791px) and (max-width: 1200px){.about-text{font-size:16px}.card-title{font-size:24px}}@media screen and (min-width: 1200px){.card-btn{font-size:20px}.card-about{gap:3rem}}.skills{padding-left:var(--section-padding);padding-right:var(--section-padding);padding-top:3vh;padding-bottom:3vh;border:1px solid rgba(238,238,238,.1)}.skills h1{margin-top:2vh;font-size:var(--section-fs);color:var(--second-color);width:100%;text-align:center}.skills-grid{height:auto;display:grid;place-items:center;grid-template-columns:repeat(3,1fr);row-gap:5vh;padding:3vh 10vw 3vh 10vw}.skill{display:flex;width:100px;height:100px;padding:.5rem;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(200deg,var(--main-color),transparent);box-shadow:-3px 7px 15px #131313;border-radius:.5rem;transition:.2s}.skill:hover{transform:scale(1.05)}.skill-icon{font-size:5vh;color:var(--second-color)}.skill p{color:var(--second-color)}@media screen and (max-width: 500px){.skills-grid{grid-template-columns:repeat(2,1fr)}}.contact{display:flex;height:100vh;width:100vw;padding-left:var(--section-padding);padding-right:var(--section-padding);padding-top:15vh;justify-content:center;gap:5vw}.contact-text{display:flex;flex-direction:column;align-items:center;position:relative;max-height:60vh;max-width:40%}.contact-titles{display:flex;flex-direction:column}.contact-title#c-title-1{font-size:var(--section-fs);color:var(--second-color);white-space:nowrap}.contact-title#c-title-2{font-size:var(--section-fs);color:var(--main-color)}.form{max-width:60%;display:flex;flex-direction:column}.form-top{display:flex;gap:1rem;margin-bottom:1.5rem;width:100%}.user-name,.user-email{display:flex;flex-direction:column}label{color:var(--second-color);font-weight:700;font-size:var(--small-fs);margin-bottom:10px}.top-input{color:var(--second-color);font-family:Poppins,sans-serif;font-size:var(--small-fs);font-weight:700;width:100%;padding:1rem 2rem;border:none;border-radius:1rem;background-color:var(--grey-color)}#message{color:var(--second-color);font-family:Poppins,sans-serif;font-size:var(--small-fs);font-weight:700;padding:1rem 2rem;max-width:100%;height:280px;min-height:4rem;max-height:550px;border:none;border-radius:1rem;background-color:var(--grey-color);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}input:focus,textarea:focus{outline:1px solid var(--main-color)}.contact-images{z-index:-5;flex:1}#arrow-two{position:absolute;left:65%;rotate:-70deg}#person-three{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:440px;max-height:182%;margin-top:24.5%}#shadow-three{position:relative;z-index:-5;display:none;top:50%;transform:translate(-50%,-50%);left:50%;width:100%;max-height:29px;margin-top:148%;margin-left:-24%}#contact-btn{background-color:var(--main-color);text-decoration:none;margin-top:1.5rem;border:none;border-radius:1.5rem;padding:10px 2.5rem;font-weight:700;font-size:var(--small-fs);color:var(--second-color);cursor:pointer;text-shadow:0px 4px 4px rgba(0,0,0,.5);width:239px;max-width:100%;height:3rem;transition:.15s}#contact-btn:active{box-shadow:inset 5px 5px 10px -3px #000000b3}#contact-btn:disabled{filter:opacity(.6);cursor:default}@media screen and (max-width: 950px){.contact{flex-direction:column;height:auto;align-items:center;justify-content:flex-start;padding-top:3vh;padding-bottom:3vh}.contact-text{max-width:85%}.user-name,.user-email,.contact-titles{align-items:center}.contact-title#c-title-1,.contact-title#c-title-2{font-size:7vw}.form{align-items:center;max-width:85%}#message{width:100%}.contact-images{z-index:-5;flex:1;position:relative;height:0px;width:0px;display:none;top:80vh}#person-three{position:absolute;margin-left:-30%;margin-top:auto;height:100%}#arrow-two{position:absolute;left:44%;width:44%;rotate:196deg}#shadow-three{position:absolute;width:44%;margin-top:21%;margin-left:-29%}}.footer{display:flex;min-height:25vh;width:100vw;background-color:var(--bg-color);align-items:center;border-top:1px solid rgba(238,238,238,.1);z-index:100;padding:2dvh 12dvw;justify-content:space-evenly;gap:clamp(1rem,5vh,7vh)}.footer-brand{height:100%}.mm-logo-footer{max-height:100px;max-width:100px}.languages i:hover{color:var(--main-color)}.footer-links{display:flex;align-items:end;gap:1rem}.footer-links a{font-size:var(--small-fs);color:var(--second-color);text-decoration:none;cursor:pointer;border:1px solid rgb(203,115,0,0);border-radius:4px;padding:4px 9px;transition:border .15s,border-radius .15s,background-color 1.2s,transform .15s}.footer-links #resume-footer{border:1px solid var(--main-color)}.footer-links a:hover{transform:scale(1.1);border:1px solid var(--main-color);background-color:#0067306f}@media screen and (max-width: 1061px){.footer-links{flex-direction:column;gap:.3rem}}@media screen and (max-width: 500px){.footer{flex-direction:column-reverse;gap:2vh}.mm-logo-footer{width:60px;height:60px}.footer-links{align-items:center}}