#header{margin:15px;position:fixed;text-align:center;width:100%;z-index:1010}#header .navbar{display:inline-flex;white-space:nowrap}#header .navbar ul{display:flex;list-style:none;border-radius:100px;align-items:center;padding:5px;column-gap:20px;position:relative}#header .navbar a{padding:5px 20px;border-radius:100px;display:flex;font-family:var(--f-text);font-size:var(--fs-nav);font-weight:var(--w-button);color:var(--white);text-decoration:none;align-items:center;transition:background-color .2s}#header .navbar a:hover{background-color:#f2f2f21a}#header .selector{position:absolute;border-radius:100px;height:calc(100% - 11px);left:0rem;width:0px;display:flex;z-index:-1}#header .nav-svg{margin-right:7px;border-radius:100px;width:clamp(20px,6vw,27px);height:clamp(20px,6vw,27px)}#header .nav-svg svg{width:100%;height:100%}#header .active-nav-svg{background-color:var(--dark-yg)}#header .active-nav-svg .poly-svg-nav-light{fill:var(--yg)}#header .active-nav-svg .poly-svg-nav-base{fill:#719e00}#header .poly-svg-nav-light{fill:var(--white)}#header .poly-svg-nav-base{fill:var(--transp_white)}#header .contact{position:fixed;right:15px;text-decoration:none;border-radius:100px;height:47px;width:150px;line-height:47px}#header .contact span{font-size:var(--fs-nav)}@media (max-width: 992px){#header .contact{width:auto}#header .icon-cont{width:calc(100% - 4px);aspect-ratio:1/1;position:relative}#header .contact span{display:none}}@media (max-width: 668px){#header .navbar ul{column-gap:0px}#header .navbar a{padding-left:10px;padding-right:10px}#header .nav-svg{margin-right:3px}}@media (max-width: 500px){#header{text-align:left}#header .contact{height:calc(var(--fs-nav) + 30px)}#header .navbar a{padding:7px}#header .nav-svg{margin-right:0;display:none}}#home{min-height:100vh;min-height:-webkit-fill-available;background-color:var(--black-yg);position:relative;overflow:hidden;display:flex;align-items:center}#home h1{font-family:var(--f-title);font-variation-settings:"wdth" 150;color:var(--white);position:relative;z-index:15;font-weight:var(--w-title);font-size:var(--fs-title);margin-bottom:5px;line-height:1.2}#home h2{font-family:var(--f-title);font-style:italic;font-variation-settings:"wdth" 150;color:var(--yg);position:relative;z-index:15;font-weight:var(--w-title);font-size:var(--fs-title);margin-bottom:10px;line-height:1.2}#home p{font-family:var(--f-text);color:var(--light_grey);position:relative;display:inline-block;max-width:550px;z-index:15;font-weight:var(--w-text);font-size:var(--fs-text);margin-top:15px;margin-bottom:40px}#home p a{color:var(--yg)}#home .buttons-container{flex-wrap:wrap;display:flex;gap:20px 30px}#home #epicycloid{top:0;left:20%;mask-image:linear-gradient(90deg,transparent 0%,black 15%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 15%);mix-blend-mode:screen;opacity:.75;position:absolute}#home .title-cont{display:flex;height:100%;justify-content:center}#home .noise{opacity:.2;mix-blend-mode:overlay;background-image:url(/portfolio/assets/noise-BVZAnKJ_.gif);background-position:0 0;background-size:480px;background-attachment:fixed;position:absolute;top:0;bottom:0;left:0;right:0}#home .loc-cont{z-index:15;display:flex;gap:10px;justify-content:center;align-items:center;border-radius:100px;padding:7px 20px;margin-bottom:20px;background-color:var(--yg);box-shadow:0 0 0 0 var(--yg);transition:all ease .4s}#home .loc-cont .svg-cont{width:17px;height:17px}#home .loc-cont .svg-cont svg{fill:var(--black-yg)}#home .loc-cont a{font-family:var(--f-text);text-decoration:none;color:var(--black-yg);font-weight:var(--w-title);font-size:clamp(13px,3vw,16px)}#home .loc-cont:hover{box-shadow:0 0 0 2px var(--yg)}@media (max-width: 768px){#home #epicycloid{mask-image:none;-webkit-mask-image:none;left:0;opacity:.35}}@media (max-width: 550px){#home .buttons-container{flex-wrap:wrap;display:flex;gap:20px 10px}}#projects{display:flex;flex-direction:column;transform:translateY(-100px)}#projects .separator{fill:var(--dark_purple)}#projects .project-cont{background-color:var(--dark_purple);margin-bottom:-101px}#projects .last-about-comp{margin-bottom:100px}#projects .horizontall-sect{width:100%;display:flex;align-items:center;position:relative;margin-bottom:180px}#projects .project-list-container{width:100%;position:relative;overflow-x:auto;white-space:nowrap;-ms-overflow-style:none;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent 0%,black 10%,black 90%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 10%,black 90%,transparent 100%)}#projects .project-list-container::-webkit-scrollbar{display:none}#projects .project-list{padding-top:30px;display:flex;flex-direction:row}#projects .project-card{box-sizing:border-box;cursor:pointer;position:relative;flex:0 0 auto;width:60%;margin:0 5% 0 0;padding:30px;border-radius:28px;border-style:solid;border-color:var(--dark_purple);border-width:2px;-ms-overflow-style:none;scrollbar-width:none;display:flex;flex-direction:column;transition:border-color .5s;background-color:var(--black-purple)}#projects .hovered{border-color:var(--yg)}#projects .project-card::-webkit-scrollbar{display:none}#projects .content-pad{padding:0}#projects .spacer{flex:0 0 auto;width:20%}#projects .img-text-cont{display:flex;width:100%;margin-bottom:15px;height:100%}#projects .img-container{display:flex;flex-direction:column;width:40%;margin-right:15px;justify-content:center}#projects .img-container img{border-radius:8px;width:100%;object-fit:cover;height:100%}#projects .txt-container{height:100%;width:60%;display:flex;flex-direction:column}#projects .txt-container h3{font-variation-settings:"wdth" 150;padding:15px;white-space:normal;margin-bottom:15px;font-size:clamp(20px,4vw,26px);font-weight:var(--w-button);font-family:var(--f-text);color:var(--white)}#projects .txt-container p{height:100%;padding:15px;margin:0;white-space:normal;font-size:var(--fs-text);font-weight:var(--w-text);font-family:var(--f-text);color:var(--light_grey)}#projects .language-bar{display:flex}#projects .language-text{margin-right:15px;padding:10px;font-size:var(--fs-text);font-weight:var(--w-text);font-family:var(--f-text);color:var(--light_grey);border:1px solid var(--purple);transition:all ease .4s;border-radius:10px}#projects .language-text:hover{background-color:var(--dark_purple)}#projects .github-button{width:100%;text-align:center;padding:10px;border-style:solid;border-color:var(--yg);background-color:var(--yg);border-width:2px;border-radius:8px;font-size:var(--fs-text);font-weight:var(--w-button);font-family:var(--f-text);color:var(--dark-yg);transition:border-color .5s,background-color .5s,color .5s}#projects .active-project .github-button:hover{border-color:var(--dark-yg);background-color:var(--dark-yg);color:var(--yg)}#projects .date-cont{position:absolute;color:var(--white);z-index:10;border-radius:8px;top:35px;left:10px;padding:10px 20px;font-size:var(--fs-text);font-weight:var(--w-button);font-family:var(--f-text)}#projects .grid-bg{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' width='32' height='32' fill='none' stroke='rgb(87 66 185 / .2)'%3e%3cpath d='M0 .5H31.5V32'/%3e%3c/svg%3e");-webkit-mask-image:linear-gradient(to top,transparent 0%,#fff 30% 70%,transparent 100%),linear-gradient(to left,transparent 0%,#fff 30% 70%,transparent 100%);mask-image:linear-gradient(to top,transparent 0%,#fff 30% 70%,transparent 100%),linear-gradient(to left,transparent 0%,#fff 30% 70%,transparent 100%);position:absolute;-webkit-mask-composite:source-in;mask-composite:intersect;height:100%;width:100%}@media (max-width: 768px){#projects .project-card{width:80%}#projects .spacer{width:10%}#projects #first-project{margin-left:10%}}@media (max-width: 992px){#projects .horizontall-sect{margin-bottom:120px}#projects{transform:translateY(-50px)}#projects .project-cont{margin-bottom:-51px}#projects .img-text-cont{flex-direction:column}#projects .img-container{aspect-ratio:3/2;width:100%;margin-bottom:15px}#projects .txt-container{width:100%}#projects .language-bar{margin-right:0;gap:15px;flex-wrap:wrap}#projects .language-text{margin-right:0;flex-grow:1}#projects .project-list-container{mask-image:none;-webkit-mask-image:none}}@media (max-width: 400px){#projects h2{padding:0 30px}}#skills{transform:translateY(-100px)}#skills .separator{fill:var(--black-yg)}.skill-cont{background-color:var(--black-yg);overflow:auto;margin-bottom:-101px}#skills .container{max-width:800px;margin:auto auto 50px;height:auto;border-radius:15px;width:100%;border:2px solid var(--dark-yg);box-shadow:1px 12px 37px #00000070;padding:10px}#skills .content-pad{margin-bottom:200px}#skills .tabs{border-radius:13px;display:flex;list-style:none;position:relative;flex-wrap:wrap;background-color:var(--yg)}#skills .hover{content:"";border:2px solid var(--yg);background-color:var(--black-yg);box-shadow:#00002d 0 0 25px;height:100%;width:0;position:absolute;z-index:100;border-radius:15px;transition:all .5s ease-in-out}#skills .tab{white-space:nowrap;border-radius:13px;height:100%;font-family:var(--f-text);font-weight:var(--w-button);font-size:var(--fs-text);color:var(--black-yg);position:relative;cursor:pointer;transition:all .3s ease-in-out;z-index:100;padding:15px 5px;display:flex;align-items:center;justify-content:center;flex-grow:1}#skills .tabs .active{color:var(--yg)}#skills .tab:hover{background-color:#06280055}#skills .tab-slide{display:flex;flex-wrap:wrap;gap:15px;padding:15px}#skills .svg-container{border-radius:15px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;flex-grow:1}#skills .svg-container:hover{background-color:#c0ffc417}#skills .svg-container img{width:70px;text-align:center}#skills .svg-container span{padding:5px 10px;border-radius:5px;position:absolute;font-size:var(--fs-text);transform:rotateY(90deg);text-align:center;color:var(--light_grey);font-family:var(--f-text);transition:transform .4s}#skills .svg-container:hover span{transform:rotateY(0)}#skills h3{color:var(--white);text-align:center;margin:7px;font-family:var(--f-text);font-size:var(--fs-text);padding-bottom:10px;border-radius:15px}@media (max-width: 992px){#skills{transform:translateY(-50px)}#skills .skill-cont{margin-bottom:-51px}}@media (max-width: 768px){#skills .svg-container span{transform:rotateY(0);bottom:-10px}}#contact{transform:translateY(-100px)}#contact h2{margin-bottom:20px}#contact .contact-cont{background-color:var(--dark_purple);overflow:hidden;margin-bottom:-101px}#contact .content-pad{position:relative}#contact .separator{fill:var(--dark_purple)}#contact .container{max-width:800px;margin:auto auto 50px;height:auto;border-radius:15px;width:100%;background-color:var(--puple);border:3px solid var(--dark_purple);box-shadow:1px 12px 37px #00002191;padding:10px}#contact .contact-info{width:100%;justify-content:center;max-width:800px;margin:auto;position:relative;z-index:10;padding:15px;display:flex;gap:15px;flex-direction:column;align-items:center;border-radius:25px;box-shadow:0 0 50px #000021e6}#contact .social-link{text-decoration:none;box-shadow:1px 12px 37px #0000145e;transition:border-color .5s;width:100%;display:flex;align-items:center;border-radius:15px;padding:10px}#contact .social-link:hover{border-color:var(--yg)}#contact .social-svg-cont{margin-right:20px;width:50px;height:50px}#contact .social-svg-cont img{width:100%;height:100%}#contact p{font-family:var(--f-text);font-weight:var(--w-button);font-size:var(--fs-text);color:var(--white)}#contact .arobase-cont{position:relative;width:100%;aspect-ratio:2 / 1;display:flex;justify-content:center;align-items:center;margin-bottom:100px}#contact .arobase-circle{top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:50%;max-width:800px;position:absolute}@keyframes rotate-circle{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#contact .arobase-circle svg{animation:rotate-circle 10s linear infinite}#contact #circle-text{font-family:Roboto Mono;font-weight:var(--w-button);font-size:6.55px;fill:var(--purple);transition:fill .5s}@media (max-width: 992px){#contact{transform:translateY(-50px)}#contact .contact-cont{margin-bottom:-51px}#contact .arobase-circle{width:70%}}@media (max-width: 768px){#contact .arobase-circle{width:80%}}@media (max-width: 512px){#contact .arobase-circle{width:120%}}@media (max-width: 370px){#contact .social-link{flex-direction:column;padding:15px}#contact .social-svg-cont{margin:0 0 10px}#contact .arobase-circle{width:160%}}#footer .footer-cont{background-color:var(--yg);overflow:hidden;padding-top:70px;padding-bottom:50px}#footer img{width:20px;height:20px;fill:var(--dark-yg)}#footer .content-pad{margin-bottom:50px}#footer .link-cont{margin-bottom:40px;display:flex;justify-content:space-between}#footer .license,#footer .github{text-decoration:none;gap:10px;display:flex;justify-content:center;align-items:center}#footer .license{margin-right:10px;margin-bottom:15px}#footer span{font-family:var(--f-text);font-weight:var(--w-button);font-size:var(--fs-text);color:var(--dark-yg)}#footer .software-list-cont{display:flex;position:relative;width:100%;height:150px;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0%,black 10%,black 90%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 10%,black 90%,transparent 100%)}#footer .software-list{display:flex;position:absolute;top:0;left:0;align-items:self-end;justify-content:flex-start;width:100%;height:100%;white-space:nowrap}#footer .software-list span{font-family:Roboto Mono;color:var(--yg);-webkit-text-stroke-width:1.5px;-webkit-text-stroke-color:var(--dark-yg);font-size:140px}#footer .software-list-scroll{display:flex;animation:scrollText 15s infinite linear}@keyframes scrollText{0%{transform:translate(0)}to{transform:translate(-50%)}}@media (max-width: 768px){#footer .link-cont{flex-direction:column}}@font-face{font-family:Plus Jakarta Sans;src:url(/portfolio/assets/plusjakartasans-D_DSbd_K.ttf);font-weight:200 800;font-style:normal}@font-face{font-family:Plus Jakarta Sans;src:url(/portfolio/assets/plusjakartasans_italic-BdWtZZ8T.ttf);font-weight:200 800;font-style:italic}@font-face{font-family:Anybody;src:url(/portfolio/assets/anybody-DG_6kQSv.ttf);font-weight:100 900;font-style:normal}@font-face{font-family:Anybody;src:url(/portfolio/assets/anybody_italic-DO3_zpDk.ttf);font-weight:100 900;font-style:italic}@font-face{font-family:Roboto Mono;src:url(/portfolio/assets/robotomono-Be6w_Krw.ttf);font-weight:100 700;font-style:normal}:root{--yg: #d9ff00;--dark-yg: #142414;--black-yg: #031111;--purple: #5742b9;--dark_purple: #180054;--black-purple: #060524;--dark_glass_bg: #0e132e42;--light_glass_bg: #e7c7ff41;--glass_edge: #ffffff1a;--transp_white: #ffffff99;--light_grey: #d7cedd;--white: #ffffff;--f-text: "Plus Jakarta Sans";--f-title: "Anybody";--fs-nav: 14px;--fs-title: clamp(30px, 6vw, 45px);--fs-text: clamp(14px, 3vw, 18px);--w-title: 900;--w-button: 750;--w-text: 400}*{margin:0;padding:0;box-sizing:border-box}.white-glass{-webkit-backdrop-filter:blur(20px) saturate(1.7);backdrop-filter:blur(20px) saturate(1.7);border:1.5px solid #ffffff30;background:var(--dark_glass_bg)}.black-glass{-webkit-backdrop-filter:blur(20px) saturate(1.7);backdrop-filter:blur(20px) saturate(1.7);border:1px solid var(--glass_edge);background:var(--dark_glass_bg)}.text-box{box-shadow:inset 0 0 0 0 var(--dark_purple);border-color:var(--glass_edge);border-width:0px;background-color:var(--dark_purple);border-radius:8px;transition:all .4s}.text-box:hover{box-shadow:inset 0 0 0 1px var(--purple);border-width:2px}#following-cursor{position:fixed;left:-50px;top:-50px;border-radius:50%;pointer-events:none;transition:transform .1s;background-color:var(--yg);width:100px;height:100px;z-index:500;display:grid;transform:translate(50vw,50vh) rotate(45deg) scale(.2);padding:10px}#following-cursor svg{transform:scale(0);fill:var(--dark-yg);width:100%}.content-pad{padding:0 150px;margin-right:auto;margin-left:auto;max-width:1600px;justify-content:center;width:100%;flex-direction:column;align-items:flex-start}@media (max-width: 1400px){.content-pad{padding:0 100px}}@media (max-width: 992px){.content-pad{padding:0 75px}}@media (max-width: 768px){.content-pad{padding:0 30px}}.separator{display:block;z-index:1000;pointer-events:none;width:100%;height:50px;transform:translateY(1%);fill:var(--purple)}@media (min-width: 992px){.separator{height:100px}}.section-title{display:flex;justify-content:center;color:var(--yg);font-weight:var(--w-title);font-family:var(--f-title);font-variation-settings:"wdth" 150;font-size:var(--fs-title);margin-bottom:60px;margin-top:30px}.clip-path{z-index:10;position:relative;clip-path:polygon(0 0,100% 0,100% 100%,0% 100%)}.text-reveal-on-scroll{transform:translateY(100%)}.button{z-index:15;width:225px;height:50px;line-height:50px;color:#fff;overflow:hidden;border-radius:100px}.button span{height:100%;text-align:center;position:absolute;font-family:var(--f-text);font-weight:var(--w-button);width:65%;line-height:inherit;font-size:var(--fs-text);left:0;transition:all .25s ease-in-out}.button .icon-cont{margin:2px;height:calc(100% - 4px);background-color:var(--yg);border-radius:100px;position:absolute;width:35%;right:0;transition:all .25s ease-in-out;display:flex;align-items:center;justify-content:center}.button .icon-cont .icon{fill:var(--dark-yg);height:26px;width:26px;vertical-align:middle;transition:all .25s ease-in-out}.button:hover span{left:-65%}.button:hover .icon-cont{width:calc(100% - 4px)}.button:active .icon-cont{background-color:var(--dark-yg)}.button:active .icon{fill:var(--yg)}.secondary-button{z-index:15;border-radius:100px;gap:15px;width:225px;color:var(--light_grey);overflow:hidden;display:flex;height:50px;justify-content:space-between;align-items:center;text-decoration:none;box-sizing:border-box;padding:0 30px;position:relative;transition:all ease .2s}.secondary-button:hover{box-shadow:inset 0 0 0 1px var(--glass_edge)}.secondary-button span{text-align:center;font-family:var(--f-text);font-weight:var(--w-button);line-height:inherit;font-size:var(--fs-text)}.secondary-button:hover span{color:var(--yg);transition:all ease .2s}.secondary-button .icon-cont{height:80%;border-radius:50px;display:flex;align-items:center;justify-content:center}.secondary-button .icon-cont .icon{height:26px;width:26px;fill:none}@media (max-width: 550px){.button,.secondary-button{width:160px}.secondary-button{padding:0 17px 0 22px}}html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-smooth iframe{pointer-events:none}
