@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.reveal{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translateY(36px)}.reveal.visible{opacity:1;transform:translateY(0)}.reveal.delay-1{transition-delay:80ms}.reveal.delay-2{transition-delay:.16s}.reveal.delay-3{transition-delay:.24s}.reveal.delay-4{transition-delay:.32s}.reveal.delay-5{transition-delay:.4s}.reveal.delay-6{transition-delay:.48s}.reveal.from-top{transform:translateY(-24px)}.reveal.from-top.visible{transform:translateY(0)}.reveal.fade-only{transform:none}h1,h2,h3,h4,h5,h6,p{margin:0}*,:before,:after{box-sizing:border-box}:root{--page-padding:1.2rem 10rem;--gap:1rem;--padding:1.2rem;--border-radius:8px;--border-radius-lg:16px;--dark-shades:#0d1117;--surface:#161b22;--surface-elevated:#21262d;--main-brand:#cc57c0;--main-brand-light:#e879e0;--dark-accent:#8b21a0;--light-shades:#e6edf3;--text-muted:#8b949e;--glass-bg:#ffffff0a;--glass-border:#ffffff14}@media screen and (width<=768px){:root{--page-padding:1rem 1.5rem}}html{scroll-behavior:smooth}body{background-color:var(--dark-shades)}.scroll-progress-bar{width:var(--scroll-progress,0%);background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light));z-index:9999;pointer-events:none;height:3px;box-shadow:0 0 10px var(--main-brand);transition:width .1s linear;position:fixed;top:0;left:0}.cursor-glow{pointer-events:none;z-index:40;background:radial-gradient(600px circle at var(--cursor-x,50%) var(--cursor-y,50%), #cc57c021, transparent 70%);position:fixed;inset:0}@keyframes shakeMenu{0%{transform:rotateX(-90deg)}70%{transform:rotateX(20deg)}to{transform:rotateX(0)}}@keyframes moveToLeft{0%{transform:translate(100%)}to{transform:translate(-100%)}}@keyframes moveToLeftContinuous{0%{transform:translate(0%)}to{transform:translate(-200%)}}@keyframes moveToRight{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes moveToRightContinuous{0%{transform:translate(-200%)}to{transform:translate(0%)}}.navbar-container{color:var(--light-shades);letter-spacing:.3px;z-index:1000;border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;width:100%;padding:1rem 10rem;font-size:1rem;font-weight:500;display:flex;position:sticky;top:0;left:0}.navbar-container:before{content:"";-webkit-backdrop-filter:blur(20px);z-index:-1;background-color:#0d1117e0;position:absolute;inset:0}@media screen and (width<=768px){.navbar-container{padding:1rem 1.5rem}}.navbar-container .name{justify-content:space-between;align-items:center;width:100%;display:flex}@media screen and (width>=769px){.navbar-container .name{width:auto}}.navbar-container .name p{-webkit-user-select:none;user-select:none;background:linear-gradient(135deg, var(--main-brand), var(--main-brand-light));-webkit-text-fill-color:transparent;color:#0000;letter-spacing:.5px;-webkit-background-clip:text;background-clip:text;font-size:1.15rem;font-weight:700;display:inline-block}.navbar-container .links-container{gap:2rem;animation:.5s ease-in-out shakeMenu;display:flex}.navbar-container .links-container a{color:var(--text-muted);font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s;position:relative}.navbar-container .links-container a:after{content:"";background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light));border-radius:2px;width:0;height:2px;transition:width .3s;position:absolute;bottom:-3px;left:0}.navbar-container .links-container a:hover{color:var(--light-shades)}.navbar-container .links-container a:hover:after{width:100%}.navbar-container .hamburger-btn{cursor:pointer;border-radius:var(--border-radius);background:0 0;border:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:8px;transition:background .2s;display:flex}.navbar-container .hamburger-btn:hover{background:#ffffff0f}.navbar-container .hamburger-btn span{background:#e6edf3b3;border-radius:2px;width:22px;height:2px;transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .25s,background .25s;display:block}.navbar-container .hamburger-btn.open span:first-child{background:var(--main-brand-light);transform:translateY(7px)rotate(45deg)}.navbar-container .hamburger-btn.open span:nth-child(2){opacity:0;transform:scaleX(0)}.navbar-container .hamburger-btn.open span:nth-child(3){background:var(--main-brand-light);transform:translateY(-7px)rotate(-45deg)}.mobile-overlay{z-index:999;visibility:hidden;opacity:0;background:#0d1117fa;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100vw;height:100vh;padding:6rem 2.5rem 3rem;transition:opacity .35s,visibility .35s;display:flex;position:fixed;top:0;left:0}.mobile-overlay.open{visibility:visible;opacity:1}.mobile-overlay:before{content:"";background:linear-gradient(to bottom, transparent, var(--main-brand) 25%, var(--main-brand-light) 75%, transparent);opacity:.35;width:1px;position:absolute;top:6rem;bottom:3rem;left:2.5rem}.mobile-nav{flex-direction:column;gap:.15rem;padding-left:1.75rem;display:flex}.mobile-nav-link{color:var(--light-shades);letter-spacing:-.5px;opacity:0;align-items:baseline;gap:.85rem;padding:.5rem 0;font-size:2.4rem;font-weight:700;text-decoration:none;transition:opacity .4s,transform .4s,color .2s;display:flex;transform:translate(30px)}.mobile-overlay.open .mobile-nav-link{opacity:1;transition-delay:calc(.1s + var(--i) * 70ms);transform:translate(0)}.mobile-nav-link:hover{color:var(--main-brand-light)}.mobile-nav-link:hover .mobile-nav-index{color:var(--main-brand)}.mobile-nav-index{color:var(--text-muted);letter-spacing:1.5px;flex-shrink:0;font-size:.75rem;font-weight:500;transition:color .2s}@keyframes breatheGlow{0%,to{border-color:#cc57c04d;box-shadow:0 8px 32px #00000080,0 0 0 1px #ffffff0a,0 0 40px #cc57c026}50%{border-color:#cc57c0bf;box-shadow:0 8px 48px #00000080,0 0 0 1px #ffffff14,0 0 80px #cc57c080}}@keyframes shimmerText{0%{background-position:0%}to{background-position:300%}}.landing-screen .typewritter-container{z-index:1;border-radius:var(--border-radius-lg);text-align:center;border:1px solid #cc57c040;flex-direction:column;justify-content:center;align-items:center;min-width:340px;padding:2.5rem 3.5rem;animation:4s ease-in-out infinite breatheGlow;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.landing-screen .typewritter-container:before{content:"";border-radius:var(--border-radius-lg);-webkit-backdrop-filter:blur(16px);z-index:-1;background:#0d111799;position:absolute;inset:0}@media screen and (width<=768px){.landing-screen .typewritter-container{min-width:280px;padding:1.75rem 2rem;top:35%}}.landing-screen .typewritter-container .typewritter-title{letter-spacing:3px;background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light), #fff, var(--main-brand-light), var(--main-brand));-webkit-text-fill-color:transparent;color:#0000;will-change:background-position;background-size:300%;-webkit-background-clip:text;background-clip:text;margin-bottom:.75rem;font-size:3.5rem;font-weight:800;animation:5s linear infinite shimmerText;display:inline-block}@media screen and (width<=768px){.landing-screen .typewritter-container .typewritter-title{letter-spacing:2px;font-size:2rem}}.animated-background-section{background-color:var(--dark-shades);flex-direction:column;width:100%;height:100vh;display:flex;position:relative;overflow:hidden}.animated-background-section .animated-row{white-space:nowrap;width:100%;padding:15px 0;display:flex;position:relative;top:-60%;left:-5%;transform:rotate(-30deg)}.animated-background-section .animated-row .row-1{animation:80s linear -80s infinite moveToLeft}.animated-background-section .animated-row .row-2{animation:80s linear -40s infinite moveToLeftContinuous}.animated-background-section .animated-row:nth-child(2n) .row-1{animation:80s linear -80s infinite moveToRight}.animated-background-section .animated-row:nth-child(2n) .row-2{animation:80s linear -40s infinite moveToRightContinuous}.animated-background-section svg{fill:#cc57c012;width:150px;height:150px;margin:0 5px;transition:fill .2s,filter .2s}.animated-background-section svg:hover{fill:var(--main-brand);filter:drop-shadow(0 0 12px var(--main-brand))}#typewritter-text{text-align:center;resize:none;color:var(--light-shades);opacity:.9;background:0 0;border:none;outline:none;width:100%;font-family:Inter,sans-serif;font-size:1.35rem;font-weight:400;overflow:auto}@media screen and (width<=768px){#typewritter-text{height:5rem;font-size:1.05rem}}.project{cursor:pointer;border:1px solid var(--glass-border);background:0 0;border-radius:12px;padding:0;transition:transform .3s,box-shadow .3s,border-color .3s;display:block;position:relative;overflow:hidden}.project:hover{border-color:var(--main-brand);box-shadow:0 16px 40px #00000080}.project img{object-fit:cover;width:320px;height:220px;transition:transform .4s;display:block}.project:hover img{transform:scale(1.06)}.project-overlay{opacity:0;background:linear-gradient(#0000 0%,#0d111780 50%,#0d1117f2 100%);flex-direction:column;justify-content:flex-end;padding:1.25rem;transition:opacity .3s;display:flex;position:absolute;inset:0}.project:hover .project-overlay{opacity:1}.project-title{color:var(--light-shades);text-align:left;margin-bottom:.3rem;font-size:1.05rem;font-weight:600}.project-cta{color:var(--main-brand);text-align:left;font-size:.8rem;font-weight:500}.modal-backdrop{cursor:default;z-index:0;background:0 0;border:none;width:100%;height:100%;position:fixed;inset:0}.modal{-webkit-backdrop-filter:blur(10px);z-index:9999;width:100%;height:100%;max-width:unset;max-height:unset;color:var(--light-shades);background:#000000bf;border:none;justify-content:center;align-items:center;padding:0;display:flex;position:fixed;inset:0}.modal-card{z-index:1;background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--border-radius-lg);width:440px;max-width:92vw;position:relative;overflow:hidden;box-shadow:0 32px 80px #000000b3,0 0 0 1px #ffffff0a}.modal-card-hero{height:260px;position:relative;overflow:hidden}.modal-card-hero img{object-fit:cover;width:100%;height:100%;display:block}.modal-card-hero-overlay{background:linear-gradient(#0000 0%,#161b2266 45%,#161b22 100%);position:absolute;inset:0}.modal-card-title{color:var(--light-shades);letter-spacing:.3px;text-transform:capitalize;font-size:1.5rem;font-weight:700;position:absolute;bottom:1.25rem;left:1.5rem}.modal-card-close{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--glass-border);color:var(--text-muted);cursor:pointer;background:#0d1117a6;border-radius:50%;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.75rem;line-height:1;transition:background .2s,color .2s;display:flex;position:absolute;top:1rem;right:1rem}.modal-card-close:hover{color:var(--light-shades);background:#ffffff1f}.modal-card-body{flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.modal-card-body p{color:var(--text-muted);font-size:.9rem;line-height:1.7}.modal-card-cta{text-align:center;background:linear-gradient(135deg, var(--main-brand), var(--dark-accent));color:#fff;border-radius:var(--border-radius);letter-spacing:.3px;padding:.75rem 1.5rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:opacity .2s,transform .2s,box-shadow .2s;display:block}.modal-card-cta span{transition:transform .2s;display:inline-block}.modal-card-cta:hover{opacity:.88;transform:translateY(-2px);box-shadow:0 8px 24px #cc57c073}.modal-card-cta:hover span{transform:translate(3px)}.about-me{padding:var(--page-padding);background-color:var(--dark-shades);justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}@media screen and (width<=600px){.about-me{flex-direction:column;padding-top:3rem;padding-bottom:3rem}}.about-me .text-container{scrollbar-width:thin;scrollbar-color:var(--main-brand) transparent;flex-direction:column;justify-content:flex-start;align-items:center;max-width:75%;height:100vh;padding:2rem 1.5rem;display:flex;overflow-y:scroll}.about-me .text-container::-webkit-scrollbar{width:4px}.about-me .text-container::-webkit-scrollbar-track{background:0 0}.about-me .text-container::-webkit-scrollbar-thumb{background:var(--main-brand);border-radius:4px}@media screen and (width<=600px){.about-me .text-container{order:1;max-width:100%}}.about-me .text-container h2{color:var(--light-shades);align-self:flex-start;margin-bottom:2rem;padding-bottom:.75rem;font-size:2rem;font-weight:700;position:relative}.about-me .text-container h2:after{content:"";background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light), transparent);border-radius:2px;width:3rem;height:3px;position:absolute;bottom:0;left:0}.about-me .text-container p{text-align:justify;color:var(--text-muted);align-self:flex-start;margin-bottom:1.2rem;font-size:.95rem;line-height:1.8}.about-me .text-container img{object-fit:cover;width:18rem;height:18rem;box-shadow:0 0 0 4px var(--dark-shades), 0 0 0 7px var(--main-brand), 0 12px 40px #cc57c04d;border-radius:50%;margin-top:4%;transition:box-shadow .4s;display:block}.about-me .text-container img:hover{box-shadow:0 0 0 4px var(--dark-shades), 0 0 0 7px var(--main-brand-light), 0 12px 56px #e879e073}@media screen and (width<=600px){.about-me .text-container img{order:2;width:14rem;height:14rem;margin-top:10%}}.about-me .arrow{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;padding:0;transition:transform .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.about-me .arrow img{filter:invert()brightness(.5);width:100%;height:100%;transition:filter .2s}.about-me .arrow:hover:not(.disabled) img{filter:invert(.6)sepia()saturate(4)hue-rotate(260deg)brightness(1.1)}.about-me .arrow:hover:not(.disabled){transform:translateY(-50%)scale(1.15)}.about-me .right{right:10%}@media screen and (width<=600px){.about-me .right{right:1%}}.about-me .left{left:10%}@media screen and (width<=600px){.about-me .left{left:1%}}.about-me .disabled{opacity:.15;cursor:not-allowed}.technologies{background-color:var(--surface);color:var(--light-shades);flex-direction:column;justify-content:center;align-items:center;gap:2.5rem;padding:5rem 10rem;display:flex}@media screen and (width<=768px){.technologies{gap:2rem;padding:3rem 1.5rem}}.technologies h1{text-align:center;color:var(--light-shades);padding-bottom:1rem;font-size:2.2rem;font-weight:700;position:relative}.technologies h1:after{content:"";background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light));border-radius:2px;width:4rem;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.technologies>p{color:var(--text-muted);font-size:.95rem}.technologies>p a{color:var(--main-brand);font-weight:500;text-decoration:none;transition:color .2s}.technologies>p a:hover{color:var(--main-brand-light)}.technologies-container{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.25rem;width:100%;display:grid}.technologies-container img{object-fit:contain;width:72px;height:72px;margin-bottom:.5rem;transition:transform .3s}.technologies-frames{border:1px solid var(--glass-border);background:var(--glass-bg);border-radius:12px;flex-direction:column;align-items:center;padding:2rem 1.25rem;transition:border-color .3s,transform .3s,box-shadow .3s;display:flex}.technologies-frames h3{color:var(--text-muted);letter-spacing:.3px;text-transform:uppercase;margin-top:.5rem;font-size:.85rem;font-weight:600}.technologies-frames:hover{border-color:var(--main-brand);transform:translateY(-5px);box-shadow:0 8px 24px #cc57c026}.technologies-frames:hover img{transform:scale(1.1)}.technologies-frames:hover h3{color:var(--light-shades)}.background-animation{background:0 0;animation:none}.portfolio{background-color:var(--dark-shades);flex-direction:column;align-items:center;gap:2.5rem;min-height:30vh;padding:5rem 10rem;display:flex}@media screen and (width<=768px){.portfolio{gap:2rem;padding:3rem 1.5rem}}@media screen and (width<=469px){.portfolio{min-height:35vh}}.portfolio h1{text-align:center;color:var(--light-shades);padding-bottom:1rem;font-size:2.2rem;font-weight:700;position:relative}.portfolio h1:after{content:"";background:linear-gradient(90deg, var(--main-brand), var(--main-brand-light));border-radius:2px;width:4rem;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.portfolio-container{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));justify-items:center;gap:1.5rem;width:100%;padding:0;display:grid}.contact{background-color:var(--dark-shades);border-top:1px solid var(--glass-border);justify-content:space-between;align-items:center;min-height:7rem;padding:2.5rem 10rem;display:flex}@media screen and (width<=768px){.contact{flex-direction:column;justify-content:center;align-items:flex-start;gap:1.25rem;min-height:9rem;padding:2rem 1.5rem}}.contact-name{background:linear-gradient(135deg, var(--main-brand), var(--main-brand-light));-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:.2rem;font-size:1.05rem;font-weight:700;display:inline-block}.contact-location{color:var(--text-muted);font-size:.875rem}.contact-link{color:var(--text-muted);font-size:.9rem}.contact a{color:var(--main-brand);font-weight:500;text-decoration:none;transition:color .2s}.contact a:hover{color:var(--main-brand-light)}
