services v.001a

This commit is contained in:
2026-05-06 17:30:31 -04:00
parent 0d6e875158
commit 5b01c1571f
4 changed files with 360 additions and 221 deletions
+359 -220
View File
@@ -243,6 +243,8 @@
<main class="contant relative transition-all z-2" id="lqd-site-content" style="background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(249,248,245,1) 100%);"> <main class="contant relative transition-all z-2" id="lqd-site-content" style="background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(249,248,245,1) 100%);">
<div class="lqd-contents-wrap"> <div class="lqd-contents-wrap">
<!-- Hero Intro Section-->
<section class="lqd-section our-vision pt-50 pb-390 py-50" id="solutions">
<div class="about-card about-intro-card"> <div class="about-card about-intro-card">
<p> <p>
At Tokslaw, we help businesses turn complex technology challenges into clear, scalable, and secure digital solutions At Tokslaw, we help businesses turn complex technology challenges into clear, scalable, and secure digital solutions
@@ -258,8 +260,12 @@
<button class="about-btn">View Portfolio</button> <button class="about-btn">View Portfolio</button>
</div> </div>
</div> </div>
</section>
<!-- END Hero Intro Section-->
<!-- Start Design -->
<!-- Start What We DO -->
<section class="lqd-section design pt-100 pb-40" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, figure, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1100 , "startDelay" : 200 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "80px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'> <section class="lqd-section design pt-100 pb-40" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, figure, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1100 , "startDelay" : 200 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "80px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
<div class="absolute top-0"> <div class="absolute top-0">
<div class="ld-particles-container relative w-full"> <div class="ld-particles-container relative w-full">
@@ -603,6 +609,9 @@
</div> </div>
</div> </div>
<!-- PROCESS STARTS-->
<div class="max-w-full animation-element about-card-wrapper"> <div class="max-w-full animation-element about-card-wrapper">
<div class="about-card2"> <div class="about-card2">
<div class=" iconbox flex flex-grow-1 relative flex-col iconbox-default iconbox-contents-show-onhover" data-slideelement-onhover="true" data-slideelement-options='{ "visibleElement": ".iconbox-icon-wrap, p, h3" , "hiddenElement": ".btn" , "alignMid": true, "triggerElement": ".lqd-iconbox-scale" }'> <div class=" iconbox flex flex-grow-1 relative flex-col iconbox-default iconbox-contents-show-onhover" data-slideelement-onhover="true" data-slideelement-options='{ "visibleElement": ".iconbox-icon-wrap, p, h3" , "hiddenElement": ".btn" , "alignMid": true, "triggerElement": ".lqd-iconbox-scale" }'>
@@ -676,30 +685,13 @@
<!-- });--> <!-- });-->
<!-- </script>--> <!-- </script>-->
<!-- <div class="col col-12 text-center mt-35">-->
<!-- <div class="w-full flex flex-wrap items-center justify-center transition-all">-->
<!-- <div class="module-text-border border-1 rounded-20 border-black-10 transition-all ld-fancy-heading relative hover:inner-text-black animation-element">-->
<!-- <p class="ld-fh-element relative inner-text-black py-10 px-20 m-0 text-slate-300">-->
<!-- Still have a question?-->
<!-- <a href="#" class="text-slate-300 inner-text-black" target="_blank">-->
<!-- <u>Browse documentation</u>-->
<!-- </a>-->
<!-- or-->
<!-- <a href="#contact-modal" class="text-slate-300 inner-text-black" data-lity="#contact-modal">-->
<!-- <u>Contact.</u>-->
<!-- </a>-->
<!-- </p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</div> </div>
</div> </div>
</section> </section>
<!-- End Design --> <!-- What We DO -->
<!-- Start Services --> <!-- Start Services -->
<section class="lqd-section our-vision pt-50 pb-390" id="solutions"> <section class="lqd-section our-vision pt-50 pb-390" id="solutions">
<div class="about-card about-intro-card"> <div class="about-card about-intro-card">
<h2>Our Process</h2> <h2>Our Process</h2>
@@ -735,209 +727,349 @@
</p> </p>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<section class="lqd-section our-vision pt-50 pb-390" id="solutions">
<div class="container">
<div class="row">
<div class="col col-12 lqd-unit-animation-done" style="">
<div class="w-full relative flex flex-col flex-grow-1 pt-40 pb-10 mb-50 border-bottom border-black module-line">
<div class="container-fluid p-0">
<div class="row items-center">
<div class="col col-2 animation-element lqd-unit-animation-done" style="">
<div class="w-30percent relative flex border-top border-black-50">
</div>
</div>
<div class="col col-8 animation-element lqd-unit-animation-done" style="">
<h6 class="ld-fh-element mb-0/5em text-12 uppercase tracking-0/01em font-normal text-black">Our services</h6>
</div>
<div class="col col-2 text-end sm:text-start animation-element lqd-unit-animation-done" style="">
<h6 class="ld-fh-element mb-0/5em text-12 font-normal">01</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col col-12 col-md-6 lqd-unit-animation-done" style="">
<div class="lqd-imggrp-container relative mb-2em transition-all ca-initvalues-applied lqd-animations-done" data-custom-animations="true" data-ca-options="{&quot;triggerHandler&quot;:&quot;inview&quot;,&quot;animationTarget&quot;:&quot;.lqd-imggrp-single&quot;,&quot;duration&quot;:&quot;1800&quot;,&quot;delay&quot;:&quot;160&quot;,&quot;ease&quot;:&quot;power4.out&quot;,&quot;direction&quot;:&quot;forward&quot;,&quot;initValues&quot;:{&quot;y&quot;:65,&quot;scaleY&quot;:1.1,&quot;opacity&quot;:0},&quot;animations&quot;:{&quot;y&quot;:0,&quot;scaleY&quot;:1,&quot;opacity&quot;:1}}">
<div class="lqd-imggrp-inner flex flex-wrap justify-center">
<div class="lqd-imggrp-single block absolute top-10percent left-0 lqd-unit-animation-done" data-shadow-style="4" style="">
<div class="lqd-imggrp-img-container">
<figure><img width="205" height="218" src="./assets/images/demo/asymmetric-agency/our-approach/what-we-do-1.jpg" alt="what we do"></figure>
</div>
</div>
<div class="lqd-imggrp-single block absolute top-5percent right-0 lqd-unit-animation-done" data-shadow-style="4" style="">
<div class="lqd-imggrp-img-container">
<figure><img width="230" height="269" src="./assets/images/demo/asymmetric-agency/our-approach/what-we-do-3.jpg" alt="what we do"></figure></div></div><div class="lqd-imggrp-single block relative mt-140 module-img lqd-unit-animation-done" data-shadow-style="4" style="">
<div class="lqd-imggrp-img-container">
<figure>
<img width="240" height="311" src="./assets/images/demo/asymmetric-agency/our-approach/what-we-do-2.jpg" alt="what we do"></figure>
</div>
</div>
</div>
</div>
</div>
<div class="col col-12 col-md-6 lqd-unit-animation-done" style="">
<div class="module-content relative flex flex-col items-start pr-5percent pl-15percent lg:pr-0">
<p class="ld-fh-element mb-0/5em text-12 uppercase tracking-0/05em text-black">What we do</p>
<h2 class="ld-fh-element mb-0/4em text-65 leading-0/8em text-black text-init">Product Strategy</h2>
<p class="ld-fh-element mb-2em text-16 leading-1/6em text-black">Through a deep understanding of our audiences makeup and motivations, we design digital experiences that connect with people.</p>
<div class="w-full relative">
<div class="flex flex-wrap -mx-15 mb-50 md:mb-0">
<div class="w-50percent px-15 sm:w-full">
<div class="one-bullet-list mb-1em">
<ul class="reset-ul module-list">
<li class="flex items-center mb-0/5em text-black">Website Development</li>
<li class="flex items-center mb-0/5em text-black">Mobile App Development</li>
<li class="flex items-center mb-0/5em text-black">Domain & Hosting</li>
<li class="flex items-center mb-0/5em text-black">UI/UX Design</li>
<li class="flex items-center mb-0/5em text-black">UI/UX Design</li>
<li class="flex items-center mb-0/5em text-black">Cloud & DevOps</li>
</ul>
</div>
</div>
<div class="w-50percent px-15 sm:w-full">
<div class="one-bullet-list mb-1em">
<ul class="reset-ul module-list">
<li class="flex items-center mb-0/5em text-black">SEO Performance</li>
<li class="flex items-center mb-0/5em text-black">Email Marketing</li>
<li class="flex items-center mb-0/5em text-black">WordPress</li>
<li class="flex items-center mb-0/5em text-black">SEO Optimization</li>
<li class="flex items-center mb-0/5em text-black">Cloud & DevOps</li>
<li class="flex items-center mb-0/5em text-black">Ongoing Support & Maintenance</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div> </div>
<!-- Start Who We Work WITH -->
<section class="lqd-section approach pt-40 pb-90 ca-initvalues-applied lqd-animations-done" id="approach" data-custom-animations="true" data-ca-options="{&quot;triggerHandler&quot;:&quot;inview&quot;,&quot;animationTarget&quot;:&quot;.col&quot;,&quot;duration&quot;:&quot;1800&quot;,&quot;delay&quot;:&quot;160&quot;,&quot;ease&quot;:&quot;power4.out&quot;,&quot;direction&quot;:&quot;forward&quot;,&quot;initValues&quot;:{&quot;x&quot;:30,&quot;transformOriginX&quot;:50,&quot;transformOriginY&quot;:50,&quot;transformOriginZ&quot;:&quot;0px&quot;,&quot;opacity&quot;:0},&quot;animations&quot;:{&quot;x&quot;:0,&quot;transformOriginX&quot;:50,&quot;transformOriginY&quot;:50,&quot;transformOriginZ&quot;:&quot;0px&quot;,&quot;opacity&quot;:1}}" data-section-luminosity="light"><div class="container"> <section class="lqd-section our-vision pt-50 pb-390 py-50" id="solutions">
<div class="col col-12 lqd-unit-animation-done" style=""> <div class="about-card about-intro-card">
<div class="w-full relative flex flex-col flex-grow-1 pt-40 pb-10 mb-50 border-bottom border-black module-line"> <h2>Who We Help</h2>
<div class="container-fluid p-0"> <h2>Tokslaw works with:</h2>
<div class="row items-center"> <div class="about-card3-wrapper">
<div class="col col-2 animation-element lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-30percent relative flex border-top border-black-50"> <p>
</div> Startups building MVPs
</div> </p>
<div class="col col-8 animation-element lqd-unit-animation-done" style="">
<h6 class="ld-fh-element mb-0/5em text-12 uppercase tracking-0/01em font-normal text-black">Software Development Process</h6>
</div>
<div class="col col-2 text-end sm:text-start animation-element lqd-unit-animation-done" style="">
<h6 class="ld-fh-element mb-0/5em text-12 font-normal">02</h6>
</div>
</div>
</div>
</div> </div>
</div> <div class="about-card3">
<p>
<div class="row"> Small businesses needing custom software
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> </p>
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">
<span class="ld-fh-txt-outline">1</span> 1</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 1</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Discovery.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Understanding your goals,target audience, and project requirements through in depth discussions and collaborative planning sessions.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Enterprises modernizing legacy systems
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">2</span> 2</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 2</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Planning.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Healthcare and wellness platforms.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">3</span> 3</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 3</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Wireframe Design.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Logistics and mobility companies.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">4</span> 4</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 4</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Front-end Development.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Cybersecurity-focused teams.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">5</span> 5</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 5</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Back-end Development.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Founders launching web or mobile apps.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">6</span> 6</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 6</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Integration.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Professionals building personal brands.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">7</span> 7</p>
</div>
<p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 7</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Testing</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Our web development starts and ends with a best-in-class experience strategy.</p>
</div>
</div> </div>
<div class="col col-12 col-md-4 lqd-unit-animation-done" style=""> <div class="about-card3">
<div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0"> <p>
<div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0"> Organizations needing architecture clarity.
<p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent"> </p>
<span class="ld-fh-txt-outline">8</span> 8</p>
</div><p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 8</p>
<h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Deployment.</h2>
<p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">We look to engage with our clients beyond the conventional design and agency relationship,</p>
</div>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<!-- END Who We Work WITH -->
<!-- Start Why Work With Toks -->
<section class="lqd-section our-vision pt-50 pb-390 py-50" id="solutions">
<div class="about-card about-intro-card">
<h2>Why Work With Tokslaw?</h2>
<h5>
Tokslaw brings a rare combination of strategic architecture and hands-on engineering. We do not just create diagrams, and we do not just write code. We connect the two.
</h5>
<h2>You get a partner who understands:</h2>
<div class="about-card3-wrapper">
<div class="about-card3">
<p>
Business strategy
</p>
</div>
<div class="about-card3">
<p>
Software architecture
</p>
</div>
<div class="about-card3">
<p>
Full-stack development.
</p>
</div>
<div class="about-card3">
<p>
Cloud and DevOps.
</p>
</div>
<div class="about-card3">
<p>
Cybersecurity
</p>
</div>
<div class="about-card3">
<p>
APIs and integrations.
</p>
</div>
<div class="about-card3">
<p>
User experience.
</p>
</div>
<div class="about-card3">
<p>
Scalable delivery.
</p>
</div>
</div>
<div class="belief-box">
<p>
The result is technology that is built well and built with purpose.
</p>
</div>
</div>
</section>
<!-- END Why Work With Toks -->
<!-- Start Why Work With Toks -->
<section class="lqd-section our-vision pt-50 pb-390 py-50" id="solutions">
<div class="about-card about-intro-card">
<h2>Featured Areas of Expertise</h2>
<div class="about-card3-wrapper">
<div class="about-card3">
<p>
Enterprise Architecture
</p>
</div>
<div class="about-card3">
<p>
Solution Architecture
</p>
</div>
<div class="about-card3">
<p>
Full-stack Development.
</p>
</div>
<div class="about-card3">
<p>
React / Next.js / TypeScript / Angular.
</p>
</div>
<div class="about-card3">
<p>
Node.js / Express.
</p>
</div>
<div class="about-card3">
<p>
PHP / Laravel / CodeIgniter.
</p>
</div>
<div class="about-card3">
<p>
REST APIs
</p>
</div>
<div class="about-card3">
<p>
Microservices
</p>
</div>
<div class="about-card3">
<p>
AWS Cloud
</p>
</div>
<div class="about-card3">
<p>
Docker
</p>
</div>
<div class="about-card3">
<p>
GitHub / GitLab / Jenkins CI/CD
</p>
</div>
<div class="about-card3">
<p>
DevSecOps
</p>
</div>
<div class="about-card3">
<p>
Cybersecurity
</p>
</div>
<div class="about-card3">
<p>
WordPress
</p>
</div>
<div class="about-card3">
<p>
Technical SEO
</p>
</div>
<div class="about-card3">
<p>
AI Product Strategy
</p>
</div>
</div>
</div>
</section>
<!-- END Why Work With Toks -->
<!-- Connect -->
<div class="about-card about-intro-card connect-card">
<h2>Ready to Build Something Better?</h2>
<p>
Whether you need a website, a secure application, an architecture roadmap, a cloud-ready deployment, or a digital transformation partner,
Tokslaw can help you move from idea to execution.
</p>
<strong>
Lets design, build, and secure your next digital solution.
</strong>
<div class="button-wrapper">
<button class="about-btn">Get Started</button>
</div>
</div>
<!-- <section class="lqd-section approach pt-40 pb-90 ca-initvalues-applied lqd-animations-done" id="approach" data-custom-animations="true" data-ca-options="{&quot;triggerHandler&quot;:&quot;inview&quot;,&quot;animationTarget&quot;:&quot;.col&quot;,&quot;duration&quot;:&quot;1800&quot;,&quot;delay&quot;:&quot;160&quot;,&quot;ease&quot;:&quot;power4.out&quot;,&quot;direction&quot;:&quot;forward&quot;,&quot;initValues&quot;:{&quot;x&quot;:30,&quot;transformOriginX&quot;:50,&quot;transformOriginY&quot;:50,&quot;transformOriginZ&quot;:&quot;0px&quot;,&quot;opacity&quot;:0},&quot;animations&quot;:{&quot;x&quot;:0,&quot;transformOriginX&quot;:50,&quot;transformOriginY&quot;:50,&quot;transformOriginZ&quot;:&quot;0px&quot;,&quot;opacity&quot;:1}}" data-section-luminosity="light"><div class="container">-->
<!-- <div class="col col-12 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pt-40 pb-10 mb-50 border-bottom border-black module-line">-->
<!-- <div class="container-fluid p-0">-->
<!-- <div class="row items-center">-->
<!-- <div class="col col-2 animation-element lqd-unit-animation-done" style="">-->
<!-- <div class="w-30percent relative flex border-top border-black-50">-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-8 animation-element lqd-unit-animation-done" style="">-->
<!-- <h6 class="ld-fh-element mb-0/5em text-12 uppercase tracking-0/01em font-normal text-black">Software Development Process</h6>-->
<!-- </div>-->
<!-- <div class="col col-2 text-end sm:text-start animation-element lqd-unit-animation-done" style="">-->
<!-- <h6 class="ld-fh-element mb-0/5em text-12 font-normal">02</h6>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!---->
<!-- <div class="row">-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">1</span> 1</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 1</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Discovery.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Understanding your goals,target audience, and project requirements through in depth discussions and collaborative planning sessions.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">2</span> 2</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 2</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Planning.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">3</span> 3</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 3</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Wireframe Design.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">4</span> 4</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 4</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Front-end Development.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">5</span> 5</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 5</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Back-end Development.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">6</span> 6</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 6</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Integration.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Tailor made digital products and creative solutions for small businesses and freelancers.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">7</span> 7</p>-->
<!-- </div>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 7</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Testing</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">Our web development starts and ends with a best-in-class experience strategy.</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="col col-12 col-md-4 lqd-unit-animation-done" style="">-->
<!-- <div class="w-full relative flex flex-col flex-grow-1 pr-25percent mb-15 lg:pr-0">-->
<!-- <div class="ld-fancy-heading ld-fh-pos-abs lqd-exclude-parent-ca ld-fh-outline ld-fh-outline-static relative z-0">-->
<!-- <p class="ld-fh-element absolute -top-0/1em right-0 mb-0/5em text-192 leading-1em text-transparent">-->
<!-- <span class="ld-fh-txt-outline">8</span> 8</p>-->
<!-- </div><p class="ld-fh-element relative mb-0/5em text-14 uppercase tracking-0/1em text-black">STEP 8</p>-->
<!-- <h2 class="ld-fh-element relative mb-0/7em leading-1/1em font-normal">Deployment.</h2>-->
<!-- <p class="ld-fh-element relative mb-0/5em text-16 leading-1/6em text-black">We look to engage with our clients beyond the conventional design and agency relationship,</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </section>-->
<!-- End Services --> <!-- End Services -->
@@ -947,28 +1079,28 @@
<div class="absolute w-full max-w-full bottom-0 ltr-left-0"> <div class="absolute w-full max-w-full bottom-0 ltr-left-0">
<div class="lqd-throwable-scene relative pointer-events-none overflow-hidden" data-lqd-throwable-scene> <div class="lqd-throwable-scene relative pointer-events-none overflow-hidden" data-lqd-throwable-scene>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-1" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-1" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-200 sm:text-16">Elementor Support</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-200 sm:text-16">UI/UX Design</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-2" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-2" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-100 sm:text-16">Mobile Builder</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-100 sm:text-16">Mobile Application</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-3" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-3" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-200 sm:text-16">Top-Notch Performance</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-200 sm:text-16">Performance & Optimization</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-4" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-4" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-300 sm:text-16">Next-gen Technologies</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-300 sm:text-16">AI Technologies</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-5" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-5" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-200 sm:text-16">WooCommerce Builder</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-200 sm:text-16">WordPress</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-6" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-6" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-16">Adaptive Colors</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-16">Brand Strategy</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-7" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-7" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-300 sm:text-16">Section Flow</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-300 sm:text-16">Data Engineering</span>
</p> </p>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-8" data-lqd-throwable-el> <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-8" data-lqd-throwable-el>
<span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-16">Text Reveal</span> <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-16">Bespoke Software Development</span>
</p> </p>
</div> </div>
</div> </div>
@@ -992,35 +1124,42 @@
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center"> <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full"> <div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full"> <div class="carousel-item-content relative w-full">
<img width="96" height="29" src="./assets/images/demo/start-hub-4/services/client-amazon.svg" alt="amazon"> <img width="96" height="29" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="tokslaw">
</div> </div>
</div> </div>
</div> </div>
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center"> <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full"> <div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full"> <div class="carousel-item-content relative w-full">
<img width="87" height="20" src="./assets/images/demo/start-hub-4/services/client-amd-logo.svg" alt="amd"> <img width="87" height="20" src="./assets/images/demo/start-hub-8/WrenchBoard.webp" alt="WrenchBoard">
</div> </div>
</div> </div>
</div> </div>
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center"> <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full"> <div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full"> <div class="carousel-item-content relative w-full">
<img width="127" height="24" src="./assets/images/demo/start-hub-4/services/client-dropcam.svg" alt="dropcam"> <img width="50" height="20" src="./assets/images/demo/start-hub-8/automedsys.ai logo.png" alt="automedsys">
</div> </div>
</div> </div>
</div> </div>
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center"> <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full"> <div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full"> <div class="carousel-item-content relative w-full">
<img width="84" height="36" src="./assets/images/demo/start-hub-4/services/client-marvel.svg" alt="marvel"> <img width="84" height="36" src="./assets/images/demo/start-hub-8/mermsai.png" alt="mermsemr">
</div> </div>
</div> </div>
</div> </div>
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center"> <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full"> <div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full"> <div class="carousel-item-content relative w-full">
<img width="76" height="27" src="./assets/images/demo/start-hub-4/services/client-nike.svg" alt="nike"> <img width="76" height="27" src="./assets/images/demo/start-hub-8/myfit-logo-2.png" alt="MyFit">
</div>
</div>
</div>
<div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full">
<div class="carousel-item-content relative w-full">
<img width="76" height="27" src="./assets/images/demo/start-hub-8/chiefsoft-lg.png" alt="ChiefSoft">
</div> </div>
</div> </div>
</div> </div>
@@ -1142,12 +1281,12 @@
<div class="mr-20 lqd-imggrp-single block relative"> <div class="mr-20 lqd-imggrp-single block relative">
<div class="lqd-imggrp-img-container inline-flex relative items-center justify-center"> <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
<figure class="w-full relative"> <figure class="w-full relative">
<img width="106" height="32" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Tokslaw"> <img width="40" height="40" style="object-fit: contain;" src="./assets/images/demo/start-hub-8/tokslaw_logo_main.png" alt="Tokslaw">
</figure> </figure>
</div> </div>
</div> </div>
<div class="ld-fancy-heading relative"> <div class="ld-fancy-heading relative">
<p class="ld-fh-element relative m-0 text-14 text-white-60">© 2025 Tokslaw.</p> <p class="ld-fh-element relative m-0 text-14 text-white-60">© 2026 Tokslaw. Developed by Tokslaw.</p>
</div> </div>
</div> </div>
<div class="w-50percent mt-55 text-end sm:text-start sm:w-full module-social"> <div class="w-50percent mt-55 text-end sm:text-start sm:w-full module-social">
+1 -1
View File
@@ -472,7 +472,7 @@ body {
/* Parent container for the cards */ /* Parent container for the cards */
.about-card3-wrapper { .about-card3-wrapper {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(3, 1fr);
column-gap: 28px; column-gap: 28px;
row-gap: 36px; row-gap: 36px;
align-items: stretch; align-items: stretch;

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 138 KiB