@extends('vuexy-website-layout-porto::layouts.porto.master')

@section('vendor-style')
    @vite([
        'vendor/koneko/laravel-vuexy-website-layout-porto/resources/assets/css/demos/demo-business-consulting-4.css',
        'vendor/koneko/laravel-vuexy-website-layout-porto/resources/assets/css/skins/skin-business-consulting-4.css',
    ])
@endsection

@section('header')
    <header id="header" class="header-transparent" data-plugin-options="{'stickyEnabled': true, 'stickyEnableOnBoxed': true, 'stickyEnableOnMobile': false, 'stickyChangeLogo': false, 'stickyStartAt': 53, 'stickySetTop': '-53px'}">
        <div class="header-body border-top-0 h-auto box-shadow-none">
            <div class="header-top header-top-borders">
                <div class="container h-100">
                    <div class="header-row h-100">
                        <div class="header-column justify-content-start">
                            <div class="header-row">
                                <nav class="header-nav-top">
                                    <ul class="nav nav-pills">
                                        <li class="nav-item py-2 d-none d-sm-inline-flex pe-2">
                                            <span class="ps-0 font-weight-semibold text-color-default text-2-5">1234 Street Name, City Name</span>
                                        </li>
                                        <li class="nav-item py-2 pe-2">
                                            <a href="tel:123-456-7890" class="text-color-default text-2-5 text-color-hover-primary font-weight-semibold">123-456-7890</a>
                                        </li>
                                        <li class="nav-item py-2 d-none d-md-inline-flex">
                                            <a href="mailto:mail@domain.com" class="text-color-default text-2-5 text-color-hover-primary font-weight-semibold">mail@domain.com</a>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                        <div class="header-column justify-content-end">
                            <div class="header-row">
                                <nav class="header-nav-top">
                                    <ul class="nav nav-pills p-relative bottom-2">
                                        <li class="nav-item py-2 d-none d-lg-inline-flex">
                                            <a href="http://www.facebook.com/" target="_blank" title="Facebook" class="text-color-dark text-color-hover-primary text-3 anim-hover-translate-top-5px transition-2ms"><i class="fab fa-facebook-f text-3 p-relative top-1"></i></a>
                                        </li>
                                        <li class="nav-item py-2 d-none d-lg-inline-flex">
                                            <a href="http://www.x.com/" target="_blank" title="X" class="text-color-dark text-color-hover-primary text-3 anim-hover-translate-top-5px transition-2ms"><i class="fab fa-x-twitter text-3 p-relative top-1"></i></a>
                                        </li>
                                        <li class="nav-item py-2 d-none d-lg-inline-flex">
                                            <a href="http://www.instagram.com/" target="_blank" title="Instagram" class="text-color-dark text-color-hover-primary text-3 anim-hover-translate-top-5px transition-2ms"><i class="fab fa-instagram text-3 p-relative top-1"></i></a>
                                        </li>
                                        <li class="nav-item py-2 pe-0 d-none d-lg-inline-flex">
                                            <a href="http://www.linkedin.com/" target="_blank" title="Linkedin" class="text-color-dark text-color-hover-primary text-3 anim-hover-translate-top-5px transition-2ms"><i class="fab fa-linkedin-in text-3 p-relative top-1"></i></a>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="header-container header-container-height-sm container p-static">
                <div class="header-row">
                    <div class="header-column">
                        <div class="header-row">
                            <div class="header-logo">
                                <a href="index.html">
                                    <img alt="Porto" width="123" height="32" src="img/demos/business-consulting-4/logo.png">
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="header-column justify-content-end">
                        <div class="header-row">
                            <div class="header-nav header-nav-links">
                                <div class="header-nav-main header-nav-main-square header-nav-main-dropdown-no-borders header-nav-main-dropdown-border-radius header-nav-main-text-capitalize header-nav-main-text-size-4 header-nav-main-arrows header-nav-main-full-width-mega-menu header-nav-main-mega-menu-bg-hover header-nav-main-effect-2">
                                    <nav class="collapse">
                                        <ul class="nav nav-pills" id="mainNav">
                                            <li class="dropdown">
                                                <a href="demo-business-consulting-4.html" class="nav-link active">
                                                    Home
                                                </a>
                                            </li>
                                            <li class="dropdown dropdown-mega">
                                                <a class="dropdown-item dropdown-toggle" href="elements.html">

                                                    Elements

                                                </a>
                                                <ul class="dropdown-menu border-top border-top-light mt-0">

                                                    <li>
                                                        <div class="dropdown-mega-content container px-2">
                                                            <div class="row px-1">
                                                                <div class="col-lg-3">
                                                                    <span class="dropdown-mega-sub-title">Elements 1</span>
                                                                    <ul class="dropdown-mega-sub-nav">
                                                                        <li><a class="dropdown-item" href="elements-accordions.html">Accordions</a></li>
                                                                        <li><a class="dropdown-item" href="elements-alerts.html">Alerts</a></li>
                                                                        <li><a class="dropdown-item" href="elements-animations.html">Animations  <span class="tip tip-dark p-relative bottom-2">hot</span></a></li>
                                                                        <li><a class="dropdown-item" href="elements-arrows.html">Arrows</a></li>
                                                                        <li><a class="dropdown-item" href="elements-badges.html">Badges</a></li>
                                                                        <li><a class="dropdown-item" href="elements-before-after.html">Before / After</a></li>
                                                                        <li><a class="dropdown-item" href="elements-blockquotes.html">Blockquotes</a></li>
                                                                        <li><a class="dropdown-item" href="elements-buttons.html">Buttons</a></li>
                                                                        <li><a class="dropdown-item" href="elements-call-to-action.html">Call to Action</a></li>
                                                                        <li><a class="dropdown-item" href="elements-cards.html">Cards</a></li>
                                                                        <li><a class="dropdown-item" href="elements-carousels.html">Carousels</a></li>
                                                                        <li><a class="dropdown-item" href="elements-cascading-images.html">Cascading Images</a></li>
                                                                    </ul>
                                                                </div>
                                                                <div class="col-lg-3">
                                                                    <span class="dropdown-mega-sub-title">Elements 2</span>
                                                                    <ul class="dropdown-mega-sub-nav">
                                                                        <li><a class="dropdown-item" href="elements-content-rotate.html">Content Rotate</a></li>
                                                                        <li><a class="dropdown-item" href="elements-countdowns.html">Countdowns</a></li>
                                                                        <li><a class="dropdown-item" href="elements-counters.html">Counters</a></li>
                                                                        <li><a class="dropdown-item" href="elements-dividers.html">Dividers</a></li>
                                                                        <li><a class="dropdown-item" href="elements-forms.html">Forms</a></li>
                                                                        <li><a class="dropdown-item" href="elements-headings.html">Headings</a></li>
                                                                        <li><a class="dropdown-item" href="elements-icons.html">Icons</a></li>
                                                                        <li><a class="dropdown-item" href="elements-icon-boxes.html">Icon Boxes</a></li>
                                                                        <li><a class="dropdown-item" href="elements-image-frames.html">Image Frames  <span class="tip tip-dark p-relative bottom-2">hot</span></a></li>
                                                                        <li><a class="dropdown-item" href="elements-image-gallery.html">Image Gallery</a></li>
                                                                        <li><a class="dropdown-item" href="elements-image-hotspots.html">Image Hotspots</a></li>
                                                                        <li><a class="dropdown-item" href="elements-lightboxes.html">Lightboxes</a></li>
                                                                    </ul>
                                                                </div>
                                                                <div class="col-lg-3">
                                                                    <span class="dropdown-mega-sub-title">Elements 3</span>
                                                                    <ul class="dropdown-mega-sub-nav">
                                                                        <li><a class="dropdown-item" href="elements-lists.html">Lists</a></li>
                                                                        <li><a class="dropdown-item" href="elements-maps.html">Maps</a></li>
                                                                        <li><a class="dropdown-item" href="elements-medias.html">Medias</a></li>
                                                                        <li><a class="dropdown-item" href="elements-modals.html">Modals</a></li>
                                                                        <li><a class="dropdown-item" href="elements-parallax.html">Parallax</a></li>
                                                                        <li><a class="dropdown-item" href="elements-particles.html">Particles</a></li>
                                                                        <li><a class="dropdown-item" href="elements-posts.html">Posts</a></li>
                                                                        <li><a class="dropdown-item" href="elements-pricing-tables.html">Pricing Tables</a></li>
                                                                        <li><a class="dropdown-item" href="elements-process.html">Process</a></li>
                                                                        <li><a class="dropdown-item" href="elements-progressbars.html">Progress Bars</a></li>
                                                                        <li><a class="dropdown-item" href="elements-random-images.html">Random Images</a></li>
                                                                        <li><a class="dropdown-item" href="elements-read-more.html">Read More</a></li>
                                                                    </ul>
                                                                </div>
                                                                <div class="col-lg-3">
                                                                    <span class="dropdown-mega-sub-title">Elements 4</span>
                                                                    <ul class="dropdown-mega-sub-nav">
                                                                        <li><a class="dropdown-item" href="elements-sections.html">Sections</a></li>
                                                                        <li><a class="dropdown-item" href="elements-shape-dividers.html">Shape Dividers</a></li>
                                                                        <li><a class="dropdown-item" href="elements-star-ratings.html">Star Ratings</a></li>
                                                                        <li><a class="dropdown-item" href="elements-sticky-elements.html">Sticky Elements</a></li>
                                                                        <li><a class="dropdown-item" href="elements-tables.html">Tables</a></li>
                                                                        <li><a class="dropdown-item" href="elements-tabs.html">Tabs</a></li>
                                                                        <li><a class="dropdown-item" href="elements-testimonials.html">Testimonials</a></li>
                                                                        <li><a class="dropdown-item" href="elements-toggles.html">Toggles</a></li>
                                                                        <li><a class="dropdown-item" href="elements-tooltips-popovers.html">Tooltips & Popovers</a></li>
                                                                        <li><a class="dropdown-item" href="elements-typography.html">Typography</a></li>
                                                                        <li><a class="dropdown-item" href="elements-word-rotator.html">Word Rotator</a></li>
                                                                        <li><a class="dropdown-item" href="elements-360-image-viewer.html">360º Image Viewer</a></li>
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </li>
                                            <li>
                                                <a class="nav-link" href="demo-business-consulting-4-about-us.html">
                                                    About Us
                                                </a>
                                            </li>
                                            <li class="dropdown">
                                                <a class="nav-link dropdown-toggle" href="demo-business-consulting-4-services.html">
                                                    Services
                                                </a>
                                                <ul class="dropdown-menu">
                                                    <li>
                                                        <a href="demo-business-consulting-4-services-detail.html" class="dropdown-item">Strategic Planning</a>
                                                    </li>
                                                    <li>
                                                        <a href="demo-business-consulting-4-services-detail.html" class="dropdown-item">Financial Clean-Up</a>
                                                    </li>
                                                    <li>
                                                        <a href="demo-business-consulting-4-services-detail.html" class="dropdown-item">Cash Flow Planning</a>
                                                    </li>
                                                </ul>
                                            </li>
                                            <li class="dropdown">
                                                <a class="dropdown-item dropdown-toggle" href="#">

                                                    Portfolio

                                                </a>
                                                <ul class="dropdown-menu">

                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Single Project</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-single-wide-slider.html">Wide Slider</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-small-slider.html">Small Slider</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-full-width-slider.html">Full Width Slider</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-gallery.html">Gallery</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-carousel.html">Carousel</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-medias.html">Medias</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-full-width-video.html">Full Width Video</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-masonry-images.html">Masonry Images</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-left-sidebar.html">Left Sidebar</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-right-sidebar.html">Right Sidebar</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-left-and-right-sidebars.html">Left and Right Sidebars</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-sticky-sidebar.html">Sticky Sidebar</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-single-extended.html">Extended</a></li>
                                                        </ul>
                                                    </li>
                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Grid Layouts</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-grid-1-column.html">1 Column</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-2-columns.html">2 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-3-columns.html">3 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-4-columns.html">4 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-5-columns.html">5 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-6-columns.html">6 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-no-margins.html">No Margins</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-full-width.html">Full Width</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-full-width-no-margins.html">Full Width No Margins</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-grid-1-column-title-and-description.html">Title and Description</a></li>
                                                        </ul>
                                                    </li>
                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Masonry Layouts</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-masonry-2-columns.html">2 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-3-columns.html">3 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-4-columns.html">4 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-5-columns.html">5 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-6-columns.html">6 Columns</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-no-margins.html">No Margins</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-masonry-full-width.html">Full Width</a></li>
                                                        </ul>
                                                    </li>
                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Sidebar Layouts</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-sidebar-left.html">Left Sidebar</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-sidebar-right.html">Right Sidebar</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-sidebar-left-and-right.html">Left and Right Sidebars</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-sidebar-sticky.html">Sticky Sidebar</a></li>
                                                        </ul>
                                                    </li>
                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Ajax</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-ajax-page.html">Ajax on Page</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-ajax-modal.html">Ajax on Modal</a></li>
                                                        </ul>
                                                    </li>
                                                    <li class="dropdown-submenu">
                                                        <a class="dropdown-item" href="#">Extra</a>
                                                        <ul class="dropdown-menu">

                                                            <li><a class="dropdown-item" href="portfolio-extra-timeline.html">Timeline</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-lightbox.html">Lightbox</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-load-more.html">Load More</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-infinite-scroll.html">Infinite Scroll</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-lazy-load-masonry.html">Lazy Load Masonry</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-pagination.html">Pagination</a></li>
                                                            <li><a class="dropdown-item" href="portfolio-extra-combination-filters.html">Combination Filters</a></li>
                                                        </ul>
                                                    </li>
                                                </ul>
                                            </li>
                                            <li>
                                                <a class="nav-link" href="demo-business-consulting-4-team.html">
                                                    Team
                                                </a>
                                            </li>
                                            <li>
                                                <a class="nav-link" href="demo-business-consulting-4-blog.html">
                                                    Blog
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                </div>
                                <a href="demo-business-consulting-4-contact-us.html" class="btn btn-modern btn-primary btn-outline btn-arrow-effect-1 text-capitalize text-2-5 ms-3 me-2 d-block d-md-none d-xl-block anim-hover-translate-right-5px transition-2ms">Contact Us <i class="fas fa-arrow-right ms-2"></i></a>
                                <button class="btn header-btn-collapse-nav" data-bs-toggle="collapse" data-bs-target=".header-nav-main nav">
                                    <i class="fas fa-bars"></i>
                                </button>
                            </div>
                            <div class="header-nav-features header-nav-features-no-border ps-2 order-1 order-lg-2">
                                <div class="header-nav-feature header-nav-features-search d-inline-flex">
                                    <a href="#" class="header-nav-features-toggle text-decoration-none" data-focus="headerSearch" aria-label="Search"><i class="fas fa-search header-nav-top-icon text-3"></i></a>
                                    <div class="header-nav-features-dropdown" id="headerTopSearchDropdown">
                                        <form role="search" action="page-search-results.html" method="get">
                                            <div class="simple-search input-group">
                                                <input class="form-control text-1" id="headerSearch" name="q" type="search" value="" placeholder="Search...">
                                                <button class="btn" type="submit" aria-label="Search">
                                                    <i class="fas fa-search header-nav-top-icon"></i>
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
@endsection

