@keyframes twinkle0{0%{transform:translateZ(0)}60%{transform:translate3d(10%,10%,-5px)}to{transform:translateZ(0)}}@keyframes twinkle1{0%{transform:translateZ(0)}60%{transform:translate3d(5%,20%,-5px)}to{transform:translateZ(0)}}@keyframes twinkle2{0%{transform:translateZ(0)}60%{transform:translate3d(10%,5%,-5px)}to{transform:translateZ(0)}}.twinkleWrapper{position:absolute}.twinkleWrapper.twinkle0{animation:animate-twinkle0 5s ease-in-out infinite}.twinkleWrapper.twinkle1{animation:animate-twinkle1 5s ease-in-out infinite}.twinkleWrapper.twinkle2{animation:animate-twinkle2 5s ease-in-out infinite}.twinkleWrapper path{stroke:var(--dark)}.service{display:block;height:407px;width:442px;position:relative;background:url(/service_path.svg) no-repeat;border-radius:2rem;flex:0 1 auto}@media(max-width:724px){.service{width:100%;background:#fff;flex:0 0 auto}}.service .content{height:100%;padding:1.5rem;border-radius:2rem;box-sizing:border-box;display:inline-flex;flex-direction:column;justify-content:space-between;display:flex;gap:3rem}.service .content .desc{width:75%}@media(max-width:724px){.service .content .desc{width:100%}}.service .link{color:var(--primary);background-color:var(--dark);font-weight:700;padding:.25rem .5rem;border-radius:.75rem;height:max-content;position:absolute;bottom:1rem;width:max-content;left:calc(100% - 100px)}@media(max-width:724px){.service .link{top:4rem;left:1.5rem}}.section{width:var(--sectionWidth);padding:6rem 1rem 1rem;margin:auto;background-color:var(--dark);border-radius:2rem;position:relative}.section h2{color:var(--text-light);font-size:var(--sectionTitle);position:absolute;top:-1.5rem}@media(max-width:724px){.section h2{top:-1rem;font-size:4rem}}.section h2 span{color:var(--primary)}.services{display:flex;flex-direction:row;justify-content:space-around;gap:1rem;color:var(--text-dark)}@media(max-width:724px){.services{flex-direction:column}}.service[data-astro-cid-ffwa4nth]{display:block;height:407px;width:442px;position:relative;background:url(/service_path.svg) no-repeat;border-radius:2rem;flex:0 1 auto}@media(max-width:724px){.service[data-astro-cid-ffwa4nth]{width:100%;background:#fff;flex:0 0 auto}}.service[data-astro-cid-ffwa4nth] .content[data-astro-cid-ffwa4nth]{height:100%;padding:1.5rem;border-radius:2rem;box-sizing:border-box;display:inline-flex;flex-direction:column;justify-content:space-between;display:flex;gap:3rem}.service[data-astro-cid-ffwa4nth] .content[data-astro-cid-ffwa4nth] .desc[data-astro-cid-ffwa4nth]{width:75%}@media(max-width:724px){.service[data-astro-cid-ffwa4nth] .content[data-astro-cid-ffwa4nth] .desc[data-astro-cid-ffwa4nth]{width:100%}}.service[data-astro-cid-ffwa4nth] .link[data-astro-cid-ffwa4nth]{color:var(--primary);background-color:var(--dark);font-weight:700;padding:.25rem .5rem;border-radius:.75rem;height:max-content;position:absolute;bottom:1rem;width:max-content;left:calc(100% - 100px)}@media(max-width:724px){.service[data-astro-cid-ffwa4nth] .link[data-astro-cid-ffwa4nth]{top:4rem;left:1.5rem}}.section[data-astro-cid-ffwa4nth]{width:var(--sectionWidth);padding:6rem 1rem 1rem;margin:auto;background-color:var(--dark);border-radius:2rem;position:relative}.section[data-astro-cid-ffwa4nth] h2[data-astro-cid-ffwa4nth]{color:var(--text-light);font-size:var(--sectionTitle);position:absolute;top:-1.5rem}@media(max-width:724px){.section[data-astro-cid-ffwa4nth] h2[data-astro-cid-ffwa4nth]{top:-1rem;font-size:4rem}}.section[data-astro-cid-ffwa4nth] h2[data-astro-cid-ffwa4nth] span[data-astro-cid-ffwa4nth]{color:var(--primary)}.services[data-astro-cid-ffwa4nth]{display:flex;flex-direction:row;justify-content:space-around;gap:1rem;color:var(--text-dark)}@media(max-width:724px){.services[data-astro-cid-ffwa4nth]{flex-direction:column}}#projects.section{min-height:300px;color:var(--text-light);width:var(--sectionWidth);padding:0rem;margin:auto;background-color:var(--dark);border-radius:1rem;position:relative;overflow:hidden;padding:3rem 0 5rem}#projects.section .projectsWrapper{display:flex;gap:1rem;height:500px;padding:2rem;z-index:10;flex-direction:row}#projects.section .projectsWrapper .hoverWrapper{cursor:pointer;flex:0 1 140px;height:500px;overflow:hidden;border-radius:2rem;transition:all .2s;position:relative}#projects.section .projectsWrapper .hoverWrapper .overlay{position:absolute;background:var(--dark);inset:0;z-index:1;opacity:.4;pointer-events:none}#projects.section .projectsWrapper .hoverWrapper.open{flex-basis:500px;transition:all .2s}#projects.section .projectsWrapper .hoverWrapper.open .overlay{opacity:0}#projects.section .projectsWrapper .hoverWrapper .projectLink{display:none;position:absolute;bottom:.5rem;right:1rem;width:50%;text-align:center;color:var(--primary);font-weight:700;padding:.25rem .5rem;border-radius:.75rem;height:max-content}#projects.section .projectsWrapper .hoverWrapper .projectLink.openLink{display:block}@media(max-width:724px){#projects.section .projectsWrapper .hoverWrapper .projectLink{background:var(--dark)}}#projects.section .projectsWrapper .project{position:relative;background:var(--primary);height:500px;clip-path:url(#svgPath)}@media(max-width:724px){#projects.section .projectsWrapper .project{height:100%}}#projects.section .projectsWrapper .project .projectName{position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;z-index:10;writing-mode:vertical-rl;text-orientation:mixed}@media(max-width:724px){#projects.section .projectsWrapper .project .projectName{writing-mode:horizontal-tb;text-orientation:initial}}#projects.section .projectsWrapper .project .projectImage{display:block;height:100%;width:100%;overflow:hidden;border-radius:1rem}#projects.section .projectsWrapper .project .projectImage img{position:relative;transform:translate(-50%);left:50%}@media(max-width:724px){#projects.section .projectsWrapper .project .projectImage img{transform:translate(-50%,-50%);left:50%;top:50%}}@media(max-width:724px){#projects.section .projectsWrapper{flex-direction:column}}#projects.section .sectionTitle{color:var(--text-light);font-size:var(--sectionTitle);margin-bottom:1.5rem;position:absolute;top:-1.5rem;z-index:1}#projects.section .sectionTitle:before{content:"";display:block;background:var(--dark);z-index:-1;width:88.5%;height:70%;position:absolute;top:1rem}@media(max-width:724px){#projects.section .sectionTitle{top:-1rem;font-size:4rem}}#projects.section .slashes{user-select:none;font-family:Maple Sundae Sans;display:block;font-size:var(--sectionTitle);color:var(--text-light);width:max-content;letter-spacing:1rem}#projects.section .slashesTop{position:absolute;top:-1.7rem}#projects.section .slashesBottom{font-size:3rem;position:absolute;bottom:-1.5rem}#projects.section .chacha{display:inline-block;animation:chacha-real-smooth 60s linear infinite}@keyframes chacha-real-smooth{0%{transform:translate(0)}to{transform:translate(-100%)}}.main{display:flex;flex-direction:column;gap:32px}.main .hero{margin:auto;width:clamp(300px,90vw,1029px);display:grid;grid-template-columns:var(--colWidth) 1fr;grid-template-rows:1fr 1fr;gap:3rem}@media(max-width:724px){.main .hero{grid-template-rows:auto}}.main .hero .small{font-size:4rem}.main .hero .big{font-size:clamp(2rem,2rem + 5vw,6rem);line-height:111%}.main .keyboard{grid-row:1/3;position:relative;align-self:stretch;justify-self:stretch}.main .keyboard .twinkle1{position:absolute;display:block;top:10px;left:120px}.main .keyboard .twinkle2{position:absolute;top:60px;left:135px;animation-delay:2s}.main .keyboard .twinkle3{position:absolute;bottom:70px;right:-60px;animation-delay:1s}.main .keyboard .image{position:absolute;bottom:100px;left:-100px}.main .keyboard svg{filter:drop-shadow(0 4px 10px var(--primary));position:absolute;bottom:0;z-index:-1}.main .keyboard span svg{filter:drop-shadow(0px 0px 0px transparent)}@media(max-width:724px){.main .keyboard{display:none}}
