/* GI Group Header v1.0.20 — precise overlay; first-paint commerce slots are layout-stable.
   桌機保留 v1.0.18 的無底線與三商城 ICON 光學校正。
   v1.0.20 手機正式改為會員／搜尋／購物車／漢堡四 ICON，並以搜尋／購物車齊全後才切換的 fail-open 策略保護 Journal Header。 */
.gi-group-header{
  position:fixed!important;
  top:0!important;
  right:0!important;
  left:0!important;
  z-index:10050!important;
  display:block!important;
  width:100%!important;
  height:var(--gih-height)!important;
  margin:0!important;
  padding:0!important;
  color:var(--gih-text);
  /* v1.0.17: 背景拆成固定漸層圖層 + 可轉場的純色底色，避免 gradient↔rgba 整層重畫造成閃爍。 */
  background-color:rgba(23,16,12,0)!important;
  background-image:linear-gradient(180deg,rgba(18,8,3,.72),rgba(18,8,3,.18) 72%,transparent)!important;
  border:0!important;
  /* v1.0.18: 完全移除下方邊線（含透明 placeholder）；改用陰影製造層次，不再畫任何 1px 邊。 */
  border-bottom:0!important;
  box-shadow:none!important;
  font-family:var(--gih-font,"Noto Serif TC","Source Han Serif TC","Songti TC","PMingLiU",serif)!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.gi-group-header *{box-sizing:border-box;}
/* 首頁實心：維持與透明相同高度（v1.0.17 不再首頁變高），只換底色/邊框/陰影。 */
.gi-group-header--solid{
  background-color:rgba(23,16,12,.97)!important;
  border-bottom:0!important;
  border-bottom-color:transparent!important;
  box-shadow:0 6px 22px rgba(0,0,0,.3)!important;
}
/* 內頁恆實心，使用實心高度。 */
.gi-group-header--inner{
  height:var(--gih-height-solid)!important;
  background-color:rgba(23,16,12,.97)!important;
  border-bottom:0!important;
  border-bottom-color:transparent!important;
  box-shadow:0 6px 22px rgba(0,0,0,.3)!important;
}
.gi-group-header__inner{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  width:min(100%,var(--gih-maxw))!important;
  height:100%!important;
  margin:0 auto!important;
  padding:0 clamp(30px,4.2vw,82px)!important;
}

/* Journal may draw dividers with container borders or pseudo-elements. Reset only GI's structural wrappers. */
.gi-group-header__inner,
.gi-group-header__primary,
.gi-group-header__right,
.gi-group-header__menu{
  background:transparent!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  outline:0!important;
}
.gi-group-header::before,
.gi-group-header::after,
.gi-group-header__inner::before,
.gi-group-header__inner::after,
.gi-group-header__primary::before,
.gi-group-header__primary::after,
.gi-group-header__right::before,
.gi-group-header__right::after,
.gi-group-header__menu::before,
.gi-group-header__menu::after{
  content:none!important;
  display:none!important;
  border:0!important;
  box-shadow:none!important;
}
.gi-group-header-layout-marker{display:none!important;width:0!important;height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;}
.gi-group-header__primary{min-width:0;}
.gi-group-header__menu,.gi-group-header__dropdown,.gi-group-drawer__menu,.gi-group-drawer__children{margin:0!important;padding:0!important;list-style:none!important;}
.gi-group-header__menu{display:flex!important;align-items:center!important;gap:var(--gih-gap)!important;white-space:nowrap!important;}
.gi-group-header__item{position:relative!important;}
.gi-group-header__link,.gi-group-header__parent{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:12px 0!important;
  border:0!important;
  background:none!important;
  box-shadow:none!important;
  color:var(--gih-text)!important;
  font:inherit!important;
  font-size:var(--gih-menu-font-size,14px)!important;
  font-weight:500!important;
  letter-spacing:.08em!important;
  line-height:1.2!important;
  text-decoration:none!important;
  cursor:pointer!important;
  transition:color .2s ease!important;
}
.gi-group-header__link:hover,.gi-group-header__link:focus,.gi-group-header__parent:hover,.gi-group-header__parent:focus{color:#fff2d1!important;outline:none!important;}
.gi-group-header__caret{width:5px;height:5px;margin-top:-2px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);transition:transform .2s ease;}
.gi-group-header__item:hover .gi-group-header__caret,.gi-group-header__item.is-open .gi-group-header__caret{transform:translateY(2px) rotate(225deg);}
.gi-group-header__dropdown{
  position:absolute!important;
  top:calc(100% - 2px)!important;
  left:-18px!important;
  min-width:210px!important;
  padding:10px 0!important;
  visibility:hidden;
  opacity:0;
  transform:translateY(8px);
  background:var(--gih-dropdown)!important;
  border:1px solid rgba(208,174,113,.38)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.38)!important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.gi-group-header__dropdown::before{content:"";position:absolute;top:-6px;left:28px;width:10px;height:10px;background:var(--gih-dropdown);border-top:1px solid var(--gih-border);border-left:1px solid var(--gih-border);transform:rotate(45deg);}
.gi-group-header__item:hover>.gi-group-header__dropdown,.gi-group-header__item:focus-within>.gi-group-header__dropdown,.gi-group-header__item.is-open>.gi-group-header__dropdown{visibility:visible;opacity:1;transform:none;}
.gi-group-header__dropdown a,.gi-group-header__dropdown-label{display:block!important;padding:10px 18px!important;color:var(--gih-text)!important;font-size:var(--gih-action-font-size,14px)!important;letter-spacing:.06em!important;line-height:1.45!important;text-decoration:none!important;}
.gi-group-header__dropdown a:hover,.gi-group-header__dropdown a:focus{padding-left:23px!important;background:rgba(255,255,255,.055)!important;color:#fff2d1!important;}
.gi-group-header__dropdown-label{opacity:.62;}

.gi-group-header__right{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:clamp(8px,.8vw,14px)!important;white-space:nowrap!important;}
.gi-group-header__latest{color:var(--gih-text)!important;font-size:var(--gih-action-font-size,14px)!important;letter-spacing:.08em!important;text-decoration:none!important;}
.gi-group-header__latest:hover{color:#fff2d1!important;}
.gi-group-header__socials{display:flex!important;align-items:center!important;gap:9px!important;}
.gi-group-header__social{
  display:grid!important;
  place-items:center!important;
  width:var(--gih-icon-circle)!important;
  height:var(--gih-icon-circle)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--gih-text)!important;
  text-decoration:none!important;
  transition:color .2s ease,transform .2s ease!important;
}
.gi-group-header__social:hover,.gi-group-header__social:focus{color:#fff2d1!important;transform:translateY(-1px)!important;}
.gi-group-header__social svg,.gi-group-header__social img{width:var(--gih-social-size,var(--gih-icon-size))!important;height:var(--gih-social-size,var(--gih-icon-size))!important;transform:translate(var(--gih-offset-x,0),var(--gih-offset-y,0));fill:currentColor;object-fit:contain;}
.gi-group-header__pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:32px!important;
  padding:5px 18px!important;
  border:1px solid var(--gih-accent)!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--gih-text)!important;
  font-size:var(--gih-button-font-size,14px)!important;
  letter-spacing:.08em!important;
  text-decoration:none!important;
}
.gi-group-header__pill:hover{background:rgba(217,186,122,.1)!important;color:#fff2d1!important;}
.gi-group-header__pill--accent{background:var(--gih-accent)!important;color:#2b1b0d!important;}
.gi-group-header__pill--accent:hover{background:#efd499!important;color:#2b1b0d!important;}
.gi-group-header__hamburger{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:5px!important;width:var(--gih-hamburger-size,34px)!important;height:var(--gih-hamburger-size,34px)!important;padding:0 4px!important;border:0!important;background:transparent!important;box-shadow:none!important;cursor:pointer!important;}
.gi-group-header__hamburger span{display:block!important;width:100%!important;height:1px!important;background:var(--gih-accent)!important;transition:none!important;transform:none!important;}
/* v1.0.17: 中線固定 70%，一般／Hover／Focus／Active 完全相同，不再伸縮。 */
.gi-group-header__hamburger span:nth-child(2),
.gi-group-header__hamburger:hover span:nth-child(2),
.gi-group-header__hamburger:focus span:nth-child(2),
.gi-group-header__hamburger:active span:nth-child(2){width:70%!important;margin-left:auto!important;}

[data-gi-header-hidden="1"]{display:none!important;height:0!important;min-height:0!important;max-height:0!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important;background:transparent!important;overflow:hidden!important;line-height:0!important;}
[data-gi-header-hidden="1"]::before,[data-gi-header-hidden="1"]::after{content:none!important;display:none!important;border:0!important;box-shadow:none!important;}
html.gi-header-drawer-open,html.gi-header-drawer-open body{overflow:hidden!important;}
body.gi-custom-header-inner{padding-top:var(--gih-current-height,60px)!important;}
/* Homepage stays at the top; only inner pages reserve normal-flow header space. */
body.gi-custom-header-active:not(.gi-custom-header-inner) .gi-home{margin-top:0!important;}
body.gi-custom-header-active:not(.gi-custom-header-inner) #content{padding-top:0!important;margin-top:0!important;}

/* Off-canvas drawer */
.gi-group-drawer{position:fixed;inset:0;z-index:10060;visibility:hidden;opacity:0;background:rgba(8,5,3,.72);backdrop-filter:blur(8px);transition:opacity .24s ease,visibility .24s ease;}
.gi-group-drawer::after{content:"";position:absolute;top:0;right:0;width:min(480px,88vw);height:100%;background:var(--gih-solid,#17100c);border-left:1px solid rgba(208,174,113,.25);transform:translateX(100%);transition:transform .28s ease;}
.gi-group-drawer.is-open{visibility:visible;opacity:1;}.gi-group-drawer.is-open::after{transform:none;}
.gi-group-drawer__close{position:absolute;top:25px;right:32px;z-index:2;width:44px;height:44px;padding:0;border:0;background:none;color:var(--gih-accent,#d0ae71);font-size:38px;line-height:1;cursor:pointer;}
.gi-group-drawer__body{position:absolute;top:0;right:0;z-index:1;width:min(480px,88vw);height:100%;padding:94px 48px 48px;overflow:auto;color:var(--gih-text,#f4ecdf);font-family:"Noto Serif TC","Source Han Serif TC","Songti TC","PMingLiU",serif;}
/* v1.0.17: 手機 GI Header 啟用時，Drawer 採後台設定寬度（vw，上限 360px）。 */
body.gi-mobile-header-present .gi-group-drawer::after,
body.gi-mobile-header-present .gi-group-drawer__body{width:min(360px,var(--gih-mobile-drawer-width,86vw))!important;}
.gi-group-drawer__menu>li{border-bottom:1px solid rgba(208,174,113,.18);}.gi-group-drawer__top{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:58px;}
.gi-group-drawer__top a,.gi-group-drawer__top span{color:inherit!important;font-size:18px;letter-spacing:.08em;text-decoration:none!important;}.gi-group-drawer__toggle{width:34px;height:34px;border:0;background:none;color:var(--gih-accent,#d0ae71);font-size:22px;cursor:pointer;}
.gi-group-drawer__children{display:none;padding:0 0 14px 18px!important;}.gi-group-drawer__children.is-open{display:block;}.gi-group-drawer__children a,.gi-group-drawer__children span{display:block;padding:9px 0;color:rgba(244,236,223,.72)!important;font-size:14px;text-decoration:none!important;}
.gi-group-drawer__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}.gi-group-drawer__actions a{padding:10px 16px;border:1px solid rgba(208,174,113,.42);color:var(--gih-accent,#d0ae71)!important;text-decoration:none!important;}

@media(max-width:1280px){.gi-group-header__menu{gap:14px!important;}.gi-group-header__right{gap:7px!important;}.gi-group-header__pill{padding:5px 12px!important;}.gi-group-header__socials{gap:5px!important;}}
@media(max-width:1080px){.gi-group-header__socials{display:none!important;}.gi-group-header__menu{gap:10px!important;}}
@media(prefers-reduced-motion:reduce){.gi-group-header,.gi-group-header *,.gi-group-drawer,.gi-group-drawer::after{transition:none!important;}}

/* ===== v1.0.11 商城功能區（搬入的 Journal 原生會員／搜尋／購物車節點） ===== */
.gi-group-header__commerce{display:flex!important;align-items:center!important;gap:clamp(8px,.7vw,14px)!important;position:relative;z-index:6;}
/* v1.0.17: 三個插槽固定同一外框尺寸，讓會員/搜尋/購物車視覺中心距離一致。 */
.gi-group-header__slot{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 var(--gih-icon-circle,30px)!important;
  width:var(--gih-icon-circle,30px)!important;
  height:var(--gih-icon-circle,30px)!important;
  min-width:var(--gih-icon-circle,30px)!important;
  min-height:var(--gih-icon-circle,30px)!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
}
/* v1.0.13/14: 首屏先保留三個商城控制項的實際佔位，避免 DOM 搬入前整組寬度歸零而跳動。 */
.gi-group-header__slot:empty{visibility:hidden!important;}
/* v1.0.17: 搬入的第一層 Journal Wrapper 正規化到插槽尺寸（Dropdown/展開層不鎖，維持原生定位）。 */
.gi-group-header__slot > .top-menu.secondary-menu,
.gi-group-header__slot > .secondary-menu,
.gi-group-header__slot > .desktop-search-wrapper,
.gi-group-header__slot > .desktop-cart-wrapper,
.gi-group-header__slot > .mobile-search-wrapper,
.gi-group-header__slot > .mobile-cart-wrapper{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 100%!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
/* 將搬進來的 Journal 控制項配色統一為 Header 米金色、放大到與社群 ICON 一致的視覺重量 */
.gi-group-header__commerce a,
.gi-group-header__commerce button,
.gi-group-header__commerce span,
.gi-group-header__commerce i,
.gi-group-header__commerce svg{color:var(--gih-text)!important;fill:currentColor!important;}
/* v1.0.18: 三個商城 ICON 改逐插槽光學校正。點擊區域仍＝插槽固定外框（上方 .gi-group-header__slot，不變）；
   此處只調「圖形本體」視覺大小與 Y 微位移，不縮放 wrapper，購物車數量 Badge 不受影響。
   下列三個尺寸即可微調視覺重量：會員偏細→加大、搜尋偏大→收斂、購物車折衷。實機看比例後直接改數字。 */
.gi-group-header__slot--account{ --gih-cm-size:calc(var(--gih-icon-size,16px) + 7px); --gih-cm-y:0px; }
.gi-group-header__slot--search { --gih-cm-size:calc(var(--gih-icon-size,16px) + 3px); --gih-cm-y:0px; }
.gi-group-header__slot--cart   { --gih-cm-size:calc(var(--gih-icon-size,16px) + 5px); --gih-cm-y:0px; }

/* icon-font（會員常見）：font-size 控制；SVG（搜尋/購物車常見）：width/height 控制。兩條都打，誰存在誰生效。 */
.gi-group-header__slot--account i:before,
.gi-group-header__slot--account [class*="fa-"]:before,
.gi-group-header__slot--account [class*="icon"]:before,
.gi-group-header__slot--search i:before,
.gi-group-header__slot--search [class*="fa-"]:before,
.gi-group-header__slot--search [class*="icon"]:before,
.gi-group-header__slot--cart i:before,
.gi-group-header__slot--cart [class*="fa-"]:before,
.gi-group-header__slot--cart [class*="icon"]:before{
  font-size:var(--gih-cm-size)!important;line-height:1!important;color:var(--gih-text)!important;
}
.gi-group-header__slot--account svg{width:var(--gih-cm-size)!important;height:var(--gih-cm-size)!important;}
.gi-group-header__slot--search svg{width:var(--gih-cm-size)!important;height:var(--gih-cm-size)!important;}
.gi-group-header__slot--cart svg{width:var(--gih-cm-size)!important;height:var(--gih-cm-size)!important;}
/* Y 光學位移只打圖形本體（i / svg），不含 Badge／Dropdown，避免徽章位移。 */
.gi-group-header__slot--account > * i,.gi-group-header__slot--account > * svg,.gi-group-header__slot--account i,.gi-group-header__slot--account svg,
.gi-group-header__slot--search > * i,.gi-group-header__slot--search > * svg,.gi-group-header__slot--search i,.gi-group-header__slot--search svg,
.gi-group-header__slot--cart > * i,.gi-group-header__slot--cart > * svg,.gi-group-header__slot--cart i,.gi-group-header__slot--cart svg{
  transform:translateY(var(--gih-cm-y,0))!important;
}
.gi-group-header__commerce a:hover,
.gi-group-header__commerce button:hover,
.gi-group-header__commerce a:focus{color:#fff2d1!important;}
/* 購物車數量徽章維持 Journal 原生更新，僅微調定位不被裁切 */
.gi-group-header__commerce #cart,
.gi-group-header__commerce .desktop-cart-wrapper,
.gi-group-header__commerce .desktop-search-wrapper,
.gi-group-header__commerce .mobile-cart-wrapper,
.gi-group-header__commerce .mobile-search-wrapper{position:relative;}
.gi-group-header__commerce #cart .dropdown-menu,
.gi-group-header__commerce .dropdown-menu,
.gi-group-header__commerce .search-content{z-index:10080!important;}

/* ===================== v1.0.20 手機 GI Header ===================== */
.gi-group-header__mobile{display:none!important;}
.gi-group-header__desktop{display:contents!important;}

/* 四個功能組成緊湊群組：會員／搜尋／購物車／漢堡，整組靠右並保留安全距離。 */
body.gi-mobile-commerce-ready .gi-group-header__mobile-actions{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  margin-left:auto!important;
  margin-right:var(--gih-mobile-actions-right,14px)!important;
  gap:var(--gih-mobile-gap,4px)!important;
}
.gi-group-header__mobile-commerce{
  display:flex!important;
  align-items:center!important;
  gap:var(--gih-mobile-gap,4px)!important;
}
.gi-group-header__mobile .gi-group-header__slot{
  flex:0 0 var(--gih-mobile-circle,42px)!important;
  width:var(--gih-mobile-circle,42px)!important;
  height:var(--gih-mobile-circle,42px)!important;
  min-width:var(--gih-mobile-circle,42px)!important;
  min-height:var(--gih-mobile-circle,42px)!important;
}
/* 手機光學校正：會員圖形通常留白較多，搜尋最大，購物車居中。只改圖形本體，不縮放 Badge／Dropdown。 */
.gi-group-header__mobile .gi-group-header__slot--account{--gih-cm-size:calc(var(--gih-mobile-icon,23px) + 2px);--gih-cm-y:0px;}
.gi-group-header__mobile .gi-group-header__slot--search{--gih-cm-size:var(--gih-mobile-icon,23px);--gih-cm-y:0px;}
.gi-group-header__mobile .gi-group-header__slot--cart{--gih-cm-size:calc(var(--gih-mobile-icon,23px) + 1px);--gih-cm-y:0px;}
/* v1.0.20: 手機會員入口由 GI 直接輸出，避免 Journal Mobile Top Menu selector 不同導致 fail-open 永遠不切換。 */
.gi-group-header__mobile-account{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:100%!important;height:100%!important;margin:0!important;padding:0!important;
  color:var(--gih-text)!important;text-decoration:none!important;line-height:1!important;
}
.gi-group-header__mobile-account svg{display:block!important;width:var(--gih-cm-size)!important;height:var(--gih-cm-size)!important;fill:none!important;stroke:currentColor!important;}
.gi-group-header__mobile-account:hover,.gi-group-header__mobile-account:focus{color:#fff2d1!important;text-decoration:none!important;}

.gi-group-header__mobile-hamburger{
  display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-end!important;
  gap:5px!important;
  flex:0 0 var(--gih-mobile-circle,42px)!important;
  width:var(--gih-mobile-circle,42px)!important;height:var(--gih-mobile-circle,42px)!important;
  min-width:var(--gih-mobile-circle,42px)!important;
  padding:0 9px!important;border:0!important;background:transparent!important;box-shadow:none!important;cursor:pointer!important;
}
.gi-group-header__mobile-hamburger span{display:block!important;width:var(--gih-mobile-icon,23px)!important;height:1.5px!important;background:var(--gih-accent)!important;transition:none!important;transform:none!important;}
.gi-group-header__mobile-hamburger span:nth-child(2),
.gi-group-header__mobile-hamburger:hover span:nth-child(2),
.gi-group-header__mobile-hamburger:focus span:nth-child(2),
.gi-group-header__mobile-hamburger:active span:nth-child(2){width:calc(var(--gih-mobile-icon,23px) * .7)!important;margin-left:auto!important;}

/* 搬到固定手機 Header 後，原生下拉不可被插槽裁切。 */
.gi-group-header__mobile,
.gi-group-header__mobile-actions,
.gi-group-header__mobile-commerce,
.gi-group-header__mobile .gi-group-header__slot{overflow:visible!important;}
.gi-group-header__mobile .dropdown-menu,
.gi-group-header__mobile .search-content{max-width:calc(100vw - 24px)!important;z-index:10080!important;}

@media(max-width:480px){
  body.gi-mobile-commerce-ready .gi-group-header__mobile-actions{gap:2px!important;margin-right:10px!important;}
  .gi-group-header__mobile .gi-group-header__slot,
  .gi-group-header__mobile-hamburger{
    flex-basis:40px!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  }
  .gi-group-header__mobile .gi-group-header__slot--account{--gih-cm-size:23px;}
  .gi-group-header__mobile .gi-group-header__slot--search{--gih-cm-size:21px;}
  .gi-group-header__mobile .gi-group-header__slot--cart{--gih-cm-size:22px;}
}

/* v1.0.20: Drawer 社群列（已於 twig 排除 YouTube）。 */
.gi-group-drawer__socials{display:flex;align-items:center;gap:16px;margin-top:28px;}
.gi-group-drawer__social{display:grid;place-items:center;width:40px;height:40px;color:var(--gih-accent,#d0ae71)!important;text-decoration:none!important;}
.gi-group-drawer__social svg,.gi-group-drawer__social img{width:22px;height:22px;fill:currentColor;object-fit:contain;}
/* v1.0.20: 手機內頁安全高度（GI 手機 Header 啟用時）。 */
body.gi-mobile-header-present.gi-custom-header-inner{padding-top:var(--gih-mobile-height,60px)!important;}
