:root{--clr-primary-400: #090909;--clr-light-200: #9c9c9c;--clr-light-300: #d9d9d9;--clr-light-500: #fff;--ff-primary: "Poppins", sans-serif;--ff-seconday: "Comforter", cursive;--ff-body: var(--ff-primary);--ff-heading: var(--ff-primary);--ff-logo: var(--ff-seconday);--fw-light: 300;--fw-regular: 500;--fw-bold: 700;--fw-extra-bold: 900;--fs-300: .875rem;--fs-350: 1rem;--fs-400: 1.125rem;--fs-550: 1.5rem;--fs-600: 1.75rem;--fs-850: 2rem;--fs-900: 2.215rem;--fs-1000: 3rem;--fs-1100: 3.125rem;--fs-nav: var(--fs-300);--fs-hero-title: var(--fs-1000);--fs-hero-subtitle: var(--fs-850);--fs-section-title: var(--fs-1000);--fs-section-subtitle: var(--fs-400);--fs-skill-title: var(--fs-550);--fs-card-title: var(--fs-550);--fs-para: var(--fs-350);--grid-template-column: repeat(4, 1fr);--grid-margin-side: 7.5rem;--grid-column: 1/5;--project-img-width: 17rem;--project-inner-img-width: 16.4rem;--review-card-width: 35rem;--slider-width: 37rem;--btn-padding: 1.25em 4.375em;--field-width: 33rem}@media (max-width: 52rem) and (min-width: 35rem){:root{--fs-hero-title: var(--fs-850);--fs-hero-subtitle: var(--fs-550);--fs-section-title: var(--fs-850);--fs-section-subtitle: var(--fs-350);--fs-skill-title: var(--fs-400);--fs-card-title: var(--fs-400);--fs-para: var(--fs-300);--grid-template-column: repeat(2, 1fr);--grid-margin-side: 1.5625rem;--grid-column: 1/3;--project-img-width: 13.75rem;--project-inner-img-width: 13.1rem;--field-width: 21rem;--btn-padding: 1.25em 4.375em}}@media (max-width: 35rem){:root{--fs-hero-title: var(--fs-550);--fs-hero-subtitle: var(--fs-400);--fs-section-title: var(--fs-600);--fs-section-subtitle: var(--fs-350);--fs-skill-title: var(--fs-300);--fs-skill-subtitle: var(--fs-300);--fs-card-title: var(--fs-350);--fs-para: var(--fs-300);--grid-template-column: repeat(1, 1fr);--grid-margin-side: 1.25rem;--grid-column: 1;--project-img-width: 13.75rem;--project-inner-img-width: 13.09rem;--review-card-width: 19.25rem;--slider-width: 20rem;--field-width: 20rem;--btn-padding: 1em 2em}}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0;font:inherit}ul[role=list],ol[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}html,body{height:100%}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5;transitions:all .2s}a:not([class]){text-decoration-skip-ink:auto}img,picture,svg{max-width:100%;display:block}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}a{text-decoration:none;color:inherit}p{text-align:justify}.text-primary{color:var(--clr-primary-400)}.text-neutral-500{color:var(--clr-light-500)}.text-neutral-300{color:var(--clr-light-300)}.text-neutral-200{color:var(--clr-light-200)}.fw-extra-bold{font-weight:var(--fw-extra-bold)}.fw-bold{font-weight:var(--fw-bold)}.fw-regular{font-weight:var(--fw-regular)}.fw-light{font-weight:var(--fw-light)}.ff-primary{font-family:var(--ff-primary)}.ff-secondary{font-family:var(--ff-seconday)}.bg-dark{background-color:var(--clr-primary-400)}.bg-light-500{background-color:var(--clr-light-500)}.bg-light-300{background-color:var(--clr-light-300)}.bg-light-200{background-color:var(--clr-light-200)}.fs-nav{font-size:var(--fs-nav)}.fs-hero-title{font-size:var(--fs-hero-title)}.fs-hero-subtitle{font-size:var(--fs-hero-subtitle)}.fs-card-title{font-size:var(--fs-card-title)}.fs-skill-title{font-size:var(--fs-skill-title)}.fs-skill-subtitle{font-size:var(--fs-skill-subtitle)}.fs-section-title{font-size:var(--fs-section-title)}.fs-section-subtitle{font-size:var(--fs-section-subtitle)}.fs-para{font-size:var(--fs-para)}.grid{display:grid;grid-template-columns:var(--grid-template-column);margin:0 var(--grid-margin-side);gap:1.25rem}.btn-dark{border:none;border-radius:5px;padding:var(--btn-padding);background-color:var(--clr-primary-400);color:var(--clr-light-300);font-family:var(--ff-primary);font-weight:var(--fw-bold);border:1px solid var(--clr-light-300)}.btn-dark:hover{cursor:pointer;background-color:var(--clr-light-300);color:var(--clr-primary-400);border:1px solid var(--clr-primary-400)}.btn-light{border:none;border-radius:5px;padding:var(--btn-padding);background-color:var(--clr-light-300);color:var(--clr-primary-400);font-family:var(--ff-primary);font-weight:var(--fw-bold);border:1px solid var(--clr-primary-400)}.btn-light:hover{cursor:pointer;background-color:transparent;color:var(--clr-light-300);border:1px solid var(--clr-light-300)}.circles{display:flex;gap:.875rem}.circle-dark{content:"";display:block;width:1.25rem;aspect-ratio:1;border:5px solid var(--clr-primary-400);border-radius:50%}.circle-light{content:"";display:block;width:1.25rem;aspect-ratio:1;border:5px solid var(--clr-light-300);border-radius:50%}body{background-color:var(--clr-primary-400);background-image:url(https://res.cloudinary.com/dhmh6d8si/image/upload/v1683441930/background_lpah3u.svg);object-fit:contain;background-repeat:no-repeat;overflow-x:hidden}.app{position:relative}.primary-header{position:sticky;z-index:9;top:0;background-color:var(--clr-light-300);margin:3rem 1.35rem 0;padding:0 1rem;border-radius:.25rem .25rem .5rem .5rem;display:flex;justify-content:space-between;align-items:center}.primary-header[data-visible=true]{background-color:var(--clr-primary-400);position:fixed;top:0;margin:0;padding-left:2rem;height:100vh;width:50vw;display:block}span.logo{color:var(--clr-primary-400);cursor:pointer}span.logo[data-visible=true],.primary-nav{display:none}.primary-nav[data-visible=true]{display:block}.primary-nav ul{display:flex;gap:1rem}.primary-nav[data-visible=true] ul{flex-direction:column}.nav-toggle{color:var(--clr-primary-400)}.nav-toggle[data-visible=true]{color:var(--clr-light-200);padding:2rem 0}@media (min-width:832px){.nav-toggle{display:none}.primary-header{position:sticky;min-height:fit-content;top:0;margin:0;margin-right:1.5rem;margin-top:2rem;padding:0;padding-right:1rem;border-top-right-radius:2rem;border-bottom-right-radius:2rem}.primary-nav{display:inline;background-color:var(--clr-primary-400);height:fit-content;padding:1rem 3rem;border-bottom-right-radius:2rem;border-bottom:2px solid var(--clr-light-300)}.primary-nav ul{gap:3rem}.active-link{color:var(--clr-light-500)}span.logo{margin-right:2rem;color:var(--clr-primary-400)}span.logo:hover{color:var(--clr-light-200)}}.hero-section{background-color:var(--clr-light-300);border-radius:2.5rem;margin:1rem 1.25rem;position:relative}.hero-section{margin-top:-3.25rem}.hero-section .container{padding:6.5rem 0}.hero-section .container .left{grid-column:1/3}.hero-section .container .right{grid-column:3/5;justify-self:center;position:relative}.hero-section .container p{margin-bottom:1.25rem}.hero-section .circles{margin:1.875rem 0}.pp-frame{width:250px}.pp-image{width:235px;height:350px;position:absolute;top:8px;left:7px;object-fit:cover;transition:filter .3s ease-in}.pp-image:hover{filter:drop-shadow(0 0 .9rem rgb(187,249,247))}.icons{display:flex;flex-direction:column;gap:1.5rem;position:absolute;right:5rem;top:40%}.github:hover{color:#565656;cursor:pointer}.linkedin:hover{color:#5691ff;cursor:pointer}@media (min-width: 35rem) and (max-width: 52rem){.hero-section .container .left{grid-column:1/3;margin-left:5rem;margin-top:2rem;padding-right:10rem}.hero-section .container .right{grid-column:1/3;grid-row:1}.icons{top:75%;right:5rem}}@media (max-width: 35rem){.hero-section .container .left{grid-column:1;padding-right:1rem}.hero-section .container .right{grid-column:1;grid-row:1}.icons{flex-direction:row;top:67%;right:2rem}}.about-section{position:relative}.about-section .container{padding:5rem}.about-section .container .title{grid-column:2/4;margin-bottom:2rem}.about-section .container .circles{position:absolute;top:15rem;left:33%}.about-section .container p{grid-column:2/4;margin-left:7rem}.about-section .container .btn-light{grid-column:2/4;justify-self:end;align-self:center;margin-top:1rem}@media (min-width: 35rem) and (max-width: 52rem){.about-section .container .title{grid-column:1/3}.about-section .container p{grid-column:1/3;margin-left:5rem}.about-section .container .circles{position:absolute;top:12.75rem;left:6rem}.about-section .container .btn-light{grid-column:1/3}}@media (max-width: 35rem){.about-section .container{margin:4rem 2rem;padding:0}.about-section .container .title{grid-column:1}.about-section .container p{grid-column:1;margin-left:0}.about-section .container .circles{position:absolute;top:5rem;left:80%}.about-section .container .btn-light{grid-column:1}}.skill-section{padding:4rem 0;opacity:.85}.skill-section .container .title{grid-column:var(--grid-column);justify-self:center;text-align:center;margin:1rem 0}.skill-section .container .skill-list{grid-column:var(--grid-column);padding:0 8rem;justify-content:space-between;display:flex;flex-wrap:wrap;gap:2rem}.skill-section .container .skill-slogun{grid-column:var(--grid-column);justify-self:center;margin:2rem 0;letter-spacing:5px}@media (min-width: 35rem) and (max-width:52rem){.skill-section .container .skill-list{padding:0;gap:1rem}}@media (max-width: 35rem){.skill-section .container .skill-list{padding:0;gap:0rem;justify-content:center}.skill-section .container .skill-slogun{letter-spacing:5px;text-align:center}}.project-section{padding:3rem}.project-section .container .title{grid-column:var(--grid-column);justify-self:center;margin:2rem 0;text-align:center}.project-section .container .project-list{grid-column:var(--grid-column);justify-self:center;display:grid;grid-template-columns:repeat(2,1fr);gap:10rem}.project-section .container .down-icon{color:var(--clr-light-300);grid-column:var(--grid-column);justify-self:center;margin-top:5rem}.project-card{width:var(--project-img-width)}.project-card .project-frame{position:relative}.project-card .project-frame .project-cover{width:var(--project-img-width);margin-bottom:2rem}.project-card .project-image{width:var(--project-inner-img-width);aspect-ratio:.68;position:absolute;top:7px;left:5px;object-fit:cover;transition:all .4s ease;cursor:pointer}.project-tech-detail{position:absolute;inset:0;margin:auto;display:flex;justify-content:center;align-items:center;padding:2rem;width:96%;height:97%;background-color:#000000bf;text-align:center;transform:scaleY(0);transform-origin:bottom;transition:transform .45s ease-in-out}.project-image:hover+.project-tech-detail,.project-tech-detail:hover{transform:scale(1)}.project-card .project-frame button{position:absolute;background-color:var(--clr-light-300);color:var(--clr-primary-400);text-align:center;padding:.25em;width:6em;margin:-52px 0;right:-2em;border-radius:.5rem;border:none}.project-card .project-frame button:hover{cursor:pointer;color:var(--clr-light-500);background-color:var(--clr-primary-400);border:1px solid var(--clr-light-300)}@media (min-width:35rem) and(max-width: 52rem){.project-section .container .project-list{gap:4rem}.project-card .project-frame span{width:6em}}@media (max-width:35rem){.project-section .container .project-list{grid-column:var(--grid-column);justify-self:center;display:grid;grid-template-columns:repeat(1,1fr);gap:10rem}.project-card .project-frame span{width:7em}}.testimonial-section .container .title{grid-column:var(--grid-column);justify-self:center;margin:5rem 0 2rem;text-align:center}.testimonial-section .container .testimonial-list{grid-column:var(--grid-column);justify-self:center;align-items:center}.slide-size{width:var(--slider-width)}.slide-size+div{width:var(--review-card-width)}.carousel-dots li button:hover:before,.carousel-dots li button:focus:before{opacity:0}.carousel-dots li button:before{all:initial;cursor:pointer;content:"";display:block;width:.5rem;aspect-ratio:1;border:3px solid var(--clr-light-500);border-radius:50%}.next-review{grid-column:var(--grid-column);justify-self:center;margin:1rem 0}.testimonial-card{width:var(--review-card-width);padding:5rem 4rem 1rem;border-top-left-radius:1.875rem;border-bottom-right-radius:1.875rem;position:relative}.testimonial-card p{text-align:center;padding:1rem 0 0}.testimonial-card .quotation{position:absolute;top:5px;left:5px;opacity:.2;color:var(--clr-primary-400)}.testimonial-card .testimonial-footer{display:flex;align-items:center;justify-content:space-between;margin-top:1rem;margin-bottom:2rem}@media (max-width: 35rem){.testimonial-card{padding:3rem 2rem 1rem}}.contact-section{margin:9rem 0}.contact-section .container .title{grid-column:var(--grid-column);justify-self:center;text-align:center;padding:4rem 0}.contact-section .container .contact-info-list{grid-column:1/3;justify-self:center;display:flex;flex-direction:column;gap:1rem}.contact-section .container .contact-card{display:flex;flex-direction:column;justify-content:center;align-items:center;width:18rem;background-color:var(--clr-light-200);padding:1em .25em;border-radius:.5rem}.contact-section .container .contact-card:hover{background-color:var(--clr-light-500);cursor:pointer}.contact-form{grid-column:3/5;display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.contact-form input,.contact-form textarea{background-color:transparent;border:2px solid var(--clr-light-300);width:var(--field-width);border-radius:.5rem;padding:1rem;color:var(--clr-light-500)}.contact-form input::placeholder{color:var(--clr-light-500)}.contact-form input:focus,.contact-form input:focus-visible,.contact-form textarea:focus{outline:transparent;border:3px solid var(--clr-light-500)}@media (min-width:35rem) and (max-width: 52rem){.contact-section .container .contact-info-list{grid-column:1/2}.contact-form{grid-column:2/3}}@media (max-width:35rem){.contact-section .container .contact-info-list{grid-column:1}.contact-form{grid-column:1;justify-self:center}}.footer-section{padding:2rem}.footer-section .container{display:flex;flex-direction:column;justify-content:center;align-items:center}.footer-section .container .title{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:2rem 0}.footer-nav{margin:0 0 2rem}.footer-nav ul{display:flex;gap:2rem}.footer-nav ul li:hover{text-decoration:underline 1px}.footer-section .container .social-icons{display:flex;gap:5rem;margin:0 0 1rem}@media (max-width: 35rem){.footer-nav ul{flex-direction:column;align-items:center}.footer-section .container .social-icons{gap:1rem}}.carousel-item{position:absolute;top:0;left:0}.Carousel{width:100%}.carousel-initialized{overflow:hidden;position:relative}.carousel-arrow.carousel-hidden{display:none}.carousel-track{width:100%;display:flex;position:relative}.carousel-prev.block,.carousel-next.block{opacity:1}.carousel-prev,.carousel-next{opacity:0;font-size:0;line-height:0;width:40px;height:100%;border-radius:100%;position:absolute;top:0;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;color:transparent;border:none;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1) 0ms;z-index:4;background:none}.carousel-prev:hover,.carousel-prev:focus,.carousel-next:hover,.carousel-next:focus{opacity:1;color:transparent;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1) 0ms}.carousel-prev:hover:before,.carousel-prev:focus:before,.carousel-next:hover:before,.carousel-next:focus:before{opacity:1}.carousel-prev.carousel-disabled:before,.carousel-next.carousel-disabled:before{opacity:.25}.carousel-prev:before,.carousel-next:before{content:"";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:block;width:20px;height:20px;background-position:center;background-repeat:no-repeat;background-size:contain}.carousel-prev:before{background-image:url("data:image/svg+xml,%3C!-- Generated by IcoMoon.io --%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ctitle%3Earrow-left2%3C/title%3E%3Cpath fill='%23900' d='M12.586 27.414l-10-10c-0.781-0.781-0.781-2.047 0-2.828l10-10c0.781-0.781 2.047-0.781 2.828 0s0.781 2.047 0 2.828l-6.586 6.586h19.172c1.105 0 2 0.895 2 2s-0.895 2-2 2h-19.172l6.586 6.586c0.39 0.39 0.586 0.902 0.586 1.414s-0.195 1.024-0.586 1.414c-0.781 0.781-2.047 0.781-2.828 0z'%3E%3C/path%3E%3C/svg%3E%0A")}.carousel-next:before{background-image:url("data:image/svg+xml,%3C!-- Generated by IcoMoon.io --%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ctitle%3Earrow-right2%3C/title%3E%3Cpath fill='%23900' d='M19.414 27.414l10-10c0.781-0.781 0.781-2.047 0-2.828l-10-10c-0.781-0.781-2.047-0.781-2.828 0s-0.781 2.047 0 2.828l6.586 6.586h-19.172c-1.105 0-2 0.895-2 2s0.895 2 2 2h19.172l-6.586 6.586c-0.39 0.39-0.586 0.902-0.586 1.414s0.195 1.024 0.586 1.414c0.781 0.781 2.047 0.781 2.828 0z'%3E%3C/path%3E%3C/svg%3E%0A")}.carousel-next.custom:before,.carousel-prev.custom:before{content:unset;background-image:unset}.carousel-prev{left:0px}[dir=rtl] .carousel-prev{right:-25px;left:auto}[dir=rtl] .carousel-prev:before{content:""}.carousel-next{right:0px}[dir=rtl] .carousel-next{right:auto;left:-25px}[dir=rtl] .carousel-next:before{content:""}.carousel-dots{display:block;width:100%;padding:0;margin-top:1em;list-style:none;text-align:center}.carousel-dots li{position:relative;display:inline-block;width:20px;height:20px;margin:0 5px;padding:0;cursor:pointer}.carousel-dots li button{font-size:0;line-height:0;display:block;width:20px;height:20px;padding:5px;cursor:pointer;color:transparent;border:0;outline:none;background:transparent}.carousel-dots li button:hover,.carousel-dots li button:focus{outline:none}.carousel-dots li button:hover:before,.carousel-dots li button:focus:before{opacity:1}.carousel-dots li button:before{font-family:slick;font-size:40px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:"•";text-align:center;opacity:.25;color:#000;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.carousel-dots li.carousel-dots-active button:before{opacity:.75;color:#000}.Carousel .carousel-initialized.scrolling .CustomArrow{display:none}.skillCard{margin:0 0rem}.skillCard .container{width:24rem}.skillCard .container .title{display:flex;justify-content:space-between;align-items:center;margin:0 0 1rem;padding:1rem .5rem}.skillCard .container .title:hover{cursor:pointer}.skillCard .container .down-icon{transition:all .3s ease-out}.visible{transform:rotate(-180deg)}.skillCard .container .skills{transition:all .2s ease-out}.down-menu{transform:translateY(-2rem);opacity:0}.skillCard .container .skills .skill{display:flex;align-items:center;margin-left:2rem;justify-content:space-between}.skills .skill-bar{display:flex;margin-left:2rem;align-items:center;margin-bottom:2rem}.skills .skill-bar .pos{content:"";border:2px solid rgb(0,0,0);border-top-left-radius:1rem;border-bottom-left-radius:1rem}.skills .skill-bar .neg{content:"";border:2px solid rgb(207,207,207);border-top-right-radius:2rem;border-bottom-right-radius:2rem}@media (max-width: 52rem){.skillCard .container{width:20rem}}
