:root{--bg-color: 21, 21, 21;--dark-bg-color: 15, 15, 15;--off-white: 245, 245, 245;--accent: 200, 190, 216;--purple: 162, 147, 255;--accent-back: 34, 32, 45;--tooltip-text-color: white}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(135deg,rgba(var(--bg-color),1),rgba(var(--dark-bg-color),1))}.overlay{position:fixed;z-index:10;overflow:hidden;width:100vw;height:100dvh;pointer-events:none}.tooltip{z-index:-1;display:none;opacity:0;transition:opacity .25s linear}.tooltip-text{position:absolute;color:var(--tooltip-text-color);margin:0;z-index:100;font-family:Space Mono,monospace;font-style:normal;font-weight:700;font-size:18px;white-space:nowrap;padding:6px 9px;border-radius:6px;background-color:rgb(var(--bg-color));transform:translate(-50%)}.tooltip-arrow{position:absolute;width:0px;height:0px;border:6px solid transparent;border-top-color:rgb(var(--bg-color));transform:translate(-50%)}.fades{position:absolute;height:100%;width:100%}.fade{position:absolute;height:20vh;width:100%}.fade-top{top:0;background:linear-gradient(180deg,#0006,#0000)}.fade-bottom{bottom:0;background:linear-gradient(0deg,#0006,#0000)}@media screen and (max-width: 850px){.fade-top{background:linear-gradient(180deg,#0006,#0000)}.fade-bottom{background:linear-gradient(0deg,#0006,#0000)}}@media (hover: hover) and (pointer: fine){.tooltip{display:block}}*.unselectable{-moz-user-select:-moz-none;-webkit-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}*.bold{font-weight:700}*.italic{font-style:italic}*.light-purple{color:rgb(var(--accent))!important}*.purple{color:rgb(var(--purple))!important}*.fancy-text{font-family:"DM Serif",Cambria,Cochin,Georgia,Times,Times New Roman,serif}*.cloak-text{font-weight:700;color:#fff;text-align:center}*.cloak-text .bounce-char:not(:last-of-type){letter-spacing:.75rem}*{font-variant-ligatures:none}.bounce-char{position:relative;bottom:0;cursor:-webkit-grab;cursor:grab}.section-wrapper{display:flex;flex-direction:column}.section-header{position:-webkit-sticky;position:sticky;display:flex;justify-content:flex-start;z-index:100;top:0;padding-inline:4vh;pointer-events:none}.section-link{text-decoration:none}.section-title{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0;padding-top:4vh;font-family:Merriweather,Cambria,Cochin,Georgia,Times,Times New Roman,serif;font-style:normal;font-weight:700;font-size:56px;line-height:.85;color:rgb(var(--off-white));transition:opacity .1s linear;opacity:calc(var(--top-percent) * var(--top-percent) * var(--top-percent) * .65 + .1)}.section-header-right{margin-left:auto}.section-content{padding-top:4vh;padding-bottom:4vh;transition:opacity .1s linear;opacity:calc(var(--top-percent) * var(--top-percent) * var(--top-percent) * 2 + .1)}@media screen and (min-width: 2000px){.section-title{font-size:74px}}@media screen and (max-width: 1450px){.section-title{font-size:48px}}@media screen and (max-width: 1150px){.section-title{font-size:36px}}@media screen and (max-width: 870px){.section-title{font-size:32px}}@media screen and (max-width: 850px){.section-header{padding-inline:3vh}.section-title{padding-top:2vh;font-size:48px}.section-content{margin-top:0}}@media screen and (max-width: 400px){.section-title{font-size:32px}}#intro{position:relative}#intro-content{margin-top:var(--header-offset);position:relative;box-sizing:border-box;display:flex;justify-content:center;align-items:flex-start;min-height:100svh;padding:0}.intro-imgs{position:-webkit-sticky;position:sticky;top:0;display:flex;justify-content:center;align-items:center;height:100vh;width:575px;margin-left:-125px}.intro-img-wrapper{--img-radius: 80px;--baseX: 0deg;--baseY: 0deg;--baseZ: -10deg;--rotateZ: 0deg;--x: 50%;--y: 50%;--scale: 1;position:absolute;top:var(--y);left:var(--x);aspect-ratio:1;opacity:0;transform-style:preserve-3d;perspective:1000px;transform:translate(-50%,-50%) scale(var(--scale)) rotateX(var(--baseX)) rotateY(var(--baseY)) rotate(calc(var(--baseZ)))}.transitioning .intro-img-wrapper{transition:top .35s ease,left .35s ease,opacity .35s ease,transform .35s ease}.intro-img-wrapper:nth-child(1){opacity:1;z-index:2}.intro-img-wrapper:nth-child(2){z-index:1}.intro-img-wrapper:nth-child(3){z-index:0}#intro[section-index="1"] .intro-img-wrapper:nth-child(1){--x: 35%;--y: 32.5%;--baseX: 10deg;--baseY: -10deg;--baseZ: 10deg;--scale: .8}#intro[section-index="2"] .intro-img-wrapper:nth-child(1){--x: 35%;--y: 25%;--baseX: 10deg;--baseY: -10deg;--baseZ: 10deg;--scale: .8}#intro[section-index="1"] .intro-img-wrapper:nth-child(2),#intro[section-index="1"] .intro-img-wrapper:nth-child(3){--x: 50%;--y: 62.5%;--baseZ: -10deg;--scale: 1;opacity:1}#intro[section-index="1"] .intro-img-wrapper:nth-child(3){opacity:0}#intro[section-index="2"] .intro-img-wrapper:nth-child(2){--x: 55%;--y: 47.5%;--baseX: 10deg;--baseY: 10deg;--baseZ: -10deg;--scale: .75;opacity:1}#intro[section-index="2"] .intro-img-wrapper:nth-child(3){--x: 35%;--y: 72.5%;--baseZ: 0deg;--scale: 1;opacity:1}.portait-img{cursor:-webkit-grab;cursor:grab}.intro-img{position:relative;width:325px;z-index:3;transform-style:preserve-3d;overflow:hidden;border-radius:var(--img-radius);box-shadow:0 0 30px rgba(var(--bg-color),.75)}.intro-img>img{display:block;width:100%;-o-object-fit:cover;object-fit:cover;transition:transform .15s linear;-webkit-user-drag:none;user-drag:none}.goofy-img{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-animation:fade-out .75s 50ms ease-out forwards;animation:fade-out .75s 50ms ease-out forwards;z-index:2;pointer-events:none}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.intro-text{position:relative;display:flex;flex-direction:column;align-items:center;max-width:650px;width:650px;text-align:center;color:rgb(var(--off-white));z-index:2;gap:20vh}.intro-text-group{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px}.intro-text .text-divider{position:relative;width:100%;height:3px;background:linear-gradient(90deg,#dbdbdb00,#dbdbdbaa,#dbdbdb00)}.intro-text h3{--font-size: 42px;margin:0;font-family:DM Sans,sans-serif;font-weight:500;letter-spacing:.25rem;font-size:var(--font-size);color:#dbdbdb}.intro-text p{margin:0;font-family:Space Mono,monospace;font-size:32px;line-height:1.3;color:#c6c6c6;width:100%}.left-align{text-align:left}.intro-bubbles{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1}.intro-bubble{position:absolute;aspect-ratio:1;border-radius:25%;background:linear-gradient(135deg,#b9b9e8,#b9b9e880);opacity:.15;z-index:-1;overflow:hidden;transform-origin:center;transform:translate(-50%) translateY(-50%);transition:top .75s ease,left .75s ease,transform .75s ease}.intro-bubble:nth-child(1){transform:translate(-50%) translateY(-50%) rotate(20deg);width:22vmin;top:35%;left:40%}.intro-bubble:nth-child(2){transform:translate(-50%) translateY(-50%) rotate(-5deg);width:20vmin;top:45%;left:82.5%}.intro-bubble:nth-child(3){transform:translate(-50%) translateY(-50%) rotate(7.5deg);width:18vmin;top:65%;left:52.5%}#intro[section-index="1"] .intro-bubble:nth-child(1){transform:translate(-50%) translateY(-50%) rotate(10deg);top:40%;left:45%}#intro[section-index="1"] .intro-bubble:nth-child(2){transform:translate(-50%) translateY(-50%) rotate(-15deg);top:55%;left:85%}#intro[section-index="1"] .intro-bubble:nth-child(3){transform:translate(-50%) translateY(-50%) rotate(-5deg);top:70%;left:60%}#intro[section-index="2"] .intro-bubble:nth-child(1){transform:translate(-50%) translateY(-50%) rotate(-10deg);top:35%;left:55%}#intro[section-index="2"] .intro-bubble:nth-child(2){transform:translate(-50%) translateY(-50%) rotate(0);top:60%;left:75%}#intro[section-index="2"] .intro-bubble:nth-child(3){transform:translate(-50%) translateY(-50%) rotate(15deg);top:65%;left:45%}.intro-bubble.mobile{display:none}@media screen and (min-width: 2000px){.intro-imgs{width:865px;margin-left:-187.5px}.intro-img-wrapper{--img-radius: 120px}.intro-img{width:487.5px;box-shadow:0 0 45px rgba(var(--bg-color),.75)}.intro-text{max-width:975px;width:975px}.intro-text-group{gap:48px}.intro-text h3{--font-size: 63px}.intro-text p{font-size:48px}}@media screen and (max-width: 1300px){.intro-text{max-width:500px}.intro-text>h3{--font-size: 28px}.intro-text>p{font-size:20px}}@media screen and (max-width: 1150px){.intro-imgs{width:500px;margin-left:-25px}}@media screen and (max-width: 950px){.intro-text{max-width:450px}.intro-text>h3{--font-size: 26px}.intro-text>p{font-size:18px}.intro-imgs{width:400px;margin-left:-25px}.intro-img-wrapper{--img-radius: 60px}.intro-img{width:275px}}@media screen and (max-width: 850px){body{background:rgb(var(--bg-color))}#intro-content{flex-direction:column;padding-bottom:5vw}.intro-imgs{height:275px;width:100vw;overflow:hidden;margin-left:0;z-index:3;background:linear-gradient(rgb(var(--bg-color)) 250px,rgba(var(--bg-color),0))}.intro-img-wrapper{--img-radius: 50px;--x: 50%;--y: 60%}#intro[section-index="1"] .intro-img-wrapper:nth-child(1),#intro[section-index="2"] .intro-img-wrapper:nth-child(1){--x: 7.5%;--y: 32.5%;--baseX: 10deg;--baseY: -10deg;--baseZ: 10deg;--scale: .8}#intro[section-index="1"] .intro-img-wrapper:nth-child(2),#intro[section-index="1"] .intro-img-wrapper:nth-child(3){--x: 50%;--y: 50%;--baseZ: -5deg;--scale: 1;opacity:1}#intro[section-index="1"] .intro-img-wrapper:nth-child(3){opacity:0}#intro[section-index="2"] .intro-img-wrapper:nth-child(2){--x: 92.5%;--y: 70%;--baseX: 10deg;--baseY: 10deg;--baseZ: -10deg;--scale: .75;opacity:1}#intro[section-index="2"] .intro-img-wrapper:nth-child(3){--x: 50%;--y: 50%;--baseZ: 0deg;--scale: 1;opacity:1}.intro-img{width:200px}.intro-text{box-sizing:border-box;max-width:100vw;width:100vw;padding:0 25px 10vmin;gap:250px}.intro-text-group{min-height:0;margin-block:15vw;gap:16px}.intro-text h3{--font-size: 26px}.intro-text p{font-size:22px;color:#adadad}.intro-bubble:nth-child(1){top:45%;left:10%}.intro-bubble:nth-child(2){top:47.5%;left:92.5%}.intro-bubble:nth-child(3){top:65%;left:52.5%}#intro[section-index="1"] .intro-bubble:nth-child(1){top:40%;left:25%}#intro[section-index="1"] .intro-bubble:nth-child(2){top:55%;left:85%}#intro[section-index="1"] .intro-bubble:nth-child(3){top:70%;left:45%}#intro[section-index="2"] .intro-bubble:nth-child(1){top:50%;left:55%}#intro[section-index="2"] .intro-bubble:nth-child(2){top:75%;left:80%}#intro[section-index="2"] .intro-bubble:nth-child(3){top:80%;left:25%}}@media (hover: hover) and (pointer: fine){.intro-img-wrapper{transform:translate(-50%,-50%) scale(var(--scale)) rotateX(var(--baseX)) rotateY(var(--baseY)) rotate(calc(var(--baseZ) + var(--rotateZ)))}}#projects{position:relative;min-height:100svh;background:rgb(var(--bg-color))}#projects-section{display:flex;flex-direction:column;flex:1}#projects-header{position:static}#projects .section-title{font-family:DM Sans,sans-serif;font-weight:500;letter-spacing:.2rem;line-height:1.1}#projects-content{display:flex;flex:1}#projects-content>div{position:relative;flex-grow:1}#tsparticles{position:absolute;top:0;left:0;bottom:0;right:0;padding:0;margin:0;z-index:0}.project-bar{height:auto;min-width:3px;width:3px;max-width:3px;background:linear-gradient(#dbdbdb00,#dbdbdbaa,#dbdbdb00)}.project{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:6vw 3vw;gap:3vw;flex:1}.project iframe{aspect-ratio:16 / 9}#projects h3{margin:0;font-size:42px;color:#dbdbdb;font-weight:500;font-family:Space Mono,monospace}@media screen and (min-width: 2000px){#projects h3{font-size:58px}}@media screen and (max-width: 1450px){#projects h3{font-size:32px}}@media screen and (max-width: 1150px){#projects h3{font-size:26px}}@media screen and (max-width: 900px){#projects h3{font-size:22px}}@media screen and (max-width: 850px){#projects-content{flex-direction:column}.project-bar{height:auto;min-width:100%;width:100%;min-height:3px;height:3px;max-height:3px;background:linear-gradient(90deg,#dbdbdb00,#dbdbdbaa,#dbdbdb00)}.project{gap:4vw;padding:5vw 3vw}#projects h3{font-size:42px}}@media screen and (max-width: 700px){#projects h3{font-size:32px}}@media screen and (max-width: 550px){#projects h3{font-size:26px}}@media screen and (max-width: 450px){#projects h3{font-size:22px}}#footer{position:relative;background:rgb(var(--dark-bg-color))}#footer-section{display:flex;flex-direction:column;flex:1}#footer-content{display:flex;flex:1;align-items:center;justify-content:center;padding-block:10vh;opacity:1}#footer h3{margin:0;font-size:30px;color:#dbdbdb;font-weight:500;font-family:Space Mono,monospace}@media screen and (max-width: 650px){#footer-content{padding-block:5vh}#footer h3{font-size:18px}}
