::-webkit-scrollbar{width:7px;height:5px}::-webkit-scrollbar-thumb{background:#292929;height:86px;border-radius:25px}::-webkit-scrollbar-track{background-color:transparent}*,*:after,*:before{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:auto;-webkit-tap-highlight-color:transparent}body{background:#0b0b0b;color:#fff;cursor:url(/hero/illustrations/cursor.svg),auto!important;text-rendering:optimizelegibility}a{color:inherit}a:is(:hover,:active){cursor:url(/hero/illustrations/link-cursor.svg),auto!important}a:active{color:#6d748d}h3{font-size:3rem;text-align:center;display:inline-block}.gradient{background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}h3.grad-text{color:#ffffffb3;background:linear-gradient(115deg,#fff,#ffffff26 45%,#fff);font-weight:600;text-transform:lowercase;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.tech-tools,.works,.writings,.status{text-align:center;overflow-x:hidden;position:relative}section{padding-block:2.5%;padding-inline:5%}@media screen and (max-width: 500px){section{padding-block:.75rem;padding-inline:1.25rem}}.writings{padding-left:0;padding-right:0%}nav.header{background:none;z-index:10;position:fixed;top:0;left:0;max-width:105px;filter:drop-shadow(2px 4px 6px black)}.header svg{width:100%;border-radius:inherit}.header a{display:inline-flex;border-radius:0% 100% 100% 0%/100% 0%}.navigation{display:flex;align-items:center;justify-content:space-between;height:10vh;background:#161616;position:sticky;top:-1;box-shadow:0 2px 6px -4px #0000008a;z-index:5;padding:0 10px}.hero{min-height:var(--vh, 100lvh);display:flex;align-items:center;background-image:url(/hero/illustrations/background/hero-bg.webp);background-size:cover;background-position:bottom center;background-repeat:no-repeat}.hero .hero-wrapper{--niche-color: #9f7d5f;width:min(685px,100%);margin-inline:auto}.hero .hero-wrapper h1{text-align:center;font-family:General Sans,system-ui;font-size:clamp(3.438rem,9vw + 1rem,8.125rem);font-weight:700;line-height:101.1%;color:#ffffff82;text-transform:uppercase}@property --font-wt{syntax: "<number>"; initial-value: 700; inherits: false;}.hero .hero-wrapper h1.doTheThing .letter{--letter_dur: .8s;font-weight:var(--font-wt);animation:changeWeight var(--letter_dur) linear forwards;animation-duration:var(--letter_dur);animation-delay:calc((var(--delay) * .1s));transform-origin:left bottom}.hero .hero-wrapper h1.doTheThing .letter{position:relative;display:inline-block}@keyframes changeWeight{50%{--font-wt: 350}to{--font-wt: 700}}.hero .hero-wrapper h1 .letter:before{position:absolute;color:var(--niche-color);font-family:Pacifico,cursive;font-size:clamp(1.25rem,1vw + 1rem,1.875rem);line-height:91.125%;text-transform:none;opacity:0;font-weight:400;-webkit-text-fill-color:var(--niche-color);animation:showUp ease-in-out forwards;animation-duration:calc(var(--letter_dur) + .2s)}@keyframes showUp{to{opacity:1}}.hero .hero-wrapper h1 .letter-4:before{content:"frontend";transform:translate(-25px,-18px) rotate(-16.289deg);animation-delay:calc(var(--letter_dur) + .1s)}.hero .hero-wrapper h1 .letter-12:before{content:"design";transform:translate(100%,5px) rotate(15deg);animation-delay:calc(var(--letter_dur) + .2s);right:0}.hero .hero-wrapper h1 .letter-8:before{content:"writing";transform:translate(-100%,2px) rotate(-15deg);left:15px;animation-delay:calc(var(--letter_dur) + .3s)}.tech-tools .tech_tools{--min-height: calc(var(--vh, 100lvh) * .5);min-height:var(--min-height, 50lvh);display:flex;flex-direction:column;align-items:center}.tech-tools .tech_tools .tech_tools-list{display:flex;margin-top:2.5rem;list-style-type:none;flex-wrap:wrap;gap:.5rem;font-size:1.25rem;justify-content:center;width:min(930px,100%);overflow:clip;position:relative}.tech-tools .tech_tools .tech_tools-list:before{content:"";position:absolute;background-image:linear-gradient(90deg,#0000,#0b0b0bcc,#0000);z-index:2;height:70vmax;width:40%;translate:0 -50%;top:50%;rotate:40deg;transform:translate(-50vmax);transition:transform .8s cubic-bezier(0,.7,1,.3)}.tech-tools .tech_tools .tech_tools-list.show:before{transform:translate(50vmax)}@media screen and (max-width: 500px){.tech-tools .tech_tools .tech_tools-list{font-size:1rem;margin-top:1.5rem;margin-bottom:1.5rem}}.tech_tools .tech_tools-list .tech_tools-item{position:relative;border-radius:4px;color:#fff;padding:1px}.tech_tools .tech_tools-list .tech_tool_name{display:flex;align-items:center;padding:.75rem;gap:.5rem;user-select:none;-webkit-user-select:none}@media (hover){.tech-tools .tech_tools-item:before{content:"";width:100%;height:100%;left:0;top:0;opacity:0;z-index:0;border-radius:inherit;position:absolute;background-image:radial-gradient(80px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.5),transparent 40%)}.tech-tools .tech_tools-list:hover>.tech_tools-item:before{opacity:1}.tech-tools .tech_tools-item:hover:after{opacity:1}.tech-tools .tech_tools-item:after{content:"";border-radius:inherit;width:100%;height:100%;position:absolute;opacity:0;left:0;top:0;z-index:2;transition:opacity .2s linear;background-repeat:no-repeat;background-image:radial-gradient(90px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.07),transparent 50%)}}.tech_tools .tech_tools-list .tech_tool_name:before{content:var(--before);line-height:0}.tech-tools .tech_tools-item .tech_tool_name{border-radius:5px;background-color:#171717;position:relative;z-index:1}.works_wrapper{margin:2.5rem auto 0;display:grid;width:100%;justify-content:center;gap:2rem}.work_container{width:18.75rem;height:12.5rem;border-radius:10px;position:relative;display:flex;flex-direction:column;justify-content:end}.work_container figure{width:100%;height:100%;position:relative}.work_container .cover-photo{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-select:none}.work_container h5:nth-child(1){font-size:1rem;color:#18cdca;font-weight:500}.work_container h5:nth-child(2){margin-top:.3rem;font-size:.7rem}.work_container a{color:#18cdca}@media screen and (min-width: 500px){.works_wrapper .hidden,.blogs-wrapper .hidden{opacity:0;filter:blur(5px);transform:translateY(20px);transition:transform .2s,border-radius .125s;transition-delay:calc(.2s * var(--delay));will-change:transform}.works_wrapper .show,.blogs-wrapper .show{opacity:1;filter:blur(0);transform:translateY(0)}}.work_container:nth-child(odd){--delay: 1}.work_container:nth-child(2n){--delay: 2}@media screen and (min-width: 768px){h3{font-size:4rem}}.blogs-wrapper{margin:2.5rem auto 0px;width:90%}@media screen and (max-width: 500px){.blogs-wrapper{margin-block:1.5rem}}.feat-blogs>a{padding:.8em 1em;font-size:1rem;background-color:#212121;border-radius:18px;display:inline-block;text-decoration:none;font-weight:600;margin:15px auto;transition:border-radius .2s ease-in}.feat-blogs>a:hover{border-radius:13px}.blogs-wrapper{display:flex;justify-content:center;align-items:center;gap:15px;flex-wrap:wrap}.blog{--padding: .75rem;--border-radius: 1.5em;max-width:400px;width:100%;background:#ffffff0a;border-radius:var(--border-radius);padding:var(--padding);transition:border-radius .2s ease-in;position:relative}.blog-title{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.blog img{transition:inherit;width:100%;object-fit:cover;border-radius:calc(var(--border-radius) - var(--padding))}.blog-title{font-weight:500;font-size:2rem;line-height:1.212;text-align:left;margin-bottom:5px;color:#b9b9b9}.blog p{font-weight:400;font-size:1rem;text-align:left}.read-more{margin-top:15px;display:block;text-align:right;background:linear-gradient(268.53deg,#ffffff82 11.55%,#a4a4a482 93.44%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.read-more:before{content:"";position:absolute;inset:0}@media screen and (max-width: 500px){.blogs-wrapper,.works_wrapper{--gradient: linear-gradient( 90deg, rgb(255, 255, 255) 12%, rgb(255, 255, 255) 75%, rgba(0, 0, 0, 0) 100% );overflow-x:scroll;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;justify-content:normal;mask:var(--gradient);-webkit-mask:var(--gradient)}.works_wrapper{display:flex}.blog,.work_container{scroll-snap-align:center;flex-shrink:0;margin-bottom:7px}.writings,.works{padding-left:0;padding-right:0%}.blog{padding:10px}.blog-title{font-size:1.2rem}.blog p{font-size:1rem}}@media screen and (min-width: 420px){.work_container{width:380px;height:250px}}@media screen and (max-width: 420px){.works_wrapper{width:90%;margin-top:3rem;margin-bottom:3rem}.work_container{height:unset;width:100%;aspect-ratio:38 / 25}}@media screen and (max-width: 375px){h3{font-size:2.6rem}}@media screen and (min-width: 860px){.works_wrapper{grid-template-columns:380px 380px;gap:0 2rem}.works_wrapper .work_container:nth-child(2n){margin-top:2rem}}@media screen and (max-width: 860px){.works_wrapper{grid-template-columns:minmax(250px,380px)}}@media screen and (min-width: 1260px){.works_wrapper{grid-template-columns:400px 400px}.work_container{width:25rem;height:16.875rem}.work_container h5:nth-child(1){font-size:1.125rem}.work_container h5:nth-child(2){margin-top:.4rem;font-size:.8rem}}.status .status-container{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;color:#fff}.status .status-container h2{font-size:8rem;line-height:1.06;font-weight:700;position:relative}.status-container h2:before{content:"";position:absolute;width:.35em;background-color:#16c60c;border-radius:50%;aspect-ratio:1;left:-.3em;top:50%;translate:-100% -50%;animation:ping .65s infinite cubic-bezier(0,0,.2,1) alternate;will-change:scale}@media (prefers-reduced-motion){.status-container h2:before{animation:none}}@keyframes ping{0%{scale:1.25}to{scale:1}}.status .status-container p{font-size:2.5rem;text-align:left;font-weight:400;line-height:101.1%}.status-container .mail-reach{margin-top:150px}.status-container .mail-reach a{display:flex;align-items:center;text-decoration:underline;font-size:3rem;font-weight:500}.status-container .mail-reach a:after{margin-left:.5em;width:.9em;content:url("data:image/svg+xml,%3Csvg viewBox='0 0 33 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.7036 1.29649L14.3403 18.6632M1.38262 12.3233L31.1909 1.03935C31.2984 0.998209 31.4155 0.989096 31.5281 1.01311C31.6407 1.03712 31.744 1.09322 31.8254 1.17465C31.9068 1.25607 31.9629 1.35933 31.9869 1.47196C32.0109 1.58458 32.0018 1.70174 31.9607 1.8093L20.679 31.6234C20.6341 31.7367 20.5557 31.8334 20.4542 31.9007C20.3527 31.968 20.233 32.0026 20.1113 31.9998C19.9895 31.9971 19.8716 31.9571 19.7732 31.8853C19.6749 31.8135 19.6009 31.7132 19.5612 31.5981L14.5385 19.2185C14.4799 19.0431 14.3814 18.8837 14.2506 18.7529C14.1199 18.6221 13.9605 18.5235 13.7851 18.465L1.40795 13.4458C1.29135 13.407 1.18959 13.3331 1.11659 13.2342C1.04359 13.1353 1.00293 13.0163 1.00015 12.8934C0.997378 12.7706 1.03264 12.6498 1.1011 12.5478C1.16956 12.4457 1.26789 12.3673 1.38262 12.3233Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")}@media screen and (max-width: 1024px){.status .status-container h2{font-size:5rem}.status .status-container p{font-size:1.75rem}.status-container .mail-reach{margin-top:75px}.status-container .mail-reach a{font-size:1.5rem;font-weight:500}}@media screen and (max-width: 500px){.status .status-container h2{font-size:2.5rem}.status .status-container{min-height:20vh}.status .status-container p{font-size:1rem}.status-container .mail-reach a{font-size:1rem;font-weight:500}}footer{background-color:#292929;margin-top:5rem;padding:20px 0;position:relative;overflow:hidden}footer .blob{width:350px;aspect-ratio:1 / 1;position:absolute;filter:blur(50px);border-radius:56% 44% 44% 56%/55% 46% 54% 45%;background:linear-gradient(143.08deg,#93eaa6 -16.63%,#f1c040 26.98%,#784ada 72.63%,#ef65c8e0 114.19%);pointer-events:none}footer .blob:nth-child(1){top:-300px;left:10%}footer .blob:nth-child(2){bottom:-300px;right:10%}.footer-wrapper{width:min(1900px,90%);display:flex;justify-content:space-between;margin:0 auto;align-items:center;z-index:2;position:relative;gap:4rem}.footer-wrapper>a{font-size:0}.row img{--dimension: 38px;height:var(--dimension);width:var(--dimension)}.row a{font-size:0}.footer-nav{display:inline-flex;flex-direction:column;row-gap:25px}.footer-wrapper h5{font-size:22px;font-weight:600;text-align:center}.soc-logos{display:flex;flex-direction:column;row-gap:15px;justify-content:center}.hire-me h5{margin-bottom:15px}.row{display:flex;flex-direction:row;column-gap:23px;justify-content:center}.hire-me a{display:block;text-align:center;padding:.5em 1em;background-color:#20202090;border-radius:10px;font-size:1.2rem;text-decoration:auto}.hire-me a:not(:last-child){margin-bottom:15px}@media screen and (max-width: 768px){.footer-wrapper{flex-direction:column;gap:2rem;align-items:center;margin:0 auto}.footer-wrapper>a{order:2}.footer-wrapper h5{font-size:18px}.hire-me a{font-size:1rem}.footer-nav{order:3}.hire-me{order:1}}.work_container{overflow:hidden}.work-content h5{margin-bottom:.5rem}.work-content h5 small{display:inline-block;padding:.0625rem .1875rem;color:#000;background-color:#fff;vertical-align:middle;font-size:.625rem;border-radius:25vw}.work-content p{font-size:.875rem}.work-content code{padding:.2em;background-color:#000000a1;border-radius:.4em}:is(.projects-icon,.tech-stack){position:absolute;top:0;right:20px;display:flex;column-gap:1rem;z-index:1;image-rendering:crisp-edges;padding-top:1.4rem;transition:transform ease-out .2s}.tech-stack{left:20px;right:unset;column-gap:.5rem}.tech-stack .tech-logo{width:1.875rem;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;padding:.1em;backdrop-filter:blur(.25rem);-webkit-backdrop-filter:blur(.25rem);background-color:#00000080;border-radius:50%}.tech-stack .tech-logo img{width:1.125rem;height:auto}.project-link{--dimension: 40px;width:var(--dimension);height:var(--dimension)}.work_container.dark .project-link:first-child{filter:invert(100%)}.work_container:before{content:"";width:100%;height:100%;border-radius:10px;position:absolute;background:linear-gradient(0deg,#000000db,#fff0);bottom:0;left:0;pointer-events:none;z-index:2}.work-content{position:absolute;inset-inline:0;bottom:0;z-index:3;padding-bottom:1.4rem}@media (hover){.work-content{width:90%;left:50%;transform:translate(-50%,100%);transition:all .2s ease}:is(.projects-icon,.tech-stack){transform:translateY(-100%)}.work_container:before{bottom:0;transform:translateY(100%);left:0;transition:transform ease-out .2s}.work_container:hover:before{transform:translateY(0)}.work_container:hover :is(.projects-icon,.tech-stack){transform:translateY(0);transition-delay:.2s}.work_container:hover .work-content{transform:translate(-50%);transition-delay:.2s}.blog:hover{--border-radius: 1em}}@media screen and (max-width: 546px){.work-content p{font-size:.875rem}.project-link{--dimension: 30px}}
