.nav{display:flex;justify-content:space-between;align-items:center;padding:1em 1.5em;position:fixed;inset:0 0 auto;overflow:hidden;z-index:100;background-color:var(--neutral-380);transition:all var(--ease-out-sine) var(--ms200);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.nav.nav-fixed{padding-block:.5em;box-shadow:0 0 .5em var(--primary-450)}.nav-logo-box{display:flex;align-items:center;text-decoration:none;color:var(--primary-600)}.nav-logo-icon{height:1.25rem;display:inline-block}.nav-logo-text{font-size:var(--fs-xl);font-family:var(--ff-sans-title);font-weight:600;letter-spacing:1px;margin-left:-2px}.nav-links-box{display:flex;gap:2.375rem;align-items:center}.nav-links{font-family:var(--ff-sans-title);font-weight:600;font-size:var(--fs-xs);letter-spacing:.25px;text-decoration:none;display:block;color:var(--neutral-800);position:relative}.nav-links:not(.resume):after{content:"";height:2px;width:100%;background-color:var(--primary-600);position:absolute;left:0;bottom:-.125rem;transform:scale(0);transform-origin:center;transition:all var(--ease-out-quad) var(--ms200)}.nav-links:not(.resume):is(:hover,:active,:focus){color:var(--neutral-700)}.nav-links:not(.resume):is(:hover,:active,:focus):after{transform:scale(1)}.nav-links.resume{color:var(--neutral-400);background-color:var(--primary-600);padding:.75em 2em;border-radius:2em;transition:all var(--ease-out-sine) var(--ms200)}.nav-links.resume:is(:hover,:active,:focus){background-color:var(--primary-570);box-shadow:var(--box-shadow-btn)}.nav-menu{display:none}@media only screen and (max-width: 50em){.nav{padding:1.5rem;position:fixed;overflow:visible}.nav-menu{display:block;height:2rem}.nav-logo-icon{max-height:2rem;display:inline-block}.nav-logo-text{font-size:var(--fs-base)}.nav-links-box{display:none;position:fixed;inset:5em 0 auto 0;padding-block:2em;background-color:var(--neutral-400);box-shadow:0 100vh 0 100vh var(--neutral-670);transition:box-shadow var(--ease-out-sine) var(--ms200);transform:translateY(-20%);z-index:0}.nav-links{font-size:var(--fs-base)}.nav-links-box.expanded{display:flex;flex-direction:column;gap:2.25rem;animation:menu-open var(--ease-out-sine) var(--ms300) forwards;z-index:100}.nav-links-box.expanded.fix{top:3.5em}.nav.nav-fixed{padding-block:.75em}}.footer{border:0;padding-block:2.5em}.footer .text-box{margin-inline:auto}.footer .text-box .text{font-family:var(--ff-sans-body);font-size:calc(var(--fs-xs) - .125em);font-weight:500;color:var(--neutral-800);text-align:center}.text-box .text .highlight{color:var(--neutral-800);font-weight:700;text-decoration:none;transition:all var(--ease-out-sine) var(--ms200);position:relative;cursor:pointer}.text-box .text .highlight:is(:hover,:focus-within){color:var(--primary-600)}.hero{min-height:100vh;max-width:var(--body-max-w);margin:0 auto;display:flex;padding:15rem 4rem}.hero .hero-box{display:grid;grid-template-columns:repeat(2,1fr)}.hero .text-box{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left}.hero .hello-wrld{font-size:var(--fs-lg);font-family:var(--ff-mono);font-weight:700;letter-spacing:.1px;color:var(--neutral-750);max-width:fit-content;overflow:hidden;white-space:nowrap;border-right:2px solid var(--primary-570);width:0;animation:type calc(var(--s5) + var(--ms500)) steps(67,jump-end) forwards,blink var(--ms900) steps(1,jump-end) 3 forwards;animation-delay:var(--ms300),var(--s3)}.hero .title{font-size:var(--fs-6xl);font-family:var(--ff-sans-title);font-weight:900;color:var(--neutral-800);letter-spacing:.25px;margin-block:.25em;line-height:1}.name{position:relative}.hero .title .name:after{content:"";position:absolute;width:0;height:.125em;background-color:var(--primary-600);left:0;bottom:0;animation:underline var(--ms500) var(--ease-in-out-quad) both;animation-delay:calc(var(--s2) + var(--ms600))}.hero .sub-title{font-size:calc(var(--fs-4xl) - .125rem);font-family:var(--ff-sans-title);letter-spacing:.2px;font-weight:800;color:var(--neutral-750);line-height:1.1}.hero .intro{font-size:var(--fs-lg);font-family:var(--ff-sans-body);font-weight:400;color:var(--neutral-700);line-height:1.75em;max-width:52ch;margin-block-start:1.25em}.hero .intro .status{font-weight:500;color:var(--neutral-800)}.btn-box .btn{font-family:var(--ff-sans-title);font-weight:600;letter-spacing:.25px;text-decoration:none;color:var(--neutral-400);max-width:fit-content;display:block;margin-block:1.5rem;padding:.75em 2em;background-color:var(--primary-600);border-radius:2em;transition:all var(--ease-out-sine) var(--ms200);margin-block:2em;font-size:var(--fs-base)}.btn-box .btn:is(:hover,:active,:focus){background-color:var(--primary-570);box-shadow:var(--box-shadow-btn)}.hero .image-box{display:flex;justify-content:flex-end;align-items:center}.hero .image-wrapper{max-width:16.5rem;min-height:18rem;display:flex;align-items:flex-end;border-radius:0 0 50em 50em;overflow:hidden;position:relative;transition:transform var(--ease-out-quad) var(--ms-150)}.hero .image-wrapper .background{width:16.5rem;aspect-ratio:1 / 1;border-radius:50em;background-color:var(--primary-600)}.hero .image-wrapper .profile{position:absolute;z-index:10;top:.5rem;transition:transform var(--ease-in-out-cubic) var(--ms300)}.hero .image-wrapper:hover .profile{transform:scale(1.03) translateY(-1.125rem)}.hero .wrapper{position:relative;margin-top:-14rem}.hero .wrapper .tag-box{position:absolute;top:-1.125rem;right:-2.5rem;background-color:var(--neutral-800);border-radius:.25em;padding:.5em .75em;transition:all var(--ease-in-out-cubic) var(--ms300);z-index:20;visibility:hidden;opacity:0}.hero .wrapper .tag{font-size:calc(var(--fs-xs) - .0625rem);font-family:var(--ff-mono);font-weight:500;letter-spacing:.25px;color:var(--neutral-400)}.hero .wrapper .tag .wave{animation:wave var(--s2) infinite;transform-origin:70% 70%;display:inline-block}.hero .wrapper .tag:after{position:absolute;content:"";height:10px;width:10%;left:.75rem;bottom:-8px;background-color:var(--neutral-800);clip-path:polygon(50% 100%,0 0,100% 0)}.hero .wrapper:is(:hover,:active,:focus) .tag-box{visibility:visible;opacity:1;transform:translateY(-.75rem)}.hero .wrapper:is(:hover,:active,:focus) .wave{animation:wave var(--s2) infinite;transform-origin:70% 70%;display:inline-block}@media only screen and (min-width: 1100px){.hero .title .break{display:none}}@media only screen and (max-width: 50em){.hero{display:block;min-height:auto;padding:0 1.5rem;margin-inline:unset}.hero .hero-box{grid-template-columns:1fr;gap:2.5rem}.hero .intro{font-size:var(--fs-base)}.hero .image-box{grid-row:1;justify-content:center;margin-top:7rem}.hero .text-box{text-align:center;align-items:center}.hero .hello-world{margin-inline:auto;animation:none;width:100%;border:none}.hero .title{margin-block:1rem}.hero .title .name:after{animation-delay:.5s}.hero .intro{margin-inline:auto;font-size:var(--fs-base)}.hero .text-box .btn{margin-inline:auto}.hero .image-wrapper .profile{z-index:unset;top:1rem}.hero .wrapper{margin-top:auto}.hero .image-wrapper,.hero .image-wrapper .background{max-width:10rem}.hero .image-wrapper{min-height:auto}.hero .wrapper .tag-box{right:-4.5rem;top:-1rem}.hero .wrapper .tag{font-size:.75rem}}.projects{max-width:1356px;margin-inline:auto;padding:4.5rem 4rem}.projects .title{font-size:var(--fs-2xl);font-family:var(--ff-sans-title);font-weight:800;letter-spacing:.25px;color:var(--neutral-800);margin-inline:auto;max-width:fit-content;position:relative;margin-block-end:.5em}.projects .title:after{content:"";position:absolute;width:100%;height:.125em;background-color:var(--primary-600);bottom:-4px;left:0}.projects .sub-title{font-size:var(--fs-xl);font-family:var(--ff-sans-title);font-weight:700;text-align:center;color:var(--neutral-750)}.project-box{display:grid;grid-template-columns:repeat(1,1fr);gap:6rem;margin-block-start:5rem}.text-box{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left}.sample-box{display:flex;flex-direction:row;gap:1.5rem}.sample-box:nth-child(2n){flex-direction:row-reverse}.project-title{font-family:var(--ff-sans-title);font-size:var(--fs-xl);font-weight:700;color:var(--neutral-800);margin-block-end:1rem}.project-info{font-family:var(--ff-sans-body);font-size:var(--fs-base);font-weight:400;color:var(--neutral-700);max-width:52ch;line-height:1.75rem;text-align:left}.sample-box .stack{display:flex;gap:1rem;margin-block:1.75rem;flex-wrap:wrap}.sample-box .stack .item{font-family:var(--ff-mono);font-size:var(--fs-xs);font-weight:500;background-color:var(--primary-430);color:var(--primary-600);padding:.5em .75em;border-radius:.25em;letter-spacing:.15px}.image-box{flex-basis:60%}.text-box .external-links{display:flex;gap:.75rem}.text-box .external-links .link{transition:all var(--ease-out-sine) var(--ms200);font-size:1.5rem;color:var(--primary-570)}.text-box .external-links .link:is(:hover,:active,:focus){transform:translateY(-.125em);color:var(--primary-600)}.image-box .sample{margin-inline:auto;max-width:85%;opacity:.8;filter:saturate(10%) drop-shadow(.5em .5em .25em var(--primary-450));transition:all var(--ease-in-out-quad) var(--ms300);border-radius:12px}.sample-box:nth-child(2n) .image-box .sample{filter:saturate(10%) drop-shadow(-.5em .5em .25em var(--primary-450))}.sample-box .image-box .sample:hover{filter:none;opacity:1;transform:translateY(-.25em)}@media only screen and (max-width: 50em){.projects{padding:4rem 1.5rem}.projects .title{font-size:var(--fs-xl)}.projects .sub-title,.project-title{font-size:var(--fs-lg)}.projects .sub-title{margin-bottom:2em}.project-box{gap:3.5rem;margin-block-start:4rem}.project-box .sample-box{display:grid}.project-box .sample-box{border-bottom:1px solid var(--primary-450)}.text-box .external-links{margin-inline:auto;padding-block-end:1.5rem}.sample-box .image-box{grid-row:1;display:flex;align-items:flex-end}.sample-box .image-box .sample,.sample-box:nth-child(2n) .image-box .sample{max-width:100%;filter:drop-shadow(.5em .5em .25em var(--primary-450));opacity:1}.sample-box .image-box .sample:hover{transform:none;filter:drop-shadow(.5em .5em .25em var(--primary-450));opacity:1}}.show-more{display:flex;flex-direction:column;margin-block-start:4rem;position:relative}.show-more-btn{background-color:transparent;cursor:pointer;border:none;font-family:var(--ff-sans-title);font-size:var(--fs-sm);font-weight:600;color:var(--primary-500);letter-spacing:.25px;transition:all var(--ease-out-sine) var(--ms200);position:relative}.show-more-btn:hover{color:var(--primary-600);text-shadow:0 0 .25em var(--primary-500)}.show-more-btn:focus{outline:none}.show-more-btn:before,.show-more-btn:after{content:"";position:absolute;background-color:var(--primary-450);height:1px;width:40%;top:50%}.show-more-btn:before{left:0}.show-more-btn:after{right:0}.show-more .more-box{margin-block-end:5rem}.show-more .more{display:grid;grid-template-columns:repeat(auto-fill,minmax(24rem,1fr));word-wrap:break-word;gap:2.125rem}.more .card{padding:1.5em;background-color:var(--neutral-410);border:1px solid var(--primary-450);border-radius:.5em;display:block;color:var(--neutral-800);text-decoration:none;margin-inline:auto;transition:all var(--ease-in-out-quad) var(--ms300);overflow:hidden;cursor:pointer}.more .card:is(:hover,:active,.card:is(:hover,:active,:focus-within)){transform:translateY(-.125em);box-shadow:0 .125em .375em var(--primary-450);border-color:var(--primary-500)}.more .card:is(:hover,:active,:focus-within) .relevant .name{color:var(--primary-600)}.card .relevant{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1.5rem}.card .decoration{font-size:2rem;color:var(--primary-450);margin-bottom:1.125rem}.relevant .name{font-family:var(--ff-sans-title);font-size:var(--fs-base);font-weight:700;color:var(--neutral-700);transition:all var(--ease-in-out-quad) var(--ms300)}.relevant .external-links-box{display:flex;gap:.75em}.relevant .external-link{display:block;font-size:1.375rem;color:var(--primary-570);transition:all var(--ease-out-sine) var(--ms200)}.relevant .external-link:is(:hover,:active,:focus){color:var(--primary-600);transform:translateY(-.125em)}.card .info{font-family:var(--ff-sans-body);font-size:var(--fs-xs);font-weight:400;color:var(--neutral-700);max-width:52ch;line-height:1.5rem;padding-block:1.125em}.card .stack{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.5em}.card .stack .item{font-family:var(--ff-mono);font-weight:500;font-size:var(--fs-xs);padding:.5em .75em;border-radius:.25em;background-color:var(--primary-430);color:var(--primary-600)}@media only screen and (max-width: 50em){.show-more{margin-block-start:1.5rem}.show-more-btn:after,.show-more-btn:before{display:none}.show-more .more-box{margin-block-end:2.25rem}}@media only screen and (max-width: 430px){.show-more .more{grid-template-columns:1fr}.card .relevant{flex-direction:column;align-items:center}.card .stack{justify-content:center}}.connect{max-width:1356px;margin-inline:auto;padding-inline:4rem;padding-block:4rem 10rem}.upper-connect{margin-bottom:2.5rem;margin-inline:auto;text-align:center;max-width:fit-content;border-bottom:1px solid var(--primary-450)}.upper-connect .title{font-family:var(--ff-sans-title);font-size:var(--fs-2xl);font-weight:800;letter-spacing:.25px;color:var(--neutral-800);margin-block-end:.5em;position:relative;max-width:fit-content;margin-inline:auto}.upper-connect .title:after{content:"";position:absolute;width:100%;bottom:-5px;height:.125em;left:0;background-color:var(--primary-600)}.upper-connect .sub-title{font-family:var(--ff-sans-title);font-size:var(--fs-xxl);font-weight:700;color:var(--neutral-750)}.upper-connect .text{font-family:var(--ff-sans-body);font-size:var(--fs-base);font-weight:400;color:var(--neutral-700);max-width:55ch;line-height:1.75rem;margin-inline:auto;margin-block:1.125em}.text .bold{font-weight:500;color:var(--neutral-800)}.upper-connect .btn{margin-inline:auto}.connect-links{display:flex;gap:1.375rem;justify-content:center}.connect-links .link{display:block;font-size:1.625rem;color:var(--primary-570);transition:all var(--ease-out-sine) var(--ms200)}.connect-links .link:is(:hover,:active,:focus){color:var(--primary-600);transform:translateY(-.125em)}@media only screen and (max-width: 50em){.connect{display:block;padding-block:5rem 6rem;padding-inline:1.5rem}.upper-connect .title{font-size:var(--fs-xl)}.upper-connect .sub-title{font-size:var(--fs-lg)}.upper-connect .text{font-size:var(--fs-base)}}.about{max-width:1356px;margin-block-end:3rem;padding-inline:4rem;padding-block-start:5rem;margin-inline:auto}.text-box{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;margin-inline:auto;max-width:62.5ch}.about .title{font-size:var(--fs-xxl);font-family:var(--ff-sans-title);font-weight:800;letter-spacing:.25px;color:var(--neutral-800);margin-block-end:1rem;position:relative;max-width:fit-content}.about .title:after{left:0;bottom:0;content:"";position:absolute;width:100%;height:.125em;background-color:var(--primary-600)}.about .text{font-size:var(--fs-base);font-family:var(--ff-sans-body);color:var(--neutral-700);line-height:2rem;margin-block:.75rem;max-width:72ch}.about .text .bold{font-weight:500;color:var(--neutral-800)}.about .text .italic{font-style:italic}.about .text .mono{font-weight:500;font-family:var(--ff-mono);color:var(--neutral-800)}@media only screen and (max-width: 50em){.about{margin-block-start:0;padding-inline:1.5rem;padding-block-start:1.5rem}.about .title{font-size:var(--fs-xl)}.about .text-box{text-align:left}}.side-links{display:flex;flex-direction:column;align-items:center;gap:.75em;position:fixed;bottom:0;left:1.5em;z-index:30}.side-links .links-box{display:flex;flex-direction:column;gap:.75em}.side-links .links-box .link{display:block;text-decoration:none;color:var(--primary-570);transition:all var(--ease-out-sine) var(--ms200);font-size:1.75rem}.side-links .decoration{width:1px;height:4rem;background-color:var(--primary-500)}.side-links .links-box .link:is(:hover,:active,:focus){color:var(--primary-600);transform:translateY(-.125em)}@media only screen and (max-width: 50em){.side-links{display:none}}.side-mail{display:flex;flex-direction:column;align-items:center;gap:4.75em;position:fixed;right:-2.5em;bottom:0;z-index:30}.side-mail .mail{transform:rotate(90deg);text-decoration:none;color:var(--primary-570);font-family:var(--ff-mono);font-size:var(--fs-sm);font-weight:700;transition:all var(--ease-out-sine) var(--ms200)}.side-mail .mail:is(:hover,:active,:focus){color:var(--primary-600)}.side-mail .decoration{width:1px;height:4rem;background-color:var(--primary-500)}@media only screen and (max-width: 50em){.side-mail{display:none}}@tailwind base;@tailwind components;@tailwind utilities;*,:before,:after{border-width:0;border-style:solid;margin:0;padding:0;box-sizing:border-box}html,body{scroll-behavior:smooth}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}ol,ul{list-style:none;margin:0;padding:0}img,svg,video,canvas,audio,iframe,embed,object{display:block}img,video{max-width:100%;height:auto}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}@keyframes menu-open{0%{transform:translateY(-20%);opacity:0;z-index:0}to{transform:translateY(0);opacity:1;z-index:50}}@keyframes underline{0%{width:0}to{width:100%}}@keyframes blink{0%,to{border-color:transparent}50%{border-color:var(--primary-570)}}@keyframes type{0%{width:0}to{width:100%}}@keyframes scale{0%{transform:scale(0)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes disappear{0%{opacity:1}to{opacity:0}}@keyframes wave{0%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}60%{transform:rotate(0)}to{transform:rotate(0)}}:root{--primary-430: hsl(16, 39%, 89%);--primary-450: hsl(16, 41%, 84%);--primary-500: hsl(14, 51%, 75%);--primary-570: hsl(347, 50%, 60%);--primary-600: hsl(346, 66%, 44%);--primary-650: hsl(287, 18%, 64%);--neutral-380: hsl(50, 21%, 95%, .8);--neutral-400: hsl(50, 21%, 95%);--neutral-410: hsl(38, 8%, 72%, .1);--neutral-450: hsl(40, 9%, 80%);--neutral-500: hsl(38, 8%, 72%);--neutral-670: hsl(236, 20%, 32%, .3);--neutral-700: hsl(236, 20%, 32%);--neutral-750: hsl(234, 5%, 58%);--neutral-800: hsl(225, 62%, 10%);--ff-sans-title: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;--ff-sans-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;--ff-mono: "Spline Sans Mono", monospace;--fs-xs: .875rem;--fs-sm: .9375rem;--fs-base: 1rem;--fs-lg: 1.125rem;--fs-xl: 1.25rem;--fs-xxl: 1.5rem;--fs-2xl: 1.75rem;--fs-3xl: 2rem;--fs-4xl: 2.5rem;--fs-5xl: 3rem;--fs-6xl: 3.5rem;--ease-out-quad: cubic-bezier(.25, .46, .45, .94);--ease-out-cubic: cubic-bezier(.215, .61, .355, 1);--ease-out-expo: cubic-bezier(.95, .05, .795, .035);--ease-out-sine: cubic-bezier(.39, .575, .565, 1);--ease-in-out-quad: cubic-bezier(.455, .03, .515, .955);--ease-in-out-cubic: cubic-bezier(.645, .045, .355, 1);--ease-in-out-expo: cubic-bezier(1, 0, 0, 1);--ease-in-out-sine: cubic-bezier(.445, .05, .55, .95);--ms50: 50ms;--ms100: .1s;--ms150: .15s;--ms200: .2s;--ms250: .25s;--ms300: .3s;--ms350: .35s;--ms400: .4s;--ms450: .45s;--ms500: .5s;--ms550: .55s;--ms600: .6s;--ms650: .65s;--ms700: .7s;--ms750: .75s;--ms800: .8s;--ms850: .85s;--ms900: .9s;--ms950: .95s;--s1: 1s;--s2: 2s;--s3: 3s;--s4: 4s;--s5: 5s;--body-max-w: 1356px;--box-shadow-btn: 0 .125em .5em var(--neutral-450)}body{background-color:var(--neutral-400);font-family:var(--ff-sans-body)}::-webkit-scrollbar{width:.9375em;box-sizing:border-box}::-webkit-scrollbar-track{background-color:transparent}::-webkit-scrollbar-thumb{background-color:var(--neutral-500);outline:2px transparent;border-radius:50em;border:3px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background-color:var(--primary-600)}main{position:relative}@media (max-width: 50em){:root{--fs-4xl: 1.75rem;--fs-6xl: 2.25rem}}