Access_New/demo-corporate-services.html
2024-09-05 11:33:27 +05:45

463 lines
26 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/corporate/corporate.css" />
</head>
<body data-mobile-nav-trigger-alignment="right" data-mobile-nav-style="modern" data-mobile-nav-bg-color="#242E45">
<div class="box-layout">
<header>
<nav class="navbar navbar-expand-lg header-light bg-white disable-fixed">
<div class="container-fluid">
<div class="col-auto col-xl-3 col-lg-2 me-lg-0 me-auto">
<a class="navbar-brand" href="demo-corporate.html">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="default-logo">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto col-xl-6 col-lg-8 menu-order position-static">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a href="demo-corporate.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-corporate-about.html" class="nav-link">About</a></li>
<li class="nav-item dropdown dropdown-with-icon-style02">
<a href="demo-corporate-services.html" class="nav-link">Services</a>
<i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Medal-2"></i>Business planning</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Archery-2"></i>Market research</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Financial"></i>Business consulting</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Money-Bag"></i>Audience analysis</a></li>
</ul>
</li>
<li class="nav-item"><a href="demo-corporate-customer-stories.html" class="nav-link">Testimonials</a></li>
<li class="nav-item"><a href="demo-corporate-pricing.html" class="nav-link">Pricing</a></li>
<li class="nav-item"><a href="demo-corporate-blog.html" class="nav-link">Blog</a></li>
<li class="nav-item"><a href="demo-corporate-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto col-xl-3 col-lg-2 text-end md-pe-0">
<div class="header-icon">
<div class="header-search-icon icon">
<a href="demo-corporate-services.html#" class="search-form-icon header-search-form"><i class="feather icon-feather-search"></i></a>
<div class="search-form-wrapper">
<button title="Close" type="button" class="search-close">×</button>
<form id="search-form" role="search" method="get" class="search-form text-left" action="search-result.html">
<div class="search-form-box">
<h2 class="text-dark-gray text-center fw-600 mb-4 ls-minus-1px">What are you looking for?</h2>
<input class="search-input" id="search-form-input5e219ef164995" placeholder="Enter your keywords..." name="s" value type="text" autocomplete="off">
<button type="submit" class="search-button">
<i class="feather icon-feather-search" aria-hidden="true"></i>
</button>
</div>
</form>
</div>
</div>
<div class="header-button ms-20px d-none d-xl-inline-block">
<a href="demo-corporate-contact.html" class="btn btn-rounded btn-transparent-light-gray border-1 btn-medium btn-switch-text text-transform-none">
<span>
<span class="btn-double-text fw-600" data-text="Free consultation">Free consultation</span>
<span><i class="fa-regular fa-envelope"></i></span>
</span>
</a>
</div>
</div>
</div>
</div>
</nav>
</header>
<section class="top-space-margin page-title-big-typography border-radius-6px lg-border-radius-0px p-0" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-corporate-services-title-bg.jpg')">
<div class="opacity-extra-medium bg-blue-whale"></div>
<div class="container">
<div class="row align-items-center justify-content-center small-screen">
<div class="col-lg-8 position-relative text-center page-title-extra-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<h1 class="m-auto text-white text-shadow-double-large fw-600 ls-minus-2px">Services</h1>
</div>
<div class="down-section text-center" data-anime="{ &quot;translateY&quot;: [-50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<a href="demo-corporate-services.html#down-section" class="section-link">
<div class="text-white">
<i class="feather icon-feather-chevron-down icon-very-medium"></i>
</div>
</a>
</div>
</div>
</div>
</section>
<section id="down-section" class="position-relative pb-4 overflow-hidden">
<div class="container">
<div class="row align-items-center mb-8">
<div class="col-lg-5 md-mb-50px" data-anime="{ &quot;translateY&quot;: [0, 0], &quot;perspective&quot;: [1200,1200], &quot;scale&quot;: [1.1, 1], &quot;rotateX&quot;: [50, 0], &quot;opacity&quot;: [0,0.7], &quot;duration&quot;: 800, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="d-flex flex-column box-shadow-double-large border-radius-8px overflow-hidden">
<div class="row row-cols-1 justify-content-center m-0">
<div class="col p-9 border-bottom border-color-extra-medium-gray bg-white last-paragraph-no-margin">
<div class="d-flex align-items-center justify-content-center text-dark-gray">
<div class="flex-shrink-0 me-20px">
<h2 class="mb-0 fs-60 fw-700 ls-minus-2px">99<sup class="fs-26">%</sup></h2>
</div>
<div>
<span class="fs-18 lh-28 fw-600 d-block">Track and analyze <br/>business reports.</span>
</div>
</div>
</div>
<div class="col p-9 border-bottom border-color-extra-medium-gray bg-white last-paragraph-no-margin">
<div class="d-flex align-items-center justify-content-center text-dark-gray">
<div class="flex-shrink-0 me-20px">
<h2 class="mb-0 fs-60 fw-700 ls-minus-4px">4.9</h2>
</div>
<div>
<div class="review-star-icon fs-22 d-inline-block text-gradient-orange-sky-blue">
<i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i>
</div>
<span class="fs-18 lh-28 fw-600 d-block">Best rated agency</span>
</div>
</div>
</div>
<div class="col p-9 bg-white last-paragraph-no-margin">
<div class="d-flex align-items-center justify-content-center text-dark-gray">
<div class="flex-shrink-0 me-20px">
<h2 class="mb-0 fs-60 fw-700 ls-minus-2px">98<sup class="fs-26">%</sup></h2>
</div>
<div>
<span class="fs-18 lh-28 fw-600 d-block">Genuine repeated <br/>happy customers.</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-5 offset-lg-1 col-lg-6" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">Creative approach</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px">Reach your business goals in record time.</h3>
<p class="w-95 lg-w-100 mb-35px">Lorem ipsum simply dummy printing typesetting industry lorem Ipsum been the industry's dummy text ever since when an unknown printer took a galley.</p>
<div class="feature-box feature-box-left-icon bg-gradient-flamingo-amethyst-green border-radius-4px w-95 xl-w-100 mb-40px ps-30px pe-30px pt-15px pb-15px xs-p-15px sm-mb-30px xs-lh-normal">
<div class="feature-box-icon me-10px">
<img src="images/demo-beauty-salon-story-03.png" class="h-30px" alt>
</div>
<div class="feature-box-content">
<span class="alt-font text-white fw-500">Best corporate services agency in world.</span>
</div>
</div>
<div class="row align-items-center text-center text-sm-start">
<div class="col-sm-auto xs-mb-5px">
<h3 class="alt-font text-dark-gray mb-0 d-inline-block align-middle me-10px lg-fs-32 fw-700">722+</h3>
<div class="text-center bg-dark-gray text-white fs-14 border-radius-4px d-inline-block ps-15px pe-15px lh-34 align-middle me-5px"><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i><i class="bi bi-star-fill"></i></div>
</div>
<div class="col-sm border-start border-2 border-color-dark-gray ps-25px ms-10px xl-ps-20px lg-ms-5px xs-border-start-0 xs-ps-15px xs-pe-15px xs-m-0">
<p class="m-0 lh-26 text-dark-gray fw-600">5 star reviews from our satisfied customers.</p>
</div>
</div>
</div>
</div>
</div>
<img src="images/demo-corporate-services-bg-01.png" class="position-absolute top-80px left-170px opacity-7 z-index-minus-1" data-bottom-top="transform: rotate(0deg) translateY(0)" data-top-bottom="transform:rotate(-15deg) translateY(0)" alt />
</section>
<section class="bg-gradient-quartz-white position-relative z-index-0 border-radius-6px lg-border-radius-0px overflow-hidden">
<div class="container">
<div class="row justify-content-center mb-3">
<div class="col-xl-5 col-lg-6 text-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="ps-25px pe-25px mb-10px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-quartz-light-transparent d-inline-block">Creative approach</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px">Corporate services</h3>
</div>
</div>
<div class="row row-cols-1 row-cols-xl-3 row-cols-lg-3 row-cols-md-2 row-cols-sm-1 justify-content-center mb-5 transition-inner-all" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col interactive-banner-style-02 hover-box dark-hover md-mb-30px">
<div class="h-100 text-center position-relative border-radius-6px box-shadow-quadruple-large overflow-hidden">
<figure class="m-0">
<a href="demo-corporate-services-details.html" class="position-relative d-block">
<img src="images/demo-corporate-services-01.jpg" alt />
<div class="label position-absolute right-20px top-20px bg-base-color fw-600 text-white text-uppercase border-radius-30px ps-15px pe-15px fs-11 ls-05px">Creativity</div>
</a>
<figcaption class="w-100 position-absolute bottom-0px bg-white">
<div class="position-relative z-index-2 p-40px pt-25px pb-15px border-bottom border-dark-opacity">
<i class="features-icon line-icon-Archery-2 d-block icon-extra-large"></i>
<a href="demo-corporate-services-details.html" class="fw-600 d-inline-block mb-5px text-dark-gray fs-18">Business planning</a>
<p class="w-80 lg-w-100 fs-16 mx-auto mb-15px lg-mb-10px text-light-opacity">Lorem ipsum simply dummy text of amet consectetur.</p>
</div>
<a href="demo-corporate-services-details.html" class="btn btn-link btn-hover-animation-switch btn-small fw-700 text-dark-gray text-uppercase p-20px z-index-1">
<span>
<span class="btn-text">Explore services</span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
</span>
</a>
<div class="box-overlay bg-base-color"></div>
</figcaption>
</figure>
</div>
</div>
<div class="col interactive-banner-style-02 hover-box dark-hover md-mb-30px">
<div class="h-100 text-center position-relative border-radius-6px box-shadow-quadruple-large overflow-hidden">
<figure class="m-0">
<a href="demo-corporate-services-details.html" class="position-relative d-block">
<img src="images/demo-corporate-services-02.jpg" alt />
<div class="label position-absolute right-20px top-20px bg-base-color fw-600 text-white text-uppercase border-radius-30px ps-15px pe-15px fs-11 ls-05px">Discover</div>
</a>
<figcaption class="w-100 position-absolute bottom-0px bg-white">
<div class="position-relative z-index-2 p-40px pt-25px pb-15px border-bottom border-dark-opacity">
<i class="features-icon line-icon-Coins d-block icon-extra-large"></i>
<a href="demo-corporate-services-details.html" class="fw-600 d-inline-block mb-5px text-dark-gray fs-18">Market research</a>
<p class="w-80 lg-w-100 fs-16 mx-auto mb-15px lg-mb-10px text-light-opacity">Lorem ipsum simply dummy text of amet consectetur.</p>
</div>
<a href="demo-corporate-services-details.html" class="btn btn-link btn-hover-animation-switch btn-small fw-700 text-dark-gray text-uppercase p-20px z-index-1">
<span>
<span class="btn-text">Explore services</span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
</span>
</a>
<div class="box-overlay bg-base-color"></div>
</figcaption>
</figure>
</div>
</div>
<div class="col interactive-banner-style-02 hover-box dark-hover md-mb-30px">
<div class="h-100 text-center position-relative border-radius-6px box-shadow-quadruple-large overflow-hidden">
<figure class="m-0">
<a href="demo-corporate-services-details.html" class="position-relative d-block">
<img src="images/demo-corporate-services-03.jpg" alt />
<div class="label position-absolute right-20px top-20px bg-base-color fw-600 text-white text-uppercase border-radius-30px ps-15px pe-15px fs-11 ls-05px">Modern</div>
</a>
<figcaption class="w-100 position-absolute bottom-0px bg-white">
<div class="position-relative z-index-2 p-40px pt-25px pb-15px border-bottom border-dark-opacity">
<i class="features-icon line-icon-Bar-Chart3 d-block icon-extra-large"></i>
<a href="demo-corporate-services-details.html" class="fw-600 d-inline-block mb-5px text-dark-gray fs-18">Audience analysis</a>
<p class="w-80 lg-w-100 fs-16 mx-auto mb-15px lg-mb-10px text-light-opacity">Lorem ipsum simply dummy text of amet consectetur.</p>
</div>
<a href="demo-corporate-services-details.html" class="btn btn-link btn-hover-animation-switch btn-small fw-700 text-dark-gray text-uppercase p-20px z-index-1">
<span>
<span class="btn-text">Explore services</span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
<span class="btn-icon"><i class="fa-solid fa-arrow-right"></i></span>
</span>
</a>
<div class="box-overlay bg-base-color"></div>
</figcaption>
</figure>
</div>
</div>
</div>
<img src="images/demo-corporate-services-bg-02.png" class="position-absolute top-20 right-60px z-index-minus-1" data-bottom-top="transform: rotate(0deg) translateY(0)" data-top-bottom="transform:rotate(-15deg) translateY(0)" alt />
<div class="row justify-content-center g-0">
<div class="col-auto text-center last-paragraph-no-margin icon-with-text-style-08">
<div class="feature-box feature-box-left-icon-middle overflow-hidden ps-30px pe-30px xs-ps-15px xs-pe-15px ">
<div class="feature-box-icon me-10px">
<i class="bi bi-chat-text fs-24 icon-very-medium text-base-color"></i>
</div>
<div class="feature-box-content last-paragraph-no-margin text-dark-gray text-uppercase fs-15 fw-700 ls-05px">Let's make something great work together. <a href="demo-corporate-contact.html" class="text-base-color text-decoration-line-bottom-medium border-1">Got a project in mind?</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="position-relative pt-0">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 position-relative md-mb-50px text-center text-md-center" data-anime="{ &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;:0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<img src="images/demo-corporate-services-05.png" alt>
<img src="images/demo-corporate-05.png" class="position-absolute top-70px left-minus-20px lg-left-0px d-none d-sm-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)" alt>
<img src="images/demo-corporate-services-04.png" class="position-absolute bottom-0px left-minus-60px lg-left-minus-30px xs-left-minus-10px xs-w-50" data-bottom-top="transform: translateY(50px)" data-top-bottom="transform: translateY(-50px)" alt>
<img src="images/demo-corporate-08.png" class="position-absolute top-30 right-90px d-none d-sm-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)" alt>
</div>
<div class="col-xl-5 offset-xl-1 col-lg-6 text-center text-md-start" data-anime="{ &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">Frequently asked questions</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px w-90 mb-50px md-mb-30px lg-w-100">What we can do for you and company.</h3>
<div class="accordion accordion-style-06 text-start" id="accordion-style-07">
<div class="accordion-item active-accordion">
<div class="accordion-header">
<a href="demo-corporate-services.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-07-01" aria-expanded="true" data-bs-parent="#accordion-style-07">
<div class="accordion-title fs-18 position-relative pe-0 alt-font text-dark-gray fw-600 mb-0">What is tax and legal advisory?</div>
</a>
</div>
<div id="accordion-style-07-01" class="accordion-collapse collapse show" data-bs-parent="#accordion-style-07">
<div class="accordion-body last-paragraph-no-margin">
<p>The focus of the tax and legal department is on advisory services in the tax law.</p>
<i class="line-icon-Sand-watch icon-extra-double-large opacity-2"></i>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header">
<a href="demo-corporate-services.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-07-02" aria-expanded="false" data-bs-parent="#accordion-style-07">
<div class="accordion-title fs-18 position-relative pe-0 alt-font text-dark-gray fw-600 mb-0">What is company accounting?</div>
</a>
</div>
<div id="accordion-style-07-02" class="accordion-collapse collapse" data-bs-parent="#accordion-style-07">
<div class="accordion-body last-paragraph-no-margin">
<p>The focus of the tax and legal department is on advisory services in the tax law.</p>
<i class="line-icon-Car-Wheel icon-extra-double-large opacity-2"></i>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header">
<a href="demo-corporate-services.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-07-03" aria-expanded="false" data-bs-parent="#accordion-style-07">
<div class="accordion-title fs-18 position-relative pe-0 alt-font text-dark-gray fw-600 mb-0">What do you do for corporate clients?</div>
</a>
</div>
<div id="accordion-style-07-03" class="accordion-collapse collapse" data-bs-parent="#accordion-style-07">
<div class="accordion-body last-paragraph-no-margin">
<p>The focus of the tax and legal department is on advisory services in the tax law.</p>
<i class="line-icon-Gear-2 icon-extra-double-large opacity-2"></i>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="p-0 fs-16 border-top border-color-extra-medium-gray">
<div class="container">
<div class="row justify-content-center pt-6 sm-pt-40px">
<div class="col-6 col-xl-3 col-lg-12 col-sm-6 last-paragraph-no-margin text-xl-start text-lg-center order-sm-1 lg-mb-50px sm-mb-30px">
<a href="demo-corporate.html" class="footer-logo mb-15px d-inline-block"><img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt></a>
<p class="lh-30 w-90 xl-w-100 mx-lg-auto mx-xl-0">Gearing your company through an innovative strategy.</p>
<div class="elements-social social-icon-style-02 mt-20px xs-mt-15px">
<ul class="medium-icon dark">
<li class="my-0"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li class="my-0"><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li class="my-0"><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li class="my-0"><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
</ul>
</div>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-3 order-lg-2">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Company</span>
<ul>
<li><a href="demo-corporate-about.html">Who we are</a></li>
<li><a href="demo-corporate-services.html">Our services</a><div class="bg-dark-gray fw-600 text-white lh-22 text-uppercase border-radius-30px ps-10px pe-10px fs-10 ms-10px d-inline-block align-middle">Hot</div></li>
<li><a href="demo-corporate-customer-stories.html">Our clients</a></li>
<li><a href="demo-corporate-contact.html">Contact us</a></li>
</ul>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-4 order-lg-3">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Services</span>
<ul>
<li><a href="demo-corporate-services-details.html">Planning</a></li>
<li><a href="demo-corporate-services-details.html">Research</a></li>
<li><a href="demo-corporate-services-details.html">Consulting</a></li>
<li><a href="demo-corporate-services-details.html">Analysis</a></li>
</ul>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-5 order-lg-4">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Customer</span>
<ul>
<li><a href="demo-corporate-customer-stories.html">Client support</a></li>
<li><a href="demo-corporate-customer-stories.html">Help center</a></li>
<li><a href="demo-corporate-customer-stories.html">System status</a></li>
<li><a href="demo-corporate-customer-stories.html">Feedback</a></li>
</ul>
</div>
<div class="col-xl-3 col-lg-3 col-sm-6 md-mb-50px sm-mb-30px xs-mb-0 order-sm-2 order-lg-5">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Subscribe newsletter</span>
<p class="lh-30 w-95 sm-w-100 mb-15px">Subscribe our newsletter to get the latest news and updates!</p>
<div class="d-inline-block w-100 newsletter-style-02 position-relative">
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative">
<input class="border-color-extra-medium-gray bg-transparent border-radius-4px w-100 form-control input-small pe-50px required" type="email" name="email" placeholder="Enter your email" />
<input type="hidden" name="redirect" value>
<button class="btn pe-20px submit lh-16" aria-label="submit"><i class="feather icon-feather-mail icon-small text-dark-gray"></i></button>
<div class="form-results border-radius-4px pt-5px pb-5px ps-15px pe-15px fs-14 lh-22 mt-10px w-100 text-center position-absolute d-none"></div>
</form>
</div>
</div>
</div>
<div class="row justify-content-center align-items-center pt-2">
<div class="col-12">
<div class="divider-style-03 divider-style-03-01 border-color-transparent-white-light"></div>
</div>
<div class="col-lg-5 pt-35px pb-35px md-pt-0 order-2 order-lg-1 text-center text-lg-start last-paragraph-no-margin"><p>&copy; 2024 Crafto is Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-dark-gray fw-600 text-decoration-line-bottom">ThemeZaa</a></p></div>
<div class="col-lg-7 pt-35px pb-35px md-pt-25px md-pb-5px order-1 order-lg-2 text-center text-lg-end">
<ul class="footer-navbar sm-lh-normal">
<li><a href="demo-corporate-services.html#" class="nav-link">Privacy policy</a></li>
<li><a href="demo-corporate-services.html#" class="nav-link">Terms and conditions</a></li>
<li><a href="demo-corporate-services.html#" class="nav-link">Copyright</a></li>
</ul>
</div>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-corporate-services.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>