/* ============================================================================= MUUNIQUE global header (mqhd) — loaded site-wide (template-parts/header.php) Nav markup comes from wp_nav_menu():
  • ========================================================================== */ .mq-annc{background:#0A0A0A;color:#F4F4F2;text-align:center;font-family:"IBM Plex Mono",monospace; font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:9px 16px} .mqhd,.mqhd *{box-sizing:border-box} .mqhd{--ink:#0A0A0A;--paper:#F4F4F2;--green:#06C755;--green-ink:#06A047;--line:rgba(0,0,0,.12);--muted:rgba(0,0,0,.55); font-family:"IBM Plex Sans Thai","IBM Plex Sans",sans-serif;position:relative;display:block} .mqhd a{text-decoration:none;color:inherit} .mqhd button{font-family:inherit} .mqhd__bar{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50} .mqhd__inner{max-width:1320px;margin:0 auto;padding:13px 28px;display:flex;align-items:center; justify-content:space-between;gap:18px;position:relative} .mqhd__left{display:flex;align-items:center;gap:26px;min-width:0} .mqhd__logo{font-family:"IBM Plex Sans","IBM Plex Sans Thai",sans-serif;font-weight:700;font-size:23px; letter-spacing:.02em;color:var(--ink);display:inline-flex;align-items:center} /* โลโก้รูปจาก Customize (the_custom_logo) — สูง 30px ตาม image spec */ .mqhd__logoimg{height:30px;width:auto;display:block} @media(max-width:768px){ .mqhd__logoimg{height:26px} } /* nav (from wp_nav_menu) */ .mqhd__nav{display:flex;align-items:center} .mqhd__navlist{display:flex;align-items:center;gap:22px;list-style:none;margin:0;padding:0} .mqhd__navlist li{position:relative} .mqhd__nav a{font-size:14.5px;font-weight:600;color:var(--ink);opacity:.82;white-space:nowrap; transition:opacity .15s,color .15s} .mqhd__nav a:hover{opacity:1;color:var(--green-ink)} .mqhd__navlist .current-menu-item>a,.mqhd__navlist .current_page_item>a{opacity:1;color:var(--green-ink)} /* sub-menu */ .mqhd__navlist ul.sub-menu{position:absolute;left:0;top:calc(100% + 12px);min-width:190px;background:#fff; border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 38px rgba(0,0,0,.12);padding:6px; list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(-6px); transition:opacity .18s,transform .18s,visibility .18s;z-index:60} .mqhd__navlist li:hover>ul.sub-menu,.mqhd__navlist li:focus-within>ul.sub-menu{opacity:1;visibility:visible;transform:none} .mqhd__navlist ul.sub-menu li{width:100%} .mqhd__navlist ul.sub-menu a{display:block;padding:9px 12px;border-radius:8px;font-size:14px;opacity:1} .mqhd__navlist ul.sub-menu a:hover{background:var(--paper)} .mqhd__right{display:flex;align-items:center;gap:6px} .mqhd__ic{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center; border:1px solid transparent;border-radius:999px;background:transparent;color:var(--ink);cursor:pointer; position:relative;transition:background .15s,border-color .15s} .mqhd__ic:hover{background:#fff;border-color:var(--line)} .mqhd__ic svg{width:19px;height:19px} .mqhd__badge{position:absolute;top:1px;right:1px;min-width:16px;height:16px;padding:0 4px;border-radius:999px; background:var(--green);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center; justify-content:center;font-family:"IBM Plex Mono",monospace} .mqhd__lang{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px;margin:0 4px} .mqhd__lang button{border:0;background:transparent;font-family:"IBM Plex Mono",monospace;font-size:11px; font-weight:600;letter-spacing:.03em;padding:6px 9px;border-radius:999px;cursor:pointer;color:var(--muted);transition:.15s} .mqhd__lang button.is-active{background:var(--ink);color:#fff} .mqhd__profile{position:relative} .mqhd__menu{position:absolute;right:0;top:calc(100% + 12px);width:236px;background:#fff;border:1px solid var(--line); border-radius:14px;box-shadow:0 14px 38px rgba(0,0,0,.13);padding:8px;opacity:0;visibility:hidden; transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60} .mqhd__profile:hover .mqhd__menu,.mqhd__profile:focus-within .mqhd__menu{opacity:1;visibility:visible;transform:none} .mqhd__menu:before{content:"";position:absolute;top:-16px;right:0;left:0;height:16px} .mqhd__mhead{padding:11px 12px 12px;border-bottom:1px solid var(--line);margin-bottom:6px} .mqhd__mhead b{display:block;font-size:14px;color:var(--ink)} .mqhd__mhead span{font-size:12px;color:var(--muted)} .mqhd__menu a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;font-size:14px; color:var(--ink);transition:background .12s} .mqhd__menu a:hover{background:var(--paper)} .mqhd__menu a svg{width:16px;height:16px;opacity:.7} .mqhd__msep{height:1px;background:var(--line);margin:6px 4px} .mqhd__menu a.is-cta{color:var(--green-ink);font-weight:700} .mqhd__search{max-height:0;overflow:hidden;background:var(--paper);border-bottom:1px solid transparent; transition:max-height .26s ease,border-color .26s} .mqhd__search.is-open{max-height:92px;border-color:var(--line)} .mqhd__search form{max-width:1320px;margin:0 auto;padding:14px 28px;display:flex;gap:10px} .mqhd__search input{flex:1;border:1px solid var(--line);border-radius:999px;padding:12px 20px;font-family:inherit; font-size:15px;background:#fff;outline:none} .mqhd__search input:focus{border-color:var(--ink)} .mqhd__search .go{border:0;background:var(--ink);color:#fff;border-radius:999px;padding:0 24px;font-weight:600;cursor:pointer} .mqhd__burger{display:none} @media(max-width:960px){ .mqhd__nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper); border-bottom:1px solid var(--line);padding:16px 28px} .mqhd__bar.is-open .mqhd__nav{display:flex} .mqhd__navlist{flex-direction:column;align-items:flex-start;gap:16px;width:100%} .mqhd__navlist ul.sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none; border:0;padding:4px 0 4px 14px} .mqhd__burger{display:inline-flex} .mqhd__lang{display:none} .mqhd__logo{font-size:21px} .mqhd__left{gap:12px} } /* --- override Elementor kit global