:root{--primary-color: hsl(0, 0%, 96%);--secondary-color: #333;--tertiary-color: #764ba2;--bg-header: #222;--bg-cards: #ffffff;--bg-icons: #3282d7}*{scroll-behavior:smooth;margin:0;padding:0;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,open sans,helvetica neue,sans-serif}body{background-color:var(--bg-header);color:var(--primary-color);line-height:1.6;letter-spacing:.5px;overscroll-behavior:contain}header{padding:1rem;position:fixed;z-index:10;width:100%;height:13dvh;top:0;display:flex;justify-content:space-between;align-items:center;padding:1rem 5%;background-color:#121212b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1);color:var(--bg-cards)}:is(.projects,.contact,.about) h2{letter-spacing:1px;text-transform:uppercase;font-weight:600;font-size:20px}.logo a{color:#3282d7;font-size:1.5rem;font-weight:700;text-decoration:none}.nav-links{list-style:none;display:flex;gap:1.5rem}.nav-links a{color:#fffc;text-decoration:none;font-size:1.2rem;font-weight:300}.nav-links a:hover{color:var(--bg-icons)}.about,.projects,.contact{padding:10% 5%;text-align:center}.hero{height:100dvh;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--bg-cards)}.hero-content{height:100dvh;margin-top:40dvh;z-index:5;text-align:left;color:var(--primary-color)}.hero-content h1{padding:20px;font-size:2rem;font-weight:400;line-height:1.1}.hero-content span{color:var(--bg-icons)}.job-title{font-size:1.8rem;padding:10px 20px;font-weight:400}.stack-text{font-size:1.2rem;padding:0 20px 30px;font-weight:100}.hero-content .btn{display:inline-block;margin-top:1rem;margin-left:20px;padding:.5rem 1rem;background-color:var(--bg-icons);color:var(--primary-color);text-decoration:none;font-size:1.15rem;font-weight:400;border-radius:50px;transition:.2s ease}.hero-content .btn:hover{background-color:var(--bg-icons);box-shadow:0 0 20px #3b82f64d;color:var(--primary-color);transform:scale(1.02);cursor:pointer;border:solid 2px var(--primary-color)}#about{padding-top:15dvh;display:grid;min-height:100dvh}.textBox-mobileView{border-radius:8px;box-shadow:0 0 20px #3b82f64d;padding:10px;margin-top:20px}.about h2{margin-top:20px}.about p{padding:5px 10px;font-size:1.2rem;text-align:left;font-weight:300;line-height:1.6}.about-illustration{display:none}.strong{color:var(--bg-icons);font-weight:600}.projects{padding-top:15dvh;min-height:100dvh}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(315px,1fr));gap:4rem;margin-top:5dvh}.project-card{display:flex;flex-direction:column;background:var(--bg-cards);background-color:var(--secondary-color);color:var(--primary-color);padding:1.5rem;box-shadow:0 4px 6px #0000001a;box-shadow:0 0 20px #3b82f64d;border-radius:8px;gap:15px}.project-card img{width:100%;height:auto;object-fit:fill;overflow:hidden;border-radius:8px}.tech-div{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;width:100%;gap:10px}.technologie{font-size:12px;padding:.2dvh .7dvh;background-color:#ffffff1a;border:solid 1px #515456;border-radius:50px}.project-btn{padding:.5rem 1rem;border-radius:50px;background:#3282d7;border:solid 2px #3282d7;text-decoration:none;color:var(--primary-color);transition:.2s ease;font-weight:600;margin:auto}.project-btn:hover{background-color:var(--bg-icons);border:solid 2px var(--primary-color);box-shadow:0 0 20px #3b82f64d;color:var(--primary-color);transform:scale(1.02);cursor:pointer}.iconsDiv{width:50%;font-size:16px;display:flex;gap:35px;margin:35px auto 25px;justify-content:center}.socialIcono{font-size:35px;height:1.3em;width:1.3em;color:#ffffff7e;transition:transform .3s ease}.socialIcono:hover{color:var(--bg-icons);transform:scale(1.3)}.contact a{color:#ffffff7e;font-weight:700;font-size:20px;text-decoration:none}.contact a:hover{color:var(--bg-icons)}footer{background:var(--bg-header);color:var(--bg-cards);text-align:center;padding:1rem;font-size:14px}footer a{text-decoration:none;color:var(--primary-color);font-size:14px;cursor:pointer}@media(min-width:769px){header{height:11dvh}.projects{padding:8% 10%;text-align:center}.about,.contact{padding:10%;text-align:center}.hero-content{height:78dvh;margin-top:25dvh}.hero-content h1{font-size:3rem}.job-title{font-size:3.5rem}.stack-text{font-size:1.8rem}.hero-content .btn{padding:.5rem 1rem;border:solid 2px var(--bg-icons);color:var(--primary-color);text-decoration:none;font-size:1.5rem;font-weight:400;border-radius:50px;transition:.2s ease;margin-left:20px}#about{padding-top:10%;place-items:center;display:grid;grid-template-columns:35% 1fr;gap:20px}#about h2{grid-column:2/3;justify-self:center;align-self:last baseline}.textBox-mobileView{border:none;box-shadow:none;margin-top:0}.about p{font-size:1.3rem;font-weight:200;text-align:left;padding:0 0 0 40px}.about-illustration{display:block;width:100%;max-width:400px;height:auto}.circle-frame{width:400px;height:400px;border-radius:50%;border:4px solid #3282d7;overflow:hidden;background-color:#2a2a2a;display:flex;justify-content:center;align-items:center;box-shadow:0 0 20px #3b82f64d}.circle-frame img{width:90%;object-fit:cover}.project-grid{grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.project-card{display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:10px;transition:transform .3s ease}.project-card h3{height:30px}.project-card .tech-div{height:50px}.project-card .text-card{height:150px;text-align:left}.project-card:hover{transform:scale(1.02)}.project-btn{display:inline-block;padding:.5rem 1rem;border-radius:50px;background:#3282d7;border:solid 2px #3282d7;text-decoration:none;color:var(--primary-color);transition:.2s ease;font-weight:400}.project-btn:hover{background-color:var(--bg-icons);box-shadow:0 0 20px #3b82f64d;color:var(--primary-color);transform:scale(1.02);cursor:pointer;border:solid 2px var(--primary-color)}#contact{padding-top:100px;padding-bottom:100px;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);color:var(--bg-cards)}.iconsDiv{width:50%;font-size:16px;display:flex;gap:50px;margin:35px auto 25px;justify-content:center}.socialIcono{font-size:35px;height:1.3em;width:1.3em;color:#ffffff7e;transition:transform .3s ease}.socialIcono:hover{color:var(--bg-icons);transform:scale(1.3)}}.shapes-wrapper{position:relative;width:100%;height:100dvh;overflow:hidden;background-color:var(--bg-header)}.shapes-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:.35}.desktop-bg{display:block}.mobile-bg{display:none}@keyframes girarIzquierda{50%{transform:rotate(-360deg)}}@keyframes girarDerecha{50%{transform:rotate(360deg)}}.violetaA,.violetaB,.gris,.verde,.turquesa,.purpura,.azulgris,.azulgrisB{transform-box:fill-box}.violetaA{transform:translate(50px,70px) rotate(180deg);animation:girarIzquierda 15s linear infinite}.violetaB{transform:translate(-30px,10px) rotate(180deg);animation:girarIzquierda 15s linear infinite}.azulgris{transform:translate(50px,40px) rotate(180deg);animation:girarDerecha 15s linear infinite}.azulgrisB{transform:translate(-40px,30px) rotate(180deg);animation:girarIzquierda 15s linear infinite}.purpura{transform:translate(40px,35px) rotate(180deg);animation:girarDerecha 15s linear infinite}.turquesa{transform:translateY(45px) rotate(180deg);animation:girarDerecha 15s linear infinite}.verde{transform:translate(10px,-10px) rotate(180deg);animation:girarIzquierda 15s linear infinite}.gris{transform:translate(15px,-35px) rotate(180deg);animation:girarDerecha 15s linear infinite}@media(max-width:768px){.desktop-bg{display:none}.mobile-bg{display:block}.shapes-wrapper{aspect-ratio:1 / 1}.violeta,.rosa,.verde,.turquesa{transform:translate(-10px) scale(1.2);animation-duration:5s;opacity:1}}