@section('content')
    <section class="section border-0 m-0 bg-color-quaternary p-relative">
        <div class="container">
            <div class="row custom-hero-row">

                <div class="col">
                    <div class="row pt-5 mt-5 mb-5 pb-5">
                        <div class="col-12 col-lg-6 p-relative pt-5 mt-5">
                            <div class="divider divider-small divider-small-lg appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                                <hr class="bg-primary border-radius">
                            </div>
                            <div class="overflow-hidden mb-1">
                                <h2 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4-5 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">A leading consulting firm</h2>
                            </div>
                            <h1 class="text-color-dark font-weight-bold text-9 pb-2 mb-4 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Digital, business and technology<br>consulting for growth.</h1>
                            <div class="d-block appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="300">
                                <a href="#start" data-hash data-hash-offset="0" data-hash-offset-lg="100" class="btn btn-modern btn-primary btn-arrow-effect-1 text-capitalize text-2-5 px-5 py-3 anim-hover-translate-top-5px transition-2ms">Learn More <i class="fas fa-arrow-right ms-2"></i></a>
                            </div>
                            <div class="pt-5 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="400">
                                <span class="d-inline-block anim-hover-translate-bottom-5px transition-2ms">
                                    <a href="#start" data-hash data-hash-offset="0" data-hash-offset-lg="100" class="btn btn-default text-color-primary border-color-primary bg-transparent rotate-r-90 btn-circle border-width-2 btn-lg"><i class="fas fa-arrow-right"></i></a>
                                </span>
                            </div>
                        </div>
                        <div class="col-12 col-lg-6 p-relative text-end">

                            <div class="appear-animation custom-element-wrapper custom-element-6" data-appear-animation="expandIn" data-appear-animation-delay="500">
                                <div class="bg-color-primary particle particle-dots w-100 h-100 opacity-3"></div>
                            </div>

                            <div class="appear-animation custom-element-wrapper custom-element-7" data-appear-animation="expandIn" data-appear-animation-delay="700">
                                <div class="bg-color-primary particle particle-dots w-100 h-100 opacity-3"></div>
                            </div>

                            <div class="appear-animation custom-element-wrapper p-relative custom-element-5" data-appear-animation="expandIn" data-appear-animation-delay="0">
                                <div class="w-100 h-100">
                                    <div class="custom-element rotate-r-45"></div>
                                </div>
                            </div>

                            <img class="appear-animation img-fluid custom-element-wrapper custom-element-8" data-appear-animation="fadeIn" data-appear-animation-delay="900" src="img/demos/business-consulting-4/generic/generic-1.png" alt="">

                        </div>
                    </div>
                    <div class="row align-items-end justify-content-end pt-5">
                        <div class="col-lg-9 text-end pt-5">
                            <div class="appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="800">
                                <div class="owl-carousel owl-theme stage-margin rounded-nav nav-dark nav-icon-1 nav-size-md nav-position-1" data-plugin-options="{'responsive': {'0': {'items': 1}, '479': {'items': 1}, '768': {'items': 2}, '979': {'items': 2}, '1199': {'items': 2}}, 'margin': 10, 'loop': true, 'nav': true, 'dots': false, 'stagePadding': 40}">
                                    <div class="overlay overlay-color-primary overlay-show overlay-op-8 rounded overflow-hidden">
                                        <img alt="" class="img-fluid rounded" src="img/demos/business-consulting-4/generic/generic-2.jpg">
                                        <a href="#" class="p-absolute z-index-2 top-0 left-0 w-100 h-100 anim-hover-translate-top-5px transition-2ms">
                                            <span class="p-absolute left-0 bottom-0 text-color-light text-start ms-4 mb-3 ps-2 pb-1">
                                                <strong class="text-5 negative-ls-05 font-weight-bold">Why Choose Us</strong>
                                                <p class="font-weight-medium text-color-light opacity-7 p-relative bottom-4 mb-0">Lorem ipsum dolor sit amet...</p>
                                            </span>
                                        </a>
                                    </div>
                                    <div class="overlay overlay-color-dark overlay-show overlay-op-9 rounded overflow-hidden">
                                        <img alt="" class="img-fluid rounded" src="img/demos/business-consulting-4/generic/generic-3.jpg">
                                        <a href="#" class="p-absolute z-index-2 top-0 left-0 w-100 h-100 anim-hover-translate-top-5px transition-2ms">
                                            <span class="p-absolute left-0 bottom-0 text-color-light text-start ms-4 mb-3 ps-2 pb-1">
                                                <strong class="text-5 negative-ls-05 font-weight-bold">Consulting for Growth</strong>
                                                <p class="font-weight-medium text-color-light opacity-7 p-relative bottom-4 mb-0">Lorem ipsum dolor sit amet...</p>
                                            </span>
                                        </a>
                                    </div>
                                    <div class="overlay overlay-color-primary overlay-show overlay-op-8 rounded overflow-hidden">
                                        <img alt="" class="img-fluid rounded" src="img/demos/business-consulting-4/generic/generic-4.jpg">
                                        <a href="#" class="p-absolute z-index-2 top-0 left-0 w-100 h-100 anim-hover-translate-top-5px transition-2ms">
                                            <span class="p-absolute left-0 bottom-0 text-color-light text-start ms-4 mb-3 ps-2 pb-1">
                                                <strong class="text-5 negative-ls-05 font-weight-bold">Why Choose Us</strong>
                                                <p class="font-weight-medium text-color-light opacity-7 p-relative bottom-4 mb-0">Lorem ipsum dolor sit amet...</p>
                                            </span>
                                        </a>
                                    </div>
                                    <div class="overlay overlay-color-dark overlay-show overlay-op-9 rounded overflow-hidden">
                                        <img alt="" class="img-fluid rounded" src="img/demos/business-consulting-4/generic/generic-5.jpg">
                                        <a href="#" class="p-absolute z-index-2 top-0 left-0 w-100 h-100 anim-hover-translate-top-5px transition-2ms">
                                            <span class="p-absolute left-0 bottom-0 text-color-light text-start ms-4 mb-3 ps-2 pb-1">
                                                <strong class="text-5 negative-ls-05 font-weight-bold">Consulting for Growth</strong>
                                                <p class="font-weight-medium text-color-light opacity-7 p-relative bottom-4 mb-0">Lorem ipsum dolor sit amet...</p>
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="appear-animation custom-element-wrapper custom-element-1" data-appear-animation="expandIn" data-appear-animation-delay="200">
            <div class="w-100 h-100" data-plugin-float-element data-plugin-options="{'startPos': 'bottom', 'speed': 2.1, 'transition': true, 'transitionDuration': 500}">
                <div class="custom-element rotate-r-45"></div>
            </div>
        </div>

        <div class="appear-animation custom-element-wrapper custom-element-2" data-appear-animation="expandIn" data-appear-animation-delay="200">
            <div class="w-100 h-100" data-plugin-float-element data-plugin-options="{'startPos': 'bottom', 'speed': 2.2, 'transition': true, 'transitionDuration': 500}">
                <div class="custom-element rotate-r-45"></div>
            </div>
        </div>

        <div class="appear-animation custom-element-wrapper custom-element-3" data-appear-animation="expandIn" data-appear-animation-delay="200">
            <div class="w-100 h-100" data-plugin-float-element data-plugin-options="{'startPos': 'bottom', 'speed': 2.3, 'transition': true, 'transitionDuration': 500}">
                <div class="custom-element rotate-r-45"></div>
            </div>
        </div>

        <div class="appear-animation custom-element-wrapper custom-element-4" data-appear-animation="expandIn" data-appear-animation-delay="200">
            <div class="w-100 h-100" data-plugin-float-element data-plugin-options="{'startPos': 'bottom', 'speed': 2.4, 'transition': true, 'transitionDuration': 500}">
                <div class="custom-element rotate-r-45"></div>
            </div>
        </div>

    </section>

    <section class="section border-0 bg-transparent m-0" id="start">
        <div class="container py-5 mb-3">
            <div class="row">
                <div class="col text-center">

                    <div class="divider divider-small divider-small-lg mt-0 text-center appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                        <hr class="bg-primary border-radius m-auto">
                    </div>
                    <div class="overflow-hidden mb-1">
                        <h3 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">Our Mission</h3>
                    </div>
                    <h2 class="text-color-dark font-weight-bold text-8 pb-2 mb-4 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">We are committed to providing our clients the best<br>strategic guidance available</h2>

                </div>
            </div>
            <div class="row pt-4 pb-5">
                <div class="col-lg-6 text-center p-relative pt-5">

                    <div class="appear-animation custom-element-wrapper custom-element-9" data-appear-animation="expandIn" data-appear-animation-delay="1000">
                        <div class="bg-color-primary particle particle-dots w-100 h-100 opacity-3"></div>
                    </div>

                    <div class="appear-animation custom-element-wrapper custom-element-10" data-appear-animation="expandIn" data-appear-animation-delay="1200">
                        <div class="bg-color-primary particle particle-dots w-100 h-100 opacity-3"></div>
                    </div>

                    <div class="appear-animation custom-element-wrapper custom-element-11 p-relative rotate-r-45" data-appear-animation="fadeIn" data-appear-animation-delay="300">
                        <img class="img-fluid" src="img/demos/business-consulting-4/generic/generic-6.jpg" alt="">
                    </div>

                </div>
                <div class="col-lg-6 pt-5 mt-5 pt-lg-0 mt-lg-0">
                    <div class="appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">
                        <p class="font-weight-medium text-4-5 line-height-5">Cras a elit sit amet leo accumsan volutpat. Suspendisse hendrerit vehicula leo, vel efficitur felis ultrices non. Integer aliquet ullamcorper dolor, quis sollicitudin.</p>
                        <p class="text-3-5">Cras a elit sit amet leo accumsan volutpat. Suspendisse hendrerit vehicula leo, vel efficitur felis ultrices non. Integer aliquet.</p>

                        <ul class="list list-icons list-icons-style-2 list-icons-lg">
                            <li class="line-height-9 text-3-5 mb-1">
                                <i class="fas fa-check border-width-2 text-3"></i>Amet orci quis arcu vestibulum vestibulum.
                            </li>
                            <li class="line-height-9 text-3-5 mb-1">
                                <i class="fas fa-check border-width-2 text-3"></i>Quis arcu vestibulum vestibulum.
                            </li>
                            <li class="line-height-9 text-3-5 mb-1">
                                <i class="fas fa-check border-width-2 text-3"></i>Sit amet orci quis arcu.
                            </li>
                        </ul>
                    </div>

                    <div class="d-block pt-4 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="300">
                        <a href="demo-business-consulting-4-about-us.html" class="btn btn-modern btn-primary btn-arrow-effect-1 text-capitalize text-2-5 px-5 py-3 anim-hover-translate-top-5px transition-2ms">Learn More <i class="fas fa-arrow-right ms-2"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section border-0 bg-quaternary m-0">
        <div class="container py-5">
            <div class="row justify-content-center">
                <div class="col col-lg-9 text-center">

                    <div class="divider divider-small divider-small-lg mt-0 text-center appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                        <hr class="bg-primary border-radius m-auto">
                    </div>
                    <div class="overflow-hidden mb-1">
                        <h3 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">How We Can Help</h3>
                    </div>
                    <h2 class="text-color-dark font-weight-bold text-8 pb-4 mb-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Our Amazing Services</h2>

                    <p class="font-weight-medium text-4-5 line-height-5 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="400">Cras a elit sit amet leo accumsan volutpat. Suspendisse hendrerit vehicula leo, vel efficitur felis ultrices non.</p>

                </div>
            </div>

            <div class="row py-5 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">
                <div class="col-md-4 mb-4 mb-md-0">
                    <div class="card card-border card-border-top card-border-hover bg-color-light border-0 box-shadow-6 box-shadow-hover anim-hover-translate-top-10px transition-3ms anim-hover-inner-wrapper">
                        <div class="card-body p-relative zindex-1 p-5 text-center">
                            <div class="anim-hover-inner-translate-top-20px transition-3ms">
                                <img width="72" height="73" src="img/demos/business-consulting-4/icons/icon-1.svg" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-fill-color-primary'}" />
                                <h4 class="card-title mt-4 mb-2 text-5 font-weight-bold">Strategic Planning</h4>
                                <p class="card-text text-3-5">Lorem ipsum dolor sit amet, consectetur elit.</p>
                            </div>
                            <div class="w-100 text-center p-absolute opacity-0 bottom-30 left-0 transformY-p100 anim-hover-inner-opacity-10 anim-hover-inner-translate-top-0px transition-4ms">
                                <a href="demo-business-consulting-4-services-detail.html" class="read-more text-color-primary font-weight-semibold mt-2 text-2">Learn More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 mb-4 mb-md-0">
                    <div class="card card-border card-border-top card-border-hover bg-color-light border-0 box-shadow-6 box-shadow-hover anim-hover-translate-top-10px transition-3ms anim-hover-inner-wrapper">
                        <div class="card-body p-relative zindex-1 p-5 text-center">
                            <div class="anim-hover-inner-translate-top-20px transition-3ms">
                                <img width="72" height="73" src="img/demos/business-consulting-4/icons/icon-2.svg" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-fill-color-primary'}" />
                                <h4 class="card-title mt-4 mb-2 text-5 font-weight-bold">Financial Clean-Up</h4>
                                <p class="card-text text-3-5">Lorem ipsum dolor sit amet, consectetur elit.</p>
                            </div>
                            <div class="w-100 text-center p-absolute opacity-0 bottom-30 left-0 transformY-p100 anim-hover-inner-opacity-10 anim-hover-inner-translate-top-0px transition-4ms">
                                <a href="demo-business-consulting-4-services-detail.html" class="read-more text-color-primary font-weight-semibold mt-2 text-2">Learn More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card card-border card-border-top card-border-hover bg-color-light border-0 box-shadow-6 box-shadow-hover anim-hover-translate-top-10px transition-3ms anim-hover-inner-wrapper">
                        <div class="card-body p-relative zindex-1 p-5 text-center">
                            <div class="anim-hover-inner-translate-top-20px transition-3ms">
                                <img width="72" height="73" src="img/demos/business-consulting-4/icons/icon-3.svg" alt="" data-icon data-plugin-options="{'onlySVG': true, 'extraClass': 'svg-fill-color-primary'}" />
                                <h4 class="card-title mt-4 mb-2 text-5 font-weight-bold">Cash Flow Planning</h4>
                                <p class="card-text text-3-5">Lorem ipsum dolor sit amet, consectetur elit.</p>
                            </div>
                            <div class="w-100 text-center p-absolute opacity-0 bottom-30 left-0 transformY-p100 anim-hover-inner-opacity-10 anim-hover-inner-translate-top-0px transition-4ms">
                                <a href="demo-business-consulting-4-services-detail.html" class="read-more text-color-primary font-weight-semibold mt-2 text-2">Learn More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row justify-content-center">
                <div class="col col-lg-9 text-center">

                    <div class="d-block pt-4 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="300">
                        <a href="demo-business-consulting-4-services.html" class="btn btn-modern btn-primary btn-arrow-effect-1 text-capitalize text-2-5 px-5 py-3 anim-hover-translate-top-5px transition-2ms">Learn More <i class="fas fa-arrow-right ms-2"></i></a>
                    </div>

                </div>
            </div>
        </div>
    </section>

    <section class="section border-0 bg-dark m-0 p-relative">
        <div class="particles-wrapper z-index-1">
            <div id="particles-1"></div>
        </div>
        <div class="container py-5 p-relative z-index-2">
            <div class="row">
                <div class="col text-center">

                    <div class="divider divider-small divider-small-lg mt-0 text-center appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                        <hr class="bg-primary border-radius m-auto">
                    </div>
                    <div class="overflow-hidden mb-1">
                        <h3 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">Company Stats</h3>
                    </div>
                    <h2 class="text-color-light font-weight-bold text-8 pb-4 mb-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Learn More About Us In Numbers</h2>
                </div>
            </div>
            <div class="row pt-4 pb-3 counters text-light appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">
                <div class="col-lg-4 mb-4 mb-lg-0">
                    <div class="counter">
                        <strong data-to="500" data-append="+">0</strong>
                        <label class="font-weight-semibold text-4 opacity-7">Cases Completed</label>
                    </div>
                </div>
                <div class="col-lg-4 mb-4 mb-lg-0">
                    <div class="counter">
                        <strong data-to="100" data-append="+">0</strong>
                        <label class="font-weight-semibold text-4 opacity-7">Total Consultants</label>
                    </div>
                </div>
                <div class="col-lg-4 mb-4 mb-sm-0">
                    <div class="counter">
                        <strong data-to="100" data-append="%">0</strong>
                        <label class="font-weight-semibold text-4 opacity-7">Satisfied Customers</label>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section border-0 bg-quaternary m-0">
        <div class="container py-5">
            <div class="row justify-content-center">
                <div class="col col-lg-9 text-center">

                    <div class="divider divider-small divider-small-lg mt-0 text-center appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                        <hr class="bg-primary border-radius m-auto">
                    </div>
                    <div class="overflow-hidden mb-1">
                        <h3 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">What They Say About Us</h3>
                    </div>
                    <h2 class="text-color-dark font-weight-bold text-8 pb-4 mb-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Testimonials</h2>

                </div>
            </div>

            <div class="row mt-4">
                <div class="col appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">

                    <div class="owl-carousel owl-theme stage-margin rounded-nav nav-dark nav-icon-1 nav-size-md mb-0" data-plugin-options="{'responsive': {'0': {'items': 1}, '479': {'items': 1}, '768': {'items': 2}, '979': {'items': 2}, '1199': {'items': 2}}, 'margin': 0, 'loop': true, 'nav': true, 'dots': false, 'stagePadding': 40}">
                        <div class="mx-3">
                            <div class="testimonial testimonial-style-3 testimonial-style-3-light">
                                <blockquote class="p-3 before-d-none">
                                    <p class="font-weight-medium text-4 line-height-5 p-3 m-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est, in consequat.</p>
                                </blockquote>
                                <div class="testimonial-arrow-down p-relative z-index-1"></div>
                                <div class="testimonial-author">
                                    <div class="testimonial-author-thumbnail">
                                        <img src="img/clients/client-1.jpg" class="img-fluid rounded-circle" alt="">
                                    </div>
                                    <p><strong class="font-weight-extra-bold">John Smith</strong><span>CEO & Founder - Okler</span></p>
                                </div>
                            </div>
                        </div>
                        <div class="mx-3">
                            <div class="testimonial testimonial-style-3 testimonial-style-3-light">
                                <blockquote class="p-3 before-d-none">
                                    <p class="font-weight-medium text-4 line-height-5 p-3 m-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est, in consequat.</p>
                                </blockquote>
                                <div class="testimonial-arrow-down p-relative z-index-1"></div>
                                <div class="testimonial-author">
                                    <div class="testimonial-author-thumbnail">
                                        <img src="img/clients/client-1.jpg" class="img-fluid rounded-circle" alt="">
                                    </div>
                                    <p><strong class="font-weight-extra-bold">John Smith</strong><span>CEO & Founder - Okler</span></p>
                                </div>
                            </div>
                        </div>
                        <div class="mx-3">
                            <div class="testimonial testimonial-style-3 testimonial-style-3-light">
                                <blockquote class="p-3 before-d-none">
                                    <p class="font-weight-medium text-4 line-height-5 p-3 m-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est, in consequat.</p>
                                </blockquote>
                                <div class="testimonial-arrow-down p-relative z-index-1"></div>
                                <div class="testimonial-author">
                                    <div class="testimonial-author-thumbnail">
                                        <img src="img/clients/client-1.jpg" class="img-fluid rounded-circle" alt="">
                                    </div>
                                    <p><strong class="font-weight-extra-bold">John Smith</strong><span>CEO & Founder - Okler</span></p>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </section>
    <section class="section border-0 bg-light m-0">
        <div class="container py-5">
            <div class="row align-items-center text-center">
                <div class="col-sm-4 col-lg-2 mb-5 mb-lg-0">
                    <img src="img/logos/logo-8.png" alt="" class="img-fluid" style="max-width: 90px;">
                </div>
                <div class="col-sm-4 col-lg-2 mb-5 mb-lg-0">
                    <img src="img/logos/logo-9.png" alt="" class="img-fluid" style="max-width: 140px;">
                </div>
                <div class="col-sm-4 col-lg-2 mb-5 mb-lg-0">
                    <img src="img/logos/logo-10.png" alt="" class="img-fluid" style="max-width: 140px;">
                </div>
                <div class="col-sm-4 col-lg-2 mb-5 mb-sm-0">
                    <img src="img/logos/logo-11.png" alt="" class="img-fluid" style="max-width: 140px;">
                </div>
                <div class="col-sm-4 col-lg-2 mb-5 mb-sm-0">
                    <img src="img/logos/logo-12.png" alt="" class="img-fluid" style="max-width: 100px;">
                </div>
                <div class="col-sm-4 col-lg-2">
                    <img src="img/logos/logo-13.png" alt="" class="img-fluid" style="max-width: 100px;">
                </div>
            </div>
        </div>
    </section>

    <section class="parallax section section-text-light section-parallax bg-primary m-0" data-plugin-parallax data-plugin-options="{'speed': 1.5}" data-image-src="img/demos/business-consulting-4/parallax/parallax-1.jpg">
        <div class="container py-5">
            <div class="row justify-content-center">
                <div class="col">
                    <div class="feature-box align-items-center border-0 float-lg-end mb-4 mb-lg-0 appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="300">
                        <div class="feature-box-icon bg-transparent">
                            <i class="icons icon-phone text-6 text-color-light"></i>
                        </div>
                        <div class="feature-box-info line-height-2 ps-1">
                            <span class="d-block text-1 text-light font-weight-semibold text-color-default ws-nowrap">CALL US NOW</span>
                            <strong class="text-4-5"><a href="tel:+1234567890" class="text-color-light text-decoration-none ws-nowrap">+123 4567 890</a></strong>
                        </div>
                    </div>
                    <h2 class="text-color-light font-weight-bold text-8 pb-4 mb-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Best Consultants Downtown Los Angeles CA</h2>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col">
                    <div class="border-top border-color-light-5 text-light pt-4 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">

                        <div class="row align-items-center">
                            <div class="col-12 mb-3 mb-lg-0 col-lg">
                                <h2 class="text-color-light font-weight-bold text-5 mb-0">Request a Call Back</h2>
                            </div>
                            <div class="col-12 mb-3 mb-lg-0 col-lg">
                                <input type="text" class="form-control text-3 h-auto py-3 line-height-1 border-0" placeholder="Subject" aria-label="Subject">
                            </div>
                            <div class="col-12 mb-3 mb-lg-0 col-lg">
                                <input type="text" class="form-control text-3 h-auto py-3 line-height-1 border-0" placeholder="Full Name" aria-label="Full Name">
                            </div>
                            <div class="col-12 mb-3 mb-lg-0 col-lg">
                                <input type="text" class="form-control text-3 h-auto py-3 line-height-1 border-0" placeholder="Phone Number" aria-label="Phone Number">
                            </div>
                            <div class="col-12 mb-3 mb-lg-0 col-lg">
                                <div class="d-grid gap-2">
                                    <a href="#" class="btn btn-modern btn-dark btn-arrow-effect-1 text-capitalize text-2-5 px-5 py-3 anim-hover-translate-top-5px transition-2ms">Submit <i class="fas fa-arrow-right ms-2"></i></a>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section border-0 bg-quaternary m-0">
        <div class="container py-5">
            <div class="row justify-content-center">
                <div class="col col-lg-9 text-center">

                    <div class="divider divider-small divider-small-lg mt-0 text-center appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="0">
                        <hr class="bg-primary border-radius m-auto">
                    </div>
                    <div class="overflow-hidden mb-1">
                        <h3 class="font-weight-semi-bold text-color-grey text-uppercase positive-ls-3 text-4 line-height-2 line-height-sm-7 mb-0 appear-animation" data-appear-animation="maskUp" data-appear-animation-delay="100">What Is Happening</h3>
                    </div>
                    <h2 class="text-color-dark font-weight-bold text-8 pb-4 mb-0 appear-animation" data-appear-animation="fadeInUpShorter" data-appear-animation-delay="200">Latest News</h2>

                </div>
            </div>

            <div class="row justify-content-center appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="300">
                <div class="col-9 col-md-6 col-lg-4 mb-4 mb-lg-0">
                    <a href="demo-business-consulting-4-blog-post.html" class="text-decoration-none">
                        <div class="card border-0 bg-transparent">
                            <div class="card-img-top position-relative overlay overflow-hidden border-radius">
                                <div class="position-absolute bottom-10 right-0 d-flex justify-content-end w-100 py-3 px-4 z-index-3">
                                    <span class="text-center bg-primary text-color-light border-radius font-weight-semibold line-height-2 px-3 py-2">
                                        <span class="position-relative text-6 z-index-2">
                                            18
                                            <span class="d-block text-0 positive-ls-2 px-1">FEB</span>
                                        </span>
                                    </span>
                                </div>
                                <img src="img/demos/business-consulting-4/blog/post-thumb-1.jpg" class="img-fluid border-radius" alt="Lorem Ipsum Dolor" />
                            </div>
                            <div class="card-body py-4 px-0">
                                <span class="d-block text-color-grey font-weight-semibold positive-ls-2 text-2">BY ADMIN</span>
                                <h4 class="font-weight-bold text-5 text-color-hover-primary mb-2">Lorem ipsum dolor sit a met, consectetur</h4>
                                <a href="demo-business-consulting-4-blog-post.html" class="read-more text-color-primary font-weight-semibold mt-0 text-2">Read More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-9 col-md-6 col-lg-4 mb-4 mb-lg-0">
                    <a href="demo-business-consulting-4-blog-post.html" class="text-decoration-none">
                        <div class="card border-0 bg-transparent">
                            <div class="card-img-top position-relative overlay overflow-hidden border-radius">
                                <div class="position-absolute bottom-10 right-0 d-flex justify-content-end w-100 py-3 px-4 z-index-3">
                                    <span class="text-center bg-primary text-color-light border-radius font-weight-semibold line-height-2 px-3 py-2">
                                        <span class="position-relative text-6 z-index-2">
                                            15
                                            <span class="d-block text-0 positive-ls-2 px-1">FEB</span>
                                        </span>
                                    </span>
                                </div>
                                <img src="img/demos/business-consulting-4/blog/post-thumb-2.jpg" class="img-fluid border-radius" alt="Lorem Ipsum Dolor" />
                            </div>
                            <div class="card-body py-4 px-0">
                                <span class="d-block text-color-grey font-weight-semibold positive-ls-2 text-2">BY ADMIN</span>
                                <h4 class="font-weight-bold text-5 text-color-hover-primary mb-2">Lorem ipsum dolor sit a met, consectetur</h4>
                                <a href="demo-business-consulting-4-blog-post.html" class="read-more text-color-primary font-weight-semibold mt-0 text-2">Read More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-9 col-md-6 col-lg-4">
                    <a href="demo-business-consulting-4-blog-post.html" class="text-decoration-none">
                        <div class="card border-0 bg-transparent">
                            <div class="card-img-top position-relative overlay overflow-hidden border-radius">
                                <div class="position-absolute bottom-10 right-0 d-flex justify-content-end w-100 py-3 px-4 z-index-3">
                                    <span class="text-center bg-primary text-color-light border-radius font-weight-semibold line-height-2 px-3 py-2">
                                        <span class="position-relative text-6 z-index-2">
                                            12
                                            <span class="d-block text-0 positive-ls-2 px-1">FEB</span>
                                        </span>
                                    </span>
                                </div>
                                <img src="img/demos/business-consulting-4/blog/post-thumb-3.jpg" class="img-fluid border-radius" alt="Lorem Ipsum Dolor" />
                            </div>
                            <div class="card-body py-4 px-0">
                                <span class="d-block text-color-grey font-weight-semibold positive-ls-2 text-2">BY ADMIN</span>
                                <h4 class="font-weight-bold text-5 text-color-hover-primary mb-2">Lorem ipsum dolor sit a met, consectetur</h4>
                                <a href="demo-business-consulting-4-blog-post.html" class="read-more text-color-primary font-weight-semibold mt-0 text-2">Read More <i class="fas fa-angle-right position-relative top-1 ms-1"></i></a>
                            </div>
                        </div>
                    </a>
                </div>
            </div>

        </div>
    </section>

    <!-- Google Maps - Go to the bottom of the page to change settings and map location. -->
    <div id="googlemaps" class="google-map m-0" style="min-height: 580px;"></div>

    <section class="section border-0 bg-light m-0">
        <div class="container py-3">
            <div class="row align-items-center">
                <div class="col-md-4 mb-4 mb-md-0 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="100">
                    <h2 class="text-color-dark font-weight-bold text-5 mb-0">New York</h2>

                    <ul class="list list-icons list-icons-style-2 list-icons-lg">
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-location-pin icons border-width-2 text-3"></i>123 Street Name, City, 191919<br>New York - NY
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-phone icons border-width-2 text-3"></i>800 123-45679<br>800 123-45678
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5">
                            <i class="icon-envelope icons border-width-2 text-3"></i><a href="mailto:mail@domain.com" class="p-relative top-5">mail@domain.com</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-4 mb-4 mb-md-0 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="500">
                    <h2 class="text-color-dark font-weight-bold text-5 mb-0">Chicago</h2>

                    <ul class="list list-icons list-icons-style-2 list-icons-lg">
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-location-pin icons border-width-2 text-3"></i>123 Street Name, City, 191919<br>New York - NY
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-phone icons border-width-2 text-3"></i>800 123-45679<br>800 123-45678
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5">
                            <i class="icon-envelope icons border-width-2 text-3"></i><a href="mailto:mail@domain.com" class="p-relative top-5">mail@domain.com</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-4 appear-animation" data-appear-animation="fadeIn" data-appear-animation-delay="900">
                    <h2 class="text-color-dark font-weight-bold text-5 mb-0">Louisville</h2>

                    <ul class="list list-icons list-icons-style-2 list-icons-lg">
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-location-pin icons border-width-2 text-3"></i>123 Street Name, City, 191919<br>New York - NY
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5 mb-2">
                            <i class="icon-phone icons border-width-2 text-3"></i>800 123-45679<br>800 123-45678
                        </li>
                        <li class="text-3 font-weight-medium mb-1 line-height-5">
                            <i class="icon-envelope icons border-width-2 text-3"></i><a href="mailto:mail@domain.com" class="p-relative top-5">mail@domain.com</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
