@font-face{font-family:Metropolis;src:url(/assets/Metropolis-Regular-CzBvJ1n5.otf) format("opentype");font-weight:400;font-style:normal}@font-face{font-family:Metropolis;src:url(/assets/Metropolis-Bold-DM16brCS.otf) format("opentype");font-weight:700;font-style:bold}@font-face{font-family:Metropolis;src:url(/assets/Metropolis-SemiBold-CjwwsEGE.otf) format("opentype");font-weight:600;font-style:semibold}*{margin:0;padding:0;box-sizing:border-box;font-family:Metropolis,sans-serif;font-size:16px;line-height:30px}html,body{width:100%;background-color:#e6dcc8;overflow-x:hidden}a{text-decoration:none;color:inherit;cursor:pointer}h1{font-size:5rem;font-weight:700;color:#545456;letter-spacing:-.1875rem;line-height:5rem}h2{font-weight:600;font-size:1.875rem;letter-spacing:2%;color:#545456}h3{font-weight:400;font-size:1.25rem;line-height:1.875rem;color:#545456}p{font-size:1rem;color:#545456;line-height:1.875rem}@media only screen and (max-width: 768px){h1{font-size:4rem;line-height:4rem}h2{font-size:1.75rem;line-height:2rem}h3{font-size:1.125rem;line-height:1.5625rem}p{font-size:.874rem;line-height:1.5rem}}@media only screen and (max-width: 480px){h1{font-size:3.5rem;line-height:3.5rem}h3{font-size:1rem;line-height:1.4rem}p{font-size:.8125rem;line-height:1.25rem}}.navbar{max-width:1160px;width:calc(100% - 80px);margin:1.25rem auto;position:fixed;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:#ffffff7a;border-radius:15px;z-index:10}.logo{height:2.5rem}nav ul{list-style:none;display:flex;gap:2rem}nav ul li{color:#545456;font-size:1.125rem;line-height:2rem;border-bottom:transparent 2px solid;cursor:pointer;transition:all .4s ease-in-out}nav ul li:hover{border-bottom:#545456 2px solid}nav .socials{display:flex;gap:2rem}nav .socials img{height:25px;cursor:pointer;transition:all .3s ease-in-out}nav .socials img:hover{transform:scale(1.1)}.hamburger{display:none;flex-direction:column;cursor:pointer;width:32px;height:32px;justify-content:center;align-items:center;z-index:20}.hamburger span{display:block;width:25px;height:3px;margin:2.5px 0;background:#545456;border-radius:2px;transition:.3s}.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.dropdown-menu{display:flex;position:absolute;top:4.5rem;left:50%;transform:translate(-50%,-30px);width:90vw;max-width:700px;background:#f2ede2;border-radius:15px;box-shadow:0 8px 32px #00000026;padding:2rem 1rem 1rem;z-index:15;flex-direction:column;opacity:0;pointer-events:none;transition:opacity .6s cubic-bezier(.4,2,.6,1),transform .6s cubic-bezier(.4,2,.6,1)}.dropdown-menu ul{list-style:none;padding:0;margin:0 0 1rem;display:flex;flex-direction:column;gap:2.5rem;align-items:center}.dropdown-menu a{color:#545456;font-size:1.125rem;line-height:2rem}.dropdown-menu .socials{gap:1.5rem;justify-content:center}.dropdown-menu.show{opacity:1;gap:1.5rem;transform:translate(-50%);pointer-events:auto}@media (min-width: 769px){.dropdown-menu,.hamburger{display:none!important}.desktop-menu,.desktop-socials{display:flex}}@media (max-width: 768px){.desktop-menu,.desktop-socials{display:none!important}.hamburger{display:flex}.dropdown-menu{max-width:700px;left:50%;transform:translate(-50%,-30px)}.navbar{max-width:700px;width:calc(100% - 60px);margin:1rem 2rem}}@media (max-width: 480px){nav .navbar{max-width:440px;width:calc(100% - 30px);margin:1rem}.dropdown-menu ul{gap:1.5rem}}.footer{max-width:1160px;height:100px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.go-up img{height:30px;padding:5px;background-color:#545456;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer}@media only screen and (max-width: 768px){.footer{max-width:700px;margin:0 1.125rem}}@media only screen and (max-width: 480px){.footer{max-width:400px;margin:0 1rem}}.hero{max-width:1160px;width:calc(100% - 80px);padding-top:5rem;height:85vh;display:flex;flex-direction:row;margin:0 auto}.hero-center,.hero-left,.hero-right{flex:1;width:0;min-width:0;display:flex;flex-direction:column}.hero-center{position:relative;width:100%;height:100%;display:flex;align-items:center}.hero-left{align-items:flex-start}.hero-left-text,.hero-right-text{opacity:0;flex:1;transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1)}.hero-left-text{transform:translate(-80px);align-content:center}.hero-right-text{transform:translate(80px);align-content:center}.ellipse-yellow{position:absolute;width:20px;top:25%;left:20%;height:auto;z-index:2}.union-blue{position:absolute;width:30px;top:70%;left:25%;height:auto;z-index:2}.union-grey{position:absolute;width:15px;top:20%;right:25%;height:auto;z-index:2}.hero-right{align-items:flex-end}.union-yellow{position:absolute;width:30px;top:25%;right:20%;height:auto;z-index:2}.ellipse-grey{position:absolute;width:30px;height:30px;top:70%;right:25%;height:auto;z-index:2}.ellipse-blue-big{position:absolute;width:40px;top:40%;right:70%;z-index:2}.portrait{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);width:auto;height:90%;object-fit:contain;z-index:1;display:block;opacity:0;pointer-events:none;transition:width 2s,height 2s,transform 2s,opacity 2s,pointer-events 2s}.portrait.visible{opacity:1;pointer-events:auto}.hero p{margin-top:5px;width:300px}@media only screen and (max-width: 768px){.hero{max-width:700px;width:calc(100% - 60px);margin:0 1.25rem;padding-top:3rem;height:70vh}.hero p{width:200px}.portrait{left:50%;top:60%;height:80%;z-index:1000}.ellipse-yellow{width:18px;top:22%;left:15%}.union-blue{width:25px;top:55%;left:20%}.ellipse-blue-big{width:35px;top:30%;right:75%}.ellipse-grey{width:20px;top:55%;right:25%}.union-yellow{width:20px;top:25%;right:15%}}@media only screen and (max-width: 480px){.hero{max-width:440px;width:calc(100% - 30px);margin:0 1rem;padding-top:2rem;height:60vh}.hero h1{font-size:2.5rem}.hero p{width:150px}.portrait{left:50%;top:62%;height:75%}.ellipse-yellow{width:15px;top:18%;left:12%}.union-blue{width:18px;top:50%;left:12%}.ellipse-blue-big{width:22px;top:25%;right:80%}.union-grey{width:10px;top:22%;right:25%}.ellipse-grey{width:17px;top:50%;right:15%}.union-yellow{width:15px;top:18%;right:12%}}.lastproject-container{background-color:#fff}.lastproject{display:flex;max-width:1160px;flex-direction:column;padding:100px 0;margin:0 auto}.lastproject h2{font-size:1.5625rem;font-weight:400;margin-bottom:1.875rem;letter-spacing:2%;color:#545456;text-align:center}.lastprojectcard-box{display:flex;flex-wrap:wrap;justify-content:center;margin:0 auto;gap:20px}.lastprojectcard{display:flex;cursor:pointer;flex-direction:column;flex:1 1 0;min-width:0;max-width:calc((100% - 40px) / 3);border-radius:20px;box-shadow:#545456 5px 5px 20px -10px;transition:ease-in-out .5s}.lastprojectcard:hover{transform:scale(1.05)}.lastproject-text-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:10px 20px 20px}.lastproject-text{display:flex;flex-direction:column;align-items:flex-start;margin:10px}.lastproject-text h3{font-weight:600;font-size:1.25rem;color:#ffc00d;margin:0}.lastproject-text p{font-size:1rem;color:#545456;opacity:.8;text-align:left}.lastprojectcard:hover .arrow-more{opacity:.6;transform:scale(1.1)}.techno{margin-top:.325rem;margin-bottom:10px;display:flex;gap:10px}.techno span{font-size:.75rem;font-weight:700;padding:5px 10px;border-radius:50px}.techno #html{color:#e96228;border:#E96228 2px solid}.techno #css{color:#2862e9;border:#2862E9 2px solid}.techno #javascript{color:#d3b22e;border:#d3b22e 2px solid}.techno #react{color:#09d2f6;border:#09D2F6 2px solid}@media only screen and (max-width: 768px){.lastproject{max-width:700px;padding:3.125rem 1.25rem}.lastprojectcard-box{gap:10px}.lastproject h2{font-size:1.25rem;margin-bottom:1.5625rem}.lastproject-text h3{font-size:1.125rem}.lastproject-text p{font-size:.874rem}}@media only screen and (max-width: 480px){.lastproject{max-width:440px;margin:0 1rem}.lastprojectcard-box{flex-direction:column;align-content:center;margin:0 auto;gap:20px}.lastprojectcard{max-width:80%}.lastproject h2{margin-bottom:1.25rem}}.about-hero{max-width:1160px;width:calc(100% - 80px);padding-top:5rem;height:80vh;display:flex;flex-direction:row;margin:0 auto}.about-hero-left,.about-hero-right{opacity:0;flex:1;transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1)}.about-hero-left{transform:translate(-80px);align-content:center}.about-hero-right{transform:translate(80px)}.title{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px}.description h3{margin-top:1rem;margin-bottom:1rem}.description{max-width:470px}.about-hero-right{position:relative;flex:1;width:0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.background-img{position:absolute;top:10%;left:0;width:100%;height:100%;z-index:0;display:flex;justify-content:center;align-items:center}.design-img{position:relative;left:10%;bottom:10%;width:50%}.code-img{position:relative;width:50%;right:5%}.portrait-img{position:relative;z-index:1;width:80%}@media only screen and (max-width: 768px){.about-hero{max-width:700px;width:calc(100% - 60px);margin:0 2rem;flex-direction:column;flex-wrap:wrap;height:auto}.about-hero-left,.about-hero-right{width:100%}.about-hero-left{margin-top:3rem}.portrait-img{width:45%}.design-img{left:0%;width:30%}.code-img{position:relative;width:30%;left:8%}.description{width:100%}.description h3{margin-top:.875rem;margin-bottom:.875rem}}@media only screen and (max-width: 480px){.about-hero{max-width:440px;width:calc(100% - 30px);margin:0 1rem;flex-direction:column;flex-wrap:wrap;gap:1rem;height:auto}.about-hero-left,.about-hero-right{width:100%}.about-hero-left{margin-top:3rem}.description h3{margin-top:.625rem;margin-bottom:.625rem}.description{width:100%}.portrait-img{position:relative;z-index:1;width:60%}}.mystory{margin:0 auto;background-color:#fff;padding:100px 0}.mystory h2{margin-bottom:1.875rem}.container{display:flex;flex-direction:row;justify-content:center;align-items:center;max-width:1160px;margin:0 auto;gap:40px}.mystory-left,.mystory-right{flex:1;width:0;min-width:0}.mystory-left{display:flex;flex-direction:column;justify-content:center}.mystory-right{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;min-width:0;width:0;flex:1;opacity:0;transform:translate(80px);transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1)}.mystory-right.slide-in-right{opacity:1;transform:translate(0)}.office{position:relative;display:flex;flex-direction:column;align-items:flex-end}.office p{text-align:right;margin-top:15px}.office img:not(.meworking){width:400px;height:auto;border-radius:3%;z-index:1;display:block}.meworking{position:absolute;height:180px;border-radius:50%;border:5px solid #ffff;bottom:30px;right:370px;z-index:2}@media only screen and (max-width: 768px){.mystory{padding:70px 0}.container{max-width:700px;width:calc(100% - 60px);margin:0 2rem;flex-direction:column;flex-wrap:wrap;height:auto}.mystory-left,.mystory-right{width:100%}.mystory-right{align-items:center}.meworking{height:150px;bottom:20px;z-index:2}}@media only screen and (max-width: 480px){.mystory{padding:50px 0}.container{max-width:440px;width:calc(100% - 30px);margin:0 1rem;flex-direction:column;flex-wrap:wrap;gap:2rem;height:auto}.office img:not(.meworking){width:300px}.meworking{height:120px;bottom:20px;left:0%}}.designcode-container{display:flex;margin:100px auto;flex-direction:row;align-items:center;gap:20px;max-width:1160px}.designcode-container img{width:40%;height:100%}@media only screen and (max-width: 768px){.designcode-container{max-width:700px;width:calc(100% - 60px);margin:0 2rem;padding:70px 0;gap:10px;flex-direction:column;flex-wrap:wrap;height:auto}.designcode-container img{width:50%}.designcode-container h2{font-size:1.5625rem;line-height:3rem}}.myskills-container{background-color:#fff;padding:100px 0}.myskills-block{display:flex;margin:0 auto;flex-direction:column;align-items:flex-start;max-width:1160px;gap:30px}.myskills-block img{width:100%;height:auto}@media only screen and (max-width: 768px){.myskills-container{padding:70px 0}.myskills-block{max-width:700px;width:calc(100% - 60px);margin:0 1.25rem}}.portfolio-hero{max-width:1160px;padding-top:5rem;height:80vh;display:flex;flex-direction:row;margin:0 auto}.portfolio-hero-left,.portfolio-hero-right{opacity:0;flex:1 1 0;transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1)}.portfolio-hero-left{transform:translate(-80px);display:flex;flex-direction:column;gap:30px;justify-content:center}.portfolio-hero-right{transform:translate(80px);display:flex;flex-direction:column;justify-content:center;align-items:center}.slide-in-left,.slide-in-right{opacity:1;transform:translate(0)}.title-portfolio{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px}.description-portfolio{max-width:470px}.porfolio-img{position:relative;height:auto;width:90%}@media only screen and (max-width: 768px){.portfolio-hero{max-width:700px;width:calc(100% - 60px);margin:0 2rem;flex-direction:column;flex-wrap:wrap;height:auto}.portfolio-hero-left,.portfolio-hero-right{width:100%;gap:30px}.portfolio-hero-left{margin-top:3rem}.porfolio-img{margin:30px 0;width:60%}.description-portfolio{width:100%}}@media only screen and (max-width: 480px){.porfolio-img{margin:30px 0;width:90%}}.portfolio-container{background-color:#fff}.portfolio{max-width:1160px;padding:100px 0;display:flex;flex-wrap:wrap;justify-content:flex-start;margin:0 auto;gap:20px}.porfoliocard{display:flex;cursor:pointer;flex-direction:column;flex:1 1 calc((100% - 40px) / 3);min-width:0;max-width:calc((100% - 40px) / 3);border-radius:20px;box-shadow:#545456 5px 5px 20px -10px;transition:ease-in-out .5s}.porfoliocard:hover{transform:scale(1.05)}.Mockup{width:100%;height:auto;border-radius:20px;padding:10px}.portfolio-text-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:10px 20px 20px}.portfolio-text{display:flex;flex-direction:column;align-items:flex-start}.portfolio-text h3{font-weight:500;font-size:1.25rem;color:#ffc00d;margin:0}.portfolio-text p{font-size:1rem;color:#545456;opacity:.8;text-align:left}.arrow-more{cursor:pointer;width:30px;height:auto;opacity:0;transition:ease-in-out .5s}.porfoliocard:hover .arrow-more{opacity:.6;transform:scale(1.1)}@media only screen and (max-width: 768px){.portfolio{max-width:700px;margin:0 auto;padding:3.125rem 1.25rem;gap:10px}.portfolio-text h3{font-size:1.125rem}.portfolio-text p{font-size:.874rem}}@media only screen and (max-width: 480px){.portfolio{max-width:440px;margin:0 1rem;flex-direction:column;align-content:center;margin:0 auto;gap:20px}.porfoliocard{max-width:80%}}.contact-hero{max-width:1160px;padding-top:5rem;height:80vh;display:flex;flex-direction:row;margin:0 auto}.contact-hero-left{transform:translate(-80px);opacity:0;flex:1 1 0;transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1);display:flex;flex-direction:column;gap:30px;justify-content:center}.contact-hero-right{display:flex;flex:1 1 0;width:0;flex-direction:column;justify-content:center;align-items:center}.slide-in-left{opacity:1;transform:translate(0)}.contact-img{height:40%;width:auto;max-height:100%;transform:translate(80px);opacity:0;flex:0 0 auto;transition:opacity .8s cubic-bezier(.4,2,.6,1),transform .8s cubic-bezier(.4,2,.6,1);position:relative;display:block}.slide-in-right{opacity:1;transform:translate(0)}.title-contact{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px}.point{color:#ffc00d}.description-contact{max-width:470px}.ellipseyellow{position:absolute;top:17%;right:30%;height:15px;z-index:2}.ellipseblue{position:absolute;bottom:50%;right:50%;height:20px;z-index:2}.unionblue{position:absolute;top:20%;right:15%;height:20px;z-index:2}.uniongrey{position:absolute;bottom:30%;right:45%;height:15px;z-index:2}.ellipseyellowbig{position:absolute;bottom:30%;right:25%;height:45px;z-index:2}@media only screen and (max-width: 768px){.contact-hero{max-width:700px;width:calc(100% - 60px);margin:0 2rem;flex-direction:column;flex-wrap:wrap;height:auto}.contact-hero-left,.contact-hero-right{width:100%}.contact-hero-left{margin-top:3rem}.contact-img{width:auto;height:35%}.ellipseyellow{top:50%;right:40%}.ellipseblue{top:50%;left:30%}.unionblue{top:60%;right:15%}.uniongrey{bottom:25%;right:75%}.ellipseyellowbig{bottom:10%;right:20%}}@media only screen and (max-width: 480px){.contact-hero{max-width:440px;width:calc(100% - 30px);margin:0 1rem;flex-direction:column;flex-wrap:wrap;gap:1rem;height:auto}.contact-hero-left,.contact-hero-right{width:100%}.contact-hero-left{margin-top:3rem}}.contact-form{background-color:#fff;padding:100px 0;margin:0 auto;display:flex}form{width:1160px;margin:0 auto}.top-form{display:flex;flex-direction:row;justify-content:space-between;gap:30px;align-items:stretch}.form-left,.form-right{display:flex;flex:1;flex-direction:column}.form-right textarea{padding:10px;margin-bottom:20px;border:1px solid #ccc;border-radius:4px;flex:1}.form-left input{width:100%;padding:10px;margin-bottom:20px;border:1px solid #ccc;border-radius:4px;flex:1}.contact-form button{background-color:#0d43ff;color:#fff;padding:10px 30px;border:2px solid transparent;border-radius:10px;box-shadow:#545456 5px 5px 20px -10px;transition:ease-in-out .5s}.contact-form button:hover{transform:scale(1.05);border:2px solid #0D43FF;background-color:transparent;color:#0d43ff}.contact-form label{color:#545456;font-weight:400}@media screen and (max-width: 768px){.contact-form{padding:70px 0}form{max-width:700px;width:calc(100% - 60px);margin:0 2rem;flex-direction:column;flex-wrap:wrap;height:auto}.form-right textarea{padding:10px;margin-bottom:20px;border:1px solid #ccc;border-radius:4px;flex:1}form label,button,.form-right textarea,.form-left input{font-size:.874rem;line-height:1.5rem}}@media screen and (max-width: 480px){.contact-form{padding:50px 0}form{max-width:440px;width:calc(100% - 30px);margin:0 1rem;flex-direction:column;flex-wrap:wrap;gap:1rem;height:auto}form label,button,.form-right textarea,.form-left input{font-size:.8125rem;line-height:1.25rem}}
