/*
 * YJ Water Mega Menu v1.6.1
 * Strictly namespaced for the /water/ education portal.
 * IMPORTANT: no generic .navbar/.nav-item/.dropdown/header/nav selectors are used.
 */
.yjwm-mega-nav,
.yjwm-mega-nav *{box-sizing:border-box}

.yjwm-mega-nav{
  --yjwm-blue:#00779f;
  --yjwm-text:#29465d;
  --yjwm-muted:#8093a1;
  --yjwm-line:#dbe5ea;
  position:relative;
  z-index:900;
  width:100%;
  overflow:visible!important;
  background:#fff;
  border-top:1px solid #e8eef2;
  border-bottom:1px solid var(--yjwm-line);
  font-family:inherit;
}

.yjwm-mega-nav__inner{
  width:min(1180px,calc(100% - 32px));
  min-height:68px;
  margin:0 auto;
  display:flex;
  align-items:stretch;
  gap:14px;
  overflow:visible!important;
}

.yjwm-mega-nav__main{
  position:relative;
  min-width:0;
  flex:1 1 auto;
  display:flex;
  align-items:stretch;
  overflow:visible!important;
}

.yjwm-mega-nav__home{
  min-width:0;
}

.yjwm-mega-nav__zone{
  position:relative;
  min-width:0;
  width:100%;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:stretch;
  overflow:visible!important;
}

.yjwm-mega-nav__top{
  min-width:0;
  padding:13px 12px 11px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  text-decoration:none!important;
  color:var(--yjwm-text)!important;
  background:#fff!important;
  border:0!important;
  border-bottom:3px solid transparent!important;
  line-height:1.15;
  text-align:left;
}

.yjwm-mega-nav__top strong{
  display:block;
  font-size:15px;
  font-weight:800;
  white-space:nowrap;
}

.yjwm-mega-nav__top > span{
  display:block;
  margin-top:5px;
  overflow:hidden;
  color:var(--yjwm-muted)!important;
  font-size:10px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.yjwm-mega-nav__caret{
  display:inline-block!important;
  margin:0 0 0 5px!important;
  color:var(--yjwm-muted)!important;
  font-size:10px!important;
  line-height:1!important;
  vertical-align:2px;
  transition:transform .16s ease;
}

.yjwm-mega-nav__top:hover,
.yjwm-mega-nav__top:focus,
.yjwm-mega-nav__top.is-active{
  color:var(--yjwm-blue)!important;
  background:#f6fbfd!important;
  border-bottom-color:var(--yjwm-blue)!important;
  outline:none;
}

.yjwm-mega-nav__zone:hover .yjwm-mega-nav__caret,
.yjwm-mega-nav__zone:focus-within .yjwm-mega-nav__caret{
  transform:rotate(180deg);
  color:var(--yjwm-blue)!important;
}

.yjwm-mega-nav__panel{
  position:absolute;
  top:calc(100% - 1px);
  left:0;
  right:0;
  z-index:99999;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin:0!important;
  padding:18px 18px 20px!important;
  background:#fff;
  border:1px solid #d7e2e8;
  border-top:3px solid #1685ad;
  box-shadow:0 16px 34px rgba(20,50,70,.16);
  opacity:0;
  visibility:hidden;
  transform:translateY(7px);
  pointer-events:none;
  transition:opacity .14s ease,transform .14s ease,visibility .14s ease;
}

.yjwm-mega-nav__zone:hover > .yjwm-mega-nav__panel,
.yjwm-mega-nav__zone:focus-within > .yjwm-mega-nav__panel,
.yjwm-mega-nav__zone.is-open > .yjwm-mega-nav__panel{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}

.yjwm-mega-nav__column{
  min-width:0;
  margin:0!important;
  padding:2px 18px 4px!important;
  border-left:1px solid #edf2f5;
}
.yjwm-mega-nav__column:first-child{border-left:0}

.yjwm-mega-nav__column-title{
  display:block!important;
  margin:0 0 9px!important;
  padding:0 0 9px!important;
  color:#123b57!important;
  background:transparent!important;
  border:0!important;
  border-bottom:1px solid #dce9ef!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.25!important;
  text-decoration:none!important;
}
.yjwm-mega-nav__column-title:hover,
.yjwm-mega-nav__column-title:focus{color:var(--yjwm-blue)!important;outline:none}

.yjwm-mega-nav__column ul{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.yjwm-mega-nav__column li{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.yjwm-mega-nav__column li a{
  display:block!important;
  margin:0!important;
  padding:7px 2px!important;
  color:#466176!important;
  background:transparent!important;
  border:0!important;
  font-size:12.5px!important;
  font-weight:650!important;
  line-height:1.35!important;
  text-align:left!important;
  text-decoration:none!important;
}
.yjwm-mega-nav__column li a:hover,
.yjwm-mega-nav__column li a:focus{
  color:var(--yjwm-blue)!important;
  background:#f4fafc!important;
  outline:none;
}

.yjwm-mega-nav__account{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 0;
}
.yjwm-mega-nav__account > a{
  min-height:36px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#36576d!important;
  background:transparent!important;
  border:0!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.2!important;
  text-decoration:none!important;
  white-space:nowrap;
}
.yjwm-mega-nav__account > a:hover,
.yjwm-mega-nav__account > a:focus{color:var(--yjwm-blue)!important;outline:none}
.yjwm-mega-nav__account .yjwm-mega-nav__classroom{
  color:#006f99!important;
  background:#e8f5fb!important;
  border:1px solid #bcddea!important;
}

.yjwm-mega-nav__mobile-toggle{display:none}

/* Subpages only: the theme header remains intact; this menu lives in the page body. */
body:not(.yj-sta-water-page) .yjwm-mega-nav{margin:0 0 24px}

/* Mobile: use a dedicated scoped toggle; no parent-site menu selectors are touched. */
@media (max-width:900px){
  .yjwm-mega-nav{overflow:hidden!important}
  .yjwm-mega-nav__inner{width:100%;min-height:0;display:block}
  .yjwm-mega-nav__main{display:block}
  .yjwm-mega-nav__zone{display:block}
  .yjwm-mega-nav__home{display:flex!important;min-height:58px}
  .yjwm-mega-nav__zone > .yjwm-mega-nav__top:not(.yjwm-mega-nav__home){display:none!important}
  .yjwm-mega-nav__mobile-toggle{
    width:100%;
    min-height:52px;
    padding:0 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#29465d;
    background:#fff;
    border:0;
    border-top:1px solid #edf2f5;
    font:inherit;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
  }
  .yjwm-mega-nav__panel{
    position:static;
    display:none;
    grid-template-columns:1fr 1fr;
    padding:10px 10px 14px!important;
    border-left:0;
    border-right:0;
    border-bottom:0;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
  }
  .yjwm-mega-nav__zone.is-open > .yjwm-mega-nav__panel{display:grid}
  .yjwm-mega-nav__column{padding:10px 12px!important}
  .yjwm-mega-nav__column:nth-child(odd){border-left:0}
  .yjwm-mega-nav__account{padding:8px 14px;border-top:1px solid #edf2f5}
}

@media (max-width:560px){
  .yjwm-mega-nav__panel{grid-template-columns:1fr}
  .yjwm-mega-nav__column{border-left:0;border-top:1px solid #edf2f5}
  .yjwm-mega-nav__column:first-child{border-top:0}
  .yjwm-mega-nav__account{flex-wrap:wrap}
}

@media (max-width:820px){
  body.yj-sta-water-page .yjwm-mega-nav{display:none}
  body.yj-sta-water-page .yjwm-mega-nav.is-open{display:block}
}