@import"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap";*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;box-sizing:border-box;margin:0;padding:0;scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;font-family:Inter,sans-serif}:root{--bg: #111111;--white: #fff6e5;--gray: #c4c1ba;--blue: #5d7ec5;--pink: #c44d6a}html{font-size:clamp(16px,4vw,24px)}body{background:var(--bg);overflow-x:hidden}::-webkit-scrollbar-track{border-radius:10px;background-color:var(--bg)}::-webkit-scrollbar{width:12px;background-color:var(--bg)}::-webkit-scrollbar-thumb{border-radius:10px;background-color:var(--white)}.App{position:relative}.container{height:100vh;position:relative}.container h1{font-size:clamp(2.8rem,5vw,10rem);color:var(--white);position:absolute;left:50%;top:50%;translate:-50% -50%;width:clamp(0rem,80vw,48rem);z-index:3}.container p{margin-top:2rem;font-size:clamp(1.7rem,3vw,5rem);letter-spacing:-.03rem;color:var(--white)}.container .about-me-h1{font-size:clamp(2.2rem,5vw,10rem)}.container .about-me-p{margin-top:.8rem;font-size:clamp(.7rem,2.2vw,.65rem);color:var(--white);font-weight:400;letter-spacing:-.02rem;line-height:clamp(1.2rem,3.2vw,1rem);width:clamp(0rem,80vw,48rem)}.container .email-container{color:var(--white);text-decoration:none}.container .about-me-link img{margin-top:20px;padding:6px;background-color:#111;border-radius:10px}#secondImage{margin-left:8px}.outside{z-index:3;background-color:var(--bg)}.inside{background-color:var(--bg)}.hoverable-opacity:hover .animate-opacity,.projects-cta .animate-opacity{animation:opacityPass 1.1s infinite;animation-fill-mode:forwards}@keyframes opacityPass{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.hoverable-title-opacity{cursor:default}.hoverable-title-opacity span{transition:all 1s}.hoverable-title-opacity:hover span{transition:all .2s}.hero{height:100svh}.borders{position:relative;z-index:10}.hero-container{position:relative;height:100svh;border-radius:28px;border:14px solid var(--bg);outline:15px solid var(--bg);outline-offset:-1px;z-index:2}.hero-container h1{font-size:clamp(1.33rem,2.2vw,6rem);font-weight:400;letter-spacing:-.05rem;line-height:clamp(1.95rem,3.2vw,6rem);width:clamp(0rem,70vw,48rem);color:var(--white);position:absolute;top:50%;left:50%;translate:-50% -50%;z-index:6;transition:all .2s;-webkit-user-select:none;user-select:none}@keyframes rotate{0%{rotate:0deg;background:var(--pink);transform:translate(150px)}50%{scale:1 1.5;background:var(--blue);transform:translate(150px)}to{rotate:360deg;background:var(--pink);transform:translate(150px)}}@keyframes rotate2{0%{rotate:0deg;background:var(--blue)}50%{scale:1 1.5;background:var(--pink)}to{rotate:360deg;background:var(--blue)}}#blob{height:30vmax;aspect-ratio:1;position:fixed;left:50%;top:50%;translate:-35% -35%;border-radius:50%;background:var(--pink);animation:rotate 16s infinite;opacity:.8;transition:all .2s;z-index:2}#blob2{height:30vmax;aspect-ratio:1;position:fixed;left:10%;top:10%;translate:-65% -65%;border-radius:50%;background:var(--blue);animation:rotate2 16s infinite;opacity:.8;transition:all .2s;z-index:2}#blur{height:100%;width:100%;position:absolute;backdrop-filter:blur(6vmax);-webkit-backdrop-filter:blur(6vmax);z-index:2}@media screen and (orientation: portrait) and (max-width: 1439px){#blob{height:40vmax;position:fixed;left:50%;top:50%;translate:-20% -20%;scale:3}#blob2{height:40vmax;position:fixed;left:50%;top:50%;translate:-80% -65%;scale:3}}@media screen and (max-width: 1000px){#image-trailer{display:none}}#image-trailer{opacity:0;background-color:transparent;background-size:cover;width:600px;height:300px;border-radius:10px;position:fixed;left:0;top:0;z-index:10000;pointer-events:none;transition:opacity .5s ease}.contact-btn{display:inline-block;cursor:pointer;color:var(--white);text-decoration:none}.contact-btn p{font-size:clamp(1.15rem,2.2vw,1.15rem);font-weight:400;letter-spacing:-.05rem;display:inline}#text,#text2{position:absolute;margin-left:6px;border-bottom:1px solid var(--white);transition:all .2s}#text2{opacity:0;visibility:hidden;transition:all .2s}.contact-btn:hover #text{visibility:hidden;opacity:0;margin-left:18px;border-bottom:1px solid rgba(255,246,229,.219);transition:all .2s}.contact-btn:hover #text2{visibility:visible;opacity:1;margin-left:18px;border-bottom:1px solid rgba(255,246,229,.219);transition:all .2s}@media screen and (min-width: 1440px){#text2,#text{bottom:5px;line-height:2rem}}@keyframes background-pan{0%{background-position:0% center}to{background-position:-200% center}}header{position:fixed;display:flex;justify-content:space-between;top:1.8rem;left:clamp(1.9rem,2.2vw,.65rem);right:clamp(1.9rem,2.2vw,.65rem);z-index:100}.header-text{font-size:clamp(.75rem,2.2vw,.75rem);font-weight:400;letter-spacing:-.03rem;line-height:clamp(1.95rem,3.2vw,6rem);color:var(--white);cursor:pointer;text-decoration:none}.header-buttons{display:flex;justify-content:space-between;gap:1.8rem}.header-buttons a{text-decoration:none;transition:all .2s}.header-buttons a.active{font-weight:700;transition:all .2s}@media screen and (min-width: 1440px){header{left:clamp(5.6rem,2.2vw,.65rem);right:clamp(5.6rem,2.2vw,.65rem)}.header-text{font-size:clamp(.65rem,2.2vw,.65rem)}.header-buttons{gap:3.2rem}.theme-switch{transition:all .2s}.theme-switch:hover{scale:1.2;text-shadow:0px 0px 24px rgb(255,251,13,.8);transition:all .2s}}.cta-container{position:fixed;display:flex;justify-content:right;bottom:1.8rem;left:clamp(1.9rem,2.2vw,.65rem);right:clamp(1.9rem,2.2vw,.65rem);z-index:100;-webkit-user-select:none;user-select:none}.projects-cta{display:inline-block;float:right;cursor:pointer}.projects-cta p{font-size:clamp(.65rem,2.2vw,.65rem);font-weight:400;letter-spacing:-.03rem;line-height:clamp(1.95rem,3.2vw,6rem);color:var(--white);cursor:pointer}@media screen and (min-width: 1440px){.cta-container{left:clamp(5.6rem,2.2vw,.65rem);right:clamp(5.6rem,2.2vw,.65rem)}}.project-container{height:45vh;position:relative}.content-container{display:flex;flex-direction:row;justify-content:space-between;gap:24px;position:absolute;left:50%;top:65%;translate:-50% -50%;width:clamp(0rem,80vw,48rem)}.project-container h1{font-size:clamp(1.7rem,3vw,5rem);letter-spacing:-.03rem;color:var(--white);-webkit-user-select:none;user-select:none;width:clamp(0rem,41vw,20rem)}.project-desc{margin-top:16px;margin-bottom:16px;font-size:clamp(.75rem,2.2vw,.75rem);color:var(--white);font-weight:400;letter-spacing:-.02rem;line-height:clamp(1rem,3.2vw,1rem);width:clamp(0rem,40vw,20rem)}.project-link{font-size:clamp(.75rem,2.2vw,.75rem);color:var(--gray);font-weight:500;letter-spacing:-.02rem;line-height:clamp(1rem,3.2vw,1rem);width:clamp(0rem,40vw,20rem);padding-block:16px;transition:all .2s;cursor:pointer}.project-link:hover{color:var(--white);transition:all .2s}.project-link:nth-child(4){margin-left:16px}.project-image{background-color:var(--gray);background-size:cover;width:clamp(0rem,60vw,8rem);height:clamp(0rem,60vw,11rem);border-radius:10px;position:relative}@media screen and (min-width: 1439px){.project-desc,.project-link{font-size:clamp(.7rem,2.2vw,.65rem)}}@media screen and (min-width: 1439px) and (min-height: 765px){#store:after{content:"hover me!";position:absolute;display:flex;justify-content:center;rotate:12deg;top:-75px;height:100px;width:100px;margin-left:6rem;color:var(--white);background:url(/portfolio/arrow.svg);background-repeat:no-repeat;background-position-y:center;font-size:clamp(.7rem,2.2vw,.65rem)}}