<!doctype html>
<html class="no-js" lang="zxx" tp-theme="tp-theme-light">
<head>
   <meta charset="utf-8">
   <meta http-equiv="x-ua-compatible" content="ie=edge">
   <title>Sharjeel Anjum</title>
   <meta name="description" content="Sharjeel Anjum is a UI UX Designer and frontend developer, having 14 Years or experience, provides web development and web design services.">
   <meta name="keywords" content="pakistan web design web design Web Design - graphic design freelance designer logo designer branding jobsportal classified career">
   <meta name="viewport" content="width=device-width, initial-scale=1">

   <link rel="shortcut icon" type="image/x-icon" href="assets/img/logo/favicon.png">

   <!-- CSS here -->
   <link rel="stylesheet" href="assets/css/bootstrap.css">
   <link rel="stylesheet" href="assets/css/animate.css">
   <link rel="stylesheet" href="assets/css/custom-animation.css">
   <link rel="stylesheet" href="assets/css/swiper-bundle.css">
   <link rel="stylesheet" href="assets/css/slick.css">
   <link rel="stylesheet" href="assets/css/magnific-popup.css">
   <link rel="stylesheet" href="assets/css/font-awesome-pro.css">
   <link rel="stylesheet" href="assets/css/spacing.css">
   <link rel="stylesheet" href="assets/css/main.css">
</head>

