Access_New/pages/demo-consulting.html
2024-09-05 11:33:27 +05:45

893 lines
54 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/consulting/consulting.css" />
</head>
<body data-mobile-nav-style="classic">
<header class="header-with-topbar">
<div class="header-top-bar top-bar-light bg-white disable-fixed md-border-bottom border-color-transparent-dark-very-light">
<div class="container-fluid">
<div class="row h-45px align-items-center m-0">
<div class="col-md-6 text-center text-md-start">
<div class="fs-14 text-dark-gray">Our consulting experts waiting for you! <a href="demo-consulting-contact.html" class="text-base-color fw-500 text-decoration-line-bottom">Contact now</a></div>
</div>
<div class="col-6 text-end d-none d-md-flex">
<div class="widget fs-14 me-30px md-me-0"><a href="tel:02228899900" class="text-dark-gray"><i class="feather icon-feather-phone-call text-base-color"></i> 0222 8899900</a></div>
<div class="widget fs-14 text-dark-gray d-none d-lg-inline-block"><i class="feather icon-feather-map-pin text-base-color"></i> Broadway, 24th Floor, San Francisco</div>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-lg header-transparent bg-transparent border-bottom border-color-transparent-white-light disable-fixed">
<div class="container-fluid">
<div class="col-auto col-lg-2 me-auto">
<a class="navbar-brand" href="demo-consulting.html">
<img src="images/demo-consulting-logo-white.png" data-at2x="images/demo-consulting-logo-white@2x.png" alt class="default-logo">
<img src="images/demo-consulting-logo-black.png" data-at2x="images/demo-consulting-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-consulting-logo-black.png" data-at2x="images/demo-consulting-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto 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 alt-font">
<li class="nav-item"><a href="demo-consulting.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-consulting-company.html" class="nav-link">Company</a></li>
<li class="nav-item dropdown simple-dropdown">
<a href="demo-consulting-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-consulting-services-details.html">Audit assurance</a></li>
<li><a href="demo-consulting-services-details.html">Financial advisory</a></li>
<li><a href="demo-consulting-services-details.html">Business analytics</a></li>
<li><a href="demo-consulting-services-details.html">Middle marketing</a></li>
<li><a href="demo-consulting-services-details.html">Consumer markets</a></li>
<li><a href="demo-consulting-services-details.html">Tax efficiency</a></li>
</ul>
</li>
<li class="nav-item"><a href="demo-consulting-process.html" class="nav-link">Process</a></li>
<li class="nav-item"><a href="demo-consulting-clients.html" class="nav-link">Clients</a></li>
<li class="nav-item"><a href="demo-consulting-news.html" class="nav-link">News</a></li>
<li class="nav-item"><a href="demo-consulting-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto col-lg-2 text-end md-pe-0">
<div class="header-icon">
<div class="header-search-icon icon">
<a href="demo-consulting.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 alt-font">×</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 fw-600 ls-minus-1px text-center mb-4 alt-font">What are you looking for?</h2>
<input class="search-input alt-font" 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-push-button icon">
<div class="push-button">
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="push-menu push-menu-style-3 p-50px bg-dark-gray">
<span class="close-menu text-dark-gray bg-white"><i class="fa-solid fa-xmark"></i></span>
<div class="push-menu-wrapper text-dark-gray" data-scroll-options="{ &quot;theme&quot;: &quot;light&quot; }">
<div class="w-100">
<h4 class="alt-font text-white fw-400 mb-30px d-block w-90 lh-40">Scalable business for <span class="d-inline-block fw-600 border-3 border-bottom border-color-base-color">startups</span></h4>
</div>
<div class="col-12">
<ul class="fs-20 ps-0 alt-font">
<li class="pt-10px pb-10px w-100"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f w-30px text-start text-white"></i>Facebook</a></li>
<li class="pt-10px pb-10px w-100"><a class="instagram" href="https://www.instagram.com/" target="_blank"><i class="fa-brands fa-instagram w-30px text-start text-white"></i>Instagram</a></li>
<li class="pt-10px pb-10px w-100"><a class="twitter" href="https://twitter.com/" target="_blank"><i class="fa-brands fa-twitter w-30px text-start text-white"></i>Twitter</a></li>
<li class="pt-10px pb-10px w-100"><a class="dribbble" href="https://www.dribbble.com/" target="_blank"><i class="fa-brands fa-dribbble w-30px text-start text-white"></i>Dribbble</a></li>
</ul>
</div>
<div class="border-top border-color-transparent-white-light pt-30px w-100">
<span class="fs-24 fw-500 text-white"><a href="tel:12345678910">+1 234 567 8910</a></span>
<a href="cdn-cgi/l/email-protection.html#97fef9f1f8d7f3f8faf6fef9b9f4f8fa"><span class="__cf_email__" data-cfemail="6b02050d042b0f04060a020545080406">[email&#160;protected]</span></a>
</div>
</div>
</div>
</header>
<section class="p-0 bg-dark-gray">
<div class="swiper full-screen bg-dark-gray ipad-top-space-margin md-h-600px sm-h-500px swiper-number-pagination-style-02 magic-cursor light magic-cursor-vertical lg-no-parallax" data-slider-options="{ &quot;slidesPerView&quot;: 1, &quot;direction&quot;: &quot;horizontal&quot;, &quot;loop&quot;: true, &quot;parallax&quot;: true, &quot;speed&quot;: 1000, &quot;pagination&quot;: { &quot;el&quot;: &quot;.swiper-number&quot;, &quot;clickable&quot;: true }, &quot;autoplay&quot;: { &quot;delay&quot;: 40000, &quot;disableOnInteraction&quot;: false }, &quot;keyboard&quot;: { &quot;enabled&quot;: true, &quot;onlyInViewport&quot;: true }, &quot;breakpoints&quot;: { &quot;1199&quot;: { &quot;direction&quot;: &quot;vertical&quot; }}, &quot;effect&quot;: &quot;slide&quot; }" data-number-pagination="1">
<div class="swiper-wrapper">
<div class="swiper-slide overflow-hidden">
<div class="cover-background position-absolute top-0 start-0 w-100 h-100" data-swiper-parallax="500" style="background-image:url('images/demo-consulting-slider-03.jpg');">
<div class="opacity-light bg-dark-gray"></div>
<div class="container h-100">
<div class="row align-items-center h-100 justify-content-center">
<div class="col-md-10 position-relative text-white d-flex flex-column justify-content-center h-100 text-center">
<div class="alt-font fs-110 xs-fs-80 lh-100 mb-5 xs-mb-35px ls-minus-4px xs-ls-minus-2px text-shadow-double-large transform-origin-right" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;rotateX&quot;: [90, 0], &quot;opacity&quot;: [0,1], &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="d-inline-block">Professional</span>
<span class="d-inline-block fw-600">consulting</span>
</div>
<div data-anime="{ &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 300, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<a href="demo-consulting-contact.html" class="btn btn-base-color btn-box-shadow btn-large btn-round-edge">Let's work together</a>
</div>
<div data-anime="{ &quot;opacity&quot;: [0, 1], &quot;duration&quot;: 500, &quot;delay&quot;: 1000, &quot;easing&quot;: &quot;easeOutQuad&quot; }" class="fs-20 alt-font position-absolute lg-position-relative left-0px right-0px bottom-0 mb-8 lg-mt-40px lg-mb-0 sm-mt-25px w-100 text-shadow-double-large">Request a free <a href="demo-consulting-contact.html" class="text-decoration-line-bottom text-white fw-500">business consulting!</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide overflow-hidden">
<div class="cover-background position-absolute top-0 start-0 w-100 h-100" data-swiper-parallax="500" style="background-image:url('images/demo-consulting-slider-01.jpg');">
<div class="opacity-light bg-dark-gray"></div>
<div class="container h-100">
<div class="row align-items-center h-100 justify-content-center">
<div class="col-md-10 position-relative text-white d-flex flex-column justify-content-center h-100 text-center">
<div class="alt-font fs-110 xs-fs-80 lh-100 mb-5 xs-mb-35px ls-minus-4px xs-ls-minus-2px text-shadow-double-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;rotateX&quot;: [90, 0], &quot;opacity&quot;: [0,1], &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="d-inline-block">Contribute</span><br>
<span class="fw-600 d-inline-block">guidance</span>
</div>
<div data-anime="{ &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 300, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }"><a href="demo-consulting-contact.html" class="btn btn-base-color btn-box-shadow btn-large btn-round-edge">Let's work together</a></div>
<div data-anime="{ &quot;opacity&quot;: [0, 1], &quot;duration&quot;: 500, &quot;delay&quot;: 1000, &quot;easing&quot;: &quot;easeOutQuad&quot; }" class="fs-20 alt-font position-absolute lg-position-relative left-0px right-0px bottom-0 mb-8 lg-mt-40px lg-mb-0 sm-mt-25px w-100 text-shadow-double-large">Discover our <a href="demo-consulting-process.html" class="text-decoration-line-bottom text-white fw-500">business process!</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide overflow-hidden">
<div class="cover-background position-absolute top-0 start-0 w-100 h-100" data-swiper-parallax="500" style="background-image:url('images/demo-consulting-slider-02.jpg');">
<div class="opacity-light bg-dark-gray"></div>
<div class="container h-100">
<div class="row align-items-center h-100 justify-content-center">
<div class="col-md-10 position-relative text-white d-flex flex-column justify-content-center h-100 text-center">
<div class="alt-font fs-110 xs-fs-80 lh-100 mb-5 xs-mb-35px ls-minus-4px xs-ls-minus-2px text-shadow-double-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;rotateX&quot;: [90, 0], &quot;opacity&quot;: [0,1], &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="d-inline-block">Business</span><br>
<span class="fw-600 d-inline-block">strategies</span>
</div>
<div data-anime="{ &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 300, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }"><a href="demo-consulting-contact.html" class="btn btn-base-color btn-box-shadow btn-large btn-round-edge">Let's work together</a></div>
<div data-anime="{ &quot;opacity&quot;: [0, 1], &quot;duration&quot;: 500, &quot;delay&quot;: 1000, &quot;easing&quot;: &quot;easeOutQuad&quot; }" class="fs-20 alt-font position-absolute lg-position-relative left-0px right-0px bottom-0 mb-8 lg-mt-40px lg-mb-0 sm-mt-25px w-100 text-shadow-double-large">Become a part of <a href="demo-consulting-company.html" class="text-decoration-line-bottom text-white fw-500">business venture!</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-pagination container swiper-pagination-clickable swiper-pagination-bullets-right swiper-number"></div>
</div>
</section>
<section class="position-relative overflow-hidden">
<div id="particles-01" data-particle="true" data-particle-options="{&quot;particles&quot;: {&quot;number&quot;: {&quot;value&quot;: 5,&quot;density&quot;: {&quot;enable&quot;: true,&quot;value_area&quot;: 1000}},&quot;color&quot;:{&quot;value&quot;:[&quot;#b7b9be&quot;, &quot;#dd6531&quot;]},&quot;shape&quot;: {&quot;type&quot;: &quot;circle&quot;,&quot;stroke&quot;:{&quot;width&quot;:0,&quot;color&quot;:&quot;#000000&quot;}},&quot;opacity&quot;: {&quot;value&quot;: 0.5,&quot;random&quot;: false,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;speed&quot;: 1,&quot;sync&quot;: false}},&quot;size&quot;: {&quot;value&quot;: 8,&quot;random&quot;: true,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;sync&quot;: true}},&quot;move&quot;: {&quot;enable&quot;: true,&quot;speed&quot;:2,&quot;direction&quot;: &quot;right&quot;,&quot;random&quot;: false,&quot;straight&quot;: false}},&quot;interactivity&quot;: {&quot;detect_on&quot;: &quot;canvas&quot;,&quot;events&quot;: {&quot;onhover&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;repulse&quot;},&quot;onclick&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;push&quot;},&quot;resize&quot;: true}},&quot;retina_detect&quot;: false}" class="position-absolute h-100 top-0 left-0 z-index-minus-1"></div>
<div class="container">
<div class="row row-cols-1 row-cols-lg-3 row-cols-md-2 justify-content-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;rotateZ&quot;: [5, 0], &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col icon-with-text-style-01 mb-50px sm-mb-40px">
<div class="feature-box feature-box-left-icon last-paragraph-no-margin">
<div class="feature-box-icon">
<img src="images/demo-consulting-icon-01.png" alt />
</div>
<div class="feature-box-content">
<span class="d-inline-block alt-font text-dark-gray fw-600 mb-5px fs-20">Innovative ideas</span>
<p class="w-90 md-w-100">Lorem ipsum simply dummy text printing typesetting.</p>
</div>
</div>
</div>
<div class="col icon-with-text-style-01 mb-50px sm-mb-40px">
<div class="feature-box feature-box-left-icon last-paragraph-no-margin">
<div class="feature-box-icon">
<img src="images/demo-consulting-icon-02.png" alt />
</div>
<div class="feature-box-content">
<span class="d-inline-block alt-font text-dark-gray fw-600 mb-5px fs-20">Expertise strategy</span>
<p class="w-90 md-w-100">Lorem ipsum simply dummy text printing typesetting.</p>
</div>
</div>
</div>
<div class="col icon-with-text-style-01 mb-50px sm-mb-40px">
<div class="feature-box feature-box-left-icon last-paragraph-no-margin">
<div class="feature-box-icon">
<img src="images/demo-consulting-icon-03.png" alt />
</div>
<div class="feature-box-content">
<span class="d-inline-block alt-font text-dark-gray fw-600 mb-5px fs-20">Financial planning</span>
<p class="w-90 md-w-100">Lorem ipsum simply dummy text printing typesetting.</p>
</div>
</div>
</div>
</div>
<div class="row align-items-center mt-4 lg-mt-2 mb-50px lg-mb-0">
<div class="col-lg-6 position-relative md-mb-70px">
<div class="w-75 overflow-hidden position-relative xs-w-80 border-radius-4px" data-anime="{ &quot;effect&quot;: &quot;slide&quot;, &quot;direction&quot;: &quot;lr&quot;, &quot;color&quot;: &quot;#dd6531&quot;, &quot;duration&quot;: 1000, &quot;delay&quot;: 0 }">
<img class="w-100" src="images/demo-consulting-01.jpg" alt>
</div>
<div class="border-radius-4px position-absolute right-minus-15px md-right-15px bottom-minus-50px w-55 md-w-50 overflow-hidden" data-bottom-top="transform: translateY(50px)" data-top-bottom="transform: translateY(-50px)" data-anime="{ &quot;effect&quot;: &quot;slide&quot;, &quot;direction&quot;: &quot;rl&quot;, &quot;color&quot;: &quot;#292d36&quot;, &quot;duration&quot;: 1000, &quot;delay&quot;: 500 }">
<img class="w-100" src="images/demo-consulting-02.jpg" alt>
</div>
</div>
<div class="col-lg-5 offset-lg-1 md-mt-30px" data-anime="{ &quot;opacity&quot;: [0, 1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutCirc&quot; }">
<span class="fs-20 mb-15px text-dark-gray fw-600 d-inline-block">Company's vision</span>
<h2 class="alt-font fw-600 text-dark-gray ls-minus-2px mb-25px">Scalable business for startups.</h2>
<p class="w-80 lg-w-100 mb-35px sm-mb-25px">Lorem ipsum dolor sit amet consectetur elit adipiscing elit do eiusmod tempor incididunt ut labore et dolore magna ut enim.</p>
<div class="d-inline-block">
<a href="demo-consulting-company.html" class="btn btn-medium btn-dark-gray btn-box-shadow me-25px btn-round-edge">About company</a>
<a href="demo-consulting-process.html" class="btn btn-link btn-large text-dark-gray xs-mt-15px xs-mb-15px">How we work</a>
</div>
<div class="row align-items-center mt-50px sm-mt-40px">
<div class="col-auto col-lg-4 border-end border-color-extra-medium-gray text-center"><h1 class="text-dark-gray fw-700 mb-0">4.9</h1></div>
<div class="col-7 ms-15px md-ms-0">
<div class="review-star-icon fs-18">
<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="text-dark-gray d-block fw-500 fs-18">2,488 Genuine rating</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="bg-gradient-very-light-gray ps-7 pe-7 xxl-ps-3 xxl-pe-3 xs-px-0">
<div class="container-fluid">
<div class="row justify-content-center mb-3">
<div class="col-xl-5 col-lg-7 col-md-8 text-center" data-anime="{ &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="fw-600 ls-1px fs-16 alt-font d-inline-block text-uppercase mb-5px text-base-color">Innovative solutions</span>
<h2 class="alt-font text-dark-gray fw-600 ls-minus-2px">Consulting services</h2>
</div>
</div>
<div class="row row-cols-1 row-cols-xl-4 row-cols-md-2 row-cols-sm-2 justify-content-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateX&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 200, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col interactive-banner-style-05 lg-mb-30px position-relative z-index-1">
<div class="atropos" data-atropos data-atropos-perspective="1450">
<a href="demo-consulting-services-details.html" class="position-absolute z-index-1 top-0px left-0px h-100 w-100"></a>
<div class="atropos-scale">
<div class="atropos-rotate">
<div class="atropos-inner">
<figure class="m-0 hover-box border-radius-4px overflow-hidden position-relative" data-atropos-offset="3">
<img class="w-100" src="images/demo-consulting-03.jpg" alt />
<figcaption class="d-flex flex-column align-items-start justify-content-center position-absolute left-0px top-0px w-100 h-100 z-index-1 p-15 xl-p-12 last-paragraph-no-margin">
<div class="mb-auto bg-base-color fw-500 text-white text-uppercase border-radius-30px ps-20px pe-20px fs-13">Flexible</div>
<span class="alt-font text-white fw-500 fs-26 sm-lh-26 xs-lh-28 sm-mb-5px">Audit assurance</span>
<p class="text-white opacity-6 fs-18">Innovative solutions</p>
<div class="position-absolute left-0px top-0px w-100 h-100 bg-gradient-gray-light-dark-transparent z-index-minus-1 opacity-9"></div>
<div class="box-overlay bg-gradient-gray-light-dark-transparent z-index-minus-1"></div>
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</div>
<div class="col interactive-banner-style-05 lg-mb-30px position-relative z-index-1">
<div class="atropos" data-atropos data-atropos-perspective="1450">
<a href="demo-consulting-services-details.html" class="position-absolute z-index-1 top-0px left-0px h-100 w-100"></a>
<div class="atropos-scale">
<div class="atropos-rotate">
<div class="atropos-inner">
<figure class="m-0 hover-box border-radius-4px overflow-hidden position-relative" data-atropos-offset="3">
<img class="w-100" src="images/demo-consulting-04.jpg" alt />
<figcaption class="d-flex flex-column align-items-start justify-content-center position-absolute left-0px top-0px w-100 h-100 z-index-1 p-15 xl-p-12 last-paragraph-no-margin">
<div class="mb-auto bg-base-color fw-500 text-white text-uppercase border-radius-30px ps-20px pe-20px fs-13">Diversity</div>
<span class="alt-font text-white fw-500 fs-26 sm-lh-26 xs-lh-28">Financial advisory</span>
<p class="text-white opacity-6 fs-18">Business consalting</p>
<div class="position-absolute left-0px top-0px w-100 h-100 bg-gradient-gray-light-dark-transparent z-index-minus-1 opacity-9"></div>
<div class="box-overlay bg-gradient-gray-light-dark-transparent z-index-minus-1"></div>
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</div>
<div class="col interactive-banner-style-05 sm-mb-30px position-relative z-index-1">
<div class="atropos" data-atropos data-atropos-perspective="1450">
<a href="demo-consulting-services-details.html" class="position-absolute z-index-1 top-0px left-0px h-100 w-100"></a>
<div class="atropos-scale">
<div class="atropos-rotate">
<div class="atropos-inner">
<figure class="m-0 hover-box border-radius-4px overflow-hidden position-relative" data-atropos-offset="3">
<img class="w-100" src="images/demo-consulting-05.jpg" alt />
<figcaption class="d-flex flex-column align-items-start justify-content-center position-absolute left-0px top-0px w-100 h-100 z-index-1 p-15 xl-p-12 last-paragraph-no-margin">
<div class="mb-auto bg-base-color fw-500 text-white text-uppercase border-radius-30px ps-20px pe-20px fs-13">Inclusion</div>
<span class="alt-font text-white fw-500 fs-26 sm-lh-26 xs-lh-28">Business analytics</span>
<p class="text-white opacity-6 fs-18">Driving sustainable</p>
<div class="position-absolute left-0px top-0px w-100 h-100 bg-gradient-gray-light-dark-transparent z-index-minus-1 opacity-9"></div>
<div class="box-overlay bg-gradient-gray-light-dark-transparent z-index-minus-1"></div>
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</div>
<div class="col interactive-banner-style-05 position-relative z-index-1">
<div class="atropos" data-atropos data-atropos-perspective="1450">
<a href="demo-consulting-services-details.html" class="position-absolute z-index-1 top-0px left-0px h-100 w-100"></a>
<div class="atropos-scale">
<div class="atropos-rotate">
<div class="atropos-inner">
<figure class="m-0 hover-box border-radius-4px overflow-hidden position-relative" data-atropos-offset="3">
<img class="w-100" src="images/demo-consulting-06.jpg" alt />
<figcaption class="d-flex flex-column align-items-start justify-content-center position-absolute left-0px top-0px w-100 h-100 z-index-1 p-15 xl-p-12 last-paragraph-no-margin">
<div class="mb-auto bg-base-color fw-500 text-white text-uppercase border-radius-30px ps-20px pe-20px fs-13">Strategy</div>
<span class="alt-font text-white fw-500 fs-26 sm-lh-26 xs-lh-28">Middle marketing</span>
<p class="text-white opacity-6 fs-18">Inclusive growth</p>
<div class="position-absolute left-0px top-0px w-100 h-100 bg-gradient-gray-light-dark-transparent z-index-minus-1 opacity-9"></div>
<div class="box-overlay bg-gradient-gray-light-dark-transparent z-index-minus-1"></div>
</figcaption>
</figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="pt-0 position-relative">
<div id="particles-02" data-particle="true" data-particle-options="{&quot;particles&quot;: {&quot;number&quot;: {&quot;value&quot;: 5,&quot;density&quot;: {&quot;enable&quot;: true,&quot;value_area&quot;: 1000}},&quot;color&quot;:{&quot;value&quot;:[&quot;#b7b9be&quot;, &quot;#dd6531&quot;]},&quot;shape&quot;: {&quot;type&quot;: &quot;circle&quot;,&quot;stroke&quot;:{&quot;width&quot;:0,&quot;color&quot;:&quot;#000000&quot;}},&quot;opacity&quot;: {&quot;value&quot;: 0.5,&quot;random&quot;: false,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;speed&quot;: 1,&quot;sync&quot;: false}},&quot;size&quot;: {&quot;value&quot;: 8,&quot;random&quot;: true,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;sync&quot;: true}},&quot;move&quot;: {&quot;enable&quot;: true,&quot;speed&quot;:2,&quot;direction&quot;: &quot;right&quot;,&quot;random&quot;: false,&quot;straight&quot;: false}},&quot;interactivity&quot;: {&quot;detect_on&quot;: &quot;canvas&quot;,&quot;events&quot;: {&quot;onhover&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;repulse&quot;},&quot;onclick&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;push&quot;},&quot;resize&quot;: true}},&quot;retina_detect&quot;: false}" class="position-absolute h-100 top-0 left-0 z-index-minus-1"></div>
<div class="container">
<div class="row">
<div class="col-lg-5 md-mb-50px sm-mb-30px">
<h2 class="alt-font fw-600 text-dark-gray ls-minus-2px">Highly flexible pricing options.</h2>
<p class="w-80 lg-w-100 mb-30px sm-mb-25px">Lorem ipsum dolor sit amet consectetur adipiscing elit do eiusmod tempor.</p>
<a href="demo-consulting.html#" class="btn btn-small btn-dark-gray btn-box-shadow btn-round-edge">All pricing plans</a>
</div>
<div class="col-xl-5 col-lg-6 offset-xl-2 offset-lg-1" data-anime="{&quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:200, &quot;staggervalue&quot;: 200, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="accordion accordion-style-02" id="accordion-style-02" data-active-icon="icon-feather-minus" data-inactive-icon="icon-feather-plus">
<div class="accordion-item active-accordion">
<div class="accordion-header border-bottom border-color-extra-medium-gray">
<a href="demo-consulting.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-01" aria-expanded="true" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray">
<i class="feather icon-feather-minus"></i><span class="fw-600 fs-20">Unique and bold website design</span>
</div>
</a>
</div>
<div id="accordion-style-02-01" class="accordion-collapse collapse show" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-light-medium-gray">
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod tempor incididunt.</p>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header border-bottom border-color-extra-medium-gray">
<a href="demo-consulting.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-02" aria-expanded="false" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray">
<i class="feather icon-feather-plus"></i><span class="fw-600 fs-20">We're ready to start now</span>
</div>
</a>
</div>
<div id="accordion-style-02-02" class="accordion-collapse collapse" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-light-medium-gray">
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod tempor incididunt.</p>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header border-bottom border-color-transparent">
<a href="demo-consulting.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-03" aria-expanded="false" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray">
<i class="feather icon-feather-plus"></i><span class="fw-600 fs-20">Something for everyone</span>
</div>
</a>
</div>
<div id="accordion-style-02-03" class="accordion-collapse collapse" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-transparent">
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod tempor incididunt.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row align-items-center justify-content-center pricing-table-style-06 mt-8 mb-8" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateX&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-lg-4 col-md-8 md-mb-30px">
<div class="bg-white box-shadow-quadruple-large border border-radius-6px p-15 ps-18 pe-18 xl-p-13 text-center">
<span class="fs-26 lh-30 ls-minus-05px d-block text-dark-gray fw-600">Standard</span>
<span class="fs-18 mb-25px d-inline-block">Unlimited users</span>
<div class="row align-items-center">
<div class="col-sm-5 pe-sm-0">
<h2 class="text-dark-gray mb-0 fw-700 ls-minus-2px text-center text-sm-end"><sup class="fs-30">$</sup>20</h2>
</div>
<div class="col-lg-7 col-sm-5 text-center text-sm-start last-paragraph-no-margin fs-15 lh-24">
<p>per user/month billed annually</p>
</div>
</div>
<ul class="p-0 mt-20px mb-30px list-style-01 text-start lh-normal">
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Marketing strategy</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px d-flex"><i class="feather icon-feather-x fs-20 text-red me-10px"></i>Competitive work analysis</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px d-flex"><i class="feather icon-feather-x fs-20 text-red me-10px"></i>Social media share audit</li>
</ul>
<div class="pricing-footer w-100">
<a href="demo-consulting.html#" class="btn btn-small btn-dark-gray btn-box-shadow btn-round-edge border-1 w-100">Choose package</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8 md-mb-30px">
<div class="bg-white box-shadow-quadruple-large border border-radius-6px p-15 ps-18 pe-18 xl-p-13 text-center">
<span class="fs-26 lh-30 ls-minus-05px d-block text-dark-gray fw-600">Business</span>
<span class="fs-18 mb-25px d-inline-block">Unlimited users</span>
<div class="row align-items-center">
<div class="col-sm-5 pe-sm-0">
<h2 class="text-dark-gray mb-0 fw-700 ls-minus-2px text-center text-sm-end"><sup class="fs-30">$</sup>24</h2>
</div>
<div class="col-lg-7 col-sm-5 text-center text-sm-start last-paragraph-no-margin fs-15 lh-24">
<p>per user/month billed annually</p>
</div>
</div>
<ul class="p-0 mt-20px mb-30px list-style-01 text-start lh-normal">
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Marketing strategy</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Competitive work analysis</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px d-flex"><i class="feather icon-feather-x fs-20 text-red me-10px"></i>Social media share audit</li>
</ul>
<div class="pricing-footer w-100">
<a href="demo-consulting.html#" class="btn btn-small btn-dark-gray btn-box-shadow btn-round-edge w-100">Choose package</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8">
<div class="bg-white box-shadow-quadruple-large border border-radius-6px p-15 ps-18 pe-18 xl-p-13 text-center">
<span class="fs-26 lh-30 ls-minus-05px d-block text-dark-gray fw-600">Ultimate</span>
<span class="fs-18 mb-25px d-inline-block">Unlimited users</span>
<div class="row align-items-center">
<div class="col-sm-5 pe-sm-0">
<h2 class="text-dark-gray mb-0 fw-700 ls-minus-2px text-center text-sm-end"><sup class="fs-30">$</sup>30</h2>
</div>
<div class="col-lg-7 col-sm-5 text-center text-sm-start last-paragraph-no-margin fs-15 lh-24">
<p>per user/month billed annually</p>
</div>
</div>
<ul class="p-0 mt-20px mb-30px list-style-01 text-start lh-normal">
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Marketing strategy</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Competitive work analysis</li>
<li class="border-color-extra-medium-gray pt-20px pb-20px text-dark-gray fw-500 d-flex"><i class="feather icon-feather-check fs-20 text-green me-10px"></i>Social media share audit</li>
</ul>
<div class="pricing-footer w-100">
<a href="demo-consulting.html#" class="btn btn-small btn-dark-gray btn-box-shadow btn-round-edge border-1 w-100">Choose package</a>
</div>
</div>
</div>
</div>
<div class="row row-cols-1 row-cols-xl-4 row-cols-md-3 row-cols-sm-2 justify-content-center align-items-center" 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;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col icon-with-text-style-08 sm-mb-25px text-center text-sm-start">
<div class="feature-box feature-box-left-icon-middle d-inline-flex align-middle">
<div class="feature-box-icon me-10px">
<i class="bi bi-calendar-check fs-24"></i>
</div>
<div class="feature-box-content">
<span class="alt-font fs-18 md-fs-16 fw-600 text-dark-gray">Get 30 day free trial</span>
</div>
</div>
</div>
<div class="col icon-with-text-style-08 sm-mb-25px text-center text-sm-start">
<div class="feature-box feature-box-left-icon-middle d-inline-flex align-middle">
<div class="feature-box-icon me-10px">
<i class="bi bi-wallet2 fs-24"></i>
</div>
<div class="feature-box-content">
<span class="alt-font fs-18 md-fs-16 fw-600 text-dark-gray">No any hidden fees pay</span>
</div>
</div>
</div>
<div class="col icon-with-text-style-08 text-center text-sm-start">
<div class="feature-box feature-box-left-icon-middle d-inline-flex align-middle">
<div class="feature-box-icon me-10px">
<i class="bi bi-clock fs-24"></i>
</div>
<div class="feature-box-content">
<span class="alt-font fs-18 md-fs-16 fw-600 text-dark-gray">You can cancel anytime</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="position-relative overflow-hidden py-0">
<div class="skrollr-parallax mx-auto pt-7 pb-7 md-pt-12 md-pb-12" data-bottom-top="width: 63%" data-center-top="width: 100%;" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-consulting-parallax.jpg')">
<div class="opacity-extra-medium bg-gradient-black-dark-orange"></div>
<div class="container">
<div class="row justify-content-center align-items-center mb-5">
<div class="col-xl-9 col-lg-10 text-center position-relative last-paragraph-no-margin parallax-scrolling-style-2">
<a href="https://www.youtube.com/watch?v=cfXHhfNy7tU" class="position-relative d-inline-block text-center rounded-circle border border-3 border-color-transparent-white-very-light video-icon-box video-icon-extra-large popup-youtube mb-5">
<span>
<span class="video-icon">
<i class="fa-solid fa-play text-white"></i>
</span>
</span>
</a>
<span class="opacity-6 ls-2px text-uppercase alt-font text-white d-block mb-2 fw-500">Supporting your business goal</span>
<h1 class="text-white fw-500 alt-font ls-minus-2px text-shadow-double-large">Some of the worldwide clients we've helped.</h1>
</div>
</div>
<div class="row row-cols-1 row-cols-lg-4 row-cols-sm-2 text-center justify-content-center clients-style-06 position-relative">
<div class="col md-mb-45px">
<div class="client-box">
<a href="demo-consulting.html#"><img src="images/logo-envato-white.svg" class="h-45px" alt></a>
</div>
</div>
<div class="col md-mb-45px">
<div class="client-box">
<a href="demo-consulting.html#"><img src="images/logo-less-white.svg" class="h-45px" alt></a>
</div>
</div>
<div class="col xs-mb-45px">
<div class="client-box">
<a href="demo-consulting.html#"><img src="images/logo-pingdom-white.svg" class="h-45px" alt></a>
</div>
</div>
<div class="col">
<div class="client-box">
<a href="demo-consulting.html#"><img src="images/logo-google-white.svg" class="h-45px" alt></a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="position-relative">
<div id="particles-03" data-particle="true" data-particle-options="{&quot;particles&quot;: {&quot;number&quot;: {&quot;value&quot;: 5,&quot;density&quot;: {&quot;enable&quot;: true,&quot;value_area&quot;: 1000}},&quot;color&quot;:{&quot;value&quot;:[&quot;#b7b9be&quot;, &quot;#dd6531&quot;]},&quot;shape&quot;: {&quot;type&quot;: &quot;circle&quot;,&quot;stroke&quot;:{&quot;width&quot;:0,&quot;color&quot;:&quot;#000000&quot;}},&quot;opacity&quot;: {&quot;value&quot;: 0.5,&quot;random&quot;: false,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;speed&quot;: 1,&quot;sync&quot;: false}},&quot;size&quot;: {&quot;value&quot;: 8,&quot;random&quot;: true,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;sync&quot;: true}},&quot;move&quot;: {&quot;enable&quot;: true,&quot;speed&quot;:2,&quot;direction&quot;: &quot;right&quot;,&quot;random&quot;: false,&quot;straight&quot;: false}},&quot;interactivity&quot;: {&quot;detect_on&quot;: &quot;canvas&quot;,&quot;events&quot;: {&quot;onhover&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;repulse&quot;},&quot;onclick&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;push&quot;},&quot;resize&quot;: true}},&quot;retina_detect&quot;: false}" class="position-absolute h-100 top-0 left-0 z-index-minus-1"></div>
<div class="container">
<div class="row justify-content-center mb-3">
<div class="col-lg-7 text-center" data-anime="{ &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="fw-600 ls-1px fs-16 alt-font mb-5px d-inline-block text-uppercase text-base-color">Meet our people</span>
<h2 class="alt-font text-dark-gray fw-600 ls-minus-2px">Leading experts</h2>
</div>
</div>
<div class="row row-cols-1 row-cols-lg-4 row-cols-sm-2 justify-content-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col text-center team-style-05 md-mb-40px">
<div class="position-relative border-radius-4px overflow-hidden mb-30px last-paragraph-no-margin">
<img src="images/team-08.jpg" alt />
<div class="w-100 h-100 d-flex flex-column justify-content-center align-items-center p-40px lg-p-30px team-content bg-gradient-dark-orange-transparent">
<div class="social-icon fs-20">
<a href="https://www.facebook.com/" target="_blank" class="text-white"><i class="fa-brands fa-facebook-f"></i></a>
<a href="http://www.dribbble.com" target="_blank" class="text-white"><i class="fa-brands fa-dribbble"></i></a>
<a href="https://www.twitter.com/" target="_blank" class="text-white"><i class="fa-brands fa-twitter"></i></a>
</div>
</div>
</div>
<div class="alt-font fw-600 text-dark-gray lh-22 fs-18">Bryan Jonhson</div>
<span>Director</span>
</div>
<div class="col text-center team-style-05 md-mb-40px">
<div class="position-relative border-radius-4px overflow-hidden mb-30px last-paragraph-no-margin">
<img src="images/team-09.jpg" alt />
<div class="w-100 h-100 d-flex flex-column justify-content-center align-items-center p-40px team-content bg-gradient-dark-orange-transparent">
<div class="social-icon fs-20">
<a href="https://www.facebook.com/" target="_blank" class="text-white"><i class="fa-brands fa-facebook-f"></i></a>
<a href="http://www.dribbble.com" target="_blank" class="text-white"><i class="fa-brands fa-dribbble"></i></a>
<a href="https://www.twitter.com/" target="_blank" class="text-white"><i class="fa-brands fa-twitter"></i></a>
</div>
</div>
</div>
<div class="alt-font fw-600 text-dark-gray lh-22 fs-18">Jeremy Dupont</div>
<span>Specialist</span>
</div>
<div class="col text-center team-style-05 xs-mb-40px">
<div class="position-relative border-radius-4px overflow-hidden mb-30px last-paragraph-no-margin">
<img src="images/team-10.jpg" alt />
<div class="w-100 h-100 d-flex flex-column justify-content-center align-items-center p-40px team-content bg-gradient-dark-orange-transparent">
<div class="social-icon fs-20">
<a href="https://www.facebook.com/" target="_blank" class="text-white"><i class="fa-brands fa-facebook-f"></i></a>
<a href="http://www.dribbble.com" target="_blank" class="text-white"><i class="fa-brands fa-dribbble"></i></a>
<a href="https://www.twitter.com/" target="_blank" class="text-white"><i class="fa-brands fa-twitter"></i></a>
</div>
</div>
</div>
<div class="alt-font fw-600 text-dark-gray lh-22 fs-18">Matthew Taylor</div>
<span>Manager</span>
</div>
<div class="col text-center team-style-05">
<div class="position-relative border-radius-4px overflow-hidden mb-30px last-paragraph-no-margin">
<img src="images/team-11.jpg" alt />
<div class="w-100 h-100 d-flex flex-column justify-content-center align-items-center p-40px team-content bg-gradient-dark-orange-transparent">
<div class="social-icon fs-20">
<a href="https://www.facebook.com/" target="_blank" class="text-white"><i class="fa-brands fa-facebook-f"></i></a>
<a href="http://www.dribbble.com" target="_blank" class="text-white"><i class="fa-brands fa-dribbble"></i></a>
<a href="https://www.twitter.com/" target="_blank" class="text-white"><i class="fa-brands fa-twitter"></i></a>
</div>
</div>
</div>
<div class="alt-font fw-600 text-dark-gray lh-22 fs-18">Johncy Parker</div>
<span>Consultant</span>
</div>
</div>
</div>
</section>
<section class="bg-very-light-gray">
<div class="container">
<div class="row justify-content-center mb-2">
<div class="col-lg-7 text-center" data-anime="{ &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="fw-600 ls-1px fs-16 alt-font d-inline-block text-uppercase text-base-color">Business news</span>
<h2 class="alt-font text-dark-gray fw-600 ls-minus-2px">Latest news</h2>
</div>
</div>
<div class="row">
<div class="col-12 p-md-0">
<ul class="blog-grid blog-wrapper grid-loading grid grid-3col xl-grid-3col lg-grid-3col md-grid-2col sm-grid-2col xs-grid-1col gutter-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;:100, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<li class="grid-sizer"></li>
<li class="grid-item">
<div class="card border-0 border-radius-4px box-shadow-quadruple-large">
<div class="blog-image">
<a href="demo-consulting-blog-single-modern.html" class="d-block"><img src="images/demo-consulting-blog-01.jpg" alt /></a>
</div>
<div class="card-body p-13 md-p-11">
<a href="demo-consulting-blog-single-modern.html" class="card-title mb-15px alt-font fw-600 fs-20 text-dark-gray d-inline-block">Build up healthy habits and strong peaceful life</a>
<p>Lorem ipsum has been industry standard dummy text ever...</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-16">
<div class="me-auto">
<span class="blog-date d-inline-block">30 August 2021</span>
<div class="d-inline-block author-name">By <a href="demo-consulting-news.html" class="text-dark-gray text-decoration-line-bottom fw-600">Den viliamson</a></div>
</div>
<div class="like-count fs-15 fw-600">
<a href="demo-consulting-blog-single-modern.html"><i class="fa-regular fa-heart text-base-color"></i><span class="text-dark-gray align-middle">65</span></a>
</div>
</div>
</div>
</div>
</li>
<li class="grid-item">
<div class="card border-0 border-radius-4px box-shadow-quadruple-large">
<div class="blog-image">
<a href="demo-consulting-blog-single-modern.html" class="d-block"><img src="images/demo-consulting-blog-03.jpg" alt /></a>
</div>
<div class="card-body p-13 md-p-11">
<a href="demo-consulting-blog-single-modern.html" class="card-title mb-15px alt-font fw-600 fs-20 text-dark-gray d-inline-block">How to bring the season into your great work</a>
<p>Lorem ipsum has been industry standard dummy text ever...</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-16">
<div class="me-auto">
<span class="blog-date d-inline-block">28 August 2021</span>
<div class="d-inline-block author-name">By <a href="demo-consulting-news.html" class="text-dark-gray text-decoration-line-bottom fw-600">Hugh macleod</a></div>
</div>
<div class="like-count fs-15 fw-600">
<a href="demo-consulting-blog-single-modern.html"><i class="fa-regular fa-heart text-base-color"></i><span class="text-dark-gray align-middle">25</span></a>
</div>
</div>
</div>
</div>
</li>
<li class="grid-item">
<div class="card border-0 border-radius-4px box-shadow-quadruple-large">
<div class="blog-image">
<a href="demo-consulting-blog-single-modern.html" class="d-block"><img src="images/demo-consulting-blog-02.jpg" alt /></a>
</div>
<div class="card-body p-13 md-p-11">
<a href="demo-consulting-blog-single-modern.html" class="card-title mb-15px alt-font fw-600 fs-20 text-dark-gray d-inline-block">Be the strong willed one the public relationship</a>
<p>Lorem ipsum has been industry standard dummy text ever...</p>
<div class="author d-flex justify-content-center align-items-center position-relative overflow-hidden fs-16">
<div class="me-auto">
<span class="blog-date d-inline-block">26 August 2021</span>
<div class="d-inline-block author-name">By <a href="demo-consulting-news.html" class="text-dark-gray text-decoration-line-bottom fw-600">Walton smith</a></div>
</div>
<div class="like-count fs-15 fw-600">
<a href="demo-consulting-blog-single-modern.html"><i class="fa-regular fa-heart text-base-color"></i><span class="text-dark-gray align-middle">30</span></a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<section class="pt-4 pb-4 cover-background" style="background-image:url('images/demo-consulting-footer-bg.jpg');">
<div class="opacity-extra-medium bg-gradient-black-dark-orange"></div>
<div class="container position-relative">
<div class="row align-items-center justify-content-center text-start text-sm-center text-lg-start">
<div class="col-xl-5 col-lg-6 col-md-7 md-mb-25px">
<h2 class="alt-font text-white fw-500 mb-0 cd-headline zoom fancy-text-style-4 text-shadow-double-large ls-minus-1px">Let's discuss your now
<span data-fancy-text="{ &quot;effect&quot;: &quot;rotate&quot;, &quot;string&quot;: [&quot;consulting!&quot;, &quot;business!&quot;, &quot;innovative!&quot;] }"></span>
</h2>
</div>
<div class="col-xl-5 col-lg-6 col-md-8 col-sm-10 offset-xl-1 icon-with-text-style-08">
<div class="feature-box feature-box-left-icon-middle text-start">
<div class="feature-box-icon feature-box-icon-rounded w-110px h-110px xs-w-80px xs-h-80px rounded-circle bg-base-color me-20px xs-me-15px">
<i class="line-icon-Handshake icon-extra-large text-white lh-100"></i>
</div>
<div class="feature-box-content last-paragraph-no-margin xs-mt-15px xs-mb-15px">
<span class="fs-24 lh-32 xs-fs-22 xs-lh-32 text-white">Looking for collaboration? <a href="cdn-cgi/l/email-protection.html#533a3d353c132a3c2621373c3e323a3d7d303c3e" class="text-decoration-line-bottom text-white fw-500"><span class="__cf_email__" data-cfemail="a0c9cec6cfe0d9cfd5d2c4cfcdc1c9ce8ec3cfcd">[email&#160;protected]</span></a></span>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="footer-light p-0 position-relative">
<div id="particles-04" class="position-absolute h-100 top-0 left-0 z-index-minus-1 w-100" data-particle="true" data-particle-options="{&quot;particles&quot;: {&quot;number&quot;: {&quot;value&quot;: 5,&quot;density&quot;: {&quot;enable&quot;: true,&quot;value_area&quot;: 1000}},&quot;color&quot;:{&quot;value&quot;:[&quot;#b7b9be&quot;, &quot;#dd6531&quot;]},&quot;shape&quot;: {&quot;type&quot;: &quot;circle&quot;,&quot;stroke&quot;:{&quot;width&quot;:0,&quot;color&quot;:&quot;#000000&quot;}},&quot;opacity&quot;: {&quot;value&quot;: 0.5,&quot;random&quot;: false,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;speed&quot;: 1,&quot;sync&quot;: false}},&quot;size&quot;: {&quot;value&quot;: 8,&quot;random&quot;: true,&quot;anim&quot;: {&quot;enable&quot;: false,&quot;sync&quot;: true}},&quot;move&quot;: {&quot;enable&quot;: true,&quot;speed&quot;:2,&quot;direction&quot;: &quot;right&quot;,&quot;random&quot;: false,&quot;straight&quot;: false}},&quot;interactivity&quot;: {&quot;detect_on&quot;: &quot;canvas&quot;,&quot;events&quot;: {&quot;onhover&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;repulse&quot;},&quot;onclick&quot;: {&quot;enable&quot;: false,&quot;mode&quot;: &quot;push&quot;},&quot;resize&quot;: true}},&quot;retina_detect&quot;: false}"></div>
<div class="container">
<div class="row justify-content-center pt-7 sm-pt-50px">
<div class="col-7 col-lg-3 col-md-12 col-sm-6 text-md-center text-lg-start md-mb-30px">
<a href="demo-consulting.html" class="footer-logo mb-15px md-mb-20px d-inline-block"><img src="images/demo-consulting-logo-black.png" data-at2x="images/demo-consulting-logo-black@2x.png" alt></a>
<p class="mb-20px">Lorem ipsum dolor consectetur adipiscing eiusmod tempor.</p>
<div class="elements-social social-icon-style-02">
<ul class="medium-icon dark icon-with-animation">
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li><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-5 col-lg-2 offset-xl-1 col-md-3 col-sm-6 md-mb-30px">
<span class="alt-font d-block text-dark-gray fw-600 mb-10px fs-19">Company</span>
<ul>
<li><a href="demo-consulting-company.html">Company</a></li>
<li><a href="demo-consulting-services.html">Services</a></li>
<li><a href="demo-consulting-process.html">Process</a></li>
<li><a href="demo-consulting-contact.html">Contact</a></li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 xs-mb-30px">
<span class="alt-font d-block text-dark-gray fw-600 mb-10px fs-19">Get in touch</span>
<p class="mb-15px w-75 lg-w-85 sm-w-100">Broadway, 24th Floor New York, NY, 10013</p>
<p class="m-0"><span class="fw-600"><i class="feather icon-feather-phone-call text-dark-gray icon-small me-10px"></i></span><a href="tel:1800222000">1-800-222-000</a></p>
<p class="m-0"><span class="fw-600"><i class="feather icon-feather-mail text-dark-gray icon-small me-10px"></i></span><a href="cdn-cgi/l/email-protection.html#c0a9aea6af80a4afada1a9aeeea3afad"><span class="__cf_email__" data-cfemail="97fef9f1f8d7f3f8faf6fef9b9f4f8fa">[email&#160;protected]</span></a></p>
</div>
<div class="col-xl-3 col-lg-4 col-md-5 col-sm-6">
<span class="alt-font d-block text-dark-gray fw-600 mb-10px fs-19">Newsletter</span>
<p class="sm-mb-20px">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 w-100">
<input class="bg-transparent border-color-extra-medium-gray w-100 form-control required" type="email" name="email" placeholder="Enter email address...">
<input type="hidden" name="redirect" value>
<button class="btn submit" aria-label="submit"><i class="icon feather icon-feather-mail icon-small text-base-color"></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-5 sm-pt-30px">
<div class="col-12">
<div class="divider-style-03 divider-style-03-01 border-color-extra-medium-gray"></div>
</div>
<div class="col-lg-6 pt-25px pb-25px md-pt-0 fs-16 last-paragraph-no-margin order-2 order-lg-1 text-center text-lg-start"><p>&copy; 2024 Crafto is Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-decoration-line-bottom text-dark-gray fw-500">ThemeZaa</a></p></div>
<div class="col-lg-6 pt-25px pb-25px md-pb-5px fs-16 order-1 order-lg-2 text-center text-lg-end">
<ul class="footer-navbar md-lh-normal">
<li class="nav-item"><a href="demo-consulting.html#" class="nav-link">Privacy policy</a></li>
<li class="nav-item"><a href="demo-consulting.html#" class="nav-link">Terms and conditions</a></li>
<li class="nav-item"><a href="demo-consulting.html#" class="nav-link">Copyright</a></li>
</ul>
</div>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-consulting.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>
<script data-cfasync="false" src="cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><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>