/* Neverland v9.6.7 R3 final public UI polish
   Goals: persistent fixed public navigation, stable teacher entry alignment,
   recruitment AI assistant restored without covering LINE conversion actions,
   and remaining collision fixes. */

/* Keep the public navigation visible like the floating AI assistant.
   The body reserves the header height so the fixed bar never covers the hero. */
html{scroll-padding-top:104px!important}
body.visual-page{padding-top:clamp(58px,5.1vw,76px)!important}
.visual-page > .site-header{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  z-index:950!important;
  width:min(calc(100% - 48px),1480px);
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  isolation:isolate;
}
.visual-page .nav-pill{
  min-width:0;
  border-radius:0 0 30px 30px;
  align-items:center;
  box-shadow:0 8px 28px rgba(4,74,145,.12);
}
.visual-page #mainNav{
  justify-content:flex-end;
  gap:clamp(11px,1.25vw,22px);
}
.visual-page #mainNav>a{flex:0 0 auto}
.visual-page .hero{margin-top:0}

/* Fixed header now sits outside normal flow via body padding, so hero copy can use
   its intended internal spacing without reserving a second fake header gap. */
@media(min-width:561px){
  .visual-page .hero-content{padding-top:clamp(48px,5.2vw,76px)!important}
  .visual-page .hero-wash{inset:0 auto 0 0!important}
}

/* Teacher entry remains a first-class top navigation control. */
.visual-page #mainNav .teacher-entry{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  flex:0 0 auto;
  min-height:34px;
  margin:0;
  padding:7px 13px;
  border:1px solid #b9d9fb;
  border-radius:999px;
  background:#eef7ff;
  color:#075ebd;
  font-size:13px;
  font-weight:850;
  line-height:1.2;
}
.visual-page #mainNav .teacher-entry:hover,
.visual-page #mainNav .teacher-entry:focus-visible{
  color:#004da5;
  background:#e1f1ff;
}
.visual-page .nav-cta{
  align-self:center;
  flex:0 0 auto;
  margin:0;
}

/* At narrower desktop widths, keep teacher access and avoid squeezing the nav. */
@media(max-width:1180px) and (min-width:901px){
  .visual-page > .site-header{width:calc(100% - 24px);gap:10px}
  .visual-page .nav-cta{display:none!important}
  .visual-page .nav-pill{padding-inline:18px;gap:14px}
  .visual-page #mainNav{gap:9px}
  .visual-page #mainNav>a{font-size:13px}
  .visual-page #mainNav .teacher-entry{font-size:12px;padding:7px 10px}
}

@media(max-width:900px){
  html{scroll-padding-top:82px!important}
  body.visual-page{padding-top:65px!important}
  .visual-page > .site-header{
    position:fixed!important;
    top:0!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100% - 24px);
    margin:0;
    display:block;
    z-index:950!important;
  }
  .visual-page .nav-pill{width:100%}
  .visual-page #mainNav{z-index:960}
  .visual-page #mainNav .teacher-entry{
    display:flex;
    width:100%;
    margin-top:5px;
    padding:11px 12px;
    font-size:15px;
  }
  .visual-page .hero-wash{top:0!important}
}

/* Mobile heroes intentionally place the image above copy; retain v9.6.6 layout. */
@media(max-width:560px){
  body.visual-page{padding-top:65px!important}
  .visual-page .hero-wash{top:285px!important;inset:285px 0 0!important}
  .visual-page .hero-content{padding:350px 20px 32px!important}
  .visual-page > .site-header{width:calc(100% - 16px)}
}

/* Keep the word 「開始」 intact instead of allowing CJK line breaking mid-word. */
.page-home .hero-content h1 .hero-keep{
  white-space:nowrap;
  color:inherit!important;
}

/* Fixed navigation needs anchor breathing room. */
.visual-page #strengths,
.visual-page #application,
.visual-page #contact,
.visual-page #gallery{scroll-margin-top:104px}
@media(max-width:900px){
  .visual-page #strengths,
  .visual-page #application,
  .visual-page #contact,
  .visual-page #gallery{scroll-margin-top:82px}
}

/* Recruitment: AI assistant must remain available. Keep conversion controls above
   ordinary content and reserve enough bottom/right breathing room so LINE actions
   stay visible and clickable beside the fixed assistant. */
.page-recruit .neverland-ai-launch{display:block!important;z-index:900!important}
.page-recruit .neverland-ai-panel{z-index:901!important}
.page-recruit .application-details,
.page-recruit .cosmos-cta{position:relative;z-index:2}
.page-recruit .application-grid aside .button[href*="lin.ee"],
.page-recruit a[data-site-link="recruitLine"]{position:relative;z-index:3}
.page-recruit .cosmos-cta .hero-actions{position:relative;z-index:3}
.page-recruit .site-footer{padding-bottom:110px!important}
.page-recruit .application-details{margin-bottom:28px}

@media(max-width:900px){
  .page-recruit .neverland-ai-launch{
    right:12px!important;
    bottom:12px!important;
    padding:10px 14px!important;
    font-size:13px!important;
  }
  .page-recruit .neverland-ai-panel{
    right:12px!important;
    bottom:70px!important;
    width:min(360px,calc(100vw - 24px))!important;
  }
  .page-recruit .application-details{padding-bottom:76px}
  .page-recruit .cosmos-cta{padding-bottom:88px!important}
  .page-recruit .site-footer{padding-bottom:100px!important}
}

/* On other phone pages, leave room for the assistant without covering final actions. */
@media(max-width:560px){
  .visual-page:not(.page-recruit) .site-footer{padding-bottom:92px}
}