@import"https://fonts.googleapis.com/css2?family=Doto:wght,ROND@100..900,100&display=swap";:root{--main-bg-color: #080808;--main-color: #fff;--transparent: rgba(255, 255, 255, .01);--light: rgba(255, 255, 255, .03);--border: rgba(255, 255, 255, .1);--border-radius: 100px;--box-border-radius: 25px;--blur-radius: 5px;--font: "Doto", system-ui;--font-weight-light: 300;--font-weight: 500;--font-weight-middle: 700;--font-weight-bold: 900;--accent-color: rgb(255, 160, 0);--accent-color-t: rgba(255, 160, 0, .6);--accent-color-t1: rgba(255, 160, 0, .5);--accent-color-about: rgba(255, 199, 120, .5);--speed: .1s}::-webkit-scrollbar{width:7px}::-webkit-scrollbar-track{background:#000}::-webkit-scrollbar-thumb{background:var(--accent-color-t1);border:2px solid var(--main-bg-color)}::-webkit-scrollbar-thumb:hover{background:var(--accent-color)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font);background-color:var(--main-bg-color);color:var(--main-color);min-height:100vh;display:flex;flex-direction:column}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(/assets/bg.png);background-size:auto;background-repeat:no-repeat;background-position:center;filter:contrast(.75) brightness(.25);z-index:-1;pointer-events:none}#app>:not(.navbar):not(footer){animation:fadein 1s}@keyframes fadein{0%{opacity:0}to{opacity:1}}#app{display:flex;flex-direction:column;min-height:100vh}.content{padding:40px}img{opacity:.5}.navbar{background-color:var(--transparent);display:flex;justify-content:space-between;align-items:center;min-height:4em;padding:15px 30px;position:sticky;top:10px;margin:0 10px;z-index:1002;border:3px solid var(--border);border-radius:var(--border-radius);backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));border-radius:calc(var(--border-radius) - 3px);overflow:visible}.navbar>*{position:relative;z-index:1}.logo a{color:var(--main-color);font-size:24px;font-weight:var(--font-weight-bold);text-decoration:none}.nav-links{display:flex;list-style:none;gap:30px}.nav-links li a,.nav-links li p{color:var(--main-color);text-decoration:none;font-size:24px;font-weight:var(--font-weight);transition:font-weight var(--speed) ease}.nav-links li p strong{font-weight:var(--font-weight-bold)}.nav-links li a:hover{font-weight:var(--font-weight-middle)}.hamburger{display:none;cursor:pointer;z-index:1003}.hamburger div{width:25px;height:3px;background-color:var(--main-color);margin:5px;transition:all .3s ease;border-radius:2px}@media screen and (max-width: 820px){.nav-links{display:none}.hamburger{display:block}}.mobile-menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000a6;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:2000;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2rem;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.mobile-menu-overlay.open{opacity:1;visibility:visible}.mobile-menu-overlay ul{list-style:none;padding:0;text-align:center;display:flex;flex-direction:column;gap:2rem}.mobile-menu-overlay ul li{opacity:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}.mobile-menu-overlay.open ul li{opacity:1;transform:translateY(0)}.mobile-menu-overlay.open ul li:nth-child(1){transition-delay:.1s}.mobile-menu-overlay.open ul li:nth-child(2){transition-delay:.2s}.mobile-menu-overlay.open ul li:nth-child(3){transition-delay:.3s}.mobile-menu-overlay.open ul li:nth-child(4){transition-delay:.4s}.mobile-menu-overlay.open ul li:nth-child(5){transition-delay:.5s}.mobile-menu-overlay a,.mobile-menu-overlay p{color:var(--main-color);font-size:2rem;text-decoration:none;font-weight:var(--font-weight);transition:color .3s ease,transform .3s ease;cursor:pointer}.mobile-menu-overlay a:hover{color:var(--accent-color)}.mobile-menu-overlay p strong{color:var(--accent-color);font-weight:var(--font-weight-bold);text-shadow:0 0 15px var(--accent-color-t)}.mobile-menu-close{position:absolute;top:25px;right:40px;background:none;border:none;color:var(--main-color);font-size:3rem;cursor:pointer;z-index:2002;padding:0;line-height:1;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.button{backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));color:var(--main-color);font-size:clamp(1.2rem,2.5vw,1.5rem);font-weight:var(--font-weight);padding:.75em 1.5em;text-align:center;border:3px solid var(--border);border-radius:var(--border-radius);margin-top:1.5em;text-decoration:none;transition:border-color var(--speed) ease,color var(--speed) ease,font-weight var(--speed) ease;display:inline-block}.button:hover{border-color:var(--light);font-weight:var(--font-weight-bold);color:var(--accent-color)}footer{text-align:center;padding:20px;font-size:16px;border:3px solid var(--border);border-radius:var(--border-radius);font-weight:var(--font-weight);background-color:var(--transparent);color:var(--main-color);backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));margin:auto 10px 10px}.home-hero{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;padding:2em;gap:.5em}.home-hero h1{font-weight:var(--font-weight-bold);text-align:center;font-size:clamp(2.5rem,8vw,5rem);margin:0}.hero-sublogo{text-align:center;display:block;margin-top:1.5em;font-size:clamp(1rem,2.5vw,1.5rem);max-width:90%;font-weight:var(--font-weight-middle)}.hero-buttons{display:flex;gap:1em}.about{display:block;margin-top:auto;margin-bottom:auto}.about h1{font-size:clamp(2rem,5vw,3rem);margin:.5em;text-align:center;font-weight:var(--font-weight-bold)}.about p{font-size:clamp(1rem,2.5vw,1.5rem);margin:.5em;text-align:center;font-weight:var(--font-weight-middle)}.about a{color:var(--main-color);text-decoration:underline}.about fieldset{border:3px solid var(--border);position:relative;background-color:var(--transparent);backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));overflow:visible;line-height:40px;padding:1em;max-width:calc(100% - 2em);margin:.5em auto;transition:border var(--speed) ease;cursor:pointer;border-radius:var(--box-border-radius)}.about fieldset:hover{border:3px solid var(--light)}.about .fieldset-content{max-height:0;overflow:hidden;transition:max-height .3s ease}.about fieldset.open .fieldset-content{max-height:none}.about fieldset.open legend{font-weight:var(--font-weight-bold)}.about fieldset p{font-size:clamp(1rem,2.5vw,1.5rem);margin:.25em;text-align:left;font-weight:var(--font-weight)}.about fieldset p:first-of-type{margin-top:0}.about fieldset p strong{font-weight:var(--font-weight-bold);color:var(--accent-color-about)}.about fieldset em{color:var(--accent-color-t1)}.about fieldset h2{font-weight:var(--font-weight-bold)}.about a{color:var(--main-color);text-decoration:underline;font-weight:var(--font-weight)}.about code{background-color:var(--light);padding:.2em;border-radius:6px;font-family:var(--font)}.about fieldset legend{font-size:clamp(1rem,2.5vw,1.5rem);margin-left:2%;color:var(--main-color);font-weight:var(--font-weight-middle);padding:0 5px}.projects{display:block;margin-top:auto;margin-bottom:auto}.projects h1{font-size:clamp(2rem,5vw,3rem);margin:.5em;text-align:center;font-weight:var(--font-weight-bold)}.projects>p{font-size:clamp(1rem,2.5vw,1.5rem);margin:.5em;text-align:center;font-weight:var(--font-weight-middle)}.projects .list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;max-width:1400px;margin:0 auto;padding:20px 10px;align-items:stretch}.project{background-color:var(--transparent);backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));border:3px solid var(--border);display:flex;flex-direction:column;padding:16px;width:100%;transition:border var(--speed) ease;border-radius:var(--box-border-radius)}.project:hover{border:3px solid var(--light)}.project p{text-align:left;font-weight:var(--font-weight)}.project .title{font-size:clamp(1.25rem,2.5vw,1.5rem);font-weight:var(--font-weight-bold);padding-bottom:5px}.project .desc{font-size:clamp(1rem,2.5vw,1.5rem);font-weight:var(--font-weight);padding-bottom:5px}.project .buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}.project .buttons .button{margin-top:0}.contact{display:block;margin-top:auto;margin-bottom:auto}.contact h1{font-size:clamp(2rem,5vw,3rem);margin:.5em;text-align:center;font-weight:var(--font-weight-bold)}.contact p{font-size:clamp(1rem,2.5vw,1.5rem);margin:.5em;text-align:center;font-weight:var(--font-weight-middle)}.contact a{color:var(--main-color);text-decoration:underline}.contact code{background-color:var(--light);padding:.2em;border-radius:10px;font-family:var(--font);cursor:pointer}.contact code.active{cursor:not-allowed}.contact fieldset{border:3px solid var(--border);position:relative;padding:1em;max-width:1200px;margin:.5em auto;transition:border var(--speed) ease;background-color:var(--transparent);backdrop-filter:blur(var(--blur-radius));-webkit-backdrop-filter:blur(var(--blur-radius));border-radius:var(--box-border-radius)}.contact fieldset:hover{border:3px solid var(--light)}.contact fieldset p:first-of-type{margin-top:0}.contact fieldset legend{font-size:clamp(1rem,2.5vw,1.5rem);margin-left:auto;margin-right:auto;color:var(--main-color);font-weight:var(--font-weight-middle);padding:0 5px}.error-hero{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;padding:2em;gap:.5em}.error-logo{width:60vw;max-width:800px;min-width:160px;display:block;margin-left:auto;margin-right:auto}.error-sublogo{text-align:center;display:block;margin-top:1.5em;font-size:clamp(1rem,2.5vw,1.5rem);max-width:90%;font-weight:var(--font-weight-middle)}.error-buttons{display:flex;gap:1em}
