Header Style Curve

    
<template>
  <header class="site-header mo-left header navstyle2">
    <!-- Main Header -->
    <div class="sticky-header main-bar-wraper header-curve navbar-expand-lg">
      <div class="main-bar clearfix bg-primary">
        <div class="container clearfix">
          <!-- Website Logo -->
          <div class="logo-header mostion logo-dark">
            <nuxt-link to="/">
              <img alt="" src="/images/logo-2.png" width="258" height="75" />
            </nuxt-link>
          </div>
          <!-- Nav Toggle Button -->
          <button
            class="navbar-toggler collapsed navicon justify-content-end"
            type="button"
            @click="toggleMobileMenu"
            data-bs-toggle="collapse"
            data-bs-target="#navbarNavDropdown"
            aria-controls="navbarNavDropdown"
            aria-expanded="false"
            aria-label="Toggle navigation"
          >
            <span />
            <span />
            <span />
          </button>
          <!-- Extra Nav -->
          <div class="extra-nav">
            <div class="extra-cell">
              <button
                id="quik-search-btn"
                type="button"
                class="site-button-link"
              >
                <i class="la la-search" />
              </button>
            </div>
          </div>
          <!-- Quick Search -->

          <!-- Main Nav -->
          <div
            class="header-nav navbar-collapse collapse justify-content-end"
            id="navbarNavDropdown"
          >
            <div class="logo-header d-md-block d-lg-none">
              <nuxt-link to="/">
                <img alt="" src="/images/logo-2.png" width="258" height="75" />
              </nuxt-link>
            </div>
            <ul class="nav navbar-nav">
              <Nav />
            </ul>
            <div class="dlab-social-icon ind-social">
              <ul>
                <li v-for="(elm, i) in socialLinks" :key="i">
                  <a
                    :class="['site-button-link', elm.className]"
                    :href="elm.href"
                  />
                </li>
              </ul>
              <p>{{ currentYear }} Industry</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- Main Header END -->
  </header>
</template>

<script setup>
import Nav from "./component/Nav.vue";
import { socialLinks } from "@/data/socials";
import { toggleMobileMenu } from "~/utlis/toggleMobileMenu";

const currentYear = new Date().getFullYear();
</script>

<style scoped>
/* Add your styles here */
</style>