@import"https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:linear-gradient(to left,#7fecfa,#070707)}a{font-family:Onest,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal}h1{margin:0;font-family:Onest,sans-serif;font-optical-sizing:auto;font-weight:800;font-style:normal}h2{font-family:Onest,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal}p{margin:0;font-family:Onest,sans-serif;font-optical-sizing:auto;font-weight:300;font-style:normal}html{scroll-behavior:smooth}#root{max-width:1000px;margin:0 auto}#proyectos{scroll-margin-top:10px}#experiencia,#contacto{scroll-margin-top:200px}.nav{position:fixed;top:0;margin-top:5px;left:50%;transform:translate(-50%);background-color:#0003;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:clamp(4px,1.5vw,9px) clamp(6px,3vw,15px);z-index:1000;border-radius:20px}.nav ul{list-style-type:none;margin:0;padding:0;display:flex;gap:clamp(5px,2vw,8px)}.nav li{margin:0;transition:transform .2s;flex-shrink:1}.nav li:hover{transform:scale(1.1)}.nav a{text-decoration:none;font-size:clamp(12px,2.5vw,16px);color:#fff;transition:color .2s ease;white-space:nowrap;padding:clamp(2px,.5vw,6px) clamp(5px,1.5vw,12px)}.nav a:hover{color:#b2fae2}.aboutContainer{margin:0;margin-top:3rem;padding:1rem;height:400px}.info{display:flex;flex-direction:column;align-items:flex-start;max-width:800px}.perfil{display:flex;align-items:center;gap:15px}.perfil img{width:100px;height:100px;box-shadow:0 0 10px #000000b3;border-radius:50%;object-fit:cover;transition:transform .2s}.perfil img:hover{transform:scale(1.1)}.perfil h1{margin:0;font-size:3em}.perfil p{background-color:#b2fae2;font-size:18px;color:#000;font-weight:400;border:1px solid tra;border-radius:20px;padding:10px;transition:border-color .2s ease,background-color .2s ease}.perfil p:hover{background-color:#0fa;border-color:transparent;cursor:default}.text{margin:20px 10px;font-size:22px;line-height:normal;text-align:justify}.text strong{color:#0fa}.text strong a{text-decoration:none;color:#0fa}@media (max-width: 768px){.info{align-items:center;margin:0 auto}.perfil{flex-direction:column;align-items:center;text-align:center}.perfil img{width:80px;height:80px}.perfil h1{font-size:2em}.perfil p{font-size:16px;text-align:center}.text{font-size:18px;text-align:justify;margin:1rem;width:100%}}.buttonsContact{display:flex;margin-top:10px;gap:5px}.linkedinButton{background-color:#0e76a8;font-size:20px;margin-left:7px;padding:10px;border:1px solid transparent;border-radius:20px;box-shadow:0 3px 8px #000000b3;transition:background .3s}.linkedinButton:hover{background-color:#084b99;cursor:pointer}.cvButton{background-color:#ca0f01;font-size:20px;margin-left:7px;padding:10px;border:1px solid transparent;border-radius:20px;box-shadow:0 3px 8px #000000b3;transition:background .3s}.cvButton:hover{background-color:#b30b00;cursor:pointer}.gitHubButton{background-color:#151b23;font-size:20px;margin-left:7px;padding:10px;border:1px solid transparent;border-radius:20px;box-shadow:0 3px 8px #000000b3;transition:background .3s}.gitHubButton:hover{background-color:#0b1016;cursor:pointer}.linkedinButton a,.cvButton a,.gitHubButton a{display:flex;color:#fff;text-decoration:none;align-items:center;gap:8px;transition:background-color .3s}.footer{display:flex;justify-content:space-between;align-items:center;width:100%;padding:10px;font-size:16px;border-top:1px solid #ffffff30}.footer p{margin:0;color:#ffffff71}.footer-right a{display:inline-flex;align-items:center;color:#ffffffc0;text-decoration:none;transition:color .3s}.footer-right a:hover{color:#fff;text-decoration:underline}.footer-right a svg{margin-right:8px}@media (max-width: 600px){.footer{flex-direction:column;text-align:center;gap:8px}.footer-left,.footer-right{width:100%;justify-content:center;display:flex}.footer-right a{font-size:15px}.footer p{font-size:14px}}.projectsCointainer{margin:0 0 40px;padding:1rem}.projectsCointainer h1{display:flex;color:#fff;align-items:center;gap:8px;font-size:clamp(32px,6vw,45px);flex-wrap:wrap}.cardProject{display:flex;flex-direction:row;padding:10px;margin-bottom:20px;align-items:center}.cardProject img{background-color:#b4b4b48c;display:flex;object-fit:cover;flex-shrink:0;width:350px;height:299px;border:2px solid #fff;border-radius:5px;transition:transform .3s ease}.cardProject img:hover{transform:scale(1.05)}.cardProjectText{display:flex;margin-left:20px;flex-direction:column}.cardProjectText h2{font-size:clamp(24px,5vw,50px);margin-top:-5px}.cardProjectText p{margin-top:-15px;margin-left:5px;text-align:justify}.buttons{display:flex;margin-top:10px;gap:10px}.overlay{position:fixed;inset:0;background-color:#000c;z-index:9998}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:transparent;padding:0;border:none;max-width:95vw;max-height:95vh;overflow:hidden;z-index:9999}.close-button{position:absolute;top:20px;left:20px;background:#ce0101;border:2px solid #000;border-radius:10px;color:#fff;padding:.5rem 1rem;cursor:pointer;z-index:10;transition:background .3s;font-size:18px}.close-button:hover{background:red}.modal-image{width:auto;max-width:90vw;max-height:90vh;object-fit:contain;border-radius:8px}.clickable-image{cursor:pointer;transition:transform .2s ease}.clickable-image:hover{transform:scale(1.02)}@media (max-width: 768px){#proyectos{margin-top:3rem}.projectsCointainer h1{justify-content:center;text-align:center}.cardProject{flex-direction:column;align-items:center;text-align:center}.cardProject img{width:100%;max-width:350px;height:auto;margin-bottom:15px}.cardProjectText{margin-left:0}.cardProjectText h2{font-size:30px;margin-top:0}.cardProjectText p{text-align:justify;padding:0 10px}.buttons{flex-wrap:wrap;justify-content:center}.close-button{top:8px;left:8px;padding:.3rem .6rem;font-size:14px;border-radius:6px}}@media (max-width: 430px){#proyectos{margin-top:6rem}.close-button{top:5px;left:5px;padding:.2rem .5rem;font-size:12px;border-radius:4px}}.buttonWithIcon{display:flex;max-width:100px;text-align:center;align-items:center;margin-top:10px;gap:8px;background-color:var(--bg-color, #a8a8a8);box-shadow:0 3px 8px #000000b3;text-decoration:none;color:var(--color, #fff);padding:10px 15px;border-radius:8px;border:none;cursor:var(--cursor, default);transition:transform .3s;font-size:16px}.buttonWithIcon:hover{transform:translateY(-5px);filter:brightness(1.1)}.icon{font-size:20px}
