@import"https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";.header{width:100%;padding:2rem 4rem;position:fixed;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:2}.header span{color:#00f}@media screen and (max-width: 900px){.header{padding:1rem}}.nav__container{display:flex;justify-content:space-between;align-items:center;height:100%}.nav__container .logo{color:var(--black-color)}.nav__container .logo-name{font-size:1rem}.nav__container .logo-title{font-size:small;font-weight:lighter}.nav__container .nav-menu{display:flex;align-items:center}.nav__container .nav{display:flex;gap:2rem}.nav__container .nav li{list-style:none}.nav__container .nav a{font-size:1rem;font-weight:600;color:var(--black-color);transition:color .3s ease}.nav__container .nav a:hover{color:var(--secondary-color)}.nav__container .btn{border:1px solid var(--secondary-color)}.nav__container .hamburger{display:none}.nav__container .hamburger .menuIcon,.nav__container .hamburger .menuIcon2{color:var(--white-color);font-size:2rem}.nav__container .switch1{display:none}.nav__container .switch{color:var(--black-color)}@media screen and (max-width: 900px){.nav__container .header{padding:0rem}.nav__container .hamburger{display:flex}.nav__container .nav{display:flex;flex-direction:column;gap:1.5rem}.nav__container .nav-menu{position:absolute;flex-direction:column;justify-content:start;background:var(--tetiary-color);width:70%;left:-100%;top:0px;z-index:2;height:100vh;transition:.5s;padding:2rem;border-left:1px solid #eee}.nav__container .nav-menu.active{left:0%}.nav__container .nav li{padding:1rem 0;width:100%}.nav__container .nav a{font-size:1rem;color:var(--whiteInverse);transition:color .3s ease}.nav__container .nav a:hover{color:var(--secondary-color)}.nav__container .switch{display:none}.nav__container .switch1{display:block;color:var(--black-color)}}.app{background:var(--primary-color);font-family:var(--font-base);overflow-x:hidden}.whitebg{background-color:var(--white-color)}.app__container{width:100%;min-height:100vh;display:flex;flex-direction:row}.app__flex{display:flex;justify-content:center;align-items:center}.h-text{font-size:3rem;font-weight:600;line-height:normal;color:var(--white-color);text-transform:capitalize}.h-text span{color:var(--secondary-color)}@media screen and (min-width: 2000px){.h-text{font-size:4rem}}@media screen and (max-width: 1200px){.h-text{font-size:3.5rem}}@media screen and (max-width: 600px){.h-text{font-size:2.1rem}}.sub-text{font-size:2.6rem;font-weight:600;text-align:center;text-transform:capitalize;color:var(--white-color)}.sub-text span{color:var(--secondary-color)}@media screen and (min-width: 2000px){.sub-text{font-size:3rem}}@media screen and (max-width: 450px){.sub-text{font-size:1.7rem}}.p-text{font-size:.8rem;color:var(--white-color);line-height:1.5}@media screen and (min-width: 2000px){.p-text{font-size:1.75rem}}.pSub-text{font-size:16px;color:var(--white-color);line-height:1.5}@media screen and (min-width: 2000px){.pSub-text{font-size:16px}}@media screen and (max-width: 600px){.pSub-text{font-size:14px}}.bold-text{font-size:28px;font-weight:500;color:var(--secondary-color)}@media screen and (min-width: 2000px){.bold-text{font-size:2rem}}@media screen and (max-width: 450px){.bold-text{font-size:1.75rem}}.mid-text{font-size:2rem;color:var(--secondary-color)}@media screen and (min-width: 2000px){.mid-text{font-size:1.5rem}}@media screen and (max-width: 450px){.mid-text{font-size:1.2rem}}a{text-decoration:none}ul{list-style-type:none}.btn{padding:12px 28px;border-radius:24px 4px;border:none;cursor:pointer;font-weight:400}.btn:hover{box-shadow:#00000026 0 8px 24px}.hero{width:100%;height:100%;display:flex;align-items:center;margin-top:7rem;justify-content:center;background:var(--primary-color);color:var(--white-color);padding:2rem;overflow:auto;font-family:var(--font-base)}.hero .hero__container{text-align:center;max-width:800px;width:100%;padding:2rem;animation:fadeIn 1.5s ease-in-out}.hero .hero__container .hero__headline{margin-bottom:1rem;background:var(--secondary-color);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:slideIn 1.5s ease-out}.hero .hero__container .hero__subheadline{margin-bottom:2rem;color:var(--gray-color);animation:fadeInUp 2s ease-out}.hero .hero__container .hero__cta-buttons{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.hero .hero__container .hero__cta-buttons .hero__button{padding:.8rem 2rem;font-size:1rem;font-weight:600;border-radius:30px;border:none;cursor:pointer;transition:transform .3s ease,background .3s ease}.hero .hero__container .hero__cta-buttons .hero__button--primary{background-color:var(--button);color:var(--whiteInverse);box-shadow:0 4px 15px #00c6ff66}.hero .hero__container .hero__cta-buttons .hero__button--secondary{background-color:transparent;color:var(--button);border:2px solid var(--button)}.hero .hero__container .hero__cta-buttons .hero__button:hover{transform:scale(1.05);filter:brightness(1.1)}.hero .hero__container .hero__supporting-text{font-size:1rem;font-weight:300;margin-top:2rem;line-height:1.6;max-width:600px;color:var(--gray-color);margin:2rem auto 0;animation:fadeInUp 2.5s ease-out}.hero .social-icons{display:flex;gap:2rem;justify-content:center;align-items:center;margin-top:2rem}.hero .social-icons a{color:var(--secondary-color);transition:color .3s ease;padding:12px 10px 8px;border-radius:8px;background-color:var(--project-color)}.hero .social-icons a:hover{color:var(--button)}@media screen and (max-width: 768px){.hero .hero__cta-buttons{flex-direction:column;gap:1rem}}@media screen and (max-width: 480px){.hero .hero__container{padding:0rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.skills .skills__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1.5rem;justify-items:center;max-width:1000px;margin:0 auto}.skills .skill__card{background-color:var(--project-color);border-radius:12px;padding:1.5rem;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;align-items:center;text-align:center;transition:transform .3s ease;cursor:pointer}.skills .skill__card .skill__icon{font-size:2.5rem;color:var(--secondary-color);margin-bottom:.5rem}.skills{padding:4rem 1rem;background-color:var(--primary-color);text-align:center}.skills .skills__title{font-size:2rem;color:var(--secondary-color);margin-bottom:2rem}.skills .skills__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1.5rem;justify-items:center;max-width:1000px;margin:0 auto}.skills .skill__card{background-color:var(--project-color);border-radius:12px;width:150px;height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 10px #0000001a;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.skills .skill__card:hover{box-shadow:0 6px 15px #00000026}.skills .skill__card .skill__icon{font-size:2.5rem;color:var(--secondary-color);margin-bottom:.5rem;transition:transform .3s ease}.skill__card:hover .skills .skill__card .skill__icon{transform:rotate(360deg)}.skills .skill__card .skill__name{font-size:1rem;font-weight:500;color:var(--black-color)}.contact{width:100%;padding:3rem 1rem;background-color:var(--primary-color);border-radius:50px 50px 0 0;text-align:center;display:flex;justify-content:center;align-items:center}.contact .contact__container{display:flex;flex-direction:column;align-items:center;gap:1.5rem;max-width:600px}.contact .contact__container h3{color:var(--secondary-color);margin-bottom:1rem;width:100%}.contact .contact__container .p{font-size:1rem;color:var(--black-color);max-width:500px;margin:0 auto 1.5rem}.contact .contact__container .hero__button{padding:.8rem 2rem;width:260px;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-size:.8rem;font-weight:500;border-radius:30px;border:none;background-color:var(--button);color:var(--whiteInverse);box-shadow:0 4px 15px #00c6ff66;transition:transform .3s ease,background .3s ease;cursor:pointer}.contact .contact__container .hero__button:hover{transform:scale(1.05);filter:brightness(1.1)}.contact .contact__container .contact__social-icons{display:flex;gap:1.5rem;justify-content:center;align-items:center;margin-top:2rem}.contact .contact__container .contact__social-icons a{color:var(--secondary-color);transition:color .3s ease}.contact .contact__container .contact__social-icons a:hover{color:var(--button)}@media screen and (max-width: 768px){.contact{padding:2rem 1.2rem}.contact .contact__container h3{width:90%}.contact .contact__container .hero__button{width:90%;padding:.6rem 0rem;width:240px}}.scrollTop{visibility:hidden;opacity:0;position:fixed;bottom:5%;right:5%;display:flex;justify-content:center;align-items:center;border:3px solid transparent;border-radius:30rem;background-color:var(--secondary-color);z-index:100;height:4rem;width:4rem;background-origin:border-box;background-clip:content-box,border-box;transition:.5s ease-in-out;cursor:pointer}.scrollTop:hover{box-shadow:none}@media screen and (max-width: 700px){.scrollTop:hover{height:2.5rem;width:2.5rem}}.scrollTop a svg{color:var(--primary-color);font-size:2rem}.visible{visibility:visible;opacity:1}.work{width:100%;height:100%;margin-top:4rem}@media screen and (max-width: 800px){.work{margin-top:1rem}}.work__container{margin:0rem auto;width:90%}.work__container h1{margin-bottom:0rem}.work-portfolio{display:flex;flex-direction:column;justify-items:center;align-items:center}.workContent_col2{width:60%;margin:2rem;border-radius:23px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:var(--project-color)}.workContent_col2 .workContent_col3{display:flex;flex-direction:column;justify-content:center}.workContent_col2 .workContent_col3 h3{margin:20px 0}.workContent_col2 .workContent_col3 .workContent_col5{display:flex;align-items:center;justify-items:center;gap:12px;margin-top:1rem}.workContent_col2 .workContent_col3 .workContent_col5 a{color:var(--secondary-color)}.workContent_col2 .workContent_col3 .workContent_col5 .arrow{display:flex;align-self:center;font-size:22px;color:var(--secondary-color)}@media screen and (max-width: 800px){.workContent_col2{margin:2rem auto 0;width:100%;grid-template-columns:1fr;gap:1rem}}@media screen and (max-width: 600px){.workContent_col2{width:100%;margin:1rem auto 0;flex-direction:column;align-items:start}.workContent_col2 .workContent_col3 hr{margin:.7rem}.workContent_col2 .workContent_col3 .workContent_col5{margin-top:1rem}.workContent_col2 .workContent_col3 .icon{padding:.5rem;font-size:1rem;border-radius:10px}}.workContent_img{background-color:var(--project-color2);width:100%;border-radius:14px}.workContent_img img{width:80%;height:auto;display:flex;margin:0 auto;padding-top:20px}@media screen and (max-width: 900px){.workContent_img{margin-top:.5rem}.workContent_img img{width:100%;height:100%;padding:10px 10px 0}}.write{width:100%;height:100%}.write__container{margin:0rem auto;width:80%;display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (max-width: 800px){.write__container{margin-top:5rem}}.write-portfolio{display:grid;margin-top:2rem;grid-template-columns:auto 1fr;gap:3rem}.write-portfolio .writeContent_col3{background-color:var(--project-color);width:350px;height:400px;padding:1rem;position:relative}.write-portfolio .writeContent_col3 h3{margin-bottom:1rem}.write-portfolio .writeContent_col3 .writeContent_col5{display:flex;align-items:center;margin-top:2rem;position:absolute;bottom:1rem}.write-portfolio .writeContent_col3 .writeContent_col5 .eye{background-color:#65ce5455;color:#65ce54;margin-right:1rem}.write-portfolio .writeContent_col3 .writeContent_col5 .eye:hover{color:#65ce54}.write-portfolio .writeContent_col3 .writeContent_col5 .icon{padding:.5rem;border-radius:1rem;display:flex;justify-content:center;align-items:center;font-size:1rem;cursor:pointer}.write-portfolio .writeContent_col3 .writeContent_col5 .icon a{text-decoration:none;color:#65ce54}.write-portfolio .writeContent_col3 .writeContent_col5 p{margin-right:1rem}@media screen and (max-width: 800px){.write-portfolio{margin:2rem auto 0;display:grid;grid-template-columns:1fr;gap:1rem}}@media screen and (max-width: 600px){.write-portfolio{margin:2rem auto 0;display:grid;grid-template-columns:1fr;gap:1rem}.write-portfolio .writeContent_col3{width:auto;height:300px}.write-portfolio .writeContent_col3 .writeContent_col5{margin-top:1rem}.write-portfolio .writeContent_col3 .icon{padding:.5rem;font-size:1rem;border-radius:10px}}.about{width:100%;height:100%;overflow-x:hidden}.about__container{margin:2rem auto 0;width:90%;height:100%}.about__container .sub-text{text-align:center;margin-bottom:1.3rem}.about__container .about__col{display:flex;align-items:center;justify-content:space-around;gap:4rem;max-width:100%;height:100%}.about__container .about__col .about__text-wrapper{max-width:600px}.about__container .about__col .about__text-wrapper .about__text{font-size:16px;line-height:38px;font-weight:400;color:var(--white-color);text-align:justify}.about__container .about__col .about__col2 .image__col .image{width:400px;height:400px;border-radius:50%}@media (max-width: 1024px){.about__container .about__col{gap:1rem}.about__container .about__col .about__text-wrapper{margin-right:2rem}}@media (max-width: 768px){.about__container .about__col{flex-direction:column}.about__container .about__col .about__text-wrapper{margin-right:0;margin-bottom:.5rem}}@media (max-width: 480px){.about__container{margin:0rem auto;padding:0}.about__container .about__col .about__text-wrapper .about__text{font-size:1rem}.about__container .about__col .about__col2 .image__col .image,.about__container .about__col .about__col2 .image__border{width:300px;height:300px}}.testimonial{width:100%;padding:4rem 0;background-color:var(--primary-color)}.testimonial .testimonial-container{margin:0 auto;width:80%;text-align:center}.testimonial .testimonial-carousel{display:flex;gap:2rem;overflow:hidden;margin-top:2rem;width:max-content}.testimonial .testimonial-card{min-width:300px;max-width:600px;padding:2rem;background-color:var(--project-color);border:1px solid var(--gray-color);border-radius:16px;box-shadow:0 4px 15px #0000001a;display:flex;flex-direction:column;align-items:center}.testimonial .testimonial-card .testimonial-text{font-size:1rem;color:var(--black-color);line-height:1.6;margin-bottom:1.5rem}.testimonial .testimonial-card .testimonial-author{display:flex;text-align:left;align-items:center;gap:1rem;margin-top:1rem}.testimonial .testimonial-card .testimonial-author .testimonial-img{width:50px;height:50px;border-radius:50%;background-color:var(--gray-color)}.testimonial .testimonial-card .testimonial-author .testimonial-name{font-size:1.2rem;font-weight:600;color:var(--secondary-color)}.testimonial .testimonial-card .testimonial-author .testimonial-position{font-size:.9rem;color:var(--gray-color)}@media screen and (max-width: 768px){.testimonial .testimonial-container{width:90%}.testimonial .testimonial-card{width:200px}}.scrolling-images{overflow:hidden;padding:2rem 0;background-color:var(--primary-color)}.scrolling-images .scrolling-images__wrapper{display:flex;gap:2rem;padding:1rem 0}.scrolling-images .scrolling-image{width:400px;height:auto;border-radius:12px;box-shadow:0 4px 10px #736ef326;transition:transform .3s ease}@media screen and (max-width: 768px){.scrolling-images .scrolling-images{padding:0rem}.scrolling-images .scrolling-image{width:300px}}:root{--font-base: "Poppins", sans-serif;--primary-color: #eef2f6;--project-color: #d1e3f6;--project-color2: #b2d2f5;--tetiary-color: linear-gradient(121.53deg, #070b28 17.18%, #0a0d21 84.45%);--secondary-color: #0c589a;--black-color: #161515;--lightGray-color: #e4e4e4;--gray-color: #6b7688;--white-color: #010101;--whiteInverse: #ffffff;--button: #0c589a}[data-theme=true]{--font-base: "Poppins", sans-serif;--primary-color: linear-gradient(121.53deg, #070b28 17.18%, #0a0d21 84.45%);--project-color: #0b1244;--project-color2: #0f143c;--secondary-color: #1385e9;--tetiary-color: #eef2f6;--black-color: #f7f2f2;--lightGray-color: #f9f8f8;--gray-color: #e5edf9;--white-color: #ffffff;--whiteInverse: #010101;--button: #ffffff}*{box-sizing:border-box;padding:0;margin:0;scroll-behavior:smooth}
