/* =========================================================
   NIKKO-KIKAI GLOBAL HEADER — TOP/VMC UNIFIED DESIGN / 2026-09-08
   Scope: body.nk-global-header-page only
   Based on vertical_mc_catalog header geometry and typography.
   Applied to the FA/robotics pages without altering page content.
   ========================================================= */
body.nk-global-header-page{
  --nk-header-gold:#b9934c;
  --nk-header-gold-dark:#8d6a2f;
  --nk-header-ease:cubic-bezier(.2,.75,.2,1);
  --navH:72px;
  --navH-small:58px;
}

body.nk-global-header-page .g-nav{
  position:fixed!important;
  inset:0 0 auto!important;
  z-index:1400!important;
  height:var(--navH)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
  background:rgba(12,13,15,.94)!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
  box-shadow:none!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  transition:height .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .25s ease!important;
}
body.nk-global-header-page .g-nav.shrink,
body.nk-global-header-page .g-nav.is-compact{
  height:var(--navH-small)!important;
  background:rgba(12,13,15,.95)!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.22)!important;
}
body.nk-global-header-page .g-wrap{
  width:min(1380px,calc(100% - 32px))!important;
  max-width:none!important;
  margin:auto!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  flex-wrap:nowrap!important;
}
body.nk-global-header-page .brand{
  display:inline-flex!important;
  align-items:center!important;
  gap:11px!important;
  margin-right:0!important;
  color:#fff!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  min-width:0!important;
}
body.nk-global-header-page .brand img{
  height:28px!important;
  width:auto!important;
  max-width:none!important;
  display:block!important;
  transition:height .25s ease!important;
}
body.nk-global-header-page .g-nav.shrink .brand img,
body.nk-global-header-page .g-nav.is-compact .brand img{
  height:25px!important;
}
body.nk-global-header-page .brand-name{
  display:flex!important;
  align-items:baseline!important;
  gap:8px!important;
  max-width:none!important;
  overflow:visible!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
body.nk-global-header-page .brand-name small{
  display:inline!important;
  color:rgba(255,255,255,.64)!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1!important;
}

body.nk-global-header-page .nav-right,
body.nk-global-header-page .nav-links,
body.nk-global-header-page .lang-switch{
  display:flex;
  align-items:center;
}
body.nk-global-header-page .nav-right{
  gap:12px!important;
  flex-wrap:nowrap!important;
}
body.nk-global-header-page .nav-links{
  gap:3px!important;
  flex-wrap:nowrap!important;
}
body.nk-global-header-page .dd{position:relative!important;}
body.nk-global-header-page .nav-links>.dd>a{
  display:inline-flex!important;
  align-items:center!important;
  min-height:38px!important;
  padding:0 10px!important;
  border:0!important;
  border-radius:999px!important;
  color:rgba(255,255,255,.90)!important;
  background:transparent!important;
  text-decoration:none!important;
  text-shadow:none!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:0!important;
  transition:background-color .18s ease,color .18s ease!important;
}
body.nk-global-header-page .nav-links>.dd>a::before,
body.nk-global-header-page .nav-links>.dd>a::after{display:none!important;content:none!important;}
body.nk-global-header-page .nav-links>.dd:hover>a,
body.nk-global-header-page .nav-links>.dd.open>a,
body.nk-global-header-page .nav-links>.dd.is-open>a{
  color:#fff!important;
  background:rgba(255,255,255,.09)!important;
}

body.nk-global-header-page .dd-menu{
  position:absolute!important;
  top:calc(100% + 10px)!important;
  left:0!important;
  right:auto!important;
  min-width:250px!important;
  padding:8px!important;
  visibility:hidden!important;
  opacity:0!important;
  transform:translateY(-6px)!important;
  pointer-events:none!important;
  background:rgba(19,20,22,.98)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:14px!important;
  box-shadow:0 20px 60px rgba(0,0,0,.35)!important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
}
body.nk-global-header-page .dd.open .dd-menu,
body.nk-global-header-page .dd.is-open .dd-menu{
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}
body.nk-global-header-page .dd-menu a{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-height:42px!important;
  padding:8px 12px!important;
  border-radius:9px!important;
  color:rgba(255,255,255,.82)!important;
  background:transparent!important;
  text-decoration:none!important;
  text-shadow:none!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1.5!important;
}
body.nk-global-header-page .dd-menu a::before,
body.nk-global-header-page .dd-menu a::after{display:none!important;content:none!important;}
body.nk-global-header-page .dd-menu a:hover,
body.nk-global-header-page .dd-menu a:focus-visible{
  color:#fff!important;
  background:rgba(185,147,76,.18)!important;
}

body.nk-global-header-page .lang-switch{
  gap:2px!important;
  padding:3px!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:999px!important;
  white-space:nowrap!important;
}
body.nk-global-header-page .lang-switch a{
  padding:5px 8px!important;
  border:0!important;
  border-radius:999px!important;
  color:rgba(255,255,255,.56)!important;
  background:transparent!important;
  text-decoration:none!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1!important;
}
body.nk-global-header-page .lang-switch a[aria-current="page"]{
  color:#111!important;
  background:#fff!important;
}
body.nk-global-header-page .lang-switch a:hover{color:#fff!important;background:rgba(255,255,255,.09)!important;}
body.nk-global-header-page .lang-switch a[aria-current="page"]:hover{color:#111!important;background:#fff!important;}

body.nk-global-header-page .nav-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:40px!important;
  padding:0 15px!important;
  gap:0!important;
  border:0!important;
  border-radius:999px!important;
  color:#17130c!important;
  background:linear-gradient(135deg,#e4c47f,var(--nk-header-gold))!important;
  box-shadow:none!important;
  text-decoration:none!important;
  text-shadow:none!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
body.nk-global-header-page .nav-cta:hover,
body.nk-global-header-page .nav-cta:focus-visible{filter:brightness(1.06);transform:none!important;}
body.nk-global-header-page .tel-cta{display:none!important;}
body.nk-global-header-page .sp-toggle{
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:40px!important;
  padding:0 13px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:999px!important;
  color:#fff!important;
  background:transparent!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}

/* Mobile drawer — same visual language as VMC. */
body.nk-global-header-page .drawer{
  position:fixed!important;
  inset:0!important;
  z-index:1350!important;
  display:block!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  background:rgba(0,0,0,.48)!important;
  transition:opacity .25s ease,visibility .25s ease!important;
}
body.nk-global-header-page .drawer.show,
body.nk-global-header-page .drawer.is-open{
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
body.nk-global-header-page .drawer-panel{
  position:absolute!important;
  top:var(--navH-small)!important;
  right:0!important;
  width:min(88vw,370px)!important;
  height:calc(100% - var(--navH-small))!important;
  padding:18px!important;
  padding-bottom:max(18px,env(safe-area-inset-bottom))!important;
  overflow:auto!important;
  display:block!important;
  color:#fff!important;
  background:#151619!important;
  border:0!important;
  border-left:1px solid rgba(255,255,255,.12)!important;
  transform:translateX(100%)!important;
  transition:transform .28s var(--nk-header-ease)!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
}
body.nk-global-header-page .drawer.show .drawer-panel,
body.nk-global-header-page .drawer.is-open .drawer-panel{transform:none!important;}
body.nk-global-header-page .drawer-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  padding-bottom:12px!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
}
body.nk-global-header-page .drawer-head span{
  color:var(--nk-header-gold)!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
}
body.nk-global-header-page .drawer-close{
  padding:8px 12px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:999px!important;
  color:#fff!important;
  background:transparent!important;
  font-size:12px!important;
  font-weight:800!important;
}
body.nk-global-header-page .drawer details{border-bottom:1px solid rgba(255,255,255,.10)!important;}
body.nk-global-header-page .drawer summary{
  position:relative!important;
  padding:16px 34px 16px 2px!important;
  list-style:none!important;
  color:#fff!important;
  cursor:pointer!important;
  font-size:14px!important;
  font-weight:800!important;
}
body.nk-global-header-page .drawer summary::-webkit-details-marker{display:none!important;}
body.nk-global-header-page .drawer summary::after{
  content:"+"!important;
  position:absolute!important;
  right:4px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:var(--nk-header-gold)!important;
  font-size:20px!important;
  font-weight:500!important;
}
body.nk-global-header-page .drawer details[open] summary::after{content:"−"!important;}
body.nk-global-header-page .drawer details>div{padding:0 0 12px 12px!important;}
body.nk-global-header-page .drawer details a{
  display:block!important;
  padding:10px 12px!important;
  border-radius:9px!important;
  color:rgba(255,255,255,.70)!important;
  background:transparent!important;
  text-decoration:none!important;
  font-size:13px!important;
  font-weight:600!important;
}
body.nk-global-header-page .drawer details a:hover{color:#fff!important;background:rgba(185,147,76,.14)!important;}
body.nk-global-header-page .drawer-actions{display:grid!important;gap:8px!important;margin-top:20px!important;}
body.nk-global-header-page .drawer-actions a{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:48px!important;
  padding:0 14px!important;
  border-radius:12px!important;
  color:#17130c!important;
  background:var(--nk-header-gold)!important;
  text-decoration:none!important;
  font-size:13px!important;
  font-weight:800!important;
}
body.nk-global-header-page .drawer-actions a+a{
  color:#fff!important;
  background:transparent!important;
  border:1px solid rgba(255,255,255,.18)!important;
}

/* Apple theme must not turn the unified header white; only page content remains Apple-light. */
html[data-theme="apple"] body.nk-global-header-page .g-nav,
html[data-theme="apple"] body.nk-global-header-page .g-nav.shrink,
html[data-theme="apple"] body.nk-global-header-page .g-nav.is-compact{
  color:#fff!important;
  background:rgba(12,13,15,.94)!important;
  border-bottom-color:rgba(255,255,255,.12)!important;
}
html[data-theme="apple"] body.nk-global-header-page .brand,
html[data-theme="apple"] body.nk-global-header-page .brand-name,
html[data-theme="apple"] body.nk-global-header-page .nav-links>.dd>a{color:#fff!important;}
html[data-theme="apple"] body.nk-global-header-page .brand-name small{color:rgba(255,255,255,.64)!important;}

@media(max-width:1180px){
  body.nk-global-header-page .nav-links,
  body.nk-global-header-page .lang-switch{display:none!important;}
  body.nk-global-header-page .sp-toggle,
  body.nk-global-header-page .tel-cta{display:inline-flex!important;}
}
@media(max-width:820px){
  body.nk-global-header-page{--navH:62px;--navH-small:56px;}
  body.nk-global-header-page .brand-name{font-size:12px!important;}
  body.nk-global-header-page .brand-name small{display:none!important;}
  body.nk-global-header-page .nav-cta:not(.tel-cta){display:none!important;}
}
@media(max-width:520px){
  body.nk-global-header-page .g-wrap{width:calc(100% - 20px)!important;}
  body.nk-global-header-page .brand img{height:24px!important;}
  body.nk-global-header-page .g-nav.shrink .brand img,
  body.nk-global-header-page .g-nav.is-compact .brand img{height:23px!important;}
  body.nk-global-header-page .tel-cta{display:none!important;}
}

@media(prefers-reduced-motion:reduce){
  body.nk-global-header-page .g-nav,
  body.nk-global-header-page .brand img,
  body.nk-global-header-page .dd-menu,
  body.nk-global-header-page .drawer,
  body.nk-global-header-page .drawer-panel{transition:none!important;}
}


/* 2026-09-08 dropdown usability fix: bridge the visual gap */
body.nk-global-header-page .dd{position:relative;}
body.nk-global-header-page .dd::after{
  content:"";
  position:absolute;
  left:-4px;right:-4px;
  top:100%;
  height:14px;
  display:none;
  background:transparent;
  pointer-events:auto;
}
body.nk-global-header-page .dd.open::after,
body.nk-global-header-page .dd.is-open::after{display:block;}
