/* Navigation 2.0 */

.ys-site-header{
  border-bottom:1px solid #d9e4f2 !important;
  background:rgba(255,255,255,.88) !important;
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 6px 24px rgba(15,30,60,.08);
}

.ys-site-header.is-scrolled{
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 8px 28px rgba(15,30,60,.12);
}

.ys-site-header .ys-site-header-inner{
  max-width:none !important;
  width:100%;
}

.ys-site-header .ys-site-header-shell{padding-left:20px;padding-right:20px}
.ys-site-header .ys-site-header-row{height:64px}

.ys-site-logo img,
.site-logo img{max-height:30px;width:auto}

.ys-site-brand{letter-spacing:-.02em;color:#12243b}

.ys-site-nav .front-menu{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
}

.ys-site-nav .front-menu li{list-style:none}

.ys-site-nav .front-menu a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 10px;
  border-radius:10px;
  color:#1e2f45;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  word-break:keep-all;
  transition:background-color .18s ease,color .18s ease, box-shadow .18s ease;
}

.ys-site-nav .front-menu a:hover{
  color:#1d5fd1;
  background:#eef4ff;
}

.ys-site-nav .front-menu .current-menu-item > a,
.ys-site-nav .front-menu .current_page_item > a{
  color:#124fb5;
  background:#eaf2ff;
  box-shadow:inset 0 0 0 1px #d5e4fb;
  font-weight:700;
}

@media (min-width: 768px){
  .ys-site-header .ys-site-header-shell{
    padding-left:max(20px, calc((100vw - var(--ys-header-max-width, 1280px)) / 2));
    padding-right:max(20px, calc((100vw - var(--ys-header-max-width, 1280px)) / 2));
  }

  .ys-site-header .ys-site-header-inner{
    display:block;
  }

  .ys-site-header .ys-site-header-row{
    gap:20px;
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    width:100%;
    max-width:none;
    margin:0;
    min-height:64px;
    height:auto;
    padding-top:10px;
    padding-bottom:10px;
  }

  .ys-site-logo,
  .ys-site-brand,
  .ys-site-actions{
    flex:0 0 auto;
  }

  .ys-site-nav{
    flex:1 1 auto;
    min-width:0;
    overflow:visible;
    display:flex;
    align-items:center;
    justify-content:center;
    padding-left:28px;
    padding-right:28px;
  }

  .ys-site-nav .front-menu{
    justify-content:center;
    gap:4px;
    width:100%;
    max-width:none;
    min-width:0;
    margin:0;
    row-gap:6px;
  }

  .ys-site-nav .front-menu a{
    padding:0 10px;
    font-size:13px;
  }

  .ys-site-actions{
    gap:8px !important;
    justify-self:end;
  }
}

@media (min-width: 768px) and (max-width: 1280px){
  .ys-site-nav .front-menu a{
    padding:0 8px;
    font-size:12px;
  }

  .ys-site-nav .front-menu{
    max-width:none;
  }

  .ys-site-search .header-search-wrap{width:164px}
}

@media (min-width: 768px) and (max-width: 1080px){
  .ys-site-header .ys-site-header-row{
    gap:14px;
  }

  .ys-site-nav{
    padding-left:24px;
    padding-right:24px;
  }

  .ys-site-nav .front-menu a{
    padding:0 7px;
    font-size:12px;
  }

  .ys-site-search .header-search-wrap{width:148px}
}

.ys-site-search .header-search-wrap{width:180px}
.ys-site-search .header-search-input{height:34px;line-height:34px;border-radius:9px;border:1px solid #d7e3f1;background:#fff}
.ys-site-search .header-search-input:focus{border-color:#b9d0ef;box-shadow:0 0 0 3px rgba(29,95,209,.12)}
.ys-site-search .header-search-ico{width:20px;height:20px;right:7px;color:#7a8fa8}
.ys-site-search .header-search-ico:hover{color:#1d5fd1}

.ys-auth-login,
.ys-auth-register{
  min-height:36px;
  border-radius:10px !important;
  font-size:13px;
  font-weight:700;
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.ys-auth-login{border:1px solid #cfdbeb !important;color:#24405e !important;background:#fff}
.ys-auth-login:hover{background:#f5f9ff !important;color:#1d5fd1 !important;transform:translateY(-1px)}

.ys-auth-register{background:#1d5fd1 !important;color:#fff !important;border:1px solid transparent !important;box-shadow:0 8px 16px rgba(29,95,209,.22)}
.ys-auth-register:hover{background:#114fb5 !important;color:#fff !important;transform:translateY(-1px)}

.ys-user-wrap{min-width:190px}

.ys-user-trigger{
  min-height:38px;
  border-radius:10px !important;
  border:1px solid transparent;
  color:#233a54 !important;
}

.ys-user-trigger:hover{
  background:#f3f7fe !important;
  border-color:#d8e2f0;
}

.ys-user-panel{
  min-width:220px;
  left:auto !important;
  right:0 !important;
  border:1px solid #d8e3f1 !important;
  border-radius:12px !important;
  box-shadow:0 16px 38px rgba(9,30,66,.14) !important;
}

.ys-user-item{
  min-height:38px;
  font-size:13px;
  color:#334b67 !important;
}

.ys-user-item:hover{background:#f3f7fe !important;color:#114fb5 !important}
.ys-user-item-logout:hover{background:#fff1f1 !important;color:#be2f2f !important}

.ys-mobile-toggle{
  min-width:38px;
  min-height:38px;
  border-radius:10px !important;
  border:1px solid #d2dfef !important;
  background:#fff;
  color:#264463;
}

.ys-mobile-toggle:hover{background:#f2f7ff;color:#1d5fd1}

.ys-mobile-nav{
  border-top:1px solid #d9e4f2 !important;
  background:rgba(255,255,255,.98) !important;
  box-shadow:0 18px 30px rgba(9,30,66,.1);
}

.ys-mobile-nav-shell{padding-top:10px;padding-bottom:12px}

.ys-mobile-nav .front-mobile-menu{gap:4px !important}

.ys-mobile-nav .front-mobile-menu a{
  display:flex;
  align-items:center;
  min-height:40px;
  border-radius:10px;
  padding:0 12px;
  font-size:14px;
  font-weight:600;
  color:#213a56;
}

.ys-mobile-nav .front-mobile-menu a:hover{
  background:#edf4ff;
  color:#1d5fd1;
}

.ys-mobile-auth{margin-top:10px !important}

.ys-mobile-login,
.ys-mobile-register{
  min-height:40px;
  border-radius:10px !important;
  font-size:13px;
  font-weight:700;
}

.ys-mobile-login{border:1px solid #d2dfef !important;color:#24405e !important;background:#fff}
.ys-mobile-register{background:#1d5fd1 !important;color:#fff !important}

.ys-mobile-account-label{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid #e3ebf6;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  color:#7b8fa7;
}

.front-mobile-account-menu{
  border-top:none !important;
  padding-top:0 !important;
  margin-top:6px !important;
}

.front-mobile-account-menu a.is-logout{
  color:#b03030;
}

.front-mobile-account-menu a.is-logout:hover{
  color:#b03030;
  background:#fff1f1;
}

@media (max-width: 900px){
  .ys-site-header .ys-site-header-shell{padding-left:14px;padding-right:14px}
}
