/* Header fix layer for index */

/* Desktop brand text */
.logo .navbar-brand,
.inner-logo .navbar-brand{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
}

.logo .navbar-brand span,
.inner-logo .navbar-brand span{
  display:inline-block;
}

/* Keep nav items visually aligned even if an icon font fails temporarily */
.navbar-info .nav-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
}

.navbar-info .nav-link .nav-icon{
  width:16px;
  min-width:16px;
  text-align:center;
  line-height:1;
}

/* Home icon compatibility */
.fa-home:before{
  content:"\f015";
}

/* Cleaner mobile toggle focus state */
.mobile-menu-toggle{
  border:0;
  background:transparent;
  box-shadow:none;
  outline:none;
}

.mobile-menu-toggle:focus,
.mobile-menu-toggle:focus-visible{
  outline:none;
  box-shadow:none;
}

.mobile-menu-toggle::-moz-focus-inner{
  border:0;
}

@media (max-width:1199.98px){
  html.menu-open,
  body.menu-open{
    overflow:hidden !important;
    height:100%;
    touch-action:none;
  }

  .header-area{
    overflow:visible;
  }

  .header-area .container{
    position:relative;
  }

  .header-area .menu-container{
    display:flex;
    align-items:center;
    gap:12px;
    position:relative;
    overflow:visible;
  }

  /* Full-screen overlay over the entire page */
  .mobile-menu-overlay{
    position:fixed !important;
    inset:0 !important;
    width:100vw;
    height:100dvh;
    background:rgba(15, 23, 42, 0.38);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    z-index:9998;
  }

  .mobile-menu-overlay.show{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  /* Sticky off-canvas panel locked to viewport */
  .navbar .navbar-main{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:320px;
    max-width:calc(100vw - 40px);
    height:100dvh !important;
    box-sizing:border-box;
    background:var(--white);
    transform:translate3d(calc(-100% - 32px), 0, 0);
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    z-index:9999;
    box-shadow:none;
  }

  .navbar .navbar-main.show{
    transform:translate3d(0, 0, 0);
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    box-shadow:0 12px 40px rgba(15, 23, 42, 0.12);
  }

  .header-area .container .navbar-main{
    display:flex !important;
    flex-direction:column;
    justify-content:flex-start;
  }

  .mobile-menu-control-bar{
    margin-left:auto;
    flex:0 0 auto;
    position:relative;
    z-index:10;
  }

  .mobile-menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:12px;
  }

  .header-area .container .inner-logo{
    width:100%;
    padding:0;
    overflow:hidden;
    margin-bottom:24px;
  }

  .header-area .container .inner-logo .navbar-brand{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .header-area .container .navbar-info{
    width:100%;
    margin:0 0 24px 0;
  }

  .header-area .navbar-info .nav-item{
    display:block;
    margin-bottom:8px;
  }

  .header-right-info{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    width:100%;
    gap:12px;
    margin-top:auto;
    padding-top:16px;
    overflow:visible;
  }

  .header-area .header-right-info .theme-control-btn{
    width:100%;
    margin-bottom:0;
  }

  .header-area .header-right-info .theme-control-btn span{
    width:100%;
    height:44px;
    padding:0 15px;
    justify-content:flex-start;
    overflow:hidden;
  }

  .header-area .header-right-info .lets-talk-btn{
    width:100%;
    margin-left:0;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
  }

  @media (max-width:1199.98px){

  .navbar .navbar-main{
    padding-bottom:32px;
  }

  .header-right-info{
    padding-bottom:8px;
  }

}
}

