@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";footer{background-color:#1a1d1f;color:var(--white);padding-block:2rem}footer ul{display:flex;gap:1rem;align-items:center}footer ul li{cursor:pointer}footer ul li a{transition:.2s ease-in-out}footer ul li a:hover,footer ul li a.active{color:var(--orange)}footer small{display:inline-block;text-align:center;font-size:.75rem;width:100%}footer small span{color:var(--orange)}.nav-items{flex-wrap:wrap;font-size:.875rem}.social-icons{margin-block:2rem}.social-icons a svg path{transition:.25s ease-in-out}.social-icons a:hover svg path{fill:var(--orange)}.primaryBtn{border:2px solid var(--white);border-radius:10px;padding:.5rem 1rem;transition:.2s ease-in-out}.primaryBtn:hover{color:var(--white);background-color:var(--orange);border-color:var(--orange)}header{padding-block:1rem}header{display:flex;justify-content:space-between;color:var(--white);align-items:center;position:relative;max-width:100vw;position:sticky;z-index:2;top:0;background:linear-gradient(to bottom,var(--DarkBg),rgba(31,33,36,.9),rgba(0,0,0,0))}@media (max-width: 800px){header svg{height:35px}}.show{display:grid}.lockScroll{max-height:100vh;overflow-y:hidden}nav{display:none;width:100vw;height:100svh;position:absolute;background-color:#000000d9;z-index:1;top:0;left:0}@media (min-width: 800px){nav{display:initial;position:relative;width:initial;height:initial;background-color:initial}}nav ul{display:grid;margin:6rem 2rem;gap:2rem;align-content:start}@media (min-width: 800px){nav ul{display:flex;margin:initial;align-items:center}}nav ul li{border-bottom:1px solid rgba(255,255,255,.2);padding-block:1rem}nav ul li a{transition:.25s}nav ul li a:hover,nav ul li a.active{color:var(--orange)}@media (min-width: 800px){nav ul li{border-bottom:none}}@media (max-width: 800px){nav ul li:nth-last-of-type(1) button{border:none;padding:initial}}.menu{display:grid;place-content:center;position:relative;z-index:2}.menu svg{height:15px}@media (min-width: 800px){.menu{display:none}}.section-header{display:flex;justify-content:space-between;align-items:center}.section-header .header-txt{display:flex;align-items:center;gap:1rem;background-color:var(--darkCardBg);padding:.75rem 1.5rem}.section-header .header-container{height:fit-content;padding-block-end:1.5rem}.section-header .logo-icon{display:grid;place-content:center}.stackItem{display:flex;gap:1rem;position:relative;align-items:center;background-color:var(--miniCardBg);padding:.75rem 1rem;border-radius:10px}@media (max-width: 600px){.stackItem{padding:.5rem .75rem;gap:.5rem}.stackItem p{font-size:10px}}.stackImg{height:2rem;aspect-ratio:1;background-repeat:no-repeat;background-size:contain;background-position:center}@media (max-width: 600px){.stackImg{height:1rem}}.about,.project{background-color:var(--cardBg);border-radius:1rem;padding-inline:1rem;position:relative}.about p,.project p{font-size:.875rem;line-height:200%}@media (min-width: 800px) and (orientation: landscape){.about,.project{margin-block-start:5rem}}@media (min-width: 700px){.about,.project{padding-inline:2rem}}@media (min-width: 900px){.about,.project{padding-inline:2.5rem}}.about-txt{background-color:var(--darkCardBg);padding:1rem .75rem;border-radius:10px 10px 0 0}@media (min-width: 700px){.about-txt{padding:2rem;text-align:justify}}.tech-stack{margin-block-start:3rem;display:grid;place-items:center;gap:1rem}.tech-stack-header{display:flex;gap:.5rem;width:fit-content;align-items:center;background-color:var(--mini-card-bg);border-radius:10px;padding:.625rem 1rem}.tech-stack-header svg{height:1.75rem}.the-stacks{width:100%;position:relative;overflow-x:hidden;mask:linear-gradient(90deg,transparent,white 10%,white 90%,transparent)}.the-stacks>ul{display:flex;flex-wrap:nowrap;width:max-content;gap:1rem;animation:slide 90s linear infinite}@media (prefers-reduced-motion){.the-stacks>ul{flex-wrap:wrap;animation:none;width:100%;justify-content:center}.the-stacks>ul li[aria-hidden]{display:none}}@media (max-width: 600px){.the-stacks>ul{gap:.5rem}}@keyframes slide{to{translate:calc(-50% - .5rem)}}.contact{color:var(--white);display:flex;align-items:start;gap:4rem;justify-content:space-between;background-color:var(--footerBg);padding-block:3rem;margin-block-start:2rem;position:relative;isolation:isolate}.contact-fields{width:100%}.contact-fields h2{margin-block-end:2rem;padding-block-start:3rem}#contact-form{margin-block-end:2rem;display:grid;gap:1.5rem;padding:1rem;border-radius:10px;background-color:#3a38381a}@media (max-width: 570px){#contact-form{background-color:var(--miniCardBg)}}#contact-form>div{display:grid;gap:.5rem}#contact-form label{font-size:.75rem}#contact-form input,#contact-form textarea{background-color:transparent;border:2px solid white;outline:none;padding:.875rem;border-radius:.5rem;color:var(--white)}#contact-form input:focus,#contact-form input:hover,#contact-form textarea:focus,#contact-form textarea:hover{border-color:var(--orange)}#contact-form button{width:fit-content;justify-self:end;margin-inline:1rem}.form-sec{color:var(--white);display:flex;align-items:center;justify-content:space-between;gap:4rem;position:relative;isolation:isolate}.contact-img{width:100%;opacity:.2}@media (max-width: 570px){.contact-img{position:absolute;scale:70%;top:35%;left:50%;translate:-50% -50%;opacity:.2;z-index:-1}}.contactField{width:100%}.contact-me{display:flex;gap:.5rem;align-items:center;margin-block-start:1rem}.hero{height:calc(100dvh - 4.5rem);position:relative;display:grid;align-items:center;overflow:hidden;min-height:20rem}@media (min-width: 800px){.hero{height:calc(100dvh - 7.75rem);max-height:initial}}@media (orientation: portrait){.hero{max-height:45rem}}.hero-content-container{display:flex;justify-content:flex-start;align-items:center}.hero-animation-container{--translate: 11rem;--animation-time: 60s;--center-image: 8rem;--outer-box: 5rem;--outer-box-img: 2rem;width:100%;aspect-ratio:1;max-height:50vh;display:grid;place-content:center;position:relative}@media (max-width: 600px){.hero-animation-container{display:none}}@media (max-width: 1000px){.hero-animation-container{--translate: 9rem;--center-image: 7rem;--outer-box: 4rem;--outer-box-img: 1.6rem}}@media (max-height: 500px) and (orientation: landscape){.hero-animation-container{--translate: 6rem;--center-image: 4.5rem;--outer-box: 2.5rem;--outer-box-img: 1.2rem}}.hero-animation-container>img{width:var(--center-image);aspect-ratio:1;border-radius:20%;border:4px solid var(--white)}.hero-animation-container ul{position:absolute;top:50%;left:50%;translate:-50% -50%;animation:spin var(--animation-time) linear infinite;cursor:pointer}.hero-animation-container ul:hover,.hero-animation-container ul:hover li{animation-play-state:paused}.hero-animation-container ul li{position:inherit;display:grid;place-content:center;top:50%;left:50%;translate:-50% -50%;width:var(--outer-box);aspect-ratio:1;border-radius:20px;border:2px solid var(--white);animation:maintain-position var(--animation-time) linear infinite}.hero-animation-container ul li:hover{border:transparent}.hero-animation-container ul li:hover:before{opacity:100%}.hero-animation-container ul li:before{width:100%;height:100%;background-color:#f49434cc;position:absolute;border-radius:15px;display:grid;place-content:center;color:var(--white);opacity:0;transition:all .2s ease-in-out}.hero-animation-container ul li img{height:var(--outer-box-img)}.hero-animation-container ul li:nth-last-of-type(1){--deg: -0deg;rotate:0deg}.hero-animation-container ul li:nth-last-of-type(1):before{content:"Vue Js"}.hero-animation-container ul li:nth-last-of-type(2){--deg: -45deg;rotate:45deg}.hero-animation-container ul li:nth-last-of-type(2):before{content:"Figma"}.hero-animation-container ul li:nth-last-of-type(3){--deg: -90deg;rotate:90deg}.hero-animation-container ul li:nth-last-of-type(3):before{content:"SASS"}.hero-animation-container ul li:nth-last-of-type(4){--deg: -135deg;rotate:135deg}.hero-animation-container ul li:nth-last-of-type(4):before{content:"Tailwind"}.hero-animation-container ul li:nth-last-of-type(5){--deg: -180deg;rotate:180deg}.hero-animation-container ul li:nth-last-of-type(5):before{content:"React"}.hero-animation-container ul li:nth-last-of-type(6){--deg: -225deg;rotate:225deg}.hero-animation-container ul li:nth-last-of-type(6):before{content:"JS"}.hero-animation-container ul li:nth-last-of-type(7){--deg: -270deg;rotate:270deg}.hero-animation-container ul li:nth-last-of-type(7):before{content:"CSS"}.hero-animation-container ul li:nth-last-of-type(8){--deg: -315deg;rotate:315deg}.hero-animation-container ul li:nth-last-of-type(8):before{content:"HTML"}.hero-text{width:100%}.hero-text p{margin-block:.5rem;color:var(--orange);font-size:1.125rem}.hero-text button{margin-block-start:4rem}@media (min-width: 800px){.hero-text p{font-size:1.5rem}.hero-text button{margin-block-start:3rem}}@media (max-height: 500px) and (orientation: landscape){.hero-text p{font-size:1rem}.hero-text button{margin-block-start:1rem}}@keyframes spin{to{rotate:1turn}}@keyframes maintain-position{0%{transform:translate(var(--translate)) rotate(var(--deg))}to{transform:translate(var(--translate)) rotate(calc(-1turn + var(--deg)))}}.projectCard{display:flex;flex-direction:column;background-color:var(--darkCardBg);padding:1rem;border-radius:.5rem;justify-content:space-between}@media (min-width: 700px){.projectCard{padding:1.5rem}}.projectCard>p{font-size:.875rem;margin-bottom:2rem}.projectCard h3{color:var(--orange);margin-block:1.5rem .75rem}.projectImage{width:100%;aspect-ratio:3/1.8;background-size:cover;background-repeat:no-repeat;background-position:top left;border-radius:.25rem}.projectLinks{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:3rem}.projectLinks>* a{display:flex;align-items:center;gap:.5rem;border-radius:.5rem;padding:.5rem .75rem;background-color:var(--miniCardBg);cursor:pointer;transition:.5s ease-in-out}.projectLinks>* a:hover{background-color:var(--orange)}.stackUsed{gap:.5rem;display:flex;flex-wrap:wrap;align-items:center;margin-block-start:1rem}.project{margin-block-start:5rem;padding-block-end:2rem}.project>ul{display:grid;gap:1.5rem;grid-template-columns:auto;align-items:end}@media (min-width: 600px){.project>ul{grid-template-columns:auto auto}}@media (min-width: 1200px){.project>ul{grid-template-columns:auto auto auto}}.project .buttonContainer{margin-block-start:2rem;text-align:center}.projectPage h2{font-weight:300;margin-block:2rem 4rem;text-transform:uppercase}@media (max-width: 800px){.projectPage h2{margin-block:2rem}}.projectPage .projectPageContent{margin-block:5rem;display:flex;flex-direction:column}@media (max-width: 800px){.projectPage .projectPageContent{margin-block:0 3rem}}.projectPage .projectPageContent>ul{display:flex;gap:2rem;align-items:start}.projectPage .projectPageContent>ul:nth-of-type(1) h3{font-weight:700}.projectPage .projectPageContent>ul:nth-of-type(1) li{padding-block:.5rem}.projectPage .projectPageContent>ul:not(:nth-of-type(1)){border-bottom:1px solid rgba(253,97,6,.144)}.projectPage .projectPageContent>ul>li{width:100%;padding-block:1.5rem}.projectPage .projectPageContent>ul>li a{transition:.5s;display:flex;gap:.5rem;align-items:center}.projectPage .projectPageContent>ul>li a path{transition:.5s}.projectPage .projectPageContent>ul>li a:hover,.projectPage .projectPageContent>ul>li a:focus{color:var(--orange)}.projectPage .projectPageContent>ul>li a:hover path,.projectPage .projectPageContent>ul>li a:focus path{fill:var(--orange)}.projectPage .projectPageContent>ul>li:nth-of-type(1){width:20%}.projectPage .projectPageContent>ul>li:nth-of-type(2){width:80%}@media (max-width: 800px){.projectPage .projectPageContent>ul>li:nth-of-type(3){display:none}}.projectPage .projectPageContent>ul>li:nth-of-type(4){width:40%}@media (max-width: 1200px){.projectPage .projectPageContent>ul>li:nth-of-type(4){display:none}}.projectPage .projectPageContent>ul>li:nth-of-type(5){width:50%}.builtwithlist{display:flex;flex-wrap:wrap;gap:.5rem}.builtwithlist p{background-color:var(--darkCardBg);padding:.25rem .5rem;border-radius:5px;font-size:.75rem}.HomeArrow{display:flex;gap:.5rem;align-items:center}.HomeArrow svg{rotate:180deg}.pdf{width:100%;height:85rem}*,:after,:before{padding:0;margin:0;box-sizing:border-box}:root{--DarkBg: #1e2022;--darkCardBg: #2b3138;--white: #ffffff;--orange: #f49434;--lightGray: #afb5bc;--cardBg: #212629;--miniCardBg: rgba(242, 243, 243, .05);--footerBg: #1a1d1f;--paddingMobile: 1rem;--paddingTab: 3rem;--paddingDesktop: 8rem}ul,ol,li{list-style:none!important}a{text-decoration:none}body{background:var(--DarkBg);font-family:Poppins,sans-serif;font-weight:400}html{scroll-behavior:smooth}#root{display:grid;min-height:100svh;grid-template-rows:auto 1fr auto;max-width:100vw}main{height:100%;position:relative;overflow-x:hidden}main:before{content:"";display:inline-block;width:20rem;aspect-ratio:1/1;position:absolute;background-image:url(./assets/bgik.svg);background-size:contain;top:-8rem;right:-12rem;opacity:.3}@media (min-width: 600px){main:before{width:35rem;top:-10rem;right:-20rem}}footer{align-self:end}header{align-self:start}img,svg{display:block;max-width:100%}button{background-color:transparent;border:transparent;color:var(--white);cursor:pointer}h1,h2,h3,h4,p,a{color:var(--white)}h1{font-size:3rem;font-weight:300;line-height:130%;text-transform:uppercase}@media (min-width: 900px){h1{font-size:4rem}}@media (max-width: 300px){h1{font-size:2rem}}@media (min-width: 1000px){h1{font-size:5rem}}h2{font-size:1rem;font-weight:600}@media (min-width: 700px){h2{font-size:1.5rem}}h3{font-weight:400;font-size:1rem}p,a,li{font-size:.875rem}@media (max-width: 800px){p,a,li{font-size:.875rem}}header,.hero,.projectPage,.aboutPage,.contactPage,.contact,footer{padding-inline:var(--paddingMobile)}@media (min-width: 600px){header,.hero,.projectPage,.aboutPage,.contactPage,.contact,footer{padding-inline:var(--paddingTab)}}@media (min-width: 1200px){header,.hero,.projectPage,.aboutPage,.contactPage,.contact,footer{padding-inline:var(--paddingDesktop)}}.project,.about{margin-inline:var(--paddingMobile)}@media (min-width: 600px){.project,.about{margin-inline:var(--paddingTab)}}@media (min-width: 1200px){.project,.about{margin-inline:var(--paddingDesktop)}}