/*
 * Atlobni - Premium Mobile Navigation
 * Mobile only. Does not affect desktop/tablet layouts.
 */
@media (max-width:760px){
  .site-header .main-nav{
    width:min(340px,88vw)!important;
    padding:78px 16px 24px!important;
    background:#fff!important;
    border:1px solid #e7eef1!important;
    border-radius:0 0 0 22px!important;
    box-shadow:-18px 0 55px rgba(16,43,61,.20)!important;
  }

  .site-header .main-nav::after{
    content:""!important;
    position:absolute!important;
    top:0!important;
    right:0!important;
    left:0!important;
    height:4px!important;
    background:linear-gradient(90deg,#08ae7b,#0c2c43)!important;
  }

  .site-header .mobile-nav-title{
    top:23px!important;
    right:20px!important;
    color:#0c2c43!important;
    font-size:17px!important;
    font-weight:800!important;
    letter-spacing:.1px!important;
  }

  .site-header .mobile-nav-close{
    top:16px!important;
    left:16px!important;
    width:40px!important;
    height:40px!important;
    border:1px solid #dbe6eb!important;
    border-radius:12px!important;
    background:#f6f9fa!important;
    color:#17384c!important;
    font-size:26px!important;
    font-weight:400!important;
    line-height:38px!important;
    box-shadow:0 4px 12px rgba(16,43,61,.06)!important;
    transition:all .18s ease!important;
  }

  .site-header .mobile-nav-close:hover,
  .site-header .mobile-nav-close:active{
    background:#08ae7b!important;
    border-color:#08ae7b!important;
    color:#fff!important;
    transform:rotate(3deg)!important;
  }

  .site-header .main-nav a{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:12px!important;
    min-height:58px!important;
    margin:0!important;
    padding:0 13px!important;
    border-radius:0!important;
    border-bottom:1px solid #e9eff2!important;
    background:#fff!important;
    color:#17384c!important;
    font-size:15px!important;
    font-weight:700!important;
    transition:background .16s ease,color .16s ease,padding .16s ease!important;
  }

  .site-header .main-nav a:last-child{border-bottom:0!important}

  .site-header .main-nav a::before{
    content:""!important;
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:10px!important;
    background:#f1f7f8!important;
    color:#0c8f6b!important;
    font-size:17px!important;
    font-weight:700!important;
    line-height:1!important;
    font-family:Arial,sans-serif!important;
    border:1px solid #e2ecef!important;
  }

  /* Icons for the current menu order. */
  .site-header .main-nav a:nth-of-type(1)::before{content:"⌂"!important;font-size:21px!important}
  .site-header .main-nav a:nth-of-type(2)::before{content:"♙"!important;font-size:19px!important}
  .site-header .main-nav a:nth-of-type(3)::before{content:"▦"!important;font-size:18px!important}
  .site-header .main-nav a:nth-of-type(4)::before{content:"?"!important;font-size:18px!important}
  .site-header .main-nav a:nth-of-type(5)::before{content:"◈"!important;font-size:18px!important}
  .site-header .main-nav a:nth-of-type(6)::before{content:"⌕"!important;font-size:22px!important}

  .site-header .main-nav a.active{
    color:#078b67!important;
    background:#f7fbfa!important;
  }

  .site-header .main-nav a.active::before{
    background:#e5f7f1!important;
    border-color:#c6ecdf!important;
    color:#078b67!important;
  }

  .site-header .main-nav a:hover,
  .site-header .main-nav a:active{
    color:#078b67!important;
    background:#f8fbfa!important;
    padding-right:16px!important;
  }

  .site-header .mobile-nav-overlay{
    background:rgba(7,25,37,.52)!important;
    backdrop-filter:blur(2px)!important;
    -webkit-backdrop-filter:blur(2px)!important;
  }
}

@media (min-width:761px){
  .site-header .main-nav a::before{content:none!important}
}