/* =========================================================
   NOAH AI SCHOOL HOME UI V5 FIX - 2026-06-25
   只做前端展示层修复：Header固定显示、搜索按钮、登录按钮、首页右侧头条、今日推荐卡片与语种切换。
========================================================= */
:root{
  --noah-v5-navy:#07152e;
  --noah-v5-blue:#1677ff;
  --noah-v5-cyan:#28d7ff;
  --noah-v5-text:#0f172a;
  --noah-v5-muted:#64748b;
  --noah-v5-border:rgba(22,119,255,.18);
  --noah-v5-shadow:0 18px 44px rgba(15,37,84,.12);
}
html body.web-index .web_header,
html body .web_header{
  position:sticky!important;
  top:0!important;
  z-index:10000!important;
  min-height:88px!important;
  height:88px!important;
  overflow:visible!important;
  background:rgba(255,255,255,.98)!important;
  border-bottom:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 14px 36px rgba(15,37,84,.08)!important;
}
html body.web-index .headerah,
html body.web-index .headerlg,
html body .headerah,
html body .headerlg{
  min-height:88px!important;
  height:88px!important;
  overflow:visible!important;
}
html body.web-index .headerlg,
html body .headerlg{
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  width:calc(100% - 64px)!important;
  max-width:1240px!important;
  margin:0 auto!important;
  padding:0!important;
}
html body.web-index .weblogo,
html body .weblogo{
  flex:0 0 154px!important;
  width:154px!important;
  height:66px!important;
  margin:0!important;
  float:none!important;
  display:flex!important;
  align-items:center!important;
  overflow:visible!important;
}
html body.web-index .weblogo a,
html body .weblogo a{
  display:block!important;
  width:154px!important;
  height:58px!important;
  background:url(https://www.nuoyazhijie.com/logo.png) left center/contain no-repeat!important;
}
html body.web-index .webnav,
html body.web-index .wb-main-nav,
html body .webnav,
html body .wb-main-nav{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex:1 1 auto!important;
  min-width:300px!important;
  width:auto!important;
  height:88px!important;
  margin:0!important;
  padding:0!important;
  float:none!important;
  overflow:visible!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.web-index .webnav>li,
html body .webnav>li{
  display:block!important;
  float:none!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.web-index .webnav>li[style*="display: none"],
html body .webnav>li[style*="display: none"]{display:none!important;}
html body.web-index .webnavag,
html body.web-index .webnavtit,
html body .webnavag,
html body .webnavtit{
  display:block!important;
  float:none!important;
  width:auto!important;
  height:auto!important;
  line-height:normal!important;
  overflow:visible!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.web-index .webnav li .webnavag .webnavtit a,
html body.web-index .webnavtit>a,
html body .webnav li .webnavag .webnavtit a,
html body .webnavtit>a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:auto!important;
  height:42px!important;
  line-height:42px!important;
  padding:0 13px!important;
  border-radius:999px!important;
  background:rgba(248,251,255,.75)!important;
  border:1px solid rgba(22,119,255,.08)!important;
  color:var(--noah-v5-text)!important;
  text-decoration:none!important;
  text-indent:0!important;
  opacity:1!important;
  visibility:visible!important;
  white-space:nowrap!important;
}
html body.web-index .webnav li .webnavag .webnavtit a h2,
html body.web-index .webnavtit>a h2,
html body .webnav li .webnavag .webnavtit a h2,
html body .webnavtit>a h2{
  display:inline-block!important;
  float:none!important;
  width:auto!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  line-height:42px!important;
  color:var(--noah-v5-text)!important;
  font-size:15px!important;
  font-weight:900!important;
  text-indent:0!important;
  opacity:1!important;
  visibility:visible!important;
  overflow:visible!important;
  white-space:nowrap!important;
}
html body.web-index .webnav li .webnavag .webnavtit a b,
html body .webnav li .webnavag .webnavtit a b{
  display:inline-block!important;
  float:none!important;
  flex:0 0 9px!important;
  margin:0 0 0 7px!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.web-index .webnav li .webnavag .webnavtit a:hover,
html body.web-index .webnavtit>a.hover,
html body .webnav li .webnavag .webnavtit a:hover,
html body .webnavtit>a.hover{
  color:#0757d8!important;
  background:linear-gradient(135deg,rgba(22,119,255,.13),rgba(40,215,255,.13))!important;
  border-color:rgba(22,119,255,.22)!important;
}
html body.web-index .web_navcb,
html body .web_navcb{
  top:42px!important;
  min-width:178px!important;
  border:1px solid rgba(22,119,255,.14)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 20px 50px rgba(15,37,84,.16)!important;
  overflow:hidden!important;
}
html body.web-index #ey_htmlid_1609665117,
html body.web-index .web-louser,
html body.web-index .web_serch,
html body #ey_htmlid_1609665117,
html body .web-louser,
html body .web_serch{
  display:flex!important;
  align-items:center!important;
  float:none!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.web-index .web-louser,
html body .web-louser{gap:10px!important;}
html body.web-index .web-louser li,
html body.web-index .web-louser li span,
html body .web-louser li,
html body .web-louser li span{display:block!important;float:none!important;margin:0!important;padding:0!important;}
html body.web-index .web-louser li span a,
html body .web-louser li span a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:62px!important;
  height:40px!important;
  line-height:40px!important;
  padding:0 18px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#1677ff,#28d7ff)!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:950!important;
  box-shadow:0 14px 30px rgba(22,119,255,.24)!important;
  text-decoration:none!important;
}
html body.web-index .web-louser li+li span a,
html body .web-louser li+li span a{
  background:#f1f5f9!important;
  color:#172033!important;
  box-shadow:none!important;
}
html body.web-index .web_serch form,
html body .web_serch form{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  width:230px!important;
  height:42px!important;
  margin:0!important;
  padding:0 3px 0 0!important;
  border:1px solid rgba(22,119,255,.18)!important;
  border-radius:999px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 10px 28px rgba(15,37,84,.06)!important;
}
html body.web-index .web_serch .text1,
html body .web_serch .text1{
  display:block!important;
  flex:1 1 auto!important;
  width:auto!important;
  min-width:0!important;
  height:40px!important;
  line-height:40px!important;
  padding:0 10px 0 18px!important;
  border:0!important;
  outline:none!important;
  color:#64748b!important;
  background:transparent!important;
}
html body.web-index .web_serch .submit1,
html body .web_serch .submit1{
  display:block!important;
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  cursor:pointer!important;
  opacity:1!important;
  visibility:visible!important;
  background-color:#1677ff!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E"),linear-gradient(135deg,#1677ff,#28d7ff)!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:18px 18px,100% 100%!important;
}
html body.web-index .wb-lang-switcher.noah-header-lang,
html body.web-index #wbLangSwitcher.noah-header-lang,
html body .wb-lang-switcher.noah-header-lang,
html body #wbLangSwitcher.noah-header-lang{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:5px!important;
  border-radius:999px!important;
  border:1px solid rgba(22,119,255,.15)!important;
  background:#f8fbff!important;
  box-shadow:none!important;
}
html body.web-index .wb-lang-switcher.noah-header-lang button,
html body #wbLangSwitcher.noah-header-lang button{
  min-width:62px!important;
  height:34px!important;
  padding:0 12px!important;
  border-radius:999px!important;
  color:#475569!important;
  font-weight:850!important;
}
html body.web-index .wb-lang-switcher.noah-header-lang button.is-active,
html body #wbLangSwitcher.noah-header-lang button.is-active{
  color:#fff!important;
  background:linear-gradient(135deg,#1677ff,#28d7ff)!important;
}

/* HOME 首屏右侧头条：重新生成 1 大图 + 3 小条 */
html body.web-index .web_tout{
  height:430px!important;
  min-height:430px!important;
  padding:22px!important;
  border-radius:26px!important;
  overflow:hidden!important;
}
html body.web-index .wb-headline-title{
  height:34px!important;
  margin:0 0 14px!important;
  color:var(--noah-v5-text)!important;
}
html body.web-index .wb-headline-grid{display:none!important;}
html body.web-index .noah-headline-layout{
  display:grid!important;
  grid-template-rows:180px repeat(3,56px)!important;
  gap:10px!important;
  height:348px!important;
  overflow:hidden!important;
}
html body.web-index .noah-headline-item{
  display:grid!important;
  grid-template-columns:78px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  min-height:56px!important;
  padding:8px!important;
  border-radius:16px!important;
  background:#fff!important;
  border:1px solid rgba(22,119,255,.12)!important;
  box-shadow:0 8px 20px rgba(15,37,84,.07)!important;
  color:#0f172a!important;
  text-decoration:none!important;
  overflow:hidden!important;
}
html body.web-index .noah-headline-item img{
  width:78px!important;
  height:42px!important;
  object-fit:cover!important;
  border-radius:11px!important;
  background:#e8eef6!important;
}
html body.web-index .noah-headline-item span{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  color:#0f172a!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:900!important;
}
html body.web-index .noah-headline-item.is-feature{
  position:relative!important;
  display:block!important;
  min-height:180px!important;
  padding:0!important;
  background:#07152e!important;
  border-radius:22px!important;
}
html body.web-index .noah-headline-item.is-feature:after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(7,21,46,.08),rgba(7,21,46,.82))!important;
  pointer-events:none!important;
}
html body.web-index .noah-headline-item.is-feature img{
  width:100%!important;
  height:180px!important;
  border-radius:22px!important;
  object-fit:cover!important;
}
html body.web-index .noah-headline-item.is-feature span{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:13px!important;
  z-index:2!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1.38!important;
  font-weight:950!important;
  text-shadow:0 5px 18px rgba(0,0,0,.38)!important;
}

