:root{color-scheme:light dark;--maxwidth: 1440px;--grey01: #191919;--grey02: #363636;--grey03: #666666;--grey04: #a7a7a7;--grey05: #cccccc;--green01: #018c0f;--green02: #d7ffe0;--blue01: #38434f;--white: #eeeeee;--gradientMid: #d6b945;--gradientMid: #637351;--gradientMid: #6c7b5b;--fontWeightLight: 300;--fontWeightRegular: 400;--fontWeightMedium: 500;--fontWeightSemiBold: 600;--fontWeightBold: 700;--gradient: linear-gradient( 90deg, var(--background) 0%, var(--gradientMid) 30%, var(--gradientMid) 70%, var(--background) 100% );--gradientSimple: linear-gradient( -90deg, var(--gradientMid) 0%, var(--colorH2) 100% );--fontSizeH1: clamp(2.4rem, calc(3.125vw + 14px) , 5.4rem);--fontSizeH2: clamp(2rem, calc(2.5vw + 12px) , 4.4rem);--fontSizeH3: clamp(1.8rem, calc(1.45vw + 13.333px) , 3.2rem);--fontSizeH4: clamp(1.6rem, calc(1.25vw + 12px) , 2.8rem);--fontSizeP: clamp(1.2rem, calc(.625vw + 10px) , 1.8rem);--fontSizeSmall: clamp(1rem, calc(.625vw + 8px) , 1.6rem);--background: light-dark(var(--white), var(--grey01));--reversedBackground: light-dark(var(--grey01), var(--white));--colorH1: light-dark(var(--blue01), var(--grey05));--colorH2: light-dark(var(--blue01), var(--grey05));--colorH3: light-dark(var(--grey03), var(--grey04));--colorH4: light-dark(var(--blue01), var(--grey05));--colorP: light-dark(var(--grey03), var(--grey05));--colorMenuInactive: light-dark(var(--grey04), var(--grey03));--colorPrimaryMenu: light-dark(var(--grey03), var(--grey04));--colorHoverMenu: light-dark(var(--blue01), var(--white));--colorFooter: light-dark(var(--blue01), var(--grey04));--colorBorder: light-dark(var(--blue01), var(--grey03));--colorLinkedIn: light-dark(#d4cbbc, var(--blue01))}html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}@media (prefers-color-scheme: dark){html[data-theme=light] .light{display:none}html[data-theme=light] .dark{display:block}.dark{display:none}}@media (prefers-color-scheme: light){html[data-theme=dark] .light{display:block}html[data-theme=dark] .dark,.light{display:none}}h1,h2,h3,h4{cursor:default}h1{color:var(--colorH1);font-weight:var(--fontWeightBold);line-height:calc(var(--fontSizeH1) + .5rem);font-size:var(--fontSizeH1)}h2{font-weight:var(--fontWeightBold);color:var(--colorH2);line-height:calc(var(--fontSizeH2) + .5rem);font-size:var(--fontSizeH2)}h3{color:var(--colorH3);font-weight:var(--fontWeightRegular);line-height:calc(var(--fontSizeH3) + .5rem);font-size:var(--fontSizeH3)}h4{color:var(--colorH4);font-weight:var(--fontWeightMedium);line-height:calc(var(--fontSizeH4) + .5rem);font-size:var(--fontSizeH4)}p,small,strong{color:var(--colorP);font-weight:var(--fontWeightLight);line-height:calc(var(--fontSizeP) + .75rem);font-size:var(--fontSizeP);transition-duration:.25s;transition-property:background-color,color}small{color:var(--colorH1);line-height:calc(var(--fontSizeSmall) + .75rem);font-size:var(--fontSizeSmall);margin:0 auto}strong{color:var(--colorH1);font-weight:var(--fontWeightMedium);margin:0 auto}hr{width:100%;max-width:var(--maxwidth);background:var(--gradient);border:none;height:2.5px;margin:0;z-index:9}svg{display:block}a svg path{stroke:var(--colorPrimaryMenu)}.index-html #sectionBanner #avatar,.index-html .stackSvgContainer .stackCard,.logo *,img{-webkit-user-select:none;user-select:none}*{box-sizing:border-box;transition-duration:.25s;transition-property:background-color,color}html{font-size:62.5%;font-family:Poppins,Roboto,sans-serif;font-optical-sizing:auto}body{scrollbar-color:var(--colorH2) var(--background);background-color:var(--background);color:var(--colorP);font-size:62.5%;font-family:Poppins,Roboto,sans-serif;font-optical-sizing:auto}body{width:100%;max-width:var(--maxwidth);margin:0 auto}app-root{width:100%}main{margin:0}main>section{padding:0 5%;margin:7.5vh 0;margin:7.5svh 0}section>header>*{margin:1% 0}@keyframes pop-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.01)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes pop{0%{transform:scale(1)}30%{transform:scale(1.4)}to{transform:scale(1.2)}}@media (hover: hover) and (pointer: fine){.stackCard svg{transform:rotate(45deg) translate(-40%,40%);filter:blur(4px);transition:filter .3s,transform .15s ease-in-out}#sectionStack .stackCard:hover svg{filter:blur(0px);transform:translate(0)}.projectBox{transition:transform .2s,opacity .2s ease-out}.projectsContainer:has(.projectBox:not(:only-child):hover)>.projectBox:not(:hover){opacity:.5;transform:scale(.95)}}nav ul li a,nav ul li a p,.underline-animation{position:relative}nav ul li a p:before,nav ul li a:not(:has(svg)):before,.underline-animation:before{content:"";position:absolute;left:0;bottom:-3px;width:0;height:3px;background-color:var(--gradientMid);transition:width .25s ease-in-out;border-radius:20px}nav ul li a.active:before,nav ul li a:hover:before,nav ul li a p:hover:before,nav ul li a:focus:before,nav ul li a p:focus:before,.underline-animation:hover:before,.underline-animation:focus:before{width:100%}.inactive{color:var(--colorMenuInactive)!important;cursor:help}.techStackSVG .stackSVG,.projectLinks .stackSVG{fill:var(--reversedBackground)}.socials a:hover p,.socials a:focus p{color:var(--colorHoverMenu);text-shadow:0px 0px 1px var(--colorHoverMenu)}.primaryHeader button.toggle:hover svg{fill:var(--colorH2)}nav ul li a.active:not(:hover){color:var(--gradientMid)!important}.svgFitBgFill{fill:var(--background)!important}.svgFitBgStroke{stroke:var(--background)!important}.svgBgFill{fill:var(--reversedBackground)!important}.svgBgStroke{stroke:var(--reversedBackground)!important}.icon svg>*{transition:stroke .1s ease-in}.LinkedIn-icon:hover svg>*,.LinkedIn-icon:focus svg>*{stroke:#3c82f580!important}.GitHub-icon:hover svg>*,.GitHub-icon:focus svg>*{stroke:#6f73c3!important}@media (max-width: 768px){.primaryHeader .columnRight .menu.Large{display:none}#sectionProjects .projectsContainer{justify-content:space-evenly}}@media (max-width: 768px) and (max-width: 549px){#sectionBanner{height:75vh;height:75svh}app-linkedin-card{display:none}.content{width:100%!important}}@media (min-width: 769px) and (max-width: 1023px){.primaryHeader .mobile-menu-button .toggle,#menuDrop,.menu.Small,.hrHeader{visibility:hidden!important;display:none!important}}@media (min-width: 1024px){.primaryHeader .mobile-menu-button .toggle,#menuDrop,.menu.Small,.hrHeader{visibility:hidden!important;display:none!important}}
