/* WORK ARCHIVE menu — adaptive readability layer
   Keeps the project switcher readable over both light portfolio imagery and the dark archive canvas.
   Surface state is supplied by work-archive-menu-contrast.js.
*/
html body.work-archive-page .wa-switcher{
  --wa-menu-bg:rgba(0,0,0,.95);
  --wa-menu-fg:#fff;
  --wa-menu-line:rgba(255,255,255,.14);
  --wa-menu-line-soft:rgba(255,255,255,.10);
  --wa-menu-scroll-track:rgba(255,255,255,.06);
  --wa-menu-scroll-thumb:rgba(255,255,255,.34);
}

html body.work-archive-page .wa-switcher[data-wa-surface="light"]{
  --wa-menu-bg:rgba(255,255,255,.95);
  --wa-menu-fg:#000;
  --wa-menu-line:rgba(0,0,0,.14);
  --wa-menu-line-soft:rgba(0,0,0,.10);
  --wa-menu-scroll-track:rgba(0,0,0,.06);
  --wa-menu-scroll-thumb:rgba(0,0,0,.34);
}

html body.work-archive-page .wa-switcher__toggle{
  color:var(--wa-menu-fg)!important;
  transition:color .16s ease!important;
}
html body.work-archive-page .wa-switcher__title-word{
  display:block!important;
  min-width:0!important;
  white-space:nowrap!important;
}
html body.work-archive-page .wa-switcher__toggle::after{
  border-right-color:currentColor!important;
  border-bottom-color:currentColor!important;
  opacity:.60;
}

html body.work-archive-page .wa-switcher__menu{
  background:var(--wa-menu-bg)!important;
  color:var(--wa-menu-fg)!important;
  scrollbar-color:var(--wa-menu-scroll-thumb) var(--wa-menu-scroll-track)!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease,background-color .16s ease,color .16s ease!important;
  -webkit-backdrop-filter:blur(8px) saturate(.9);
  backdrop-filter:blur(8px) saturate(.9);
}
html body.work-archive-page .wa-switcher__menu::-webkit-scrollbar-track{background:var(--wa-menu-scroll-track)!important}
html body.work-archive-page .wa-switcher__menu::-webkit-scrollbar-thumb{background:var(--wa-menu-scroll-thumb)!important}
html body.work-archive-page .wa-menu-group{border-top-color:var(--wa-menu-line)!important}
html body.work-archive-page .wa-menu-group strong,
html body.work-archive-page .wa-menu-group a{color:var(--wa-menu-fg)!important}
html body.work-archive-page .wa-menu-group a+a{border-top-color:var(--wa-menu-line-soft)!important}
html body.work-archive-page .wa-menu-group a:hover,
html body.work-archive-page .wa-menu-group a:focus-visible{color:var(--wa-menu-fg)!important;opacity:1!important}
html body.work-archive-page .wa-menu-group a.is-active{color:var(--hm-blue)!important}
html body.work-archive-page .wa-menu-group a.is-visited{opacity:.30!important}

@media(max-width:780px){
  html body.work-archive-page .wa-switcher__menu{background:var(--wa-menu-bg)!important}
}

@media(prefers-reduced-motion:reduce){
  html body.work-archive-page .wa-switcher__toggle,
  html body.work-archive-page .wa-switcher__menu{transition:none!important}
}


/* WORK ARCHIVE hero-title handoff parity with works.html.
   One visible title only: the switcher label occupies the hero title position,
   then shrinks and travels to the shared top-right hamburger state. */
