html{scroll-behavior:smooth;scroll-padding-top:60px}*,*:before,*:after{box-sizing:border-box}*{margin:0}body{line-height:1.5;-webkit-font-smoothing:antialiased;font-family:Karla,sans-serif}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}.container{max-width:1440px;width:95%;margin:0 auto}.heading-1{font-size:4.1875rem;font-family:Yeseva One,cursive;line-height:1.1;color:#1f1f1f}.heading-2{font-size:2.375rem;font-family:Yeseva One,cursive;line-height:1}.label{display:inline-block;letter-spacing:1px;padding:.5rem .875rem;color:#e04038;font-weight:700;background-color:#f5f5f5}.label+.label{margin-left:.75rem}.tech-list{padding-inline:4rem;display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem}.tech-label{display:flex;align-items:center;gap:.75rem;padding:.5rem 1.25rem;background-color:#f5f5f5;border-bottom:2px solid #1f1f1f}.tech-logo{width:28px}.tech-label p{font-size:1.3125rem}.btn{padding:.5rem 1rem;background-color:#e04038;color:#fff;display:inline-block;text-decoration:none}.btn-outline{padding:.5rem 1rem;border:2px solid #e04038;color:#e04038;display:inline-block;text-decoration:none}a:is(:link,:active,:visited).active{color:#e04038}.header{display:flex;justify-content:space-between;align-items:center;padding-block:1.5rem;border-bottom:3px solid #1f1f1f}.logo{width:64px}.navlist{display:flex;list-style:none;gap:4rem}.navlink{text-decoration:none;color:#000;font-size:1.25rem;transition:all .3s ease;font-weight:500}.mobile-btn{position:relative;display:flex;justify-content:center;align-items:center;width:40px;height:40px;cursor:pointer;transition:all .5s ease-in-out;display:none}.line{width:32px;height:5px;background-color:#1f1f1f;transition:all .5s ease-in-out}.line:before,.line:after{content:"";position:absolute;width:32px;height:5px;background-color:#1f1f1f;transition:all .5s ease-in-out}.line:before{transform:translateY(-9px)}.line:after{transform:translateY(9px)}.mobile-btn.active-mobile .line{transform:translate(-50px);background:transparent}.mobile-btn.active-mobile .line:before{transform:rotate(45deg) translate(35px,-35px)}.mobile-btn.active-mobile .line:after{transform:rotate(-45deg) translate(35px,35px)}.hero{margin-top:7rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}.hero-text h1{margin-bottom:1.5rem}.hero-text p:not(.label){margin-top:1.5rem;margin-bottom:2.25rem;max-width:50ch;color:#1f1f1f}.hero-text a{text-decoration:none}.cta-about{display:inline-flex;justify-content:center;align-items:center;gap:.5rem;transition:all .3s ease}.hero-image{width:700px;box-shadow:.4rem .4rem #000}.hero .hero-text{opacity:0;visibility:hidden;transform:translate(-100px);transition:transform 1s,opacity 1s}.hero .hero-image{opacity:0;visibility:hidden;transform:translateY(50px);transition:transform 1s,opacity 1s}.hero.animate-hero :is(.hero-text,.hero-image){opacity:1;visibility:visible}.hero.animate-hero .hero-text{transform:translate(0)}.hero.animate-hero .hero-image{transform:translateY(0)}.tech-stack{display:flex;flex-direction:column;align-items:center;margin-top:10rem;background-color:#e6584d;background-image:url(/assets/backgorund-CJhIHW3h.webp);background-blend-mode:multiply;background-size:cover;background-position:center center;padding-block:4rem;box-shadow:.5rem .5rem #000}.tech-stack h2{margin-bottom:2rem;letter-spacing:1px;color:#f5f5f5}.tech-stack,.tech-stack h2,.tech-label{opacity:0;visibility:hidden;transform:translateY(100px);transition:transform 1s,opacity 1s}.tech-label{transform:translateY(30px);transition:transform 1s,opacity 1s;transition-delay:calc(var(--index) * 50ms)}.tech-stack h2{transform:translateY(50px)}.tech-stack.animate-tech,.tech-stack.animate-tech :is(h2,.tech-label){opacity:1;visibility:visible;transform:translateY(0)}.project{margin-top:10rem}.card-container{display:flex;justify-content:center;flex-wrap:wrap;column-gap:3rem;row-gap:3rem;align-items:center}.card-image img{width:100%;height:280px;object-fit:cover}.project>h2{text-align:center;margin-bottom:48px}.card{position:relative;max-width:440px;box-shadow:.5rem .5rem #000;transition:box-shadow .3s ease}.card-label-wrapper{display:flex;gap:.5rem;margin-bottom:.75rem}.card-label{font-size:14px;padding:4px 8px;background-color:#6d6d6d8c;color:#fff}.card-text{padding:1rem;background-color:#ebebeb}.card-text>h2{color:#1f1f1f;font-size:1.65rem;margin-bottom:.25rem}.card-text>p{margin-bottom:1rem}.card-btn{transition:all .5s ease;display:flex;gap:.75rem;justify-content:center;align-items:center;color:#f5f5f5;background-color:#e6584d;flex:1}.card-btn img{width:24px}.project-link-wrapper{display:flex;gap:.65rem}.project-link-wrapper a svg{width:24px}.project-link-wrapper a svg path{fill:#ebebeb}.project>h2,.card-container .card{opacity:0;visibility:hidden;transform:translateY(-20px);transition:transform 1s,opacity 1s}.card-container .card{transform:translate(calc(var(--index) * -50px));transition-delay:calc(var(--index) * .2s)}.project.animate-project :is(h2,.card){opacity:1;visibility:visible;transform:translate(0)}.cta{background-color:#e6584d;color:#f5f5f5;padding:3rem 4rem;margin-top:10rem;display:flex;justify-content:space-between;align-items:center;box-shadow:.5rem .5rem #000;overflow:hidden}.cta-arrow{transition:transform .4s ease-in-out}.cta h2:first-of-type{color:#000;max-width:15ch}.cta-button{display:flex;gap:3rem}.cta-logo{width:80px;transition:all .2s ease}.cta-text>.heading-2{opacity:0;visibility:hidden;transition:opacity 1s}.cta-text>.heading-2:nth-child(2){transition-delay:.65s}.cta.animate-cta .cta-text>.heading-2{opacity:1;visibility:visible}.cta-logo{opacity:0;visibility:hidden;transition:transform 1s,opacity 1s}.cta-logo:nth-child(1){transform:translate(50px);transition-delay:1.25s}.cta-logo:nth-child(2){transform:translate(100px);transition-delay:1.5s}.cta-logo:nth-child(3){transform:translate(150px);transition-delay:1.75s}.cta.animate-cta .cta-logo{opacity:1;visibility:visible;transform:translate(0)}.cta-arrow{opacity:0;visibility:hidden;transition:all .3s;transition-delay:1s}.cta.animate-cta .cta-arrow{opacity:1;visibility:visible;animation:animate-slide 1.55s alternate;animation-delay:1.1s}footer{margin-top:7rem}.footer{border-top:3px solid #1f1f1f;display:flex;justify-content:center;align-items:center;gap:1rem;padding-block:1rem;font-size:1.125rem}.footer img{width:52px}.footer span a{text-decoration:underline;color:#e04038;font-weight:600}@media (hover: hover){.navlink:hover{color:#e04038}.cta-about:hover{box-shadow:inset 0 -3.25em #1f1f1f}.card-btn:hover{box-shadow:inset 0 -3.25em #1f1f1f;color:#fff}.cta:hover .cta-arrow{transform:translate(2rem);transition-delay:0s}.cta-logo:hover{transform:scale(1.2);cursor:pointer}}@media (hover: none){.navlink:active{color:#ebebeb}.cta-about:active{background-color:#1f1f1f}.card-btn:active{background-color:#1f1f1f;color:#fff}.cta-logo:active{transform:scale(1.2)}}@keyframes animate-slide{0%{transform:translate(0)}50%{transform:translate(60px)}to{transform:translate(0)}}@keyframes animate-down{0%{transform:rotate(90deg) translate(0);opacity:0}50%{opacity:.25;transform:rotate(90deg) translate(-180px)}to{opacity:1;transform:rotate(90deg) translate(0)}}@media (max-width: 1280px){.heading-1{font-size:4rem}.cta-text .heading-2{font-size:2rem}.cta-arrow{width:108px}.cta-logo{width:68px}}@media (max-width: 1024px){.heading-1{font-size:3rem}.label{font-size:14px;padding:.5rem .65rem}.card-container{align-items:stretch;column-gap:2rem;row-gap:2.25rem}.card{width:360px;display:flex;flex-direction:column}.card-text{display:flex;flex-direction:column;justify-content:space-between;flex:1}.cta{padding:2.5rem 2rem}.cta-text .heading-2{font-size:1.85rem}.cta-arrow{width:78px}.cta-logo{width:60px}.cta-button{gap:2.05rem}}@media (max-width: 768px){.header{padding-block:1.25rem}.navlist{gap:3rem}.navlink{font-size:1.125rem}.hero{flex-direction:column;margin-top:3rem}.hero-text{padding-inline:12px}.hero-image{width:95%;margin-inline:auto}.label{padding:.5rem .875rem}#tech-stack{padding-inline:12px;margin-inline:auto}.tech-stack{margin-top:6rem}.tech-list{padding-inline:2rem;gap:1rem}#project{padding-inline:12px}.card{max-width:560px;width:100%}.card-image img{height:300px}.project{margin-top:6rem}#cta{padding-inline:12px}.cta{flex-direction:column;gap:3rem;margin-top:6rem}.cta-text .heading-2{font-size:2.25rem;text-align:center}.cta h2:first-of-type{max-width:30ch}.cta-arrow{width:78px;margin-top:-10px}.cta.animate-cta .cta-arrow{animation:animate-down 2s forwards}.cta-button{width:400px;max-width:100%;justify-content:space-around}.cta-logo{width:72px}}@media (max-width: 550px){a:is(:link,:active,:visited).active{color:#fff}.header{position:relative}.logo{width:52px}.heading-1{font-size:2.75rem}.heading-2{font-size:2rem}.navbar{display:none}.mobile-btn{display:flex}.navbar{position:absolute;z-index:99;top:93px;height:100vh;right:-16px;width:320px;padding-block:2rem;background-color:#e6584d;transform:translate(400px);transition:all .5s ease-in-out}.navbar.slide-in{transform:translate(0)}.navlist{flex-direction:column;gap:2.5rem}.navlink{font-size:1.25rem}.navbar.open{display:flex}.label{font-size:13px}.hero-text p:not(.label){margin-bottom:1.75rem}.tech-stack{padding-block:3rem}.tech-logo{width:26px}.tech-label{padding:.5rem 1rem;gap:.55rem}.tech-label p{font-size:1.15rem}.card-container .card{transition-delay:calc(var(--index) * .6s)}.card-text>h2{font-size:1.5rem}.card-image img{height:240px}.card-btn{font-size:14px}.project-link-wrapper a svg{width:22px}.cta-logo{width:64px}footer{margin-top:6rem}.footer{flex-direction:column;gap:.5rem}}@media (max-width: 375px){.header{padding-block:1rem}.mobile-btn{width:38px;height:38px}.line{width:28px;height:4px}.line:before,.line:after{width:28px;height:4px}.line:before{transform:translateY(-8px)}.line:after{transform:translateY(8px)}.navbar{top:85px}.heading-1{font-size:2.45rem}.heading-2{font-size:1.75rem}.label{font-size:12px;padding:.5rem}.label+.label{margin-left:.25rem}.tech-list{padding-inline:1rem}.tech-logo{width:24px}.tech-label p{font-size:1rem}.card-btn{font-size:13px;gap:.5rem}.card-label{font-size:12px}.card-image img{height:200px}.project-link-wrapper a svg{width:20px}.btn.card-btn{padding:.5rem}.cta-text .heading-2{font-size:2rem}.cta-logo{width:58px}}