/* === Noonoo-style centered sticky menubar, matched to hero/movie content width === */
:root{
  --noonoo-bar-width: 1280px;
  --noonoo-side-gap: 32px;
  --noonoo-top-gap: 10px;
  --noonoo-bar-bg: rgba(15,13,25,.97);
  --noonoo-border: rgba(117,83,181,.55);
}
html{scroll-padding-top:82px!important;}
body{padding-top:76px!important;}

.site-header{
  position:fixed!important;
  top:var(--noonoo-top-gap)!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(var(--noonoo-bar-width), calc(100% - var(--noonoo-side-gap)))!important;
  max-width:min(var(--noonoo-bar-width), calc(100% - var(--noonoo-side-gap)))!important;
  height:auto!important;
  min-height:0!important;
  padding:7px 16px!important;
  margin:0!important;
  z-index:99999!important;
  box-sizing:border-box!important;
  background:var(--noonoo-bar-bg)!important;
  border:1px solid var(--noonoo-border)!important;
  border-radius:18px!important;
  box-shadow:0 10px 30px rgba(0,0,0,.35)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  overflow:visible!important;
}
.site-header.scrolled{
  top:var(--noonoo-top-gap)!important;
  background:rgba(15,13,25,.985)!important;
  border-color:rgba(126,91,198,.66)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.45)!important;
}
.hd-inner{
  width:100%!important;
  max-width:none!important;
  height:38px!important;
  min-height:38px!important;
  padding:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  gap:20px!important;
  box-sizing:border-box!important;
}
.logo{
  flex:0 0 auto!important;
  margin:0 4px 0 0!important;
  font-size:26px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-1.3px!important;
  color:var(--acc,#12e38b)!important;
  white-space:nowrap!important;
}
.nav-tog{display:none!important;}
.gnb{
  display:flex!important;
  align-items:center!important;
  flex:1 1 auto!important;
  gap:0!important;
  min-width:0!important;
  overflow:hidden!important;
}
.gnb a{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:38px!important;
  padding:0 13px!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#b9b5d3!important;
  font-size:13px!important;
  font-weight:800!important;
  letter-spacing:-.2px!important;
  line-height:38px!important;
  white-space:nowrap!important;
  transition:color .18s ease!important;
}
.gnb a .ni{display:none!important;}
.gnb a::after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  bottom:0!important;
  width:0!important;
  height:2px!important;
  border-radius:999px!important;
  background:var(--acc,#12e38b)!important;
  transform:translateX(-50%)!important;
  transition:width .18s ease!important;
}
.gnb a:hover,.gnb a.active{
  color:#fff!important;
  background:transparent!important;
}
.gnb a:hover::after,.gnb a.active::after{width:16px!important;}
.hd-search{
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  margin-left:auto!important;
  height:34px!important;
}
.s-form{
  display:flex!important;
  align-items:center!important;
  width:220px!important;
  height:34px!important;
  margin:0!important;
}
.s-input{
  display:block!important;
  width:180px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0 12px!important;
  margin:0!important;
  box-sizing:border-box!important;
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-right:none!important;
  border-radius:9px 0 0 9px!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:500!important;
  outline:none!important;
  box-shadow:none!important;
}
.s-input:focus{
  width:180px!important;
  border-color:rgba(18,227,139,.45)!important;
  background:rgba(255,255,255,.08)!important;
}
.s-input::placeholder{color:#77718f!important;}
.s-btn{
  width:40px!important;
  min-width:40px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0 9px 9px 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:18px!important;
  font-weight:900!important;
  line-height:34px!important;
  background:var(--acc,#12e38b)!important;
  color:var(--atx,#07110d)!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
main#main,#main{padding-top:0!important;}
.home-hero,.home-hero-inner,.hero,.hero-wrap,.main-hero,.hero-section{margin-top:0!important;}

@media (min-width:1401px){
  :root{--noonoo-bar-width:1400px;--noonoo-side-gap:44px;}
}
@media (max-width:1024px){
  :root{--noonoo-side-gap:16px;--noonoo-top-gap:8px;}
  html{scroll-padding-top:68px!important;}
  body{padding-top:64px!important;}
  .site-header{width:calc(100% - 16px)!important;max-width:calc(100% - 16px)!important;padding:7px 12px!important;border-radius:15px!important;}
  .hd-inner{height:36px!important;min-height:36px!important;gap:12px!important;}
  .logo{font-size:22px!important;}
  .nav-tog{display:inline-flex!important;order:3;margin-left:auto!important;width:34px!important;height:34px!important;}
  .gnb{display:none!important;}
  .hd-search{display:none!important;}
}
@media (max-width:520px){
  :root{--noonoo-side-gap:12px;--noonoo-top-gap:6px;}
  html{scroll-padding-top:62px!important;}
  body{padding-top:60px!important;}
  .site-header{width:calc(100% - 12px)!important;max-width:calc(100% - 12px)!important;padding:6px 10px!important;border-radius:14px!important;}
  .hd-inner{height:34px!important;min-height:34px!important;}
  .logo{font-size:20px!important;}
}

/* === FINAL FIX: menu bar width matches poster grid/content width === */
:root{
  --noonoo-bar-width: 1400px !important;
  --noonoo-side-gap: 12px !important;
  --noonoo-top-gap: 6px !important;
}
html{scroll-padding-top:78px!important;}
body{padding-top:72px!important;}
.site-header{
  position:fixed!important;
  top:var(--noonoo-top-gap)!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(1400px, calc(100% - 12px))!important;
  max-width:min(1400px, calc(100% - 12px))!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  padding:9px 18px!important;
  margin:0!important;
  border-radius:18px!important;
  box-sizing:border-box!important;
  z-index:99999!important;
}
.hd-inner{
  width:100%!important;
  max-width:none!important;
  height:40px!important;
  min-height:40px!important;
  padding:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  gap:20px!important;
  box-sizing:border-box!important;
}
.logo{font-size:27px!important;line-height:40px!important;}
.gnb a{height:40px!important;line-height:40px!important;padding:0 14px!important;font-size:13px!important;}
.hd-search{height:36px!important;}
.s-form{width:220px!important;height:36px!important;}
.s-input{width:180px!important;height:36px!important;min-height:36px!important;}
.s-input:focus{width:180px!important;}
.s-btn{width:40px!important;min-width:40px!important;height:36px!important;min-height:36px!important;}
.home-hero,
.page-wrap,
.home-content,
.wrap{
  max-width:1400px!important;
}
@media (min-width:1401px){
  .site-header{width:1400px!important;max-width:1400px!important;}
}
@media (max-width:1024px){
  body{padding-top:66px!important;}
  .site-header{width:calc(100% - 12px)!important;max-width:calc(100% - 12px)!important;padding:8px 12px!important;border-radius:15px!important;}
  .hd-inner{height:36px!important;min-height:36px!important;}
  .logo{font-size:22px!important;line-height:36px!important;}
}
@media (max-width:520px){
  body{padding-top:60px!important;}
  .site-header{width:calc(100% - 10px)!important;max-width:calc(100% - 10px)!important;padding:7px 10px!important;border-radius:14px!important;}
  .hd-inner{height:34px!important;min-height:34px!important;}
  .logo{font-size:20px!important;line-height:34px!important;}
}

/* === USER FINAL: poster-grid aligned compact header === */
:root{
  --noonoo-bar-width:1340px!important;
  --noonoo-side-gap:48px!important;
  --noonoo-top-gap:8px!important;
}
html{scroll-padding-top:78px!important;}
body{padding-top:74px!important;}
.site-header{
  position:fixed!important;
  top:8px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(1340px, calc(100% - 48px))!important;
  max-width:min(1340px, calc(100% - 48px))!important;
  padding:9px 14px!important;
  border-radius:18px!important;
  box-sizing:border-box!important;
}
.hd-inner{
  height:40px!important;
  min-height:40px!important;
  width:100%!important;
  max-width:none!important;
  gap:18px!important;
  padding:0!important;
}
.logo{
  font-size:22px!important;
  line-height:40px!important;
  letter-spacing:-1px!important;
  margin-right:14px!important;
}
.gnb a{
  height:40px!important;
  line-height:40px!important;
  padding:0 12px!important;
  font-size:12px!important;
  font-weight:800!important;
}
.hd-search{height:36px!important;}
.s-form{width:210px!important;height:36px!important;}
.s-input,.s-input:focus{width:170px!important;height:36px!important;min-height:36px!important;font-size:12px!important;}
.s-btn{width:40px!important;min-width:40px!important;height:36px!important;min-height:36px!important;}
@media (min-width:1400px){
  .site-header{width:1340px!important;max-width:1340px!important;}
}
@media (max-width:1024px){
  :root{--noonoo-side-gap:16px!important;--noonoo-top-gap:8px!important;}
  body{padding-top:66px!important;}
  .site-header{width:calc(100% - 16px)!important;max-width:calc(100% - 16px)!important;padding:8px 12px!important;border-radius:15px!important;}
  .hd-inner{height:36px!important;min-height:36px!important;}
  .logo{font-size:20px!important;line-height:36px!important;}
}
@media (max-width:520px){
  body{padding-top:60px!important;}
  .site-header{width:calc(100% - 10px)!important;max-width:calc(100% - 10px)!important;padding:7px 10px!important;border-radius:14px!important;}
  .hd-inner{height:34px!important;min-height:34px!important;}
  .logo{font-size:19px!important;line-height:34px!important;}
}

/* === FINAL EXACT 1378px HEADER ALIGNMENT === */
:root{
  --noonoo-bar-width:1378px!important;
  --noonoo-side-gap:12px!important;
  --noonoo-top-gap:6px!important;
}
html{scroll-padding-top:76px!important;}
body{padding-top:72px!important;}
.site-header{
  position:fixed!important;
  top:6px!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:1378px!important;
  max-width:calc(100% - 12px)!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  padding:8px 14px!important;
  margin:0!important;
  border-radius:18px!important;
  box-sizing:border-box!important;
  z-index:99999!important;
}
.hd-inner{
  width:100%!important;
  max-width:none!important;
  height:40px!important;
  min-height:40px!important;
  padding:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  gap:17px!important;
  box-sizing:border-box!important;
}
.logo{
  font-size:17px!important;
  line-height:40px!important;
  letter-spacing:-.5px!important;
  margin:0 14px 0 0!important;
  white-space:nowrap!important;
}
.gnb a{
  height:40px!important;
  line-height:40px!important;
  padding:0 12px!important;
  font-size:12px!important;
  font-weight:800!important;
}
.hd-search{height:36px!important;margin-left:auto!important;}
.s-form{width:210px!important;height:36px!important;}
.s-input,.s-input:focus{width:170px!important;height:36px!important;min-height:36px!important;font-size:12px!important;}
.s-btn{width:40px!important;min-width:40px!important;height:36px!important;min-height:36px!important;}
@media (max-width:1390px){
  .site-header{width:calc(100% - 12px)!important;max-width:calc(100% - 12px)!important;}
}
@media (max-width:1024px){
  body{padding-top:66px!important;}
  .site-header{width:calc(100% - 16px)!important;max-width:calc(100% - 16px)!important;padding:8px 12px!important;border-radius:15px!important;}
  .hd-inner{height:36px!important;min-height:36px!important;gap:12px!important;}
  .logo{font-size:17px!important;line-height:36px!important;}
}
@media (max-width:520px){
  body{padding-top:60px!important;}
  .site-header{width:calc(100% - 10px)!important;max-width:calc(100% - 10px)!important;padding:7px 10px!important;border-radius:14px!important;}
  .hd-inner{height:34px!important;min-height:34px!important;}
  .logo{font-size:17px!important;line-height:34px!important;}
}