html body.work-archive-page #live-main .wa-hero .hm-title{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body.work-archive-page .wa-switcher{
  position:fixed!important;
  z-index:2147483647!important;
  top:var(--wa-title-top,50vh)!important;
  left:var(--hm-inset-desktop,40px)!important;
  width:400px!important;
  max-width:calc(100vw - (var(--hm-inset-desktop,40px) * 2))!important;
  margin:0!important;
  transform:translateY(var(--wa-title-translate,-50%))!important;
  transform-origin:left center!important;
  will-change:top,transform!important;
}
html body.work-archive-page .wa-switcher__toggle{
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  gap:.22em!important;
  width:max-content!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-family:var(--hm-font-en,var(--hm-font-en-thin))!important;
  font-size:var(--wa-title-size,clamp(72px,9vw,160px))!important;
  font-weight:300!important;
  line-height:.8!important;
  letter-spacing:-.035em!important;
  white-space:nowrap!important;
  pointer-events:none!important;
  cursor:default!important;
  transition:color .16s ease!important;
}
html body.work-archive-page .wa-switcher__toggle::after{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body.work-archive-page .wa-switcher__period{
  position:absolute!important;
  top:calc(100% + var(--hm-title-description-gap,32px))!important;
  left:0!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:rgba(255,255,255,.60)!important;
  font-family:var(--hm-font-en,var(--hm-font-en-thin))!important;
  font-size:16px!important;
  font-weight:300!important;
  line-height:1.45!important;
  letter-spacing:var(--hm-track-body,0)!important;
  white-space:nowrap!important;
  opacity:var(--wa-period-opacity,1)!important;
  visibility:visible!important;
  pointer-events:none!important;
  transition:opacity .12s linear!important;
}
html body.work-archive-page.wa-title-compact .wa-switcher__period{
  opacity:0!important;
  visibility:hidden!important;
}
html body.work-archive-page.wa-title-compact .wa-switcher__toggle{
  padding-right:48px!important;
  color:var(--wa-menu-fg)!important;
  font-family:var(--hm-font-en-extralight,var(--hm-font-en))!important;
  font-weight:200!important;
  line-height:1!important;
  letter-spacing:-.02em!important;
  pointer-events:auto!important;
  cursor:pointer!important;
}
html body.work-archive-page.wa-title-compact .wa-switcher__toggle::after{
  opacity:.60!important;
  visibility:visible!important;
  pointer-events:none!important;
}
html body.work-archive-page .wa-switcher__menu{
  top:56px!important;
}

@media(max-width:780px){
  html body.work-archive-page .wa-switcher{
    position:fixed!important;
    top:var(--wa-title-top,50vh)!important;
    left:var(--hm-inset-mobile,18px)!important;
    width:max-content!important;
    max-width:calc(100vw - (var(--hm-inset-mobile,18px) * 2))!important;
    margin:0!important;
    transform:translateX(var(--wa-title-x,0px)) translateY(var(--wa-title-translate,-50%))!important;
    transform-origin:left center!important;
  }
  html body.work-archive-page .wa-switcher__toggle{
    width:max-content!important;
    height:auto!important;
    padding:0!important;
    flex-direction:column!important;
    gap:0!important;
    font-size:var(--wa-title-size,clamp(64.8px,8.1vw,144px))!important;
    font-weight:300!important;
    line-height:.82!important;
    letter-spacing:-.035em!important;
  }
  html body.work-archive-page .wa-switcher__period{
    top:calc(100% + 16px)!important;
    font-size:14px!important;
  }
  html body.work-archive-page.wa-title-compact .wa-switcher__toggle{
    padding-right:36px!important;
    font-weight:200!important;
    line-height:1!important;
    letter-spacing:-.02em!important;
  }
  html body.work-archive-page .wa-switcher__menu{
    top:52px!important;
    width:100%!important;
    max-width:none!important;
  }
}


/* WORK ARCHIVE mobile hamburger handoff.
   The two-line title shrinks/moves toward the top-right and swaps to the fixed
   three-line trigger only at the end of that motion. Existing menu content is unchanged. */
@media(max-width:780px){
  html body.work-archive-page.wa-title-compact .wa-switcher{
    position:fixed!important;
    z-index:2147483647!important;
    top:18px!important;
    right:18px!important;
    bottom:auto!important;
    left:auto!important;
    width:32px!important;
    max-width:32px!important;
    height:32px!important;
    margin:0!important;
    transform:none!important;
    transform-origin:center!important;
    will-change:auto!important;
  }

  html body.work-archive-page.wa-title-compact .wa-switcher__toggle{
    position:relative!important;
    display:block!important;
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    color:var(--wa-menu-fg)!important;
    background:transparent!important;
    font-size:0!important;
    line-height:0!important;
    letter-spacing:0!important;
    overflow:visible!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  html body.work-archive-page.wa-title-compact .wa-switcher__title-word{
    display:none!important;
  }

  html body.work-archive-page.wa-title-compact .wa-switcher__toggle::after{
    content:""!important;
    position:absolute!important;
    top:7px!important;
    right:6px!important;
    bottom:auto!important;
    left:6px!important;
    display:block!important;
    width:20px!important;
    height:1px!important;
    border:0!important;
    background:currentColor!important;
    box-shadow:0 8px 0 currentColor,0 16px 0 currentColor!important;
    opacity:.82!important;
    visibility:visible!important;
    transform:none!important;
    pointer-events:none!important;
  }

  html body.work-archive-page.wa-title-compact .wa-switcher__period{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
  }

  html body.work-archive-page.wa-title-compact .wa-switcher__menu{
    position:fixed!important;
    z-index:2147483646!important;
    top:58px!important;
    right:18px!important;
    bottom:auto!important;
    left:auto!important;
    width:calc(100vw - 36px)!important;
    max-width:none!important;
    max-height:calc(100svh - 76px)!important;
    margin:0!important;
    padding:10px 12px 14px!important;
  }
}