@endsection

@section('footer')
    <footer id="footer" class="position-relative bg-dark border-top-0">
        <div class="container pt-5 pb-3">
            <div class="row pt-5">
                <div class="col-lg-4">
                    <a href="demo-business-consulting-4.html" class="text-decoration-none">
                        <img src="img/demos/business-consulting-4/logo-light.png" width="123" height="32" class="img-fluid mb-4" alt="Porto" />
                    </a>
                    <p class="text-3-5 font-weight-medium pe-lg-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit quisque rutrum pellentesqu. </p>
                    <ul class="list list-unstyled">
                        <li class="d-flex align-items-center mb-4">
                            <i class="icon icon-envelope text-color-light text-5 font-weight-bold position-relative top-1 me-3-5"></i>
                            <a href="mailto:porto@business-consulting-4.com" class="d-inline-flex align-items-center text-decoration-none text-color-light text-color-hover-primary font-weight-semibold text-4-5">porto@domain.com</a>
                        </li>
                        <li class="d-flex align-items-center mb-4">
                            <i class="icon icon-phone text-color-light text-5 font-weight-bold position-relative top-1 me-3-5"></i>
                            <a href="tel:8001234567" class="d-inline-flex align-items-center text-decoration-none text-color-light text-color-hover-primary font-weight-semibold text-4-5">800-123-4567</a>
                        </li>
                    </ul>
                    <ul class="social-icons social-icons-clean social-icons-medium">
                        <li class="social-icons-facebook">
                            <a href="http://www.facebook.com/" target="_blank" title="Facebook">
                                <i class="fab fa-facebook-f text-color-light"></i>
                            </a>
                        </li>
                        <li class="social-icons-x">
                            <a href="http://www.x.com/" target="_blank" title="X">
                                <i class="fab fa-x-twitter text-color-light"></i>
                            </a>
                        </li>
                        <li class="social-icons-instagram">
                            <a href="http://www.instagram.com/" target="_blank" title="Instagram">
                                <i class="fab fa-instagram text-color-light"></i>
                            </a>
                        </li>
                        <li class="social-icons-linkedin">
                            <a href="http://www.linkedin.com/" target="_blank" title="Linkedin">
                                <i class="fab fa-linkedin text-color-light"></i>
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="col-lg-8">
                    <div class="row mb-5-5">
                        <div class="col-lg-6 mb-4 mb-lg-0">
                            <h4 class="text-color-light font-weight-bold mb-3">Navigation</h4>
                            <ul class="list list-unstyled columns-lg-2">
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Home</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">About Us</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Our Services</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Consultants</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Blog</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Contact Us</a></li>
                            </ul>
                        </div>
                        <div class="col-lg-6">
                            <h4 class="text-color-light font-weight-bold mb-3">Extra Links</h4>
                            <ul class="list list-unstyled columns-lg-2">
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Elements</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Portfolio</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Careers</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Shop Pages</a></li>
                                <li><a href="#" class="text-color-grey text-color-hover-primary">Testimonials</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <div class="alert alert-success d-none" id="newsletterSuccess">
                                <strong>Success!</strong> You've been added to our email list.
                            </div>
                            <div class="alert alert-danger d-none" id="newsletterError"></div>
                            <div class="d-flex flex-column flex-lg-row align-items-start align-items-lg-center">
                                <h4 class="text-color-light ws-nowrap me-3 mb-3 mb-lg-0">Subscribe to Newsletter:</h4>
                                <form id="newsletterForm" class="form-style-3 w-100" action="php/newsletter-subscribe.php" method="POST">
                                    <div class="d-flex">
                                        <input class="form-control bg-color-light border-0 box-shadow-none" placeholder="Email Address" name="newsletterEmail" id="newsletterEmail" type="text" />
                                        <button class="btn btn-primary ms-2 btn-px-3 btn-py-2 font-weight-bold" type="submit">
                                            Go
                                        </button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer-copyright bg-transparent">
            <div class="container">
                <hr class="bg-color-light opacity-1">
                <div class="row">
                    <div class="col mt-4 mb-4 pb-5">
                        <p class="text-center text-3 mb-0">Porto © 2025. All Rights Reserved.</p>
                    </div>
                </div>
            </div>
        </div>
    </footer>
@endsection

@section('vendor-script')
    <script src="{{ asset('vendor/koneko-layout/porto/vendor/particles/particles.min.js') }}"></script>
    <script src="{{ asset('vendor/koneko-layout/porto/js/demos/demo-business-consulting-4.js') }}"></script>
@endsection