/* 今日推荐标题与更多按钮 */
html body.web-index .webjrtit{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  height:auto!important;
  margin:0 0 24px!important;
  padding:0!important;
}
html body.web-index .webjrtit h2{
  flex:0 0 auto!important;
  margin:0!important;
  line-height:1.2!important;
}
html body.web-index .wb-today-more,
html body.web-index .wb-today-more.notranslate{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  min-width:128px!important;
  max-width:none!important;
  height:42px!important;
  line-height:42px!important;
  padding:0 24px!important;
  margin-left:10px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,rgba(22,119,255,.12),rgba(40,215,255,.15))!important;
  border:1px solid rgba(22,119,255,.20)!important;
  color:#0757d8!important;
  font-size:14px!important;
  font-weight:950!important;
  white-space:nowrap!important;
  text-decoration:none!important;
  overflow:visible!important;
}
html body.web-index[data-noah-lang="ja"] .wb-today-more,
html body.web-index.noah-lang-ja .wb-today-more{
  min-width:166px!important;
  padding:0 26px!important;
  font-size:14px!important;
}

/* 今日推荐课程卡片：补边框、补高度，避免价格被挡 */
html body.web-index .noah-today-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:22px!important;
  overflow:visible!important;
}
html body.web-index .noah-today-card{
  display:flex!important;
  flex-direction:column!important;
  min-height:238px!important;
  height:auto!important;
  overflow:hidden!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid #dbeafe!important;
  box-shadow:0 16px 34px rgba(15,37,84,.08)!important;
  color:#0f172a!important;
  text-decoration:none!important;
}
html body.web-index .noah-today-thumb{
  flex:0 0 132px!important;
  width:100%!important;
  height:132px!important;
  object-fit:cover!important;
  border-radius:22px 22px 0 0!important;
  border-bottom:1px solid #e6eefb!important;
  background:#eaf0f8!important;
}
html body.web-index .noah-today-body{
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  flex:1 1 auto!important;
  min-height:104px!important;
  padding:13px 14px 14px!important;
  overflow:visible!important;
  background:#fff!important;
}
html body.web-index .noah-today-title{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  min-height:40px!important;
  max-height:42px!important;
  overflow:hidden!important;
  color:#0f172a!important;
  font-size:14px!important;
  line-height:1.43!important;
  font-weight:900!important;
}
html body.web-index .noah-today-price{
  display:block!important;
  min-height:20px!important;
  margin-top:10px!important;
  color:#ff5a1f!important;
  font-size:14px!important;
  line-height:20px!important;
  font-weight:950!important;
  overflow:visible!important;
}
html body.web-index .webtoday.noah-v5-today-ready .wb-today-feed,
html body.web-index .webtoday.noah-v5-today-ready .wb-today-dynamic,
html body.web-index .webtoday.noah-v5-today-ready .zsff_banner:not(.noah-keep-original){display:none!important;}

@media (max-width:1180px){
  html body.web-index .headerlg{gap:12px!important;width:calc(100% - 28px)!important;}
  html body.web-index .weblogo{flex-basis:130px!important;width:130px!important;}
  html body.web-index .weblogo a{width:130px!important;}
  html body.web-index .webnav li .webnavag .webnavtit a{padding:0 10px!important;}
  html body.web-index .webnav li .webnavag .webnavtit a h2{font-size:14px!important;}
  html body.web-index .web_serch form{width:200px!important;}
}
@media (max-width:960px){
  html body.web-index .web_header{height:auto!important;min-height:96px!important;}
  html body.web-index .headerlg{height:auto!important;min-height:96px!important;flex-wrap:wrap!important;padding:12px 0!important;}
  html body.web-index .webnav{order:3!important;width:100%!important;height:auto!important;overflow-x:auto!important;}
  html body.web-index .noah-today-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  html body.web-index .noah-headline-layout{grid-template-rows:160px repeat(3,58px)!important;height:auto!important;}
}