/* =========================================================
   Nikko-Kikai unified global header
   Based on Vertical MC catalog header / 2026-09-07
   Scoped for machintools top test. Telephone CTA intentionally omitted.
   ========================================================= */
body.mach-page{
  --nk-gold:#b9934c;
  --nk-nav-h:72px;
  --nk-nav-small:58px;
  --nk-ease:cubic-bezier(.2,.75,.2,1);
  margin:0;
}
body.mach-page .g-nav,
body.mach-page .g-nav *,
body.mach-page .drawer,
body.mach-page .drawer *{box-sizing:border-box}

body.mach-page .g-nav{
  position:fixed;inset:0 0 auto;z-index:1400;height:var(--nk-nav-h);
  display:flex;align-items:center;color:#fff;background:rgba(12,13,15,.78);
  border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);transition:.25s;
}
body.mach-page .g-nav.is-compact{height:var(--nk-nav-small);background:rgba(12,13,15,.95)}
body.mach-page .g-wrap{width:min(1380px,calc(100% - 32px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}
body.mach-page .brand{display:inline-flex;align-items:center;gap:11px;color:#fff!important;text-decoration:none!important;white-space:nowrap}
body.mach-page .brand img{height:28px;width:auto;display:block;transition:height .25s}
body.mach-page .g-nav.is-compact .brand img{height:24px}
body.mach-page .brand-name{display:flex;align-items:baseline;gap:8px;font-size:14px;font-weight:800;line-height:1.2}
body.mach-page .brand-name small{font-size:11px;color:rgba(255,255,255,.64);font-weight:700}
body.mach-page .nav-right,body.mach-page .nav-links,body.mach-page .lang-switch{display:flex;align-items:center}
body.mach-page .nav-right{gap:12px}
body.mach-page .nav-links{gap:3px}
body.mach-page .dd{position:relative}
body.mach-page .dd>a{display:inline-flex;align-items:center;min-height:38px;padding:0 10px;border-radius:999px;color:rgba(255,255,255,.9)!important;text-decoration:none!important;font-size:12px;font-weight:700;white-space:nowrap}
body.mach-page .dd>a:hover,body.mach-page .dd.is-open>a{background:rgba(255,255,255,.09)}
body.mach-page .dd>a[aria-current="page"]{color:#f1d99e!important}
body.mach-page .dd-menu{position:absolute;top:calc(100% + 10px);left:0;min-width:250px;padding:8px;visibility:hidden;opacity:0;transform:translateY(-6px);pointer-events:none;background:rgba(19,20,22,.98);border:1px solid rgba(255,255,255,.12);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.35);transition:.18s}
body.mach-page .dd.is-open .dd-menu{visibility:visible;opacity:1;transform:none;pointer-events:auto}
body.mach-page .dd-menu a{display:flex;align-items:center;min-height:42px;padding:8px 12px;border-radius:9px;color:rgba(255,255,255,.82)!important;text-decoration:none!important;font-size:13px;font-weight:500;white-space:nowrap}
body.mach-page .dd-menu a:hover{background:rgba(185,147,76,.18);color:#fff!important}
body.mach-page .lang-switch{gap:2px;padding:3px;border:1px solid rgba(255,255,255,.15);border-radius:999px}
body.mach-page .lang-switch a{padding:5px 8px;border-radius:999px;color:rgba(255,255,255,.56)!important;text-decoration:none!important;font-size:10px;font-weight:800}
body.mach-page .lang-switch a[aria-current="page"]{color:#111!important;background:#fff}
body.mach-page .nav-cta{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 15px;border-radius:999px;color:#17130c!important;text-decoration:none!important;background:linear-gradient(135deg,#e4c47f,var(--nk-gold));font-size:12px;font-weight:800;white-space:nowrap}
body.mach-page .sp-toggle{display:none;min-height:40px;padding:0 13px;border:1px solid rgba(255,255,255,.2);border-radius:999px;color:#fff;background:transparent;font:inherit;font-size:12px;font-weight:800;cursor:pointer}

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

@media(max-width:1180px){
  body.mach-page .nav-links,body.mach-page .lang-switch,body.mach-page .nav-cta{display:none}
  body.mach-page .sp-toggle{display:inline-flex;align-items:center;justify-content:center}
}
@media(max-width:560px){
  body.mach-page .g-wrap{width:calc(100% - 20px);gap:10px}
  body.mach-page .brand{gap:8px;min-width:0}
  body.mach-page .brand img{height:24px}
  body.mach-page .brand-name{display:block;max-width:60vw;overflow:hidden;text-overflow:ellipsis;font-size:12px}
  body.mach-page .brand-name small{font-size:9px;margin-left:5px}
  body.mach-page .sp-toggle{padding:0 11px;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){
  body.mach-page .g-nav,body.mach-page .brand img,body.mach-page .dd-menu,body.mach-page .drawer,body.mach-page .drawer-panel{transition:none!important}
}


/* category34/whauto compatibility overrides.
   wha_style.css contains the previous global-nav skin; these declarations neutralize only
   the overlapping header/drawer rules so the machintools unified header renders identically. */
body.mach-page .g-wrap{padding:0}
body.mach-page .dd-menu{display:block!important;max-width:none;max-height:none;overflow:visible}
body.mach-page .lang-switch a{border:0;background:transparent}
body.mach-page .nav-cta{box-shadow:none}
body.mach-page .drawer{display:block!important}
body.mach-page .drawer-panel{border:0;border-radius:0;box-shadow:none}