/* SetupHK 主選單 v1（2026-10-17 使用者：第一層看似可按實際不行、手機版收合難找 → 重做）
   第一層文字＝連結（進該類主頁），旁邊箭頭＝獨立按鈕（展開子選單）；桌機滑鼠移上也展開。
   手機、平板（≤1199px）：全螢幕選單，各組預設摺起、點組標題展開（同時只開一組，目前所在組預設展開），底部固定 WhatsApp／致電。
   顏色、圓角、陰影、字級用 setuphk.css 的 token；首頁透明頁首由 .shn--dark 切成白字。 */
.shn{--shn-fg:var(--sh-navy-deep,#0C1B3D);--shn-hover:var(--sh-navy,#163375);font-family:var(--sh-font,'Poppins','NotoSansTC','PingFangHK',sans-serif)}
.shn *{box-sizing:border-box}
.shn a{text-decoration:none}
.shn ul{list-style:none;margin:0;padding:0}
/* Hello Elementor 的 reset.css 會把 button:hover/:focus 塗成 #c36 粉紅底、加框——三顆按鈕在所有狀態都重設 */
.shn :is(.shn__tog,.shn__burger,.shn__close,.shn__gh),.shn :is(.shn__tog,.shn__burger,.shn__close,.shn__gh):where(:hover,:focus,:active){background:none;border:0;box-shadow:none;border-radius:var(--sh-r-btn,10px);text-transform:none}
.shn :is(.shn__tog,.shn__burger):where(:hover,:focus,:active){color:var(--shn-fg)}
.shn :is(.shn__close,.shn__gh):where(:hover,:focus,:active){color:var(--sh-navy-deep,#0C1B3D)}
.shn .shn-ic{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- 桌機 ---------- */
.shn__list{display:flex;align-items:center;gap:6px}
.shn__item{position:relative}
.shn__top{display:flex;align-items:center;border-radius:var(--sh-r-btn,10px)}
.shn__link{display:block;padding:10px 4px 10px 12px;font-size:16px;font-weight:500;line-height:1.25;color:var(--shn-fg);white-space:nowrap;transition:color .15s}
.shn__tog{display:grid;place-items:center;width:28px;height:40px;margin:0;padding:0;border:0;background:none;color:var(--shn-fg);cursor:pointer;border-radius:var(--sh-r-btn,10px);transition:color .15s,transform .2s}
.shn__tog .shn-ic{transition:transform .2s}
.shn__top:hover .shn__link,.shn__top:hover .shn__tog,.shn__item.is-open .shn__link,.shn__item.is-open .shn__tog{color:var(--shn-hover)}
.shn__item.is-open .shn__tog .shn-ic{transform:rotate(180deg)}
.shn__link:hover{text-decoration:underline;text-decoration-color:var(--sh-yellow,#E8B931);text-decoration-thickness:2px;text-underline-offset:6px}
.shn__item.is-current>.shn__top .shn__link{text-decoration:underline;text-decoration-color:var(--sh-yellow,#E8B931);text-decoration-thickness:2px;text-underline-offset:6px}  /* 目前頁面：和 hover 同一條底線、只跨文字寬（2026-10-19 原本 inset 陰影連左右留白一起畫，比字寬、左右不對稱，hover 時還多一條） */
.shn__plain .shn__link{padding-right:12px}
.shn .shn__lang-btn{display:flex;align-items:center;gap:6px;width:auto;height:40px;padding:0 8px 0 10px;font:500 15px/1 var(--sh-font,'Poppins','NotoSansTC','PingFangHK',sans-serif);color:var(--shn-fg)}
.shn .shn__lang-btn .shn-ic{width:16px;height:16px}
.shn .shn__lang-btn .shn-ic:first-child{width:18px;height:18px}
.shn .shn__lang-btn:hover,.shn .shn__lang-btn:focus-visible{color:var(--shn-hover)}
.shn .shn__panel--lang{left:auto;right:-4px;width:200px;padding:6px}  /* 要寫在 .shn__panel 之前又要蓋過它，所以加 .shn 提高權重 */
.shn__langs a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:var(--sh-r-btn,10px);font-size:15px;font-weight:500;color:var(--sh-text,#111A2C)}
.shn__langs a:hover,.shn__langs a:focus-visible{background:var(--sh-surface-2,#F7F8FB)}
.shn__langs a[aria-current]{color:var(--sh-navy,#163375);font-weight:700}
.shn__langs .shn-ic{width:16px;height:16px;color:var(--sh-navy,#163375)}
.shn__langseg{display:none}

.shn__panel{position:absolute;top:calc(100% + 10px);left:-8px;z-index:60;width:360px;padding:10px;border-radius:var(--sh-r-card,14px);background:#fff;
  box-shadow:0 1px 2px rgba(17,26,44,.06),0 24px 48px -16px rgba(17,26,44,.28);border:1px solid var(--sh-line-soft,#EEF1F5);
  opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .16s ease-out,transform .16s ease-out,visibility 0s .16s}
.shn__panel::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}  /* 滑鼠從文字移到面板時不會中斷 */
.shn__item.is-open>.shn__panel{opacity:1;visibility:visible;transform:none;transition:opacity .16s ease-out,transform .16s ease-out}
.shn__gh,.shn__all{display:none}
.shn__subs a{display:block;padding:11px 14px;border-radius:var(--sh-r-btn,10px);color:var(--sh-text,#111A2C);transition:background .12s}
.shn__subs a:hover,.shn__subs a:focus-visible{background:var(--sh-surface-2,#F7F8FB)}
.shn__subs b{display:block;font-size:15px;font-weight:700;line-height:1.45;color:var(--sh-navy-deep,#0C1B3D)}
.shn__subs span{display:block;margin-top:2px;font-size:13px;line-height:1.55;color:var(--sh-subtle,#5A6478)}
.shn__subs a.is-current b{color:var(--sh-navy,#163375)}
.shn__subs a.is-current{background:var(--sh-gold-tint,#F4F1E6)}
.shn__more{margin:6px 4px 2px;padding:10px 10px 4px;border-top:1px solid var(--sh-line-soft,#EEF1F5);font-size:13px;line-height:1.8;color:var(--sh-subtle,#5A6478)}
.shn__more a{color:var(--sh-navy,#163375);font-weight:500}
.shn__more a:hover{text-decoration:underline;text-underline-offset:3px}
.shn__more i{font-style:normal;margin:0 6px;color:var(--sh-faint,#9AA3B2)}
.shn__burger,.shn__sheet-hd,.shn__cta{display:none}
.shn :focus-visible{outline:2px solid var(--sh-yellow,#E8B931);outline-offset:2px}

/* 首頁透明頁首（捲動前）：第一層白字；面板維持白底深字 */
.shn--dark{--shn-fg:#fff;--shn-hover:var(--sh-yellow,#E8B931)}

/* ---------- 手機、平板（≤1199px）：全螢幕選單；中文第一層在 1150 以下、英文在 1200 以下放不下，所以 1200 才開始用桌機版 ---------- */
@media (max-width:1199px){
 .shn__burger{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:0;background:none;color:var(--shn-fg);cursor:pointer;border-radius:var(--sh-r-btn,10px)}
 .shn__burger .shn-ic{width:26px;height:26px}
 .shn__sheet{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;background:#fff;color:var(--sh-text,#111A2C);
   opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s ease-out,transform .2s ease-out,visibility 0s .2s}
 .shn.is-open .shn__sheet{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease-out,transform .2s ease-out}
 .shn:not(.is-open) .shn__sheet{pointer-events:none}  /* 關著的選單一律不接收點擊與觸控（雙重保險） */
 .shn__item.is-open>.shn__panel{visibility:inherit}  /* 桌機留下的展開狀態也不能讓子選單在手機穿透 */
 .shn__sheet-hd{display:flex;align-items:center;justify-content:space-between;height:61px;padding:0 var(--gut,20px);border-bottom:1px solid var(--sh-line,#E3E7EE);flex:none}
 .shn__sheet-hd img{height:32px;width:auto;display:block}
 .shn__close{display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;border:0;background:none;color:var(--sh-navy-deep,#0C1B3D);cursor:pointer}
 .shn__close .shn-ic{width:24px;height:24px}
 .shn__scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px var(--gut,20px) 24px}
 .shn__list{display:block}
 .shn__item{border-bottom:1px solid var(--sh-line-soft,#EEF1F5);padding:6px 0}
 .shn__item.is-expanded{padding-bottom:12px}
 .shn__item:last-child{border-bottom:0}
 .shn__top{display:none}
 .shn__panel{position:static;width:auto;padding:0;border:0;box-shadow:none;background:none;opacity:1;visibility:inherit;transform:none;transition:none}  /* inherit：跟著全螢幕選單一起隱藏。2026-10-18 原寫 visible，選單關著時子選單連結仍隱形蓋在頁面上，手機點影片會跳到服務頁、橫向滑不動 */
 .shn__panel::before{display:none}
 /* 組標題＝展開按鈕；.shn 前綴蓋過 Hello Elementor reset.css 的 button 預設框線與內距 */
 .shn .shn__gh{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:52px;margin:0;padding:0;font:700 18px/1.3 var(--sh-font,'Poppins','NotoSansTC','PingFangHK',sans-serif);color:var(--sh-navy-deep,#0C1B3D);text-align:left;cursor:pointer}
 .shn__gh .shn-ic{width:20px;height:20px;color:var(--sh-navy,#163375);transition:transform .2s}
 .shn__item.is-expanded .shn__gh .shn-ic{transform:rotate(180deg)}
 .shn .shn__item.is-current .shn__gh{color:var(--sh-navy,#163375)}
 .shn__item:not(.is-expanded) .shn__body{display:none}
 .shn__all{display:flex;align-items:center;gap:8px;min-height:44px;margin-bottom:2px;font-size:15px;font-weight:500;color:var(--sh-navy,#163375)}
 .shn__all .shn-ic{width:16px;height:16px}
 .shn__subs a{display:flex;flex-direction:column;justify-content:center;min-height:52px;padding:8px 12px;margin:0 -12px}
 .shn__subs b{font-size:16px;font-weight:500;color:var(--sh-text,#111A2C)}
 .shn__subs span{font-size:13px}
 .shn__more{margin:4px 0 0;padding:8px 0 0}
 .shn__plain{padding:4px 0}
 .shn__plain .shn__top{display:flex}
 .shn__plain .shn__link{padding:10px 0;font-size:18px;font-weight:700;color:var(--sh-navy-deep,#0C1B3D)}
 .shn__lang{display:none}
 /* 手機：語言切換鍵放在聯絡按鈕上方 */
 .shn__langseg{display:flex;align-items:center;gap:6px;flex:none;padding:10px var(--gut,20px) 0;border-top:1px solid var(--sh-line,#E3E7EE);color:var(--sh-subtle,#5A6478)}
 .shn__langseg>.shn-ic{width:18px;height:18px;margin-right:4px}
 .shn__langseg a{display:grid;place-items:center;min-width:56px;height:40px;padding:0 14px;border:1px solid var(--sh-line,#E3E7EE);border-radius:var(--sh-r-btn,10px);font-size:15px;font-weight:500;color:var(--sh-text,#111A2C)}
 .shn__langseg a[aria-current]{background:var(--sh-navy,#163375);border-color:var(--sh-navy,#163375);color:#fff;font-weight:700}
 .shn__cta{border-top:0}
 .shn__cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:none;padding:12px var(--gut,20px) calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--sh-line,#E3E7EE);background:#fff}
 .shn__cta a{display:flex;align-items:center;justify-content:center;gap:8px;height:52px;border-radius:var(--sh-r-btn,10px);font-size:16px;font-weight:700}
 .shn__cta .shn-ic{width:20px;height:20px}
 .shn__cta .is-wa{background:var(--sh-yellow,#E8B931);color:var(--sh-night,#07101F)}
 .shn__cta .is-tel{border:1.5px solid var(--sh-navy,#163375);color:var(--sh-navy,#163375)}
 body.shn-lock{overflow:hidden}
}
@media (min-width:1200px){.shn__sheet{display:contents}.shn__scroll{display:contents}}
@media (prefers-reduced-motion:reduce){.shn__panel,.shn__sheet,.shn__tog .shn-ic,.shn__gh .shn-ic{transition:none!important}}

/* ---------- 接上 Theme Builder 頁首（8388 內頁、8663 首頁透明）：短代碼元件帶 class sh-navw ---------- */
[data-elementor-type="header"] .sh-navw{align-self:center;flex:1 1 auto;min-width:0;display:flex;justify-content:flex-end;margin-right:16px}
[data-elementor-type="header"] .sh-navw>.elementor-widget-container{display:flex;justify-content:flex-end}
/* 平板、手機：logo｜預約諮詢｜選單鍵（選單鍵靠最右，同原本） */
@media (max-width:1199px){
 [data-elementor-type="header"] .sh-navw{order:3;flex:0 0 auto;margin-right:-8px}
 [data-elementor-type="header"] .e-button-base{margin-left:auto}
}
/* 首頁透明頁首（捲動前）：第一層與選單鍵白字；捲動後 .hm-scrolled 白底，回到深字 */
.hm-hdr:not(.hm-scrolled) .shn{--shn-fg:#fff;--shn-hover:var(--sh-yellow,#E8B931)}
/* 手機選單打開時，全站浮動鈕收起（選單底部已有 WhatsApp／致電） */
body.shn-lock .sh-float{display:none}

/* 英文頁 logo（2026-10-19 使用者提供）：頁首 logo 是 Elementor 圖片元件（頁首模板 8388、8663），用 content 換圖，不改模板；
   首頁透明頁首捲動前用白字版，捲動後與內頁用深藍字版（蓋過 home.css 的 .hm-scrolled 換圖） */
html[lang^="en"] [data-elementor-type="header"] img.e-image-base{content:url(/wp-content/uploads/2026/10/setuphk-logo-en-color.png)}
html[lang^="en"] [data-elementor-type="header"] .hm-hdr:not(.hm-scrolled) img.e-image-base{content:url(/wp-content/uploads/2026/10/setuphk-logo-en-on-dark.png)}

/* 英文頁（TranslatePress 把 <html lang> 設成 en-*）：第一層字縮一號、間距收緊，否則放不下 */
@media (min-width:1200px){
 html[lang^="en"] .shn__link{font-size:15px;padding-left:8px}
 html[lang^="en"] .shn__tog{width:24px}
 html[lang^="en"] .shn__list{gap:2px}
 html[lang^="en"] .shn .shn__lang-btn{width:auto}  /* 語言鈕也帶 .shn__tog，被上一行鎖成 24px，「EN」溢出貼到 Enquire 鈕（2026-10-19） */
}