/* Navigation interaction and visual rhythm based on the approved ID HOME reference. */
:root{--menu-yellow:#e8c926;--menu-rule:#c9c9c5}
.site-header{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.primary-nav>ul>li>a{font-size:15px;font-weight:500}
.primary-nav>ul>li>a:after{content:'';display:block;flex:0 0 8px;width:8px;height:8px;margin-left:auto;margin-right:2px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;color:#333;transform:translateY(-2px) rotate(45deg)}
.primary-nav>ul>li:hover>a,.primary-nav>ul>li:focus-within>a{color:#caa600;border-bottom-color:var(--menu-yellow)}
.primary-nav .sub-menu{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;min-height:0;padding:32px 5vw 36px calc(24% + 22px);background:#fff;box-shadow:0 18px 36px rgba(0,0,0,.12)}
.primary-nav .sub-menu:before{display:block;position:absolute;top:36px;left:4%;width:18%;font-family:'Noto Serif TC',serif;font-size:20px;font-weight:700;line-height:1.8;letter-spacing:0;color:var(--ink);white-space:pre}
.primary-nav>ul>li:nth-child(1)>.sub-menu:before{content:'Our Services\A服務項目'}
.primary-nav>ul>li:nth-child(2)>.sub-menu:before{content:'Equipment\A產品選購'}
.primary-nav>ul>li:nth-child(3)>.sub-menu:before{content:'Our Works\A工程實績'}
.primary-nav>ul>li:nth-child(4)>.sub-menu:before{content:'Knowledge\A修繕知識'}
.primary-nav>ul>li:nth-child(5)>.sub-menu:before{content:'About Us\A關於修繕家'}
.primary-nav>ul>li:nth-child(6)>.sub-menu:before{content:'Contact\A聯絡 / 預約估價'}
.primary-nav .sub-menu li{border-bottom:1px solid var(--menu-rule)}
.primary-nav .sub-menu a{position:relative;display:flex;align-items:center;min-height:54px;padding:12px 24px 12px 0;font-size:15px;font-weight:400;line-height:1.5;white-space:normal}
.primary-nav .sub-menu a:before{content:'';position:absolute;bottom:-1px;left:0;width:30px;height:2px;background:var(--menu-yellow)}
.primary-nav .sub-menu a:after{content:'';position:absolute;right:2px;top:50%;margin-top:-4px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--ink)}
.primary-nav .sub-menu a:hover{color:#ae9000}
@media(min-width:901px){
  .menu-open{overflow:hidden}
  .menu-open .primary-nav>ul{display:block;position:fixed;top:var(--header-h);left:0;width:100%;height:calc(100vh - var(--header-h));max-height:none;overflow-y:auto;overflow-x:hidden;grid-auto-flow:initial;padding:0;background:#f5f5f3;box-shadow:0 18px 36px rgba(0,0,0,.14)}
  .admin-bar.menu-open .primary-nav>ul{top:calc(var(--header-h) + 32px);height:calc(100vh - var(--header-h) - 32px)}
  .menu-open .primary-nav>ul>li{display:grid;grid-template-columns:24% minmax(0,1fr);align-items:start;min-height:160px;margin:0 0 7px;padding:27px max(3vw,24px);background:#fff}
  .menu-open .primary-nav>ul>li>a{display:block;min-height:0;margin:0;padding:5px 25px 0 0;border:0;font-family:'Noto Sans TC','PingFang TC','Microsoft JhengHei',sans-serif;font-size:15px;font-weight:500;white-space:normal}
  .menu-open .primary-nav>ul>li>a:after{content:'▸';display:inline;position:static;flex:none;width:auto;height:auto;margin:0 0 0 8px;border:0;transform:none;font-size:13px;color:var(--ink)}
  .menu-open .primary-nav>ul>li>a:before{display:block;margin-bottom:9px;font-family:'Noto Sans TC',sans-serif;font-size:13px;font-weight:400;line-height:1.3;color:#656565}
  .menu-open .primary-nav>ul>li:nth-child(1)>a:before{content:'Our Services'}
  .menu-open .primary-nav>ul>li:nth-child(2)>a:before{content:'Equipment'}
  .menu-open .primary-nav>ul>li:nth-child(3)>a:before{content:'Our Works'}
  .menu-open .primary-nav>ul>li:nth-child(4)>a:before{content:'Knowledge'}
  .menu-open .primary-nav>ul>li:nth-child(5)>a:before{content:'About Us'}
  .menu-open .primary-nav>ul>li:nth-child(6)>a:before{content:'Contact'}
  .menu-open .primary-nav .sub-menu{position:static;visibility:visible;opacity:1;pointer-events:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;transform:none;width:auto;min-height:0;padding:0;background:transparent;box-shadow:none}
  .menu-open .primary-nav .sub-menu:before{display:none}
  .menu-open .primary-nav .sub-menu li{border-bottom:1px solid var(--menu-rule)}
  .menu-open .primary-nav .sub-menu a{min-height:54px;padding:12px 24px 12px 0;font-size:15px}
  .menu-open .primary-nav .sub-menu a:before{display:block}
  .menu-open .primary-nav .sub-menu a:after{content:'';position:absolute;right:2px;top:50%;margin-top:-4px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--ink)}
  .menu-open .menu-toggle>span:not(.screen-reader-text){width:19px;height:2px;border-radius:0;position:absolute;margin:0;transform:rotate(45deg)}
  .menu-open .menu-toggle>span:nth-child(2){transform:rotate(-45deg)}
  .menu-open .menu-toggle>span:nth-child(3){display:none}
}
@media(max-width:900px){
  .primary-nav .sub-menu,.admin-bar .primary-nav .sub-menu{display:block;position:static;width:auto;min-height:0;padding:2px 0 12px 18px;box-shadow:none;background:transparent;transform:none}
  .primary-nav .sub-menu:before{display:none}
  .primary-nav .sub-menu a{min-height:48px;padding:9px 22px 9px 4px;font-size:15px}
  .primary-nav .sub-menu a:before{display:none}
  .primary-nav .sub-menu a:after{right:4px}
}

/* Keep submenu panel headings in Chinese only. */
.primary-nav>ul>li:nth-child(1)>.sub-menu:before{content:'關於修繕家'}
.primary-nav>ul>li:nth-child(2)>.sub-menu:before{content:'服務項目'}
.primary-nav>ul>li:nth-child(3)>.sub-menu:before{content:'優惠活動'}
.primary-nav>ul>li:nth-child(4)>.sub-menu:before{content:'產品選購'}
.primary-nav>ul>li:nth-child(5)>.sub-menu:before{content:'工程實績'}
.primary-nav>ul>li:nth-child(6)>.sub-menu:before{content:'修繕知識'}
@media(min-width:901px){
  .menu-open .primary-nav>ul>li>a:before{display:none}
}

/* Center primary menu vertically after utility links were removed. */
@media(min-width:901px){
  .utility-nav:empty{display:none}
  .utility-nav:empty + .primary-nav{grid-row:1 / 3}
}

/* Keep header and expanded navigation on separate glass surfaces. */
:root{--szj-nav-glass-background:rgba(255,255,255,.86);--szj-nav-glass-filter:blur(14px)}
#site-header.site-header,#site-header.site-header.is-scrolled{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#site-header::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background-color .25s ease}
#site-header.is-scrolled::after{background:var(--szj-nav-glass-background);-webkit-backdrop-filter:var(--szj-nav-glass-filter);backdrop-filter:var(--szj-nav-glass-filter)}
@media(min-width:901px){
  .primary-nav>ul>li>.sub-menu{background:var(--szj-nav-glass-background);-webkit-backdrop-filter:var(--szj-nav-glass-filter);backdrop-filter:var(--szj-nav-glass-filter)}
  .menu-open #primary-menu{background:var(--szj-nav-glass-background);-webkit-backdrop-filter:var(--szj-nav-glass-filter);backdrop-filter:var(--szj-nav-glass-filter)}
  .menu-open #primary-menu>li{background:transparent}
  .menu-open #primary-menu>li>.sub-menu{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(max-width:900px){
  .header-navs{background:var(--szj-nav-glass-background);-webkit-backdrop-filter:var(--szj-nav-glass-filter);backdrop-filter:var(--szj-nav-glass-filter)}
  .primary-nav>ul>li>.sub-menu{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
}