/*!
 * 02-header.css
 * 頁首、主導覽、Mega menu、手機選單、語言切換、詢價按鈕
 *
 * 崇成工廠官網 — 由已驗證的原型拆分而來，勿隨意改動色值與斷點：
 * 全站文字對比達 WCAG AA 4.5:1，320–1920px 無水平溢出。
 */

/* ============ header ============ */
.hdr{position:sticky;top:0;z-index:80;background:rgba(243,245,241,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:18px;height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none;color:var(--ink)}
.brand-mark{width:auto;height:44px;flex:none;display:block}
.brand-txt strong{
  display:block;font-family:var(--f-display);font-weight:800;font-stretch:112%;
  font-size:15px;letter-spacing:-.01em;text-transform:uppercase;line-height:1.1;
}
.brand-txt span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;color:var(--steel);text-transform:uppercase}

.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav a,.nav button.navlink{
  /* 明確宣告顏色，不依賴繼承——父主題（GeneratePress 等）可能把
     全站文字設成白色，導致導覽列變成白字白底完全看不見。實測踩過。 */
  color:var(--ink);
  background:none;border:0;cursor:pointer;text-decoration:none;
  font-family:var(--f-mono);font-size:12.5px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;padding:10px 12px;border-radius:var(--r);
  display:inline-flex;align-items:center;gap:6px;
}
.nav a:hover,.nav button.navlink:hover{background:var(--white);color:var(--amber-2)}
.caret{width:9px;height:9px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s}
.has-mega[aria-expanded="true"] .caret{transform:rotate(-135deg) translate(-3px,-3px)}

.tools{display:flex;align-items:center;gap:8px;flex:none}
.lang{display:flex;border:1.5px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--white)}
.lang button{
  background:none;border:0;padding:8px 10px;cursor:pointer;
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;color:var(--steel);
}
.lang button[aria-pressed="true"]{background:var(--ink);color:#fff}
.inq-btn{
  color:var(--ink);
  position:relative;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  background:var(--white);border:1.5px solid var(--ink);border-radius:var(--r);
  padding:9px 14px;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
}
.inq-btn:hover{background:var(--amber);border-color:var(--amber)}
.inq-count{
  min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--amber);color:var(--ink);
  font-size:11px;font-weight:600;display:grid;place-items:center;
}
.inq-btn:hover .inq-count{background:var(--ink);color:#fff}
.burger{display:none;width:44px;height:44px;border:1.5px solid var(--line);background:var(--white);border-radius:var(--r);cursor:pointer}
.burger span{display:block;width:18px;height:1.8px;background:var(--ink);margin:3.5px auto}

/* mega menu */
.mega{
  position:absolute;left:0;right:0;top:100%;background:var(--white);
  border-bottom:1px solid var(--line);box-shadow:0 20px 40px -28px rgba(18,38,30,.4);
  display:none;
}
.mega[data-open="true"]{display:block}
.mega-in{display:grid;grid-template-columns:repeat(4,1fr);gap:2px 28px;padding:26px 0 30px}
.mega-in a{
  color:var(--ink);text-decoration:none;padding:11px 12px;border-radius:var(--r);display:flex;align-items:center;gap:12px;
  border:1px solid transparent;
}
.mega-in a:hover{border-color:var(--line);background:var(--paper)}
.mega-in .mg-name{font-family:var(--f-display);font-weight:700;font-size:14px;text-transform:uppercase;font-stretch:104%}
.mega-in .mg-n{font-family:var(--f-mono);font-size:11px;color:var(--steel);margin-left:auto}
.mega-foot{border-top:1px solid var(--line);padding:14px 0;display:flex;gap:18px;flex-wrap:wrap;align-items:center}

/* mobile drawer */
.mnav{display:none;border-top:1px solid var(--line);background:var(--white);padding:10px 0 22px}
.mnav[data-open="true"]{display:block}
.mnav a{display:block;text-decoration:none;color:var(--ink);padding:13px 2px;border-bottom:1px solid var(--line);font-family:var(--f-mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.mnav .sub{padding-left:18px;font-size:12px;color:var(--ink-2);letter-spacing:.04em;text-transform:none;font-family:var(--f-body)}