@font-face{font-family:SpaceMono;src:url(/fonts/Space_Mono/SpaceMono-Regular.ttf) format("truetype")}*{margin:0;padding:0;font-family:SpaceMono,sans-serif;box-sizing:border-box}html{scroll-behavior:smooth!important;scroll-margin-top:4.375rem;::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{border-radius:5px;background:linear-gradient(to bottom,#0077b6,#00b4d8)}::-webkit-scrollbar-thumb:hover{background:linear-gradient(to bottom,#0077b6,#00b4d8)}}body{background-color:#000}:root{--main-color: #0077b6;--secondary-color: #00b4d8}nav{width:100%;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:1rem;position:fixed;top:0;z-index:2;h1{font-size:2rem;cursor:pointer;a{text-decoration:none;color:#fff}b{font-weight:700;color:var(--main-color)}}svg{width:30px;height:auto;cursor:pointer;display:none}ul{display:flex;gap:1rem;list-style:none;li{cursor:pointer;&.close-menu{display:none}a{font-weight:600;transition:all .3s ease-in-out;text-decoration:none;color:#fff;padding:10px;border-radius:5px;&:hover{color:var(--secondary-color);background:#ffffff54}}}}&.onScroll{animation:onScroll .5s forwards}&.offScroll{animation:onScroll .5s reverse}&.scrolled{background:#ffffff0e;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}&.onScroll,&.offScroll,&.scrolled{ul li a{&:hover{background:transparent;color:var(--main-color)}}}@media screen and (max-width: 1280px){ul{display:none;position:fixed;flex-direction:column;width:100vw;height:100vh;bottom:0;left:0;background:#000;overflow:hidden;z-index:999;gap:0;&.open{display:flex;animation:openMenu .3s forwards}&.close{display:flex;animation:closeMenu .3s forwards}li{width:100%;padding:1rem;a{display:block;width:100%;font-size:1.2rem;&:hover{background:transparent}}}li.close-menu{display:flex;justify-content:space-between;padding:1rem 2rem 1rem 1rem;a{padding:0;font-size:2rem;&:hover{color:#fff}}}}svg{display:block}}@media screen and (max-width: 700px){ul li.close-menu{padding:1rem}}}section{width:100%;min-height:100vh;max-width:100vw;position:relative}section:not(.principal){scroll-margin-top:5rem;@media screen and (max-width: 1000px){margin-bottom:3rem}}.btn{display:inline-block;margin-top:1rem;padding:.5rem 1rem;border:2px solid var(--main-color);border-radius:5px;color:var(--main-color);font-weight:600;text-decoration:none;cursor:pointer;transition:all .3s ease-in-out;font-size:1rem;background-color:transparent;&:hover{background:var(--main-color);color:#fff;.spinner{border-color:#fff;border-bottom-color:transparent}}}h2.tittle{font-size:2rem;text-align:center;text-transform:uppercase;margin-bottom:2rem;background:linear-gradient(90deg,var(--main-color),white);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}h3.subtittle{font-size:1.5rem;text-align:center;text-transform:uppercase;color:#fff}.animateInside{animation:onInside 1s ease forwards;animation-timeline:view();animation-range:entry 0% cover 40%}.card{background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:5px;padding:1rem;color:#fff;box-shadow:0 0 10px #0000004d;transition:all .3s ease-in-out;display:flex;flex-direction:column;gap:1rem;animation:onInside 1s ease forwards;animation-timeline:view();animation-range:entry 0% cover 40%;span{font-size:1rem;color:var(--main-color)}&:hover{background:#ffffff1a;box-shadow:0 0 20px #00000080}.img-with-text{width:220px;height:170px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:1rem;svg{width:100%}span{font-size:1.2rem;font-weight:700}}.text-with-percent{width:300px;.head{display:flex;gap:1rem;align-items:center;margin-bottom:1rem;svg{width:30px;height:auto}}.progress{position:relative;background-color:red;border-radius:10px;height:20px;display:grid;place-content:center;width:0;transition:width 1s ease-in-out;background:linear-gradient(90deg,var(--main-color),var(--secondary-color));span{color:#fff;animation:onInsidePercent .3s ease-in-out}&:after{content:"";display:block;border-radius:10px;appearance:none;width:300px;height:20px;overflow:hidden;border:none;background:#eee;position:absolute;z-index:-1;top:0;left:0}}}}.cards-list{display:flex;gap:1rem;padding:1.2rem;flex-wrap:wrap;justify-content:center}.alert{width:100%;min-height:70px;border:1px solid white;max-width:700px;border-radius:5px;padding:1rem;align-items:center;color:#fff!important;margin:1rem auto;display:none;svg{width:40px;height:auto;margin-right:10px}&.info{background:#007bff1a;border-color:var(--main-color);color:var(--main-color);display:flex}&.error{background:#ff00001a;border-color:#ff000056;color:#ff0000d5;display:flex}&.onHide{animation:onAlertHide .5s forwards}}.spinner{width:20px;height:20px;border:2px solid var(--main-color);border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite;margin-inline:1rem}section.principal{background-image:linear-gradient(to bottom,#00000080,#000),url(/_astro/main-bg.hlMPdomM.gif);background-size:cover;background-position:center;background-repeat:no-repeat;user-select:none;display:grid;place-content:center;.tittle{color:#fff;text-align:center;font-size:2.2rem;text-transform:uppercase;h2 .typing{color:var(--main-color);padding-right:5px;white-space:nowrap;overflow:hidden;&:after{content:"|";animation:typing 1s infinite}}@media screen and (max-width: 800px){font-size:1rem;padding:0 1rem}}.next{width:30px;position:absolute;bottom:20px;left:50%;transform:translate(-50%);animation:bounce 2s infinite;a{font-size:2rem;color:#fff;cursor:pointer}}}section.sobre-mi{display:flex;gap:2rem;padding:1.2rem;align-items:center;justify-content:center;.information{max-width:600px;p{font-size:1.2rem;line-height:1.5;color:#fff}.aditional-info{margin-top:2rem;display:flex;gap:2rem;align-items:center;justify-content:space-around;span{text-align:center;font-size:1.2rem;color:#fff;font-weight:700;b{color:var(--main-color)}}}}.image{position:relative;height:60vh;overflow:hidden;border-radius:5px;max-width:500px;img{width:100%;max-width:500px;height:100%;object-fit:cover;display:block}&:after{content:"";position:absolute;inset:0;border:2px solid transparent;border-radius:inherit;background:linear-gradient(270deg,var(--main-color),var(--secondary-color),var(--main-color),var(--secondary-color));background-size:400% 400%;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:neonMove 6s linear infinite;z-index:1}&:before{content:"";position:absolute;inset:-6px;border-radius:inherit;background:inherit;filter:blur(20px);opacity:.7;z-index:0;animation:neonMove 6s linear infinite}}@media screen and (max-width: 1100px){flex-direction:column;text-align:center;.image{height:40vh;max-width:300px}}}section.estudios-experiencia{.list{display:flex;gap:1rem;padding:1.2rem;justify-content:center;.academicas,.experiencia{width:40%;display:flex;flex-direction:column;gap:1rem}@media screen and (max-width: 1000px){flex-direction:column;align-items:center;.academicas,.experiencia{width:90%}}}}section.herramientas{@media screen and (max-width: 1000px){padding-top:3rem}}section.contacto{form{padding-top:1.5rem;width:100%;height:100%;padding-inline:1rem;max-width:700px;color:#fff;margin:0 auto;.input-group{display:flex;gap:1rem;width:100%;.field{width:100%}@media screen and (max-width: 730px){flex-direction:column;margin-bottom:1rem}}label{display:block;opacity:0;margin-bottom:.5rem;font-size:1.1rem;&.onFocus{opacity:1;animation:labelUp .3s forwards}&.onBlur{opacity:1;animation:labelDown .3s forwards}}input,textarea{width:100%;padding:.8rem;margin-bottom:1rem;border:none;border-radius:15px;background:transparent;color:#fff;font-size:1rem;resize:none;border:2px solid var(--main-color);@media screen and (max-width: 700px){font-size:.9rem;margin-bottom:0}&::placeholder{color:#ffffffb3}&:focus{outline:none}&.hidePlaceholder::placeholder{color:transparent}&.error{border:2px solid rgba(255,0,0,.336);animation:errorShake .3s ease-in-out}}.align-right{width:100%;display:flex;justify-content:flex-end;gap:1rem}}}.footer{width:100%;padding:1rem;background:#000;text-align:center;color:#fff;font-size:.9rem;p{margin:0;svg{width:20px;height:auto;vertical-align:middle;margin-right:5px}}.social-media{display:flex;gap:1rem;justify-content:center;margin-bottom:1rem;a{width:30px}}}@keyframes onScroll{to{background:#ffffff0e;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}}@keyframes bounce{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}@keyframes typing{0%{opacity:0}to{opacity:1}}@keyframes openMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes closeMenu{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes neonMove{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes onInsidePercent{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes onInside{0%{opacity:0;transform:translateY(300px)}to{opacity:1;transform:translateY(0)}}@keyframes labelUp{0%{transform:translateY(50px) translate(15px);color:#ffffffb3;font-size:1rem}to{transform:translateY(0) translate(0);color:#fff;font-size:1.1rem}}@keyframes labelDown{0%{transform:translateY(0) translate(0);color:#fff;font-size:1.1rem}to{transform:translateY(50px) translate(15px);color:#ffffffb3;font-size:1rem}}@keyframes errorShake{0%{transform:translate(0)}25%{transform:translate(5px)}75%{transform:translate(-5px)}to{transform:translate(0)}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes onAlertHide{0%{opacity:1;transform:rotate3d(0,0,0,0)}to{opacity:0;transform:rotateX(90deg)}}
