/* Make header sticky */
header {
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 9999;
  background-color: transparent; /* or your preferred color */
  transition: all 0.3s ease;
}

/* Ensure hamburger menu stays visible on all viewports */
.navbar-toggler {
  display: block !important;
  border: none;
  outline: none;
}

/* Fix overlapping or hidden menu in mobile view */
@media (max-width: 991px) {
  .navbar-collapse {
        position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 9998;
  }
}


/* =====================================================
   FINAL HEADER FIX – DIGITAL TASK FORCE
   ===================================================== */

/* 1️⃣ LOCK HEADER HEIGHT */
.header-area,
.navbar-area {
  height: 90px;
}

.header-area {
  position: fixed;          /* FIXED HEADER */
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}

.header-area .navbar {
  height: 90px;
  display: flex;
  align-items: center;
}

/* 2️⃣ NAVBAR BRAND ALIGNMENT */
.navbar-brand {
  display: flex;
  align-items: center;
  padding: 0;
}

/* 3️⃣ LOGO CONTROL (MOST IMPORTANT FIX) */
.navbar-brand img {
  max-height: 90px;          /* DESKTOP LOGO SIZE */
  width: auto;
  object-fit: contain;
  display: block;
}



/* =====================================================
   MOBILE & TABLET FIXES
   ===================================================== */

@media (max-width: 991px) {

  /* MeanMenu Header Height */
  .mean-container .mean-bar {
    height: 70px !important;
    background-color: #000219;
  }

  /* Mobile Logo */
  .mobile-nav .logo img {
    max-height: 60px;
    width: auto;
  }

  .navbar-brand img {
    max-height: 42px;        /* MOBILE LOGO SIZE */
  }

  body {
    padding-top: 70px;
  }
}

/* =====================================================
   OPTIONAL: PREVENT HEADER JUMP ON SCROLL
   ===================================================== */

.navbar-area.is-sticky {
  height: 90px;
}

@media (max-width: 991px) {
  .navbar-area.is-sticky {
    height: 70px;
  }
}


/* ===============================
   1. TRANSPARENT HEADER (INITIAL)
================================ */
@media (max-width: 991px) {

  /* Header transparent on load */
  .navbar-area {
    background: transparent !important;
    box-shadow: none !important;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 999;
  }

  /* Prevent white mobile header */
  .navbar-area .mobile-nav {
    background: transparent !important;
  }

  .navbar-area .main-nav {
    background: transparent !important;
  }

}

/* ===============================
   2. STICKY HEADER (ON SCROLL)
================================ */
.navbar-area.is-sticky {
  background: #000219 !important;
  position: fixed !important;
  box-shadow: 0 5px 15px rgba(0,0,0,0.25);
}

.navbar-area.is-sticky .logo img {
  filter: none;
}

/* ===============================
   3. HAMBURGER ICON – VISIBLE
================================ */

/* Initial transparent header */
@media (max-width: 991px) {

  .mean-container .meanmenu-reveal {
    color: #ffffff !important;
  }

  .mean-container .meanmenu-reveal span {
    background: #ffffff !important;
  }

  /* Better click area */
  .meanmenu-reveal {
    border-radius: 6px;
  }
}

/* Sticky header hamburger */
.navbar-area.is-sticky .meanmenu-reveal {
  color: #ffffff !important;
}

.navbar-area.is-sticky .meanmenu-reveal span {
  background: #ffffff !important;
}

/* ===============================
   4. MOBILE MENU BACKGROUND
================================ */
.mean-container .mean-nav {
  background: #000219 !important;
}

.mean-container .mean-nav ul li a {
  color: #ffffff !important;
}



@media (max-width: 991px) {

  /* Remove all white backgrounds */
  .navbar-area,
  .navbar-area .mobile-nav,
  .navbar-area .main-nav {
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Kill any pseudo overlay */
  .navbar-area::before,
  .navbar-area::after,
  .mobile-nav::before,
  .mobile-nav::after {
    display: none !important;
    background: transparent !important;
  }

  /* Absolute positioning for overlay effect */
  .navbar-area {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
  }

  

  /* Fix body top gap */
  body {
    padding-top: 0 !important;
  }
}

/* ===============================
   STICKY HEADER (ON SCROLL)
================================ */
.navbar-area.is-sticky {
  position: fixed !important;
  background: #000219 !important;
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);
}

.navbar-area.is-sticky .logo img {
  filter: none;
}

/* ===============================
   HAMBURGER ICON FIX (SAFE)
================================ */
.mean-container .meanmenu-reveal {
  color: #ffffff !important;
}

.mean-container .meanmenu-reveal span {
  background: #ffffff !important;
}

/* ===============================
   MOBILE MENU DROPDOWN BG
================================ */
.mean-container .mean-nav {
  background: #000219 !important;
}
