*{margin:0;padding:0;box-sizing:border-box}html{font-family:Space Grotesk,sans-serif;color:#fff}.container{padding:0 16px}@media(min-width:768px){.container{padding:0 30px}}@media(min-width:1200px){.container{padding:0;max-width:1110px;margin-left:auto;margin-right:auto;position:relative}}.footer{background-color:#242424;padding:0 0 60px;position:relative}@media(min-width:768px){.footer{padding:0 0 40px}}@media(min-width:1200px){.footer{padding:0 0 92px}}.footer:after{content:"";position:absolute;top:-240px;left:-270px;width:530px;height:129px;background:url(/css-4-portfolio/img/ellipses-background-right.svg) no-repeat center/contain;pointer-events:none;z-index:0}@media(min-width:768px){.footer:after{top:-160px;left:-200px}}@media(min-width:1200px){.footer:after{left:-50px}}.footer:before{content:"";display:block;height:1px;background-color:#fff;width:calc(100% - 32px);margin:0 auto 39px}@media(min-width:768px){.footer:before{width:calc(100% - 60px);margin-bottom:30px}}@media(min-width:1200px){.footer:before{width:1110px;margin:0 auto 47px}}header{margin-top:20px}@media(min-width:768px){header{margin-top:29px}}@media(min-width:1200px){header{margin-top:39px}}header:after{content:"";position:absolute;top:120px;left:-270px;width:530px;height:129px;background:url(/css-4-portfolio/img/ellipses-background-right.svg) no-repeat center/contain;pointer-events:none;z-index:-2}@media(min-width:768px){header:after{top:60px;left:-200px}}@media(min-width:1200px){header:after{top:95px;left:-50px}}header .profile-photo{background-image:url(/css-4-portfolio/img/profile-photo-mobile.png);position:absolute;top:0;left:50%;transform:translate(-50%);width:174px;height:383px;z-index:-1}@media(min-width:768px){header .profile-photo{background-image:url(/css-4-portfolio/img/profile-photo-tablet.png);position:absolute;top:0;right:0;left:auto;transform:none;width:322px;height:600px}}@media(min-width:1200px){header .profile-photo{background-image:url(/css-4-portfolio/img/profile-photo-desktop.png);top:-39px;width:445px;height:720px}}.btn-primary{display:inline-block;background:#151515;color:#fff;padding:10px 0;border-radius:0;border:none;border-bottom:none;font-weight:700;font-size:16px;line-height:26px;letter-spacing:2.9px;text-decoration:none;cursor:pointer;font-family:inherit;appearance:none;-webkit-appearance:none;transition:background-color .2s ease,color .2s ease}.btn-primary:hover{background:#151515;color:#4ee1a0}.btn-primary{border-bottom:2px solid #4EE1A0}@media(min-width:1200px){.btn-primary{position:relative;padding-bottom:10px;border:none;background:transparent;cursor:pointer;overflow:hidden;border-bottom:none}.btn-primary:before{content:"";position:absolute;bottom:0;left:0;height:2px;background-color:#4ee1a0;width:0}.btn-primary:after{content:"";position:absolute;bottom:0;right:0;height:2px;background-color:#4ee1a0;width:100%}.btn-primary:hover:before{animation:leftLineLoop 2s linear infinite}.btn-primary:hover:after{animation:rightLineLoop 2s linear infinite}@keyframes leftLineLoop{0%{width:0%}5%{width:0%}10%{width:5%}20%{width:15%}35%{width:30%}50%{width:45%}65%{width:60%}80%{width:75%}90%{width:85%}95%{width:90%}to{width:100%}}@keyframes rightLineLoop{0%{width:100%}5%{width:90%}10%{width:85%}20%{width:75%}35%{width:60%}50%{width:45%}65%{width:30%}80%{width:15%}90%{width:5%}95%{width:0%}to{width:0%}}}.btn-secundary{display:inline-block;background:#151515;color:#fff;padding:10px 0;border-radius:0;border:none;border-bottom:none;font-weight:700;font-size:16px;line-height:26px;letter-spacing:2.9px;text-decoration:none;cursor:pointer;font-family:inherit;appearance:none;-webkit-appearance:none;transition:background-color .2s ease,color .2s ease}.btn-secundary:hover{background:#151515;color:#4ee1a0}.btn-secundary{color:#d9d9d9}.contact{background-color:#242424;text-align:center}.contact__flex{display:flex;flex-direction:column;align-items:center}@media(min-width:768px){.contact__flex{justify-content:space-between;gap:56px}}@media(min-width:1200px){.contact__flex{flex-direction:row;padding-top:84px;align-items:flex-start}}.contact__flex h2{padding-top:60px;font-weight:700;font-size:40px;line-height:40px;letter-spacing:-2.5px}@media(min-width:768px){.contact__flex h2{font-size:72px;line-height:72px}}@media(min-width:1200px){.contact__flex h2{margin:0;padding-top:0;font-size:88px;line-height:88px;text-align:left}}.contact__flex p{margin-top:20px;font-weight:500;font-size:16px;line-height:26px;color:#d9d9d9;max-width:445px}@media(min-width:768px){.contact__flex p{font-size:18px;line-height:28px}}@media(min-width:1200px){.contact__flex p{margin-top:36px;text-align:left}}.contact__flex form{margin-top:48px;display:flex;flex-direction:column;align-items:center;gap:32px;width:100%;max-width:445px}@media(min-width:1200px){.contact__flex form{margin-top:0}}.contact__flex form .form-field{width:100%;position:relative}.contact__flex form .form-field .form-input{padding:0 0 16px 24px;width:100%;background:transparent;border:none;border-bottom:1px solid #FFFFFF;outline:none;color:#d9d9d9;font-size:16px;line-height:26px;font-weight:500;font-family:Space Grotesk,sans-serif;resize:none}.contact__flex form .form-field .form-input:focus{border-bottom:1px solid #4EE1A0}.contact__flex form .form-field .form-input:invalid:not(:placeholder-shown){border-bottom:1px solid #FF6F5B}.contact__flex form .form-field .form-input:invalid:not(:placeholder-shown)~.error-icon,.contact__flex form .form-field .form-input:invalid:not(:placeholder-shown)~.error-message{display:block}.contact__flex form .form-field .error-icon{display:none;position:absolute;right:0;bottom:18px;width:20px;height:20px}.contact__flex form .form-field .error-message{display:none;position:absolute;right:0;bottom:-27px;font-size:12px;color:#ff6f5b;text-align:right}.contact__flex form .btn-primary{margin-left:auto;margin-bottom:87px;background-color:#242424}@media(min-width:768px){.contact__flex form .btn-primary{margin-bottom:92px}}.hero{margin-top:331px;text-align:center;position:relative}@media(min-width:768px){.hero{margin-top:90px;text-align:left}}@media(min-width:1200px){.hero{margin-top:127px}}.hero:before{content:"";position:absolute;top:-170px;right:0;width:65px;height:129px;background:url(/css-4-portfolio/img/semicircle-background.png) no-repeat center/contain;pointer-events:none;z-index:4}@media(min-width:768px){.hero:before{top:318px}}@media(min-width:1200px){.hero:before{position:absolute;top:50%;left:50%;transform:translate(calc(-50% + 110px),calc(-50% + 65px));width:129px;height:129px;background:url(/css-4-portfolio/img/circle-background.png) no-repeat center/contain}}.hero .hero__title{font-weight:700;font-size:40px;line-height:40px;max-width:343px;margin:0 auto;letter-spacing:-2.5px}@media(min-width:768px){.hero .hero__title{margin-left:0;text-align:left;max-width:480px;font-size:72px;line-height:72px}}@media(min-width:1200px){.hero .hero__title{max-width:760px;font-size:88px;line-height:88px}}.hero .hero__title .tablet-line-break{display:none}@media(min-width:768px){.hero .hero__title .tablet-line-break{display:inline}}@media(min-width:1200px){.hero .hero__title .tablet-line-break{display:none}}.hero .hero__title .underlined{background-image:linear-gradient(#4ee1a0,#4ee1a0);background-repeat:no-repeat;background-size:100% 4px;background-position:0 100%}@media(min-width:768px){.hero .hero__title .underlined{background-size:100% 6px}}.hero .hero__subtitle{font-weight:500;font-size:16px;line-height:26px;padding:0 20px;color:#d9d9d9;max-width:343px;margin:24px auto 0}@media(min-width:768px){.hero .hero__subtitle{margin:60px auto 0 0;text-align:left;max-width:420px;padding-left:0;padding-right:40px}}@media(min-width:1200px){.hero .hero__subtitle{margin-top:43px}}.hero .btn-primary{margin:24px 0 80px}@media(min-width:768px){.hero .btn-primary{margin:34px 0 60px}}@media(min-width:1200px){.hero .btn-primary{margin:66px 0 219px}}.projects{margin:80px 0;position:relative}@media(min-width:768px){.projects{margin:100px 0}}@media(min-width:1200px){.projects{margin:140px 0}}.projects:before{content:"";position:absolute;top:-140px;right:0;width:198px;height:129px;background:url(/css-4-portfolio/img/ellipses-background-left-small.png) no-repeat center/contain;pointer-events:none;z-index:2}@media(min-width:1200px){.projects:before{width:291px;background:url(/css-4-portfolio/img/ellipses-background-left.png) no-repeat center/contain;z-index:3}}.projects .title{display:flex;justify-content:space-between;align-items:center}.projects .title h2{font-weight:700;font-size:40px;line-height:40px;letter-spacing:-2.5px}@media(min-width:768px){.projects .title h2{font-size:72px;line-height:72px}}@media(min-width:1200px){.projects .title h2{font-size:88px;line-height:88px}}.projects__grid{margin:40px 0;display:grid;grid-template-columns:1fr;gap:40px}@media(min-width:768px){.projects__grid{margin:60px 0;grid-template-columns:1fr 1fr;gap:60px 24px}}@media(min-width:1200px){.projects__grid{margin:80px 0;gap:69px 30px}}@media(min-width:1200px){.projects__grid .project{position:relative}}@media(min-width:1200px){.projects__grid .project img{transition:filter .3s ease}}@media(min-width:1200px){.projects__grid .project .project__links{position:absolute;top:0;left:0;width:100%;height:400px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;opacity:0;pointer-events:none;transition:opacity .3s ease}}@media(min-width:1200px){.projects__grid .project:hover img{filter:grayscale(100%) brightness(35%) contrast(110%)}.projects__grid .project:hover .project__links{opacity:1;pointer-events:auto}.projects__grid .project:hover .project__links .btn-primary{background-color:transparent}}.projects__grid .project h3{margin-top:20px;font-weight:700;font-size:24px;line-height:32px}.projects__grid .project .btn-secundary{margin-right:18px}.projects__grid .project .btn-primary{margin-right:30px}.site-bar{display:flex;flex-direction:column;align-items:center;gap:20px}@media(min-width:768px){.site-bar{display:flex;flex-direction:row;justify-content:space-between;align-items:center}}@media(min-width:768px){.site-bar .logo{width:172px}}.site-bar ul{display:flex;align-items:center;list-style:none;gap:26px}@media(min-width:1200px){.site-bar ul{margin-right:30px}}.site-bar ul .icon{width:22px;color:#fff}@media(min-width:768px){.site-bar ul .icon{width:28px}}.site-bar ul .icon:hover{color:#4ee1a0}.skills{position:relative}.skills:before{content:"";display:block;width:calc(100% - 32px);height:1px;background-color:#fff;position:relative;top:0;left:50%;transform:translate(-50%)}@media(min-width:768px){.skills:before{width:calc(100% - 60px)}}@media(min-width:1200px){.skills:before{width:1110px}}.skills:after{content:"";display:block;width:calc(100% - 32px);height:1px;background-color:#fff;position:relative;bottom:0;left:50%;transform:translate(-50%)}@media(min-width:768px){.skills:after{display:none}}.skills ul{margin:40px 0;display:grid;grid-template-columns:1fr;gap:24px 0px;text-align:center}@media(min-width:768px){.skills ul{margin:52px 0 0;grid-template-columns:1fr 1fr;gap:52px 0px;text-align:left}}@media(min-width:1200px){.skills ul{margin:72px 0 0;grid-template-columns:1fr 1fr 1fr;gap:58px 30px;text-align:left}}.skills ul li{display:flex;flex-direction:column}.skills ul li h3{font-weight:700;font-size:32px;line-height:40px;letter-spacing:-1.5px}@media(min-width:768px){.skills ul li h3{font-size:48px;line-height:56px}}.skills ul li p{font-weight:500;font-size:16px;line-height:26px;color:#d9d9d9}@media(min-width:768px){.skills ul li p{font-size:18px;line-height:28px}}@media(min-width:1200px){.skills ul li p{grid-template-columns:1fr 1fr 1fr;gap:58px 30px;text-align:left}}body{overflow-x:hidden;background-color:#151515}img{max-width:100%;height:auto;display:block;margin:0 auto}