.hero-section{display:flex;align-content:center;justify-content:center}.hero-content{display:flex;flex-flow:column;gap:1rem;align-items:center;justify-items:center;justify-content:center;text-align:center}.hero-content span{color:var(--clr-principal)}.hero-content h1{font-size:min(max(2.5rem,4vw),3.5rem);font-family:General Sans,Inter,system-ui,Avenir}.hero-content ul.links{position:fixed;bottom:0;display:flex;justify-content:space-between;gap:1.5rem;font-size:1.3rem;min-width:90vw;padding:1rem 3rem 2rem;box-shadow:var(--mid-shadow);transform:translateY(0);transition:transform .3s ease-in-out}.hero-content ul.links li a{text-decoration:none;color:var(--clr-ultra-light-black);position:relative}.hero-content ul.links li a:hover,.hero-content ul.links li a:focus{color:var(--clr-black)}.hero-content ul.links li a:before{content:"";position:absolute;width:100%;height:4px;border-radius:4px;background-color:#18272f;bottom:-3px;left:0;transform-origin:right;transform:scaleX(0);transition:transform .3s ease-in-out}.hero-content ul.links li a:hover:before{transform-origin:left;transform:scaleX(1)}.hero-content ul.links li:first-child{justify-self:start;display:flex;justify-content:start;left:0}.hero-content ul.links ul{display:flex;flex-flow:row;gap:1.5rem}.hero-content ul.hide{transform:translateY(100px);transition:transform .3s ease-in-out}.hero-content button{font-size:1.3rem;background-color:var(--clr-principal);color:var(--clr-light-white);padding:1rem 2.5rem;border-radius:100px;border:3px solid var(--clr-principal);transition:border-radius .5s ease-in-out}.hero-content button:last-child{background-color:var(--clr-light-white);color:var(--clr-black);border:3px solid var(--clr-black)}.hero-content button:focus{outline:.5rem double var(--clr-light-black)}.hero-content button:hover{border-radius:0;transition:border-radius .5s ease-in-out}.circles{filter:blur(10px);z-index:-1;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.circles li{position:absolute;display:block;list-style:none;width:20px;height:20px;background:#0dbfeca6;animation:animate 25s linear infinite;bottom:-150px}.circles li:nth-child(1){left:25%;width:80px;height:80px;animation-delay:0s}.circles li:nth-child(2){left:10%;width:20px;height:20px;animation-delay:2s;animation-duration:12s}.circles li:nth-child(3){left:70%;width:20px;height:20px;animation-delay:4s}.circles li:nth-child(4){left:40%;width:60px;height:60px;animation-delay:0s;animation-duration:18s}.circles li:nth-child(5){left:65%;width:20px;height:20px;animation-delay:0s}.circles li:nth-child(6){left:75%;width:110px;height:110px;animation-delay:3s}.circles li:nth-child(7){left:35%;width:150px;height:150px;animation-delay:7s}.circles li:nth-child(8){left:50%;width:25px;height:25px;animation-delay:15s;animation-duration:45s}.circles li:nth-child(9){left:20%;width:15px;height:15px;animation-delay:2s;animation-duration:35s}.circles li:nth-child(10){left:85%;width:150px;height:150px;animation-delay:0s;animation-duration:11s}@keyframes animate{0%{transform:translateY(-1300px) rotate(0);opacity:1;border-radius:0}to{transform:translateY(100px) rotate(720deg);opacity:0;border-radius:50%}}@media (max-width: 490px){.call-to-action button{width:100%;box-sizing:border-box}}@media (max-width: 700px){.hero-content ul.links{position:block;display:none}}.project-container{min-height:fit-content;margin-bottom:5rem;display:grid;grid-template-columns:1fr 1.5fr;gap:2rem;padding:2rem 2rem 5rem;align-items:center;border-bottom:1px solid var(--clr-mega-ultra-light-black)}.project-container .project-tittle{font-size:3rem;font-family:General Sans,Inter,system-ui,Avenir}.project-container h3{font-size:1.75rem;font-weight:100;color:var(--clr-ultra-light-black);margin-bottom:1.25rem}.text-container{display:flex;gap:1rem;flex-flow:column}.text-container .project-links a{color:var(--clr-principal);font-size:1.3rem;text-decoration:none;display:flex;gap:5rem}.text-container .project-links .arrow{display:contents;font-size:2.5rem}.text-container .project-links li{display:flex;align-items:center}.image-container img{height:100%;width:100%;border-radius:1rem;box-shadow:var(--mid-shadow)}.stack-list{display:flex;gap:.5rem;flex-wrap:wrap}.stack-list li{background-color:var(--clr-light-black);padding:.5rem 1rem;border-radius:1rem;color:var(--clr-light-white)}@media (max-width: 1060px){.project-container{grid-template-columns:1fr;grid-template-rows:auto auto;padding-left:0;padding-right:0}}.skills-section{display:grid;grid-template-rows:auto 1fr}.icon-container{border:3px dotted var(--clr-ultra-light-black);height:120px;width:120px;display:flex;flex-flow:column;align-content:center;justify-content:center;justify-items:center;gap:.5rem;padding:.5rem}.icon-container svg{width:100%;transform:scale(1);transition:transform .2s ease-in-out}.icon-container p{text-align:center}.icon-container:hover{border-color:var(--clr-principal)}.icon-container:hover p{color:var(--clr-principal)}.icon-container:hover svg{fill:var(--clr-principal);transform:scale(1.1);transition:transform .2s ease-in-out}.skills-section .icons{display:flex;align-content:center;justify-content:center;flex-wrap:wrap;gap:2rem}.contact-me-section{--clr-error: rgb(244, 33, 46);display:grid;grid-template-rows:auto 1fr}.contact-me-section ul li{font-size:1.5rem}.contact-me-section h2{text-align:center;margin:1rem 0;color:var(--clr-light-black)}.contact-me-container{display:grid;grid-template-rows:auto auto;align-items:center;justify-items:center;gap:.5rem}.contact-me-container form{display:flex;flex-flow:column;justify-items:center;justify-content:center;gap:1rem;max-width:500px}.contact-me-container form input{margin-top:1.5rem;height:1.25rem;border:none;width:100%;background:transparent;overflow:hidden}.contact-me-container form input:hover,.contact-me-container form input:focus{outline:none}.contact-me-container form .input-container:not(:has(:placeholder-shown)) label{transform:translateY(0) scale(.85);left:1rem}.contact-me-container form .input-container:has(input.bad-input){border-color:var(--clr-error)}.contact-me-container form .input-container:focus-within:has(input.bad-input){outline-color:var(--clr-error)}.contact-me-container form .input-container{padding:.5rem 1rem;border:1px solid var(--clr-ultra-light-black);border-radius:.25rem;position:relative;overflow:hidden;background-color:var(--clr-light-white);min-width:300px}.contact-me-container form .input-container:focus-within{outline:2px solid var(--clr-principal)}.contact-me-container form .input-container:focus-within label{color:var(--clr-principal);transform:translateY(0) scale(.85);left:1rem}.contact-me-container form textarea{padding:1rem;min-height:100px}.contact-me-container form textarea::placeholder{color:var(--clr-light-black);font-family:Helvetica,Arial,sans-serif;font-size:1rem}.contact-me-container form textarea:focus{outline:2px solid var(--clr-principal)}.contact-me-container form label{color:var(--clr-light-black);position:absolute;left:1rem;transform:translateY(80%) scale(1);transition:transform .25s ease-in-out;transform-origin:left}.contact-me-container form button{font-size:1.3rem;background-color:var(--clr-principal);color:var(--clr-light-white);padding:1rem 2.5rem;align-self:start;margin:0}.info ul.links{display:flex;flex-flow:row;align-items:end;gap:1.5rem;font-size:3rem;margin:0rem 1rem}.info ul.links li{display:flex;align-items:center;justify-items:end;gap:.5rem}.info ul.links li a{text-decoration:none;color:var(--clr-light-black);position:relative}.info ul.links li a:hover,.info ul.links li a:focus{color:var(--clr-black)}.info ul.links li a:before{content:"";position:absolute;width:100%;height:4px;border-radius:4px;background-color:#18272f;bottom:-3px;left:0;transform-origin:right;transform:scaleX(0);transition:transform .3s ease-in-out}.info ul.links li a:hover:before{transform-origin:left;transform:scaleX(1)}.info ul.links li:first-child{justify-self:start;display:flex;justify-content:start;left:0}.info ul.links ul{display:flex;flex-flow:row;gap:1.5rem}body{line-height:1;margin:0}body html,body body,body div,body span,body applet,body object,body iframe,body h1,body h2,body h3,body h4,body h5,body h6,body p,body blockquote,body pre,body a,body abbr,body acronym,body address,body big,body cite,body code,body del,body dfn,body em,body img,body ins,body kbd,body q,body s,body samp,body small,body strike,body strong,body sub,body sup,body tt,body var,body b,body u,body i,body center,body dl,body dt,body dd,body ol,body ul,body li,body fieldset,body form,body label,body legend,body table,body caption,body tbody,body tfoot,body thead,body tr,body th,body td,body article,body aside,body canvas,body details,body embed,body figure,body figcaption,body footer,body header,body hgroup,body menu,body nav,body output,body ruby,body section,body summary,body time,body mark,body audio,body video{margin:0;padding:0;border:0;vertical-align:baseline}body article,body aside,body details,body figcaption,body figure,body footer,body header,body hgroup,body menu,body nav,body section{display:block}body ol,body ul{list-style:none}body blockquote,body q{quotes:none}body blockquote:before,body blockquote:after,body q:before,body q:after{content:"";content:none}body table{border-collapse:collapse;border-spacing:0}body button{border:0;font-weight:700}:root{font-family:Helvetica,Arial,sans-serif;--clr-black: hsl(214, 31%, 12%);--clr-light-black: hsl(213, 31%, 20%);--clr-ultra-light-black: hsl(213, 10%, 44%);--clr-mega-ultra-light-black: hsl(213, 10%, 64%);--clr-dark-white: hsl(213, 15%, 95%);--clr-light-white: hsl(213, 15%, 100%);--clr-principal: hsl(214, 90%, 51%);--clr-light-principal: hsl(214, 90%, 70%);--little-shadow: 3px 3px 5px hsl(0, 0%, 0%, .2);--mid-shadow: rgba(37, 39, 89, .08) 0px 8px 8px 0;--big-shadow: 10px 10px 5px hsl(0, 0%, 0%, .2);--radius: 1rem;color:var(--clr-black);background-color:var(--clr-dark-white)}body{max-width:100dvw;min-height:100dvh}body * button{padding:.5rem 1rem;margin:.5rem;font-size:1rem;border:0;cursor:pointer}body * svg{fill:var(--clr-black);height:3rem}body #root{min-height:inherit;max-width:inherit}.section{min-height:inherit;max-width:inherit;padding:0 5rem}.header{position:fixed;display:flex;min-width:100vw;justify-content:center;align-items:center;margin-top:2rem;gap:4rem;transform:translateY(0);transition:transform .3s ease-in-out;z-index:10}.header img{height:3rem}.header ul{display:flex;gap:1.5rem;font-size:1.3rem;box-shadow:var(--mid-shadow);padding:1rem 2rem;border-radius:100px;background-color:var(--clr-light-white)}.header ul li a{text-decoration:none;color:var(--clr-light-black);font-weight:800;position:relative}.header.hide{transform:translateY(-100px);transition:transform .3s ease-in-out}.tittle{font-size:2.5rem;margin:3rem 0rem}.tittle span{font-size:1.8rem}p{font-size:min(max(1.2rem,2vw),1.5rem);color:var(--clr-light-black);max-width:75ch;line-height:normal}@media (max-width: 1060px){.section{padding:0 min(5rem,7vw)}}@media (max-width: 700px){.header{transform:translateY(-100px)}}