:root{--primary-white: #dadff7;--primary-white-50opacity: #dadff780;--primary-white-10opacity: rgba(218, 223, 247, .1);--black-black: #000000;--primary-black: #181819;--primary-black-90opacity: rgba(24, 24, 25, .9);--primary-black-50opacity: rgba(24, 24, 25, .5);--primary-black-25opacity: rgba(24, 24, 25, .25);--primary-black-10opacity: rgba(24, 24, 25, .1);--primary-dark: #232c33;--primary-dark-50opacity: #232c3380;--primary-dark-25opacity: rgba(35, 44, 51, .25);--primary-dark-10opacity: rgba(35, 44, 51, .1);--primary-blue: #a0c1d1;--primary-blue-50opacity: #a0c1d180;--primary-blue-10opacity: rgba(160, 193, 209, .1);--primary-darkBlue: #4d6cfa;--primary-darkBlue-50opacity: rgba(77, 109, 250, .5);--primary-darkBlue-25opacity: rgba(77, 109, 250, .25);--accent: #eaba6b;--accent-50opacity: rgba(234, 185, 107, .5);--accent-10opacity: rgba(234, 185, 107, .1);--random-color: #dadff7;--primary-font: "Montserrat", sans-serif;--secondary-font: "Bebas Neue", sans-serif;--primary-boxshadow: 4px 4px 8px var(--primary-dark-50opacity);--primary-textshadow: 2px 2px 12px var(--primary-blue-50opacity);--horizontal-padding: 0 clamp(12px, 6vw, 100px);--axial-padding: clamp(12px, 6vw, 100px) clamp(12px, 6vw, 100px)}body{background-color:red;color:var(--primary-white)}#splash-screen{width:100%;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);position:absolute;top:0;display:flex;justify-content:center;align-items:center;gap:1.5vw;transition:top 1s;z-index:999}#splash-screen p{text-transform:uppercase;font-weight:900;font-size:10vw;line-height:1;color:var(--primary-white-10opacity);letter-spacing:-4vw;text-align:left;opacity:0}#splash-screen span{margin-left:2.5vw}#splash-screen p.active{opacity:1;transform:translateY(0);transition:all .5s ease-in-out}#splash-screen p.fade{opacity:0;transform:translateY(-30vh);transition:all .5s ease-in-out}.background-gradient{--leftx: -10vw;--lefty: 40vh;--rightx: 100vw;--righty: 0vh;--botx: 60vw;--boty: 100vh;position:fixed;width:clamp(128px,20vw,256px);height:clamp(128px,20vw,256px);pointer-events:none;transition:transform 1s ease,background 10s,box-shadow .5s ease;border-radius:50%;box-shadow:inset 0 0 64px #000000f2,inset 0 0 32px #0009,inset 12px -12px 24px #ff00001a,inset -8px 8px 20px #00ffff26;will-change:transform filter box-shadow;border:none}.flash{box-shadow:inset 20px 0 10px var(--random-color),inset -64px 0 32px var(--primary-white-10opacity),inset 0 32px 32px var(--primary-white-10opacity)}.background-gradient.left{transform:translate(var(--leftx),var(--lefty)) scale(2);background:var(--primary-darkBlue)}.background-gradient.right{transform:translate(var(--rightx),var(--righty)) scale(2);background:var(--primary-blue)}.background-gradient.bot{transform:translate(var(--botx),var(--boty)) scale(2);background:var(--accent)}.gradientContainer{width:100vw;height:100vh;position:fixed;inset:0;animation:rotateOnLoad 4s ease forwards}.gradientContainerWiggle{width:100vw;height:100vh;position:fixed;inset:0;z-index:-1;animation:wiggle 3s infinite alternate ease-in-out}@keyframes rotateOnLoad{0%{transform:rotate(180deg) scale(.1);opacity:.01}to{transform:rotate(0) scale(1);opacity:1}}@keyframes wiggle{0%{transform:scale(1)}to{transform:scale(1.05)}}.container{position:relative;-webkit-mask-image:linear-gradient(black,black);mask-image:linear-gradient(#000,#000);-webkit-mask-composite:source-in;mask-composite:intersect;border-bottom-right-radius:64px;background-color:var(--black-black);z-index:9;transition:background-color 1s ease}.container:before{content:"";position:absolute;inset:0;background-image:url(/assets/background-grain-DaUltLtM.png);background-repeat:repeat;pointer-events:none;opacity:.6}.shift{--y: 0px;--x: 0px;will-change:transform}.shift.left{transform:translate(var(--leftx),var(--lefty)) translate(var(--x),var(--y)) scale(2)}.shift.right{transform:translate(var(--rightx),var(--righty)) translate(var(--x),var(--y)) scale(2)}.shift.bot{transform:translate(var(--botx),var(--boty)) translate(var(--x),var(--y)) scale(2)}.container.inactive:before{content:"";position:absolute;inset:0;pointer-events:none;animation-duration:30s;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='7' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23noise)' opacity='0.07'/%3E%3C/svg%3E");mix-blend-mode:soft-light;animation:grain-drift 10s linear infinite;opacity:.04;transition:opacity 2s ease}@keyframes grain-drift{0%{transform:translate(0)}to{transform:translate(20px,20px)}}.project{height:90vh;max-width:75vw;flex-shrink:0;border-radius:64px;transition:opacity .3s ease-in-out;display:flex;align-items:flex-end;justify-content:flex-end;position:relative}.buffer{height:98vh;width:25vw;flex-shrink:0}.sticky_parent{height:800vh}.sticky{overflow:hidden;position:sticky;top:0;left:0;height:100vh}.scroll_section{display:flex;align-items:center;height:100%;will-change:transform;transition:transform .2s ease-out;gap:10vw}body::-webkit-scrollbar{width:3px}body::-webkit-scrollbar-track{background:var(--primary-dark-50opacity)}body::-webkit-scrollbar-thumb{background:var(--primary-white-50opacity)}body::-webkit-scrollbar-thumb:hover{background:var(--accent)}.fake-scrollbar{position:fixed;bottom:0;left:0;height:3px;background:var(--primary-dark-50opacity);border-radius:3px;opacity:0}.fake-scrollbar .bar{height:100%;background:var(--primary-white-50opacity);border-radius:3px;transition:none}.bar:hover,.bar:active{background:var(--accent)}.show-scrollbar .fake-scrollbar{opacity:1}.hide-scrollbar::-webkit-scrollbar{width:0}.fake-scrollbar{cursor:pointer}.fake-scrollbar:active{cursor:grabbing}.firstProject{background:url(/assets/fishscalePreview-B-o8_tRc.png)}.secondProject{background:url(/assets/colorSwapperPreview-DS8g7rAZ.png)}.thirdProject{background:url(/assets/etchasketchPreview-BCvfOoVw.png)}.fourthProject{background:url(/assets/rockPaperScissorsPreview-BE8QC6xY.png)}.fifthProject{background:url(/assets/tictactoePreview-BMReTfvZ.png)}.firstProject,.secondProject,.thirdProject,.fourthProject,.fifthProject{width:100%;height:100%;border-radius:64px;position:relative;box-shadow:inset 0 0 5vw #000;transition:filter .4s ease-in-out,opacity .2s ease-in-out;filter:brightness(.2);opacity:.5;background-size:cover}.firstProject:hover,.secondProject:hover,.thirdProject:hover,.fourthProject:hover,.fifthProject:hover{opacity:1;filter:brightness(1)}.description{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5vw;opacity:1;transition:opacity .4s ease-in-out}.project a{outline:none}.descriptionTitle{font-family:var(--secondary-font);font-size:clamp(24px,3vw,36px);color:var(--primary-white);margin-bottom:clamp(8px,1.5vh,16px)}.descriptionContent{font-family:var(--primary-font);font-size:clamp(14px,1.5vw,20px);color:var(--primary-white);margin-bottom:clamp(8px,1.5vh,16px)}.highlight{position:absolute;top:0;left:-150%;width:40%;height:100%;background:linear-gradient(90deg,transparent,var(--primary-blue-10opacity),transparent);pointer-events:none;transition:left .2s ease,opacity .3s ease;opacity:0}#header{opacity:0;position:fixed;top:-200px;width:100%;background:var(--primary-black-50opacity);display:flex;flex-direction:column;align-items:center;justify-content:space-between;z-index:10;transition:.3s ease;border-bottom-right-radius:64px;overflow:hidden}.headerContainer{min-height:clamp(64px,8vw,96px);width:100%;display:flex;position:relative;padding:var(--horizontal-padding);align-items:center;justify-content:space-between}.header-logo{display:inline-block;font-family:var(--secondary-font);text-transform:uppercase;font-size:clamp(14px,4vw,48px);border-right:2px solid var(--primary-white);animation:blink 1.2s step-end infinite;cursor:pointer;transition:transform .7s ease,filter .7s ease,text-shadow .7s ease;line-height:1}@keyframes blink{50%{border-color:transparent}}.burger{width:clamp(24px,2vw,30px);height:clamp(24px,2vw,24px);display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:transform .3s ease}.burger span{display:block;height:4px;background-color:#fff;transition:all .3s ease;transform-origin:center}.burger:hover span:nth-child(1){transform:translateY(-4px)}.burger:hover span:nth-child(3){transform:translateY(4px)}.burger.active span:nth-child(1){transform:rotate(90deg) translate(10px)}.burger.active span:nth-child(2){opacity:0}.burger.active span:nth-child(3){transform:rotate(-180deg) translateY(10px)}.burger.active{transform:rotate(45deg)}.header-logo:hover,.burger:hover,.buttonContainer button:hover,.buttonContainer .downloadBtn:hover{transform:scale(1.05);filter:brightness(1.5);opacity:1}.buttonContainer{display:none;justify-content:space-between;flex-direction:row;align-items:center;width:100%;padding:6px clamp(12px,6vw,100px);border-top:1px solid var(--primary-white-10opacity)}.visible{display:flex;height:fit-content}.buttonContainer .skipBtn,.buttonContainer .downloadBtn,.buttonContainer .headerThemeToggle,.buttonContainer #musicBtn{text-transform:uppercase;color:var(--primary-white);text-align:center;font-size:clamp(10px,2vw,24px);letter-spacing:1px}#media{display:flex;justify-content:space-between;align-items:center;width:15%}.mediaIcon{max-width:clamp(24px,2vw,48px);transition:transform .5s ease,filter .5s ease;background-color:var(--primary-white-50opacity);border:1px solid var(--primary-white-10opacity);border-radius:50%}.mediaIcon:hover{transform:rotate(360deg) scale(1.05);filter:brightness(1.5);cursor:pointer}.darkmodeContainer{display:flex;align-items:center;justify-content:center}.headerThemeToggle{position:relative;display:flex;align-items:center;justify-content:center;border:none;background:transparent;cursor:pointer}.headerThemeToggle:before,.headerThemeToggle:after{content:"";display:inline-block;border-radius:50%;background-color:var(--primary-blue);transition:all .3s ease}.headerThemeToggle:after{width:3em;height:1em;border-radius:12px;background-color:var(--primary-blue-50opacity);margin-left:.5em}.headerThemeToggle:before{width:.7em;height:.7em;position:absolute;right:.1em}.headerThemeToggle.active:before{right:2.1em;background-color:var(--accent)}.headerThemeToggle.active:after{background-color:var(--accent);opacity:.5}@media (max-width: 600px) and (orientation: portrait){.buttonContainer{flex-direction:column;padding:0;background-color:transparent}.buttonContainer .skipBtn,.buttonContainer .downloadBtn,.buttonContainer .darkmodeContainer,.buttonContainer #media{width:100%;padding:12px}.buttonContainer .skipBtn{background-color:#0000001a}#media{justify-content:center;gap:32px;background-color:#00000026}.buttonContainer .downloadBtn{background-color:#0003}.buttonContainer .darkmodeContainer{background-color:#00000040;cursor:pointer}.buttonContainer .headerThemeToggle{pointer-events:none}.buttonContainer .skipBtn:hover,.buttonContainer .downloadBtn:hover,.buttonContainer .darkmodeContainer:hover,.buttonContainer #media:hover{opacity:1;transform:scale(1);filter:brightness(1.5);background-color:#0006}}#welcomePage{height:100vh;width:100%;display:flex;align-items:center;padding:var(--horizontal-padding);font-size:clamp(18px,1.5vw,32px);color:var(--primary-white);text-transform:uppercase;line-height:1.5;filter:drop-shadow(0px 0px 20px var(--primary-black));opacity:0;transition:none}#welcomePage h1{font-size:clamp(32px,4vw,96px);font-family:var(--secondary-font);letter-spacing:.2vw}#welcomePage p{font-family:var(--primary-font)}.underscore{color:var(--accent)}.jokeAnimation,.anywayAnimation{opacity:0;display:inline-block}body{font-family:var(--primary-font);color:var(--primary-white)}#mainContainer{display:flex;flex-direction:column;justify-content:center;gap:25vh;padding:var(--horizontal-padding);opacity:0;position:relative}#mainContainer div{width:100%}#mainContainer section{display:flex;flex-direction:column;gap:clamp(12px,10vh,64px)}#mainContainer section h1{font-size:clamp(36px,4vw,48px);font-family:var(--secondary-font);letter-spacing:.2vw;line-height:1}#mainContainer section p{font-size:clamp(16px,2vw,24px);font-family:var(--primary-font);letter-spacing:.1vw}.textContainer{display:flex;flex-direction:column;gap:clamp(3px,2.5vh,16px)}.skip-link{position:absolute;top:-40px;left:0;background:var(--primary-black);color:var(--primary-white);padding:8px 16px;transition:top .3s;border:none;opacity:0;transition:none}.skip-link:focus{top:0;opacity:1}h1{margin-bottom:20px}p{max-width:none}.welcomeContainer{margin-top:25vh;line-height:1.6}.splineContainer{display:flex;flex-direction:column;align-items:center}spline-viewer{width:50%;height:800px}.carouselContainer{mask:linear-gradient(90deg,transparent,white 36%,white 64%,transparent);width:80%;overflow:hidden}.carousel-track{display:flex;animation:scroll 45s linear infinite;opacity:.6;padding-bottom:1vw;transform:translateZ(0);will-change:transform}@keyframes scroll{to{transform:translate(calc(-50% - 64px))}}.techIcon{margin-left:64px;height:64px}#footer{width:100%;height:90vh;position:sticky;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:var(--horizontal-padding);overflow:hidden;transition:filter .1s ease-in-out;will-change:filter;padding:0;color:#dadff7;opacity:0}body,#footer{background-color:#181819}#footer .footer-container{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:5vh;position:relative}#footer span{margin-left:2.5vw}#footer h1{font-family:var(--secondary-font);letter-spacing:2px;font-size:5vw;text-align:left;width:100%;padding:var(--horizontal-padding)}.links{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1vw;font-size:2vw;padding:var(--horizontal-padding)}.contact-links{display:flex;justify-content:space-around;width:100%}.contact-links div{display:flex;flex-direction:column;align-items:flex-start;gap:.2vw}.links a,.links button{color:var(--primary-white-10opacity);transition:color .2s ease-in-out;font-weight:100;text-transform:capitalize;text-align:left;transition:color .5s;padding:0;margin:0;line-height:1.2;display:inline-flex}.links a:hover,.links button:hover{color:var(--accent)}#footer .footer-bottom{width:100%;display:flex;justify-content:space-between;padding-right:clamp(12px,6vw,100px);height:26vh}#footer .signature{line-height:1;opacity:.1;font-size:.5em;align-self:flex-end}#footer .logo{position:absolute;bottom:0;left:50%;transform:translate(-50%);text-transform:uppercase;font-weight:900;font-size:10vw;line-height:.7;color:var(--primary-white-10opacity);letter-spacing:-4vw;opacity:.1}.quote{line-height:1;opacity:.1;display:flex;flex-direction:column;gap:2vw;width:20vw}.quote div{display:flex;gap:1vw;align-items:center;justify-content:space-between}.quote button{padding:5px;background-color:#dadff7;color:#181819;border-radius:6px;font-weight:900}.quote-text{display:flex;flex-direction:column;font-size:.8em}#quote{display:flex;align-self:flex-start}#author{display:flex;align-self:flex-end}.doNotClick{z-index:10;cursor:pointer}body{cursor:default}.cursor{--cursorX: 0px;--cursorY: 0px;position:fixed;width:16px;height:16px;background:#fcfdff;mix-blend-mode:difference;border-radius:50%;pointer-events:none;z-index:9999;transform:translate(var(--cursorX),var(--cursorY)) translate(-50%,-50%);will-change:transform opacity filter clip-path box-shadow;opacity:0}.clicked{animation:glitch .4s ease}.glitch{--top: 0%;--right: 0%;--bottom: 0%;--left: 0%;--rand1: 0;--rand2: 0;--rand3: 0;--rand4: 0}@keyframes glitch{0%,to{clip-path:inset(0);filter:drop-shadow(0 0 0 transparent) drop-shadow(0 0 0 transparent) drop-shadow(0 0 0 transparent);box-shadow:inset 0 0 0 transparent,inset 0 0 0 transparent,inset 0 0 0 transparent}10%{clip-path:inset(var(--top) 0 var(--bottom) 0);filter:drop-shadow(calc((var(--rand1) - .5) * 6px) 0 0 #ff0048) drop-shadow(calc((var(--rand2) - .5) * 6px) 0 0 #00ffea) drop-shadow(0 calc((var(--rand3) - .5) * 6px) 0 #ffe600);box-shadow:inset calc((var(--rand1) - .5) * 6px) calc((var(--rand2) - .5) * 6px) 1px #ff0048,inset calc((var(--rand3) - .5) * 6px) 0 1px #00ffea,inset 0 calc((var(--rand4) - .5) * 6px) 1px #ffe600}20%{clip-path:inset(var(--top) 0 var(--bottom) 0);filter:drop-shadow(calc((var(--rand2) - .5) * -6px) 0 0 #ff0048) drop-shadow(calc((var(--rand3) - .5) * 6px) 0 0 #00ffea) drop-shadow(0 calc((var(--rand4) - .5) * -6px) 0 #ffe600);box-shadow:inset calc((var(--rand2) - .5) * -6px) 0 1px #ff0048,inset calc((var(--rand3) - .5) * 6px) 0 1px #00ffea,inset 0 calc((var(--rand4) - .5) * -6px) 1px #ffe600}50%{clip-path:inset(0 var(--right) 0 var(--left));filter:drop-shadow(calc((var(--rand1) - .5) * 6px) calc((var(--rand2) - .5) * 6px) 0 #ff0048) drop-shadow(calc((var(--rand3) - .5) * -6px) calc((var(--rand4) - .5) * -6px) 0 #00ffea) drop-shadow(calc((var(--rand4) - .5) * 6px) calc((var(--rand1) - .5) * -6px) 0 #ffe600);box-shadow:inset calc((var(--rand1) - .5) * 6px) 0 1px #ff0048,inset calc((var(--rand3) - .5) * -6px) 0 1px #00ffea,inset calc((var(--rand2) - .5) * 6px) calc((var(--rand4) - .5) * 6px) 1px #ffe600}75%{clip-path:inset(var(--top) var(--right) var(--bottom) var(--left));filter:drop-shadow(calc((var(--rand3) - .5) * 6px) calc((var(--rand1) - .5) * 6px) 0 #ff0048) drop-shadow(calc((var(--rand4) - .5) * -6px) calc((var(--rand2) - .5) * -6px) 0 #00ffea) drop-shadow(calc((var(--rand2) - .5) * 6px) calc((var(--rand3) - .5) * 6px) 0 #ffe600);box-shadow:inset calc((var(--rand1) - .5) * 6px) 0 .5px #ff0048,inset calc((var(--rand2) - .5) * -6px) 0 1px #00ffea,inset calc((var(--rand3) - .5) * 6px) calc((var(--rand4) - .5) * 6px) 1px #ffe600}}.visible{opacity:1;transition:opacity 1s ease-in-out}.fade{opacity:0;transition:opacity 2s ease-in-out}