<body>
   <!--[if lte IE 9]>
      <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
      <![endif]-->




   <!-- back to top start -->
   <div class="back-to-top-wrapper">
      <button id="back_to_top" type="button" class="back-to-top-btn">
         <svg width="12" height="7" viewBox="0 0 12 7" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M11 6L6 1L1 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
               stroke-linejoin="round" />
         </svg>
      </button>
   </div>
   <!-- back to top end -->

   <!-- tp-offcanvus-area-end -->
   <div class="tp-offcanvas-area-2 tp-menu-2">
      <div class="tp-offcanvas-shape">
         <img class="tp-offcanvas-shape-2" src="assets/img/offcanvas/bg-shape-3.png" alt="">
      </div>
      <div class="tp-offcanvas-circle-1">
         <span></span>
      </div>
      <div class="tp-offcanvas-circle-2">
         <span></span>
      </div>
      <div class="tp-offcanvas-wrapper">
         <div class="tp-offcanvas-top-2 d-flex align-items-center justify-content-between">
            <div class="tp-offcanvas-logo-2">
               <a href="#">
                  <img class="logo-white" src="assets/img/logo/logo.png" alt="">
                  <img class="logo-black" src="assets/img/logo/logo-black.png" alt="">
               </a>
            </div>
            <div class="tp-offcanvas-close-2">
               <button class="tp-offcanvas-close-btn-2 tp-offcanvas-open-btn-2">
                  <svg width="37" height="38" viewBox="0 0 37 38" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <path d="M9.19141 9.80762L27.5762 28.1924" stroke="currentColor" stroke-width="1.5"
                        stroke-linecap="round" stroke-linejoin="round" />
                     <path d="M9.19141 28.1924L27.5762 9.80761" stroke="currentColor" stroke-width="1.5"
                        stroke-linecap="round" stroke-linejoin="round" />
                  </svg>
               </button>
            </div>
         </div>
         <div class="tp-offcanvas-main-2">
            <div class="tp-offcanvas-content-2">
               <h3 class="tp-offcanvas-content-title-2">Hello There!</h3>
               <p>Let's discuss the upcoming breakthrough.</p>
            </div>
            <div class="tp-main-menu-mobile d-lg-none">
               <nav></nav>
            </div>
            
            <div class="tp-offcanvas-contact-2">
               <h3 class="tp-offcanvas-contact-title-2">Contact Me</h3>

               <ul>
                  <li><a href="tel:+923026198713">+92 302 6198713</a></li>
                  <li><a href="mailto:sharjil.hz@gmail.com">sharjil.hz@gmail.com</a></li>
                  <li>Islamabad, Pakistan</li>
               </ul>
            </div>
            <div class="tp-offcanvas-social-2">
               <h3 class="tp-offcanvas-contact-title-2">Follow Me</h3>
               <ul>
                  <li>
                     <a href="https://facebook.com/sharjeelanjumdesigner/" target="_blank">
                        <i class="fab fa-facebook-f"></i>
                     </a>
                  </li>
                  <li>
                     <a href="https://www.linkedin.com/in/sharjeel-anjum/" target="_blank">
                        <i class="fab fa-linkedin-in"></i>
                     </a>
                  </li>
                  <li>
                     <a href="https://twitter.com/sharjeel4it" target="_blank">
                        <i class="fab fa-twitter"></i>
                     </a>
                  </li>                 
               </ul>
            </div>
         </div>
      </div>
   </div>
   <!-- header area start -->
   
   <header>

      <div class="tp-header-area tp-header-mob-space tp-header-transparent p-relative">
         <span class="tp-header-border"></span>
         <div class="container container-large">
            <div class="row align-items-center">
               <div class="col-xl-2 col-lg-2 col-md-5 col-6">
                  <div class="logo">
                     <a class="logo-white" href="index.html">
                        <img data-width="115" src="assets/img/logo/logo.png" alt="">
                     </a>
                     <a class="logo-black" href="index.html">
                        <img data-width="115" src="assets/img/logo/logo-black.png" alt="">
                     </a>
                  </div>
               </div>
               <div class="col-xl-6 col-lg-7 d-none d-lg-block">
                 
               </div>
               <div class="col-xl-4 col-lg-3 col-md-7 col-6">
                  <div class="tp-header-right d-flex align-items-center justify-content-end">
                    
                     
                     <div class="tp-header-hamburger ml-20">
                        <button class="tp-hamburger-btn tp-hamburger-btn-white tp-menu-bar tp-offcanvas-open-btn-2"
                           type="button">
                           <span></span>
                        </button>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>

   </header>
   <!-- header area end -->

   <!-- header area start -->
   <header>

      <div class="tp-header-area tp-header-mob-space tp-header-transparent p-relative tp-int-menu tp-header-sticky-cloned">
         <div class="container container-large">
            <div class="row align-items-center">
               <div class="col-xl-2 col-lg-2 col-md-5 col-6">
                  <div class="logo">
                     <a class="logo-white" href="index.html">
                        <img data-width="115" src="assets/img/logo/logo.png" alt="">
                     </a>
                     <a class="logo-black" href="index.html">
                        <img data-width="115" src="assets/img/logo/logo-black.png" alt="">
                     </a>
                  </div>
               </div>
               <div class="col-xl-6 col-lg-7 d-none d-lg-block">
                 
               </div>
               <div class="col-xl-4 col-lg-3 col-md-7 col-6">
                  <div class="tp-header-right d-flex align-items-center justify-content-end">
                    
                     <div class="tp-header-hamburger ml-20">
                        <button class="tp-hamburger-btn tp-hamburger-btn-white tp-menu-bar tp-offcanvas-open-btn-2"
                           type="button">
                           <span></span>
                        </button>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>

   </header>
   <!-- header area end -->

  <!-- Scroll Smoother -->

   <div id="smooth-wrapper" class="tp-page-wrapper include-bg theme-bg" data-background="assets/img/bg/distort-bg.png">
      <div id="smooth-content">

         <main>

            <!-- hero area start -->
            <section class="tp-hero-area p-relative tp-btn-trigger z-index-1 fix theme-bg-2">
               <div class="tp-hero-social-wrapper">
                  <span class="tp-hero-social-bar"></span>
                  <div class="tp-hero-social">
                        <a href="https://facebook.com/sharjeelanjumdesigner/" target="_blank">
                           <i class="fab fa-facebook-f"></i>
                        </a>
                        <a href="https://www.linkedin.com/in/sharjeel-anjum/" target="_blank">
                           <i class="fab fa-linkedin-in"></i>
                        </a>
                        <a href="https://twitter.com/sharjeel4it" target="_blank">
                           <i class="fab fa-twitter"></i>
                        </a>   
                  </div>
               </div>
               <div class="tp-hero-shape">
                  <div class="tp-hero-shape-1 background-white-mode include-bg" data-background="assets/img/hero/hero-overlay.png"></div>
                  <div class="tp-hero-shape-1 background-dark-mode include-bg" data-background="assets/img/hero/hero-overlay-2.png"></div>
                  <span class="tp-hero-shape-2"></span>
               </div>
               <div class="tp-hero-bottom-text-wrapper">
                  <div class="tp-hero-bottom-text">
                     <p>Visual designer</p>
                     <p>UI UX designer</p>
                  </div>
                  <div class="tp-hero-bottom-text">
                     <p>APP designer</p>
                     <p>Graphic designer</p>
                  </div>
               </div>
               <div class="container">
                  <div class="row align-items-end">
                     <div class="col-xl-7 col-lg-7 col-md-12">
                        <div class="tp-hero-left-wrapper">
                           <div class="tp-hero-content tp_text_anim p-relative z-index-1">
                              <span>Hello There! <img src="assets/img/hero/hero-hand.png" alt=""></span>
                              <h3 class="tp-hero-title cd-headline clip tp_title_anim">
                                 I am Sharjeel <br>
                                 <span class="cd-words-wrapper">
                                    <b class="is-visible">Web</b>
                                    <b class="app">App</b>
                                    <b>UX UI</b>
                                 </span>
                                 designer
                              </h3>

                              <p>My fervor for seamlessly blending design, code, and interactive <br> elements fuels my impact in the dynamic world of web design.</p>

                              <div class="tp-hero-btn wrap ">
                                 <div class="tp-hover-btn-wrapper tp-btn-bounce">
                                    <a href="#contact" class="tp-hover-btn tp-hover-btn-item tp-btn-circle square">
                                       <span class="tp-btn-circle-text">
                                          Get <br> In Touch
                                       </span>
                                       <span class="tp-btn-circle-arrow">
                                          <svg width="12" height="12" viewBox="0 0 12 12" fill="none"
                                             xmlns="http://www.w3.org/2000/svg">
                                             <path d="M11 1L1 11" stroke="currentColor" stroke-width="1.5"
                                                stroke-linecap="round" stroke-linejoin="round" />
                                             <path d="M2.98874 1.01725L10.9991 1L10.9826 9.01105" stroke="currentColor"
                                                stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
                                          </svg>
                                       </span>
                                       <i class="tp-btn-circle-dot"></i>
                                    </a>
                                 </div>
                              </div>
                              <div class="tp-hero-scroll smooth">
                               
                                    <span class="tp-hero-scroll-bar"></span>
                                    <span class="tp-hero-scroll-mouse"></span>
                                 
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-5 col-lg-5 col-md-12">
                        <div class="tp-hero-thumb-wrapper text-center text-lg-end p-relative z-index-1">
                           <div class="tp-hero-thumb-shape">
                              <img class="tp-hero-thumb-shape-1" data-speed="1.4"
                                 src="assets/img/hero/shape/hero-shape-1.png" alt="">
                              <img class="tp-hero-thumb-shape-2 d-none d-xl-block" data-speed="1.2"
                                 src="assets/img/hero/shape/hero-shape-2.png" alt="">
                              <span class="tp-hero-thumb-shape-3"></span>
                           </div>
                           <div class="tp-hero-thumb">
                              <img src="assets/img/hero/hero-img.png" alt="">
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- hero area end -->

            <!-- brand area start -->
            <section class="tp-brand-area p-relative">
               <span class="tp-brand-border transition-3"></span>
               <div class="container container-large">
                  <div class="tp-brand-inner p-relative">
                     <span class="tp-brand-inner-border left tp-vertical-line"></span>
                     <span class="tp-brand-inner-border right tp-vertical-line"></span>

                     <div class="row align-items-center">
                        <div class="col-xl-3 col-lg-3 col-md-5">
                           <h3 class="tp-brand-title">Trusted by <br> People who love my work</h3>
                        </div>
                        <div class="col-xl-9 col-lg-9 col-md-7">
                           <div class="tp-brand-slider">
                              <div class="tp-brand-slider-active swiper-container">
                                 <div class="swiper-wrapper align-items-center">
                                    <div class="tp-brand-item swiper-slide text-end">
                                          <img src="assets/img/brand/01.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                          <img src="assets/img/brand/02.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                          <img src="assets/img/brand/03.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                          <img src="assets/img/brand/04.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                          <img src="assets/img/brand/05.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                       <img src="assets/img/brand/06.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                       <img src="assets/img/brand/07.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                       <img src="assets/img/brand/08.png" alt="">
                                    </div>
                                    <div class="tp-brand-item swiper-slide text-end">
                                       <img src="assets/img/brand/09.png" alt="">
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- brand area end -->

            <!-- service area start -->
            <section class="tp-services-area tp-sv tp-services-bg-text-animation fix">
               <div class="container container-large">
                  <div class="tp-services-inner pb-80 p-relative z-index-1">

                     <span class="tp-services-inner-border tp-vertical-line transition-3"></span>
                     <span class="tp-services-inner-border right tp-vertical-line transition-3"></span>

                    
                     <div class="row gx-0">
                        <div class="col-xl-6 col-lg-7">
                           <div class="tp-services-wrapper tp-services-capsule-wrapper p-relative  pt-100 pr-70"
                              data-tp-throwable-scene="true">
                              <div class="tp-section-title-wrapper tp_text_anim mb-30">
                                 <div class="tp-section-title-inner p-relative">
                                    <span class="tp-section-subtitle">Services</span>
                                    <h3 class="tp-section-title tp_title_anim">What are my Capabilities</h3>
                                 </div>
                                 <p>Uniting my enthusiasm for design, code, and the dynamic realm of interactive web design.</p>
                              </div>
                              
                              <img src="assets/img/services/solution-provider.jpg" alt="">

                           </div>
                        </div>
                        <div class="col-xl-6 col-lg-5">
                           <div class="tp-services-accordion tp-accordion tp-accordion-2 mt-90 pl-70 p-relative">
                              <span class="tp-services-accordion-border"></span>
                              <div class="accordion" id="accordionExample">
                                 <div class="accordion-item tp-services-accordion-item active">
                                    <h2 class="accordion-header" id="headingOne">
                                       <button class="accordion-button collapsed" type="button"
                                          data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="false"
                                          aria-controls="collapseOne">
                                          <span>01</span>
                                          UI/UX Design
                                       </button>
                                    </h2>
                                    <div id="collapseOne" class="accordion-collapse collapse show"
                                       aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                       <div class="accordion-body">
                                          <p>Elevating digital experiences through intuitive interfaces and user-centric design, I specialize in crafting visually engaging and functional user interfaces that resonate with audiences.</p>
                                          <ul>
                                             <li>Mobile APP design</li>
                                             <li>Website Design</li>
                                             <li>Application Design</li>
                                          </ul>
                                       </div>
                                    </div>
                                    <span class="accordion-item-border"></span>
                                 </div>
                                 <div class="accordion-item tp-services-accordion-item">
                                    <h2 class="accordion-header" id="headingTwo">
                                       <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                          data-bs-target="#collapseTwo" aria-expanded="false"
                                          aria-controls="collapseTwo">
                                          <span>02</span>
                                          Interactive Web Solutions
                                       </button>
                                    </h2>
                                    <div id="collapseTwo" class="accordion-collapse collapse"
                                       aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                       <div class="accordion-body">
                                          <p>Transforming digital spaces into interactive experiences, I specialize in providing innovative Interactive Web Solutions. Through a blend of cutting-edge technology and creative design, I craft dynamic websites that captivate users, fostering engagement and interactivity at every click.</p>
                                          <ul>
                                             <li>Website Development</li>
                                             <li>APP Development</li>
                                             <li>CRM</li>
                                             <li>Wordpress</li>
                                          </ul>
                                       </div>
                                    </div>
                                    <span class="accordion-item-border"></span>
                                 </div>
                                 <div class="accordion-item tp-services-accordion-item">
                                    <h2 class="accordion-header" id="headingThree">
                                       <button class="accordion-button collapsed" type="button"
                                          data-bs-toggle="collapse" data-bs-target="#collapseThree"
                                          aria-expanded="false" aria-controls="collapseThree">
                                          <span>03</span>
                                          Frontend Development
                                       </button>
                                    </h2>
                                    <div id="collapseThree" class="accordion-collapse collapse"
                                       aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                       <div class="accordion-body">
                                          <p>Bridging design and functionality, my expertise in frontend development ensures seamless and responsive user interfaces, translating design concepts into high-performance, interactive web experiences.</p>
                                          <ul>
                                             <li>HTML</li>
                                             <li>CSS, Bootstrap</li>
                                             <li>Jquery, Javascript</li>
                                             <li>React JS</li>
                                          </ul>
                                       </div>
                                    </div>
                                    <span class="accordion-item-border"></span>
                                 </div>
                                 <div class="accordion-item tp-services-accordion-item">
                                    <h2 class="accordion-header" id="headingFour">
                                       <button class="accordion-button collapsed" type="button"
                                          data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false"
                                          aria-controls="collapseFour">
                                          <span>04</span>
                                          Branding
                                       </button>
                                    </h2>
                                    <div id="collapseFour" class="accordion-collapse collapse"
                                       aria-labelledby="headingFour" data-bs-parent="#accordionExample">
                                       <div class="accordion-body">
                                          <p>Transforming visions into compelling brand narratives, I bring brands to life by creating cohesive visual identities, impactful logos, and strategic design elements that leave a lasting impression.</p>
                                          <ul>
                                             <li>Logo Design</li>
                                             <li>Flyer Design</li>
                                             <li>Brochure Design</li>
                                             <li>Letterhead, Cards, Posters, Billboards</li>
                                          </ul>
                                       </div>
                                    </div>
                                    <span class="accordion-item-border"></span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- service area end -->            

            <!-- project area start -->
            <div class="tp-project-3__area p-relative black-bg-3 pb-80 pt-110">
               <div class="container">
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-project-3__title-box pb-30 text-center portfolio-sec-pin">
                           <h3 class="tp-section-title-3 tp_title_anim">Featured Projects</h3>
                        </div>
                     </div>
                  </div>
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-portfolio-item-wrapper-3">
                           <div class="tp-portfolio-item-3 portfolio-panel pb-80 tp-hover-reveal-text">
                              <a href="portfolio-details.html">
                                 <img src="assets/img/portfolio/3/portfolio-4.jpg" alt="">
                                 <span></span>
                                 <div class="tp-portfolio-view-btn-3">
                                    <span>View <br> Work</span>
                                 </div>
                              </a>
                           </div>
                           <div class="tp-portfolio-item-3 portfolio-panel pb-80 tp-hover-reveal-text">
                              <a href="portfolio-details.html">
                                 <img src="assets/img/portfolio/3/portfolio-1.jpg" alt="">
                                 <span></span>
                                 <div class="tp-portfolio-view-btn-3">
                                    <span>View <br> Work</span>
                                 </div>
                              </a>
                           </div>
                           <div class="tp-portfolio-item-3 portfolio-panel pb-80 tp-hover-reveal-text">
                              <a href="portfolio-details.html">
                                 <img src="assets/img/portfolio/3/portfolio-2.jpg" alt="">
                                 <span></span>
                                 <div class="tp-portfolio-view-btn-3">
                                    <span>View <br> Work</span>
                                 </div>
                              </a>
                           </div>
                           <div class="tp-portfolio-item-3 portfolio-panel pb-80 tp-hover-reveal-text">
                              <a href="portfolio-details.html">
                                 <img src="assets/img/portfolio/3/portfolio-3.jpg" alt="">
                                 <span></span>
                                 <div class="tp-portfolio-view-btn-3">
                                    <span>View <br> Work</span>
                                 </div>
                              </a>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <!-- project area end -->

            <!-- about area start -->
            <section class="tp-about-area fix pt-50">
               <div class="container container-large">
                  <div class="tp-about-inner pt-320 pb-80">
                     <div class="row">
                        <div class="col-xl-5 col-lg-5">
                           <div class="tp-about-wrapper">
                              <div class="tp-section-title-wrapper p-relative mb-45">
                                 <span class="tp-section-subtitle-bg">About Me</span>
                                 <span class="tp-section-subtitle tp-section-subtitle-1 tp-about-subtitle">About
                                    Me</span>
                              </div>
                              <div class="tp-about-thumb-wrapper p-relative z-index-1">
                                 <div class="tp-about-thumb p-relative z-index-1">
                                    <div class="tp-about-thumb-bg-shape include-bg"
                                       data-background="assets/img/about/shape/about-shape-1.png"></div>
                                    <img src="assets/img/about/about-1.png" alt="">
                                 </div>
                              </div>
                           </div>
                        </div>
                        <div class="col-xl-7 col-lg-7">
                           <div class="tp-about-desc">
                              
                              <div class="tp-about-desc-content mb-40">
                                 <p>Hello! I'm <span>Sharjeel</span>, A Passionate <span>UI/UX Designer</span> and <span>Frontend Developer</span> with a strong technical background. I bring innovation and attention to detail to create visually stunning, user-centric designs. <span>Proactive</span> and disciplined, I excel in ensuring maximum accessibility and elevating customer experiences throughout the <span>development</span> process. Let's redefine digital interactions together.

                                 </p>
                              </div>
                              <div class="tp-about-fact">
                                 <div class="row">
                                    <div class="col-md-4 col-sm-6 mb-30">
                                       <div class="tp-about-fact-item">
                                          <h4><span data-purecounter-duration="2" data-purecounter-end="800"
                                                class="purecounter"></span>+</h4>
                                          <p>Project Delivered</p>
                                       </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 mb-30">
                                       <div class="tp-about-fact-item">
                                          <h4><span data-purecounter-duration="2" data-purecounter-end="14"
                                                class="purecounter"></span>+</h4>
                                          <p>Years of Experience</p>
                                       </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6 mb-30">
                                       <div class="tp-about-fact-item">
                                          <h4><span data-purecounter-duration="2" data-purecounter-end="90"
                                                class="purecounter"></span>+</h4>
                                          <p>Happy Clients</p>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- about area end -->

            <!-- skill area start -->
            <section class="tp-skill-area pt-115 pb-105 p-relative z-index-1 fix theme-bg-2"
               data-background="assets/img/skill/bg-distort.png">
               <div class="tp-skill-shape">
                  <span class="tp-skill-shape-1"></span>
                  <span class="tp-skill-shape-2"></span>
               </div>
               <div class="container">
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-skill-section-title">
                           <div class="tp-section-title-wrapper tp_text_anim mb-30 text-center">
                              <div class="tp-section-title-inner tp_title_anim p-relative">
                                 <span class="tp-section-subtitle">Technologies</span>
                                 <h3 class="tp-section-title">Skills & tools</h3>
                              </div>
                              <p>For those who know what they're looking for..</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-skill-tab tp-tab d-flex align-items-center justify-content-center mb-70">
                           <nav>
                              <div class="nav nav-tabs tp-marker-tab" id="nav-tab" role="tablist">
                                 <button class="nav-link " id="nav-tech-tab" data-bs-toggle="tab"
                                    data-bs-target="#nav-tech" type="button" role="tab" aria-controls="nav-tech"
                                    aria-selected="true">Tech</button>
                                 <button class="nav-link active" id="nav-design-tab" data-bs-toggle="tab"
                                    data-bs-target="#nav-design" type="button" role="tab" aria-controls="nav-design"
                                    aria-selected="false">Design</button>
                                 <span id="lineMarker"></span>
                              </div>
                           </nav>
                                                     
                        </div>
                     </div>
                  </div>
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tab-content" id="nav-tabContent">
                           <div class="tab-pane fade " id="nav-tech" role="tabpanel" aria-labelledby="nav-tech-tab"
                              tabindex="0">
                              <div class="tp-skill-tab-content tp-skill-radius">
                                 <div class="row">
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/bootstrap.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>95</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Bootstrap</h3>
                                          </div>
                                       </div>
                                    </div>
                                    
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/css.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>95</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">CSS</h3>
                                          </div>
                                       </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/html.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>97</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">HTML5</h3>
                                          </div>
                                       </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/wp.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>60</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">WordPress</h3>
                                          </div>
                                       </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/laravel.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>90</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Laravel</h3>
                                          </div>
                                       </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/react.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>78</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">React</h3>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                           <div class="tab-pane fade show active" id="nav-design" role="tabpanel"
                              aria-labelledby="nav-design-tab" tabindex="0">
                              <div class="tp-skill-tab-content tp-skill-radius">
                                 <div class="row justify-content-center">
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/figma.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>90</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Figma</h3>
                                          </div>
                                       </div>
                                    </div>                                   
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/photoshop.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>98</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Photoshop</h3>
                                          </div>
                                       </div>
                                    </div>
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/xd.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>84</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Adobe XD</h3>
                                          </div>
                                       </div>
                                    </div>
                                    
                                    <div class="col-xl-2 col-lg-3 col-md-3 col-6">
                                       <div class="tp-skill-item text-center">
                                          <div
                                             class="tp-skill-thumb d-flex align-items-center justify-content-center flex-column">
                                             <div class="tp-skill-icon">
                                                <span>
                                                   <img src="assets/img/skill/ai.png" alt="">
                                                </span>
                                             </div>
                                             <h3 class="tp-skill-count"><span>84</span>%</h3>
                                          </div>
                                          <div class="tp-skill-content">
                                             <h3 class="tp-skill-title">Illustrator</h3>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- skill area end -->
            

            <!-- testimonial area start -->
            <section class="tp-testimonial-area tp-bg-light pt-80 pb-80">
               <div class="container">
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-testimonial-section-title">
                           <div class="tp-section-title-wrapper tp_text_anim mb-50 text-center">
                              <div class="tp-section-title-inner tp_title_anim p-relative">
                                 <span class="tp-section-subtitle">Testimonials</span>
                                 <h3 class="tp-section-title">What clients say</h3>
                              </div>
                              <p>Rated 4.9 out of 5 based on 768 reviews</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="row">
                     <div class="col-xl-12">
                        <div class="tp-testimonial-slider ml-70 mr-70">
                           <div class="tp-testimonial-slider-active swiper-container">
                              <div class="swiper-wrapper">
                                 <div class="swiper-slide">
                                    <div class="tp-testimonial-item theme-bg-2"
                                       data-background="assets/img/testimonial/bg-distort.png">
                                       <div class="tp-testimonial-quote">
                                          <img src="assets/img/testimonial/quote.svg" alt="">
                                       </div>
                                       <div class="tp-testimonial-item-top d-flex align-items-center">
                                          <div class="tp-testimonial-rating">
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                          </div>
                                          <p>5.0 Rating</p>
                                       </div>

                                       <div class="tp-testimonial-content">
                                          <p>"Working with Sharjeel was a game-changer for our online presence. Their keen eye for design and seamless development skills brought our vision to life. The website not only looks stunning but functions flawlessly. Truly a professional and creative force in the web design world!"</p>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide">
                                    <div class="tp-testimonial-item theme-bg-2"
                                       data-background="assets/img/testimonial/bg-distort.png">
                                       <div class="tp-testimonial-quote">
                                          <img src="assets/img/testimonial/quote.svg" alt="">
                                       </div>
                                       <div class="tp-testimonial-item-top d-flex align-items-center">
                                          <div class="tp-testimonial-rating">
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                          </div>
                                          <p>5.0 Rating</p>
                                       </div>

                                       <div class="tp-testimonial-content">
                                          <p>"Exceptional web design expertise! Sharjeel perfectly captured our brand identity and translated it into a visually appealing and user-friendly website. Their dedication to detail and responsiveness throughout the development process made the collaboration a pleasure. Highly recommended!"</p>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide">
                                    <div class="tp-testimonial-item theme-bg-2"
                                       data-background="assets/img/testimonial/bg-distort.png">
                                       <div class="tp-testimonial-quote">
                                          <img src="assets/img/testimonial/quote.svg" alt="">
                                       </div>
                                       <div class="tp-testimonial-item-top d-flex align-items-center">
                                          <div class="tp-testimonial-rating">
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                          </div>
                                          <p>5.0 Rating</p>
                                       </div>

                                       <div class="tp-testimonial-content">
                                          <p>"Choosing Sharjeel for our web development needs was one of the best decisions we made. Their innovative approach and commitment to delivering beyond expectations shine through in every aspect of our website. Our online presence has been transformed, and we couldn't be happier with the results."</p>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide">
                                    <div class="tp-testimonial-item theme-bg-2"
                                       data-background="assets/img/testimonial/bg-distort.png">
                                       <div class="tp-testimonial-quote">
                                          <img src="assets/img/testimonial/quote.svg" alt="">
                                       </div>
                                       <div class="tp-testimonial-item-top d-flex align-items-center">
                                          <div class="tp-testimonial-rating">
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                             <span>
                                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                                   xmlns="http://www.w3.org/2000/svg">
                                                   <path
                                                      d="M7 0L9.163 4.60778L14 5.35121L10.5 8.93586L11.326 14L7 11.6078L2.674 14L3.5 8.93586L0 5.35121L4.837 4.60778L7 0Z"
                                                      fill="currentColor" />
                                                </svg>
                                             </span>
                                          </div>
                                          <p>5.0 Rating</p>
                                       </div>

                                       <div class="tp-testimonial-content">
                                          <p>"A true partner in our digital journey! Sharjeel seamlessly blended creativity with functionality to create a website that not only reflects our brand but also enhances user experience. Their technical proficiency and collaborative spirit made the entire process smooth and enjoyable. Thank you for bringing our ideas to life!"</p>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                           <div class="tp-testimonial-thumb-slider">
                              <div class="tp-testimonial-nav swiper-container">
                                 <div class="swiper-wrapper">
                                    <div class="swiper-slide">
                                       <div
                                          class="tp-testimonial-user-item d-flex justify-content-center align-items-center">
                                          <div class="tp-testimonial-user-thumb">
                                             <img src="assets/img/users/user-1.jpg" alt="">
                                          </div>
                                          <div class="tp-testimonial-user-content">
                                             <h3 class="tp-testimonial-user-title">Sam Parmar</h3>
                                             <span class="tp-testimonial-user-designation">Founder & CEO at Air Immigration</span>
                                          </div>
                                          <span class="tp-testimonial-user-border"></span>
                                       </div>
                                    </div>
                                    <div class="swiper-slide">
                                       <div
                                          class="tp-testimonial-user-item d-flex justify-content-center align-items-center">
                                          <div class="tp-testimonial-user-thumb">
                                             <img src="assets/img/users/avata-1.png" alt="">
                                          </div>
                                          <div class="tp-testimonial-user-content">
                                             <h3 class="tp-testimonial-user-title">Zade Rakesh</h3>
                                             <span class="tp-testimonial-user-designation">Jobs Platform Owner</span>
                                          </div>
                                          <span class="tp-testimonial-user-border"></span>
                                       </div>
                                    </div>
                                    <div class="swiper-slide">
                                       <div
                                          class="tp-testimonial-user-item d-flex justify-content-center align-items-center">
                                          <div class="tp-testimonial-user-thumb">
                                             <img src="assets/img/users/avata-2.png" alt="">
                                          </div>
                                          <div class="tp-testimonial-user-content">
                                             <h3 class="tp-testimonial-user-title">Imran Ahmed</h3>
                                             <span class="tp-testimonial-user-designation">Client</span>
                                          </div>
                                          <span class="tp-testimonial-user-border"></span>
                                       </div>
                                    </div>
                                    <div class="swiper-slide">
                                       <div
                                          class="tp-testimonial-user-item d-flex justify-content-center align-items-center">
                                          <div class="tp-testimonial-user-thumb">
                                             <img src="assets/img/users/avata-3.png" alt="">
                                          </div>
                                          <div class="tp-testimonial-user-content">
                                             <h3 class="tp-testimonial-user-title">Farhan Firoz</h3>
                                             <span class="tp-testimonial-user-designation">Client</span>
                                          </div>
                                          <span class="tp-testimonial-user-border"></span>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </section>
            <!-- testimonial area end -->

            <!-- how we work area start -->
            <div id="service" class="tp-service-3__area services-panel-area tp-service-3__overlay-bg black-bg-2 pt-150 pb-125 z-index-1 ">

               <div class="tp-service-3__circle-img">
                 <span class="text-img">
                  <img src="assets/img/footer/footer-circle-img.png" alt="">
                 </span>
                  <div class="shape">
                     <svg width="260" height="70" viewBox="0 0 260 70" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M68.7285 34.1352C48.3941 10.6976 13.8796 0.514191 0 0.514191C93.4783 0.514191 276.081 -0.642708 258.863 0.514191C236.79 1.99739 217.224 6.94161 191.137 34.1352C140.468 93.9609 98.3272 68.2507 68.7285 34.1352Z" fill="currentcolor"/>
                     </svg>    
                  </div>                 
               </div>

               <div class="tp-service-3__shape-1">
                  <img src="assets/img/portfolio/shape-1.png" alt="">
               </div>
               <div class="tp-service-3__shape-2 d-none d-lg-block">
                  <img src="assets/img/portfolio/shape-2.png" alt="">
               </div>
               <div class="tp-service-3__shape-3">
                  <img data-speed="1.2" src="assets/img/portfolio/star.png" alt="">
               </div>
               <div class="container">
                  <div class="row">
                     <div class="col-xl-5 col-lg-5">
                        <div class="tp-service-3__title-box services-panel-pin">
                           <span class="tp-section-subtitle-3 tp_title_anim">WORK PROCESS</span>
                           <h3 class="tp-section-title-3 tp_title_anim">How I <br> Carry Out Your Projects</h3>
                           <p class="tp_title_anim">I provide an array of services dedicated to enhancing your brand and achieving impactful results.</p>
                        </div>
                     </div>
                     <div class="col-xl-7 col-lg-7">
                        <div class="tp-service-3__right-wrap">
                           <div class="tp-service-3__item d-flex align-items-start mb-25 services-panel">
                              <div class="tp-service-3__icon">
                                 <span>
                                    <svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
                                       <g style="mix-blend-mode:luminosity">
                                       <path d="M79.9865 59.8142L79.9969 59.7725C79.999 59.7621 79.999 59.7496 79.9969 59.7392C80.001 59.7141 80.001 59.6872 79.9969 59.6621V0.403101C80.001 0.37602 80.001 0.351021 79.9969 0.323939C79.999 0.313523 79.999 0.303107 79.9969 0.290607L79.9865 0.251027C79.9865 0.236444 79.9719 0.223944 79.9656 0.211446C79.9614 0.20103 79.9552 0.190613 79.9469 0.180198C79.9198 0.13645 79.8822 0.0989526 79.8385 0.0697873C79.8301 0.0635381 79.8239 0.059371 79.8156 0.0552049L79.776 0.0322896L79.7364 0.0197903H79.7009C79.6738 0.011458 79.6447 0.00520823 79.6155 0.00312462H20.3298C20.3048 -0.00104154 20.2777 -0.00104154 20.2527 0.00312462H20.2194L20.1777 0.0156239L20.1381 0.036456C20.1277 0.0406226 20.1172 0.0468724 20.1089 0.0531217C20.086 0.0677043 20.0651 0.08437 20.0485 0.103119L0.103165 20.0582C0.0823239 20.0749 0.065651 20.0957 0.053146 20.1187C0.044809 20.1269 0.040641 20.1394 0.034389 20.1498C0.034389 20.1623 0.0198 20.1727 0.013547 20.1873L0.003126 20.2269C0.001042 20.2394 0.001042 20.2499 0.003126 20.2624C-0.001042 20.2874 -0.001042 20.3145 0.003126 20.3395V79.5984C-0.001042 79.6234 -0.001042 79.6505 0.003126 79.6755C0.001042 79.688 0.001042 79.6985 0.003126 79.711L0.013547 79.7505C0.0198 79.7651 0.0281359 79.7776 0.036473 79.7901C0.040641 79.8005 0.044809 79.8109 0.053146 79.8192C0.08024 79.8651 0.117755 79.9005 0.161522 79.9297C0.171942 79.938 0.182363 79.9422 0.192784 79.9464L0.232383 79.9671L0.271981 79.9796H0.307412C0.332421 79.9901 0.357432 79.9942 0.384525 79.9984H59.6702C59.6952 80.0005 59.7223 80.0005 59.7473 79.9984H59.7827L59.8223 79.9859L59.8619 79.965C59.8723 79.9609 59.8828 79.9546 59.8911 79.9484C59.914 79.9339 59.9349 79.9172 59.9515 79.8984L79.8968 59.9621C79.9177 59.9433 79.9343 59.9246 79.9469 59.9017C79.9552 59.8913 79.9594 59.883 79.9635 59.8705C79.9719 59.8517 79.9802 59.8329 79.9865 59.8142ZM20.73 20.7394H59.27V59.2621H20.73V20.7394ZM60.0703 20.5061L79.2153 1.36971V59.2621H60.0703V20.5061ZM59.5035 19.9394H20.73V0.803078H78.6484L59.5035 19.9394ZM19.9297 19.9394H1.35157L19.9297 1.36971V19.9394ZM0.78468 20.7394H19.9297V59.4954L0.78468 78.6318V20.7394ZM20.4965 60.0621H59.27V79.1985H1.35157L20.4965 60.0621ZM60.0703 60.0621H78.6484L60.0703 78.6318V60.0621Z" fill="white"/>
                                       </g>
                                    </svg>
                                 </span>
                              </div>
                              <div class="tp-service-3__content">
                                 <h3 class="tp-service-3__content-title">Design Strategy</h3>
                                 <p>Crafting compelling visions through strategic design thinking.</p>
                                 <div class="tp-service-3__content-tag">
                                    <span class="mr-5">Wireframe</span>
                                    <span>Design Ideas</span>
                                 </div>
                              </div>
                           </div>
                           <div class="tp-service-3__item d-flex align-items-start mb-25 services-panel">
                              <div class="tp-service-3__icon">
                                 <span>
                                    <svg width="76" height="81" viewBox="0 0 76 81" fill="none" xmlns="http://www.w3.org/2000/svg">
                                       <path d="M69.5868 74.2335L67.7472 72.2468L62.7431 66.8405L55.3849 58.8938L46.3679 49.1491L36.5428 38.5328L26.5746 27.7625L17.3267 17.7719L9.47917 9.29377L3.86016 3.22445L1.18744 0.328861L1.07701 0.207179L0.474702 1.24522L2.44976 2.06721L7.82534 4.30223L15.7833 7.62247L25.4905 11.6579L36.1187 16.0808L46.8472 20.5508L56.8857 24.7253L65.333 28.2393L71.4063 30.7673C72.3624 31.1647 73.3111 31.5943 74.2798 31.9618L74.4027 32.0115L73.9435 31.3956L73.4014 35.7191L72.1089 46.0226L70.5354 58.5536L69.1852 69.3264L68.736 72.9099C68.6658 73.4686 68.5579 74.0373 68.5227 74.601C68.524 74.625 68.524 74.649 68.5227 74.673C68.5234 74.8375 68.5897 74.995 68.7072 75.1113C68.8247 75.2276 68.9839 75.2932 69.1501 75.2939C69.3153 75.2901 69.4727 75.2235 69.5895 75.1078C69.7064 74.9922 69.7737 74.8365 69.7775 74.673L70.3196 70.3495L71.612 60.0461L73.1856 47.5151L74.5357 36.7423L74.985 33.1687C75.0552 32.61 75.1656 32.0413 75.1983 31.4776C75.1983 31.4552 75.1983 31.4304 75.1983 31.4056C75.2359 31.1125 74.9724 30.9089 74.739 30.8071L72.7639 29.9851L67.3884 27.7501L59.4103 24.4422L49.7057 20.3944L39.0775 15.9715L28.3489 11.5015L18.3105 7.32695L9.86565 3.83039L3.79491 1.30482C2.83875 0.907484 1.89013 0.475379 0.921419 0.107843L0.798435 0.0581764C0.178562 -0.190159 -0.192858 0.683984 0.188603 1.09622L2.02815 3.0829L7.03231 8.48916L14.388 16.4359L23.405 26.1806L33.2301 36.7969L43.1983 47.5647L52.4437 57.5553L60.2962 66.0409L65.9127 72.1102L68.5855 74.9984L68.6984 75.12C69.2379 75.7036 70.1314 74.822 69.5868 74.2335Z" fill="#E7ECFF"/>
                                       <path d="M11.5541 79.4036L11.278 77.2903L10.5252 71.5637L9.42094 63.1004L8.06825 52.7523L6.58507 41.4033L5.09687 30.0246L3.70153 19.3462L2.52201 10.3217L1.67627 3.86494C1.54327 2.84925 1.46297 1.81121 1.27726 0.802965C1.26878 0.759475 1.26291 0.715525 1.25969 0.671347L0.474178 1.245L2.46178 2.07196L7.84238 4.30698L15.7828 7.61977L25.4824 11.6552L36.1106 16.0756L46.8743 20.5456L56.8425 24.6903L65.3249 28.2167L71.4007 30.7448C72.3594 31.1446 73.308 31.5767 74.2792 31.9417L74.4047 31.9939C74.5648 32.0374 74.7357 32.0163 74.8801 31.9353C75.0245 31.8543 75.1306 31.72 75.1752 31.5618C75.2158 31.4032 75.1932 31.2352 75.1118 31.0927C75.0305 30.9503 74.8968 30.8443 74.7385 30.7969L72.7509 29.9799L67.3678 27.7449L59.4148 24.442L49.7127 20.3966L39.087 15.9763L28.3258 11.5062L18.3576 7.3615L9.87767 3.83017L3.80192 1.29715C2.84325 0.899817 1.8921 0.465228 0.923392 0.100175L0.797912 0.0480269C0.704843 0.0228193 0.607157 0.0191936 0.512441 0.037432C0.417725 0.0556704 0.32854 0.0952807 0.251815 0.153184C0.17509 0.211087 0.112886 0.285722 0.0700585 0.371284C0.027231 0.456847 0.00493324 0.551029 0.00488281 0.646512L0.280934 2.75985L1.03382 8.48646L2.14056 16.9473L3.48571 27.3078L4.97139 38.6592L6.45709 50.038L7.85493 60.7164L9.03445 69.7409L9.87767 76.1976C10.0132 77.2183 10.1437 78.2389 10.2792 79.2596C10.2792 79.3043 10.2792 79.349 10.2968 79.3937C10.3018 79.5568 10.3695 79.7118 10.4861 79.8272C10.6027 79.9425 10.7594 80.0095 10.9242 80.0145C11.09 80.0126 11.2484 79.9466 11.3657 79.8305C11.4829 79.7145 11.5496 79.5577 11.5516 79.3937L11.5541 79.4036Z" fill="#E7ECFF"/>
                                       <path d="M74.412 31.147L72.703 32.4359L68.0577 35.93L61.2065 41.0978L52.852 47.3981L43.7045 54.2969L34.4691 61.2503L25.8612 67.7417L18.5833 73.2275L13.3533 77.1735L10.8713 79.0435L10.7659 79.1254C10.4471 79.3738 10.7659 79.9027 11.0821 79.6594L12.7886 78.373L17.4364 74.8665L24.2876 69.7011L32.6421 63.4008L41.7896 56.5021L51.0225 49.5487L59.6355 43.0671L66.9133 37.5814L72.1408 33.6304L74.6228 31.7604L74.7282 31.6785C75.047 31.4301 74.7282 30.9012 74.412 31.1421V31.147Z" fill="#E7ECFF"/>
                                       <path d="M11.5539 79.4037L11.2778 77.2903L10.5249 71.5637L9.42069 63.1005L8.06801 52.7523L6.58482 41.4034L5.09662 30.0247L3.70128 19.3462L2.52176 10.3217L1.67603 3.86501C1.54302 2.84932 1.46272 1.81128 1.27701 0.803039C1.26853 0.759549 1.26266 0.715599 1.25944 0.671421L0.187833 1.09856L2.02487 3.08524L6.99891 8.4617L14.3621 16.4258L23.3691 26.1655L33.1791 36.7769L43.1373 47.5373L52.3701 57.5228L60.2026 66.0109L65.8116 72.0753L68.4843 74.961L68.5972 75.0826L69.0389 74.0222L67.483 74.1514L63.2467 74.4966L57.0154 75.0081L49.3787 75.6339L41.0116 76.3169L32.5969 77.0072L24.7192 77.6504L18.0638 78.1968L13.2855 78.5792C12.5326 78.6413 11.7797 78.6934 11.0268 78.763H10.929C10.1284 78.8275 10.1234 80.0692 10.929 80.0046L12.4849 79.8755L16.7211 79.5303L22.9525 79.0188L30.5892 78.4128L38.9563 77.7274L47.3634 77.0395L55.2411 76.3939L61.8991 75.8475L66.6849 75.4551C67.4378 75.3931 68.1907 75.3409 68.9436 75.2714H69.0414C69.1636 75.2678 69.2822 75.2294 69.3829 75.1607C69.4835 75.0921 69.562 74.9961 69.6089 74.8844C69.6558 74.7727 69.6692 74.65 69.6473 74.531C69.6254 74.4119 69.5693 74.3017 69.4856 74.2135L67.6486 72.2268L62.667 66.8404L55.3038 58.8763L46.2994 49.1241L36.4893 38.5128L26.5362 27.7474L17.3034 17.7619L9.46335 9.29363L3.85437 3.22679L1.18667 0.328717L1.07624 0.207035C0.734937 -0.160501 -0.0681422 0.102732 0.00463641 0.646586L0.280687 2.75992L1.03357 8.48654L2.14032 16.9473L3.48546 27.3079L4.97114 38.6593L6.45684 50.038L7.85468 60.7164L9.0342 69.7409L9.87742 76.1977C10.0129 77.2183 10.1435 78.239 10.279 79.2596C10.279 79.3043 10.279 79.349 10.2965 79.3937C10.3016 79.5568 10.3693 79.7119 10.4859 79.8272C10.6025 79.9426 10.7591 80.0096 10.9239 80.0146C11.0885 80.0134 11.2461 79.949 11.3636 79.835C11.4811 79.7211 11.5493 79.5664 11.5539 79.4037Z" fill="#E7ECFF"/>
                                       <path d="M0.309282 0.733456L0.846327 1.70445L2.35209 4.41875L4.61827 8.54857L7.5269 13.8207L10.8898 19.9174L14.5287 26.5281L18.2931 33.3573L21.9898 40.0623L25.4882 46.4023L28.5976 52.0396L31.1524 56.6685L32.9794 59.9813L33.9129 61.6725C34.1036 62.0177 34.4776 62.0822 34.839 62.2163L38.6034 63.612L44.6842 65.8718L51.8616 68.539L59.019 71.1986L64.9392 73.3989L68.4326 74.6952L68.8994 74.869C69.2783 75.0106 69.4414 74.4096 69.0675 74.2705L65.6043 72.9842L57.3225 69.9073L47.2841 66.1823L38.631 62.9688L35.7801 61.9084C35.3401 61.713 34.8873 61.5471 34.4249 61.4117L34.3646 61.3894L34.5504 61.5334L33.6494 59.8944L31.1925 55.4417L27.5586 48.8534L23.1467 40.8322L18.3132 32.0684L13.4144 23.2004L8.84696 14.9209L4.9922 7.9178L2.23164 2.90391C1.79496 2.11172 1.37335 1.30463 0.916603 0.519887C0.896526 0.487604 0.878951 0.452836 0.861384 0.418069C0.668144 0.0679159 0.126076 0.38082 0.319315 0.733456H0.309282Z" fill="#E7ECFF"/>
                                    </svg>
                                 </span>
                              </div>
                              <div class="tp-service-3__content">
                                 <h3 class="tp-service-3__content-title">Prototyping </h3>
                                 <p>Breathing life into ideas with tangible and interactive prototypes.</p>
                                 <div class="tp-service-3__content-tag">
                                    <span class="mr-5">Making Design</span>
                                    <span>Creative UI</span>
                                 </div>
                              </div>
                           </div>
                           <div class="tp-service-3__item d-flex align-items-start mb-25 services-panel">
                              <div class="tp-service-3__icon">
                                 <span>
                                    <svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
                                       <path d="M65.6544 14.3406C69.1311 17.8199 72.3509 21.6053 74.9636 25.7851C75.9797 27.3684 76.8598 29.0348 77.5944 30.7667C77.8965 31.493 78.1504 32.2383 78.3546 32.998C78.5225 33.5913 78.632 34.1995 78.6816 34.8141C78.701 35.1105 78.701 35.4077 78.6816 35.7041L78.666 35.8987C78.666 35.9324 78.6426 36.0958 78.666 36.005C78.6893 35.9142 78.6504 36.1036 78.6452 36.127C78.6452 36.1944 78.6193 36.2619 78.6037 36.3293C78.5778 36.4435 78.5466 36.5603 78.5103 36.6718L78.4532 36.8353C78.3936 37.0065 78.4948 36.7652 78.4273 36.895C78.3598 37.0247 78.3313 37.0947 78.2742 37.1907C78.2457 37.2374 78.2171 37.2841 78.186 37.3283C78.1549 37.3724 78.0563 37.4969 78.1549 37.3775C78.0848 37.4606 78.0148 37.5436 77.9369 37.6214L77.8202 37.733C77.7968 37.7538 77.6515 37.8705 77.7294 37.8108C77.8072 37.7512 77.6645 37.8549 77.6463 37.8679L77.5062 37.9561C77.405 38.0158 77.2987 38.0651 77.1923 38.1196C77.0859 38.1741 77.3194 38.0781 77.1508 38.1351L76.9873 38.1922C76.868 38.2314 76.7468 38.2643 76.6241 38.2908L76.4425 38.3271L76.3205 38.3479L76.2141 38.3609L75.9677 38.379C75.679 38.3959 75.3897 38.3959 75.1011 38.379C74.961 38.379 74.8209 38.3557 74.6834 38.3375C74.5459 38.3194 74.6574 38.3375 74.6834 38.3375L74.5666 38.3219L74.2708 38.2701C73.5532 38.1357 72.8471 37.9457 72.1589 37.7019C70.4865 37.1007 68.8764 36.3387 67.3512 35.4264C63.2311 33.0291 59.4975 30.0091 56.0494 26.7322C52.3661 23.2845 49.0689 19.4462 46.2161 15.285C45.07 13.6075 44.0535 11.845 43.1753 10.0129C42.4982 8.63916 42.0045 7.18242 41.7068 5.68007L41.6679 5.44397C41.6679 5.40505 41.6679 5.36613 41.6497 5.32721C41.6497 5.35316 41.6679 5.45434 41.6497 5.32721C41.6307 5.17673 41.6125 5.015 41.5952 4.84203C41.577 4.55519 41.577 4.26749 41.5952 3.98064L41.6108 3.78605C41.6108 3.74714 41.6445 3.5266 41.6108 3.7186C41.6315 3.58887 41.6549 3.45914 41.6834 3.33461C41.712 3.21007 41.7431 3.10369 41.7794 2.99213C41.7976 2.93764 41.8209 2.88315 41.8391 2.82867C41.8858 2.69116 41.782 2.92986 41.8651 2.769C41.9169 2.67041 41.9636 2.57181 42.0207 2.47581L42.1089 2.3383C42.1764 2.23971 42.1868 2.23971 42.1427 2.2916C42.2075 2.21377 42.2724 2.13593 42.345 2.06328L42.4644 1.95171C42.5007 1.91798 42.6771 1.78826 42.5215 1.89983C42.7008 1.77198 42.8909 1.65999 43.0897 1.56513C43.1909 1.51843 43.0663 1.56513 43.0533 1.5807L43.1312 1.54956L43.2946 1.49248C43.4225 1.45119 43.5524 1.41656 43.6838 1.3887L43.8654 1.35238C43.8966 1.35238 44.0574 1.32384 43.964 1.33422C43.8706 1.3446 44.0704 1.33422 44.0938 1.33422L44.3143 1.31865C44.6029 1.30048 44.8923 1.30048 45.1809 1.31865C45.3314 1.31865 45.4818 1.34459 45.6297 1.36276L45.7465 1.38092L46.0059 1.42502C46.351 1.48989 46.6909 1.56773 47.0282 1.65854C48.6382 2.11821 50.191 2.75882 51.6568 3.56811C55.7173 5.71639 59.4067 8.5626 62.8134 11.6371C63.782 12.5124 64.7264 13.4101 65.6466 14.3303C66.2381 14.9218 67.1566 14.0059 66.5651 13.4144C62.9509 9.80797 58.9942 6.46881 54.6457 3.78087C52.9596 2.72268 51.1842 1.81374 49.3399 1.06439C47.939 0.468094 46.4482 0.110298 44.9292 0.00580914C43.772 -0.0408925 42.5941 0.187434 41.6627 0.929472C40.7831 1.64297 40.3939 2.74564 40.2954 3.83275C40.176 5.20526 40.5029 6.61929 40.9284 7.91396C41.5333 9.68845 42.3156 11.3974 43.2635 13.0148C45.7102 17.314 48.8703 21.2239 52.2743 24.8018C55.8724 28.6406 59.8877 32.0658 64.2455 35.0139C65.9612 36.1738 67.7667 37.1949 69.6448 38.0677C71.115 38.7803 72.6772 39.285 74.2864 39.5673C75.5136 39.749 76.7953 39.7541 77.9188 39.2041C78.3954 38.9604 78.8132 38.6158 79.143 38.1941C79.4728 37.7725 79.7067 37.284 79.8283 36.7626C80.1527 35.4809 79.971 34.1058 79.6545 32.8449C79.1967 31.1488 78.5446 29.5112 77.7112 27.9646C75.5162 23.7251 72.5403 19.8904 69.3568 16.3436C68.4556 15.3473 67.5302 14.3744 66.5806 13.4248C65.9839 12.8332 65.0628 13.7491 65.6544 14.3406Z" fill="#E7ECFF"/>
                                       <path d="M25.3665 54.5976C28.8432 58.0769 32.063 61.8623 34.6757 66.0395C35.6914 67.6239 36.5714 69.2912 37.3066 71.0236C37.6067 71.7506 37.8606 72.4959 38.0668 73.2549C38.2344 73.8482 38.343 74.4565 38.3911 75.0711C38.4106 75.3665 38.4106 75.6629 38.3911 75.9584C38.3911 76.0233 38.3911 76.0907 38.3755 76.1556C38.36 76.2205 38.3522 76.3528 38.3755 76.2594C38.3989 76.166 38.3574 76.3606 38.3548 76.3813C38.3418 76.4514 38.3288 76.5188 38.3133 76.5837C38.2877 76.7004 38.2556 76.8156 38.2173 76.9288C38.2017 76.9833 38.1784 77.0351 38.1602 77.0896C38.1031 77.2609 38.2017 77.0222 38.1368 77.1519C38.072 77.2816 38.0383 77.3491 37.9812 77.4451C37.9526 77.4918 37.9241 77.5385 37.893 77.5852C37.8618 77.6319 37.7658 77.7512 37.8618 77.6345C37.7949 77.7191 37.723 77.7997 37.6465 77.8758L37.5271 77.9873C37.5038 78.0107 37.3585 78.1274 37.4363 78.0678C37.5142 78.0081 37.3715 78.1119 37.3533 78.1223C37.3351 78.1326 37.2625 78.1819 37.2158 78.2105C37.1146 78.2727 37.0082 78.322 36.9018 78.3739C36.7955 78.4258 37.0264 78.335 36.8603 78.3895L36.6969 78.4492C36.5775 78.4881 36.4556 78.5192 36.331 78.5478L36.152 78.5841C36.1287 78.5841 35.9289 78.6178 36.0275 78.6048C36.1261 78.5919 35.9548 78.6048 35.9237 78.6048L35.6772 78.623C35.3886 78.6412 35.0992 78.6412 34.8106 78.623C34.6705 78.623 34.5304 78.5971 34.3903 78.5815C34.2502 78.5659 34.3644 78.5815 34.3903 78.5815L34.2736 78.5633L33.9778 78.514C33.2608 78.3769 32.5549 78.1869 31.8658 77.9458C30.1968 77.3436 28.5895 76.5825 27.0659 75.673C22.9484 73.2886 19.2071 70.2634 15.7667 66.9891C12.0835 63.543 8.78713 59.7055 5.93602 55.5446C4.7887 53.8673 3.77127 52.1048 2.89263 50.2725C2.21525 48.8982 1.72236 47.4404 1.42672 45.937C1.41115 45.8592 1.39818 45.7813 1.3878 45.7009C1.3878 45.662 1.37482 45.6231 1.36963 45.5842C1.36963 45.6101 1.3878 45.7113 1.36963 45.5842C1.35147 45.4285 1.33591 45.2702 1.32553 45.1119C1.30608 44.8251 1.30608 44.5374 1.32553 44.2506C1.32553 44.1857 1.32553 44.1182 1.3411 44.0534C1.35667 43.9885 1.37483 43.7939 1.3411 43.9885C1.35878 43.8585 1.38303 43.7295 1.41375 43.6019C1.43969 43.4878 1.47342 43.3736 1.50974 43.262C1.5279 43.205 1.54866 43.1531 1.56682 43.0986C1.61612 42.9611 1.51234 43.1972 1.59277 43.0389C1.64466 42.9403 1.69395 42.8417 1.75103 42.7457L1.83925 42.6082C1.90411 42.507 1.91449 42.507 1.87039 42.5589C1.93784 42.4811 2.0027 42.4058 2.07535 42.3332L2.19211 42.2216C2.23102 42.1879 2.40745 42.0556 2.25178 42.1671C2.4308 42.0396 2.62097 41.9284 2.81998 41.835C2.92117 41.7857 2.79663 41.835 2.78106 41.8506L2.86149 41.8195L3.02495 41.7598C3.15208 41.7209 3.2844 41.6846 3.41154 41.656L3.59316 41.6223C3.62429 41.6223 3.78516 41.5912 3.69435 41.6041C3.60354 41.6171 3.79813 41.6041 3.82148 41.6041C3.89672 41.6041 3.96936 41.6041 4.0446 41.5886C4.33318 41.5704 4.62261 41.5704 4.91118 41.5886C5.06166 41.5886 5.20955 41.6171 5.36004 41.6353L5.47679 41.6534L5.73625 41.6975C6.07873 41.7598 6.42121 41.8402 6.7585 41.931C8.36878 42.39 9.92165 43.0307 11.3872 43.8406C15.4476 45.9889 19.1344 48.8351 22.5437 51.907C23.5088 52.7805 24.4532 53.6791 25.3769 54.6028C25.9685 55.1943 26.8869 54.2758 26.2928 53.6843C22.6786 50.0805 18.7245 46.7413 14.3735 44.0534C12.6893 42.9932 10.9147 42.0842 9.07023 41.3369C7.66958 40.7397 6.17863 40.3819 4.65952 40.2783C3.49976 40.2316 2.30886 40.4573 1.39298 41.202C0.477113 41.9466 0.121664 43.0182 0.0256657 44.1053C-0.0962776 45.4752 0.233227 46.8918 0.656137 48.1839C1.26265 49.9585 2.0449 51.6682 2.99122 53.2873C5.44047 57.5865 8.60062 61.4965 12.0021 65.0743C15.6002 68.9123 19.6154 72.3366 23.9733 75.2838C25.6889 76.4452 27.4954 77.4665 29.3751 78.3376C30.8354 79.0448 32.3872 79.5452 33.9856 79.8243C35.2102 80.0059 36.4919 80.0111 37.6309 79.4585C38.1079 79.2152 38.5259 78.8707 38.8558 78.4489C39.1856 78.0272 39.4193 77.5385 39.5405 77.017C39.8648 75.7353 39.6806 74.3628 39.3667 73.0992C38.908 71.403 38.255 69.7654 37.4208 68.2189C35.2284 63.9794 32.2498 60.1317 29.0611 56.6006C28.1617 55.6043 27.2355 54.6304 26.2824 53.6791C25.6934 53.1005 24.775 54.006 25.3665 54.5976Z" fill="#E7ECFF"/>
                                       <path d="M41.4395 1.15773L40.3576 2.24744L37.4258 5.17668L33.0955 9.50436L27.7922 14.792L22.0038 20.5753L16.1687 26.4104L10.702 31.8745L6.0967 36.4694L2.78607 39.7774C2.26717 40.2964 1.73009 40.8153 1.21637 41.3342L1.14891 41.4016C0.557359 41.9932 1.47583 42.9116 2.06738 42.3201L3.14931 41.2382L6.07854 38.3115L10.4088 33.9864L15.7147 28.6858L21.5005 22.9052L27.3434 17.0674L32.8101 11.6189L37.4102 7.02139L40.7182 3.71595C41.2371 3.19704 41.7768 2.67813 42.2879 2.14625C42.3113 2.1229 42.3346 2.10215 42.3554 2.0788C42.9469 1.48724 42.0311 0.571373 41.4395 1.16293V1.15773Z" fill="#E7ECFF"/>
                                       <path d="M77.932 37.6215L76.8501 38.7008L73.9209 41.6301L69.5906 45.9578L64.2874 51.2558L58.4989 57.039L52.6586 62.8742L47.1919 68.3383L42.5892 72.9332L39.2812 76.2412C38.7623 76.7601 38.2226 77.279 37.7115 77.798C37.6903 77.8217 37.6678 77.8442 37.644 77.8654C37.0525 78.457 37.9709 79.3754 38.5625 78.7839L39.6444 77.702L42.5737 74.7727L46.9039 70.4476L52.2072 65.147L57.9956 59.3664L63.8359 53.5286L69.3026 48.0671L73.9053 43.4696L77.2133 40.1642C77.7323 39.6453 78.2719 39.1264 78.783 38.6074C78.8038 38.5841 78.8272 38.5633 78.8505 38.54C79.4421 37.9484 78.5236 37.0326 77.932 37.6241V37.6215Z" fill="#E7ECFF"/>
                                       <path d="M65.8857 13.6634L64.4846 15.0645L60.6732 18.8525L55.0587 24.4619L48.2117 31.3063L40.6875 38.8305L33.0959 46.4169L26.0569 53.4481L20.0739 59.4155L15.7722 63.738C15.0976 64.4126 14.41 65.0794 13.7432 65.7644L13.6576 65.85C13.5967 65.9109 13.5625 65.9935 13.5625 66.0796C13.5625 66.1657 13.5967 66.2483 13.6576 66.3092C13.7185 66.3701 13.8011 66.4043 13.8872 66.4043C13.9733 66.4043 14.0559 66.3701 14.1168 66.3092L15.5153 64.9108L19.3267 61.1046L24.9413 55.4926L31.7882 48.6378L39.3124 41.1137L46.9066 33.5272L53.943 26.4934L59.9286 20.526L64.2277 16.2294C64.9049 15.5523 65.5899 14.8881 66.2567 14.2005L66.3423 14.1149C66.3977 14.0533 66.4274 13.9728 66.4253 13.8899C66.4233 13.8071 66.3895 13.7281 66.3311 13.6694C66.2727 13.6106 66.194 13.5764 66.1111 13.5739C66.0283 13.5713 65.9476 13.6006 65.8857 13.6556V13.6634Z" fill="#E7ECFF"/>
                                       <path d="M55.99 5.36101L54.633 6.71795L50.9488 10.3996L45.5002 15.8481L38.8427 22.485L31.565 29.7497L24.212 37.0974L17.3443 43.96L11.5585 49.7406L7.40722 53.8918C6.74821 54.5483 6.07881 55.1891 5.43277 55.8637L5.34975 55.9467C5.29433 56.0083 5.26462 56.0889 5.2667 56.1717C5.26878 56.2546 5.30251 56.3335 5.36094 56.3922C5.41938 56.451 5.49809 56.4852 5.58093 56.4877C5.66377 56.4903 5.74445 56.461 5.80639 56.406L7.16592 55.049L10.8502 51.3674L16.2987 45.9188L22.9615 39.2612L30.2392 31.9965L37.5817 24.6592L44.4494 17.8148L50.2353 12.0342L54.3865 7.8829C55.0455 7.22389 55.7149 6.58563 56.361 5.91105L56.444 5.82802C56.5049 5.76712 56.5391 5.68453 56.5391 5.59841C56.5391 5.51229 56.5049 5.42969 56.444 5.36879C56.3831 5.30789 56.3005 5.27368 56.2144 5.27368C56.1283 5.27368 56.0457 5.30789 55.9848 5.36879L55.99 5.36101Z" fill="#E7ECFF"/>
                                       <path d="M74.2142 23.5642L72.8547 24.9212L69.173 28.6002L63.7245 34.0488L57.0643 40.6986L49.7996 47.9633L42.4441 55.3058L35.5763 62.1813L29.7931 67.962L25.6418 72.1133C24.9854 72.7697 24.316 73.4105 23.6674 74.0851L23.5844 74.1681C23.5235 74.229 23.4893 74.3116 23.4893 74.3977C23.4893 74.4839 23.5235 74.5664 23.5844 74.6273C23.6453 74.6882 23.7279 74.7225 23.814 74.7225C23.9001 74.7225 23.9827 74.6882 24.0436 74.6273L25.4031 73.2678L29.0874 69.5888L34.5359 64.1402L41.1987 57.4826L48.4634 50.2179L55.8085 42.8806L62.6763 36.018L68.4621 30.24L72.6134 26.0887C73.2724 25.4297 73.9392 24.7915 74.5878 24.1143L74.6708 24.0313C74.7259 23.9693 74.7552 23.8886 74.7526 23.8058C74.7501 23.723 74.7159 23.6442 74.6571 23.5858C74.5983 23.5274 74.5194 23.4936 74.4366 23.4916C74.3537 23.4895 74.2732 23.5192 74.2116 23.5746L74.2142 23.5642Z" fill="#E7ECFF"/>
                                    </svg>
                                 </span>
                              </div>
                              <div class="tp-service-3__content">
                                 <h3 class="tp-service-3__content-title">Front-End <br> Development</h3>
                                 <p>Weaving seamless user experiences through cutting-edge front-end development.</p>
                                 <div class="tp-service-3__content-tag">
                                    <span class="mr-5">UI/UX</span>
                                    <span>HTMl, CSS</span>
                                 </div>
                              </div>
                           </div>
                           
                           <div class="tp-service-3__btn-box">
                              <a href="+923026198713">Call me to get more extra service <span>Call Now</span></a>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <!-- how we work area end -->



         </main>

         <footer id="contact">
            <div class="tp-footer-bg tp-footer-bg-light p-relative fix z-index-1 theme-bg-2" data-background="assets/img/skill/bg-distort.png">
               <div class="tp-footer-circle-1">
                  <span></span>
               </div>
               <div class="tp-footer-circle-2">
                  <span></span>
               </div>
               <div class="tp-footer-circle-3" data-speed=".7">
                  <span></span>
               </div>
               <!-- footer area start -->
               <div class="tp-footer-area pt-120 pb-80">
                  <div class="container">
                     <div class="row">
                        <div class="col-xl-12">
                           <div class="tp-footer-content text-center">
                              <h3 class="tp-footer-title big tp_title_anim">Let's talk about <br> the next big thing</h3>
                           </div>
                        </div>
                     </div>
                     <div class="tp-footer-btn-box">
                        <div class="row">
                           <div class="col-xl-6 col-lg-6 col-md-6">
                              <div class="tp-footer-btn text-center ">
                                 <a class="tp-btn-green w-100" href="mailto:sharjil.hz@gmail.com">
                                    <div>
                                       <span>Write a Message</span>
                                    </div>
                                 </a>
                              </div>
                           </div>
                           <div class="col-xl-6 col-lg-6 col-md-6">
                              <div class="tp-footer-btn text-center ">
                                 <a class="tp-btn-white-xl w-100" href="tel:+923026198713">
                                    <div>
                                       <span>Discuss Project</span>
                                    </div>
                                 </a>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="row gx-50">
                        <div class="col-xl-4 col-lg-4 col-md-6 mb-30">
                           <a href="https://www.linkedin.com/in/sharjeel-anjum/" target="_blank">
                              <div class="tp-footer-social-item d-flex align-items-center justify-content-between">
                                 <span class="tp-footer-anim-border"></span>
                                 <div class="tp-footer-social-text z-index-1">
                                    <span class="child-1">Linkedin</span>
                                    <span class="child-2">@sharjeel-anjum</span>
                                 </div>
                                 <div class="tp-footer-social-icon z-index-1">
                                    <span>
                                       <i class="fab fa-linkedin-in"></i>
                                    </span>
                                 </div>
                              </div>
                           </a>
                        </div>
                        <div class="col-xl-4 col-lg-4 col-md-6 mb-30">
                           <a href="https://www.facebook.com/sharjeelanjumdesigner/" target="_blank">
                              <div class="tp-footer-social-item d-flex align-items-center justify-content-between">
                                 <span class="tp-footer-anim-border"></span>
                                 <div class="tp-footer-social-text z-index-1">
                                    <span class="child-1">Facebook</span>
                                    <span class="child-2">@sharjeelanjumdesigner</span>
                                 </div>
                                 <div class="tp-footer-social-icon z-index-1">
                                    <span>
                                       <i class="fab fa-facebook-f"></i>
                                    </span>
                                 </div>
                              </div>
                           </a>
                        </div>
                        <div class="col-xl-4 col-lg-4 col-md-6 mb-30">
                           <a href="https://twitter.com/sharjeel4it" target="_blank">
                              <div class="tp-footer-social-item d-flex align-items-center justify-content-between">
                                 <span class="tp-footer-anim-border"></span>
                                 <div class="tp-footer-social-text z-index-1">
                                    <span class="child-1">Twitter</span>
                                    <span class="child-2">@sharjeel4it</span>
                                 </div>
                                 <div class="tp-footer-social-icon z-index-1">
                                    <span>
                                       <i class="fab fa-twitter"></i>
                                    </span>
                                 </div>
                              </div>
                           </a>
                        </div>
                     </div>
                  </div>
               </div>
               <!-- footer area end -->

               <!-- copyright area start -->
               <div class="tp-copyright-area pb-20">
                  <div class="container">
                     <div class="row">
                        <div class="col-xl-6 col-md-6">
                           <div class="tp-copyright-content-left text-center text-md-start">
                              <p>©2024 Sharjeel Anjum, All Rights Reserved.</p>
                           </div>
                        </div>
                        <div class="col-xl-6 col-md-6">
                           <div class="tp-copyright-content-right text-center text-md-end">
                              <span></span>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
               <!-- copyright area end -->
            </div>
         </footer>
      </div>
   </div>
   
   <div id="awesome-cursor">
      <div id="awesome-cursor-circle">
         <div id="awesome-cursor-loader"></div>
         <div id="awesome-cursor-play" class="">
            <span class="awesome-cursor-play-start">Play</span>
            <span class="awesome-cursor-play-stop">Stop</span>
         </div>
      </div>
   </div>


   <!-- JS here -->
   <script data-cfasync="false" src="../../cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>
   <script src="assets/js/vendor/jquery.js"></script>
   <script src="assets/js/bootstrap-bundle.js"></script>
   <script src="assets/js/gsap.js"></script>
   <script src="assets/js/gsap-scroll-smoother.js"></script>
   <script src="assets/js/gsap-scroll-trigger.js"></script>
   <script src="assets/js/gsap-scroll-to-plugin.js"></script>
   <script src="assets/js/gsap-split-text.js"></script>

   <script src="assets/js/swiper-bundle.js"></script>
   <script src="assets/js/wow.js"></script>
   <script src="assets/js/slick.js"></script>
   <script src="assets/js/pagepiling.js"></script>
   <script src="assets/js/headroom.min.js"></script>
   <script src="assets/js/magnific-popup.js"></script>
   <script src="assets/js/nice-select.js"></script>
   <script src="assets/js/purecounter.js"></script>
   <script src="assets/js/hammer.js"></script>
   <script src="assets/js/matter.js"></script>
   <script src="assets/js/throwable.js"></script>
   <script src="assets/js/isotope-pkgd.js"></script>
   <script src="assets/js/imagesloaded-pkgd.js"></script>

   <script src="assets/js/theme-settings.js"></script>
   <script src="assets/js/animated-headline.js"></script>
   <script src="assets/js/main.js"></script>

</body>
</html>