/* PX Forward production refinements */
body.px-custom-layout #header .logo{visibility:hidden!important}
.pxf-home-brand{position:fixed;z-index:70;top:clamp(48px,6.5vh,68px);left:50%;transform:translateX(-50%);font:500 clamp(14px,1.12vw,17px)/1.1 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:.015em;color:inherit;text-decoration:none;white-space:nowrap}


@media (min-width:768px) and (max-width:1100px) and (orientation:portrait){body.pxf-style9 .pxf-gallery{grid-template-rows:clamp(180px,25vh,280px) auto 1fr}}
@media(max-width:767px){.pxf-home-brand{top:max(34px,calc(env(safe-area-inset-top) + 24px));font-size:14px}}
@media(prefers-reduced-motion:reduce){body,body.px-leaving{transition:none!important}}

/* Candidate V2: CONTACT participates in TwoFold's actual menu list. */
.navigation-menu>li.px-contact{margin-top:clamp(30px,5vh,56px)!important}
.navigation-menu>li.px-contact .px-contact__toggle{
  display:inline-block;border:0;background:none;padding:0;color:inherit;
  font:inherit;line-height:inherit;letter-spacing:inherit;text-align:left;cursor:pointer
}
.navigation-menu>li.px-contact .px-contact__email{
  display:block;margin-top:9px;color:inherit;text-decoration:none;
  font-size:.72em;line-height:1.3;letter-spacing:.045em;white-space:nowrap
}
.navigation-menu>li.px-contact .px-contact__email[hidden]{display:none!important}

/* Lightweight native page transition. Incoming state is set in <head> before first paint. */
body{opacity:1;transition:opacity 260ms ease}
body.px-leaving{opacity:0!important}

/* Safari: keep the Bare counter in the viewport and above every viewer layer. */
body.pxb-active .pxb__count{
  position:fixed!important;display:block!important;visibility:visible!important;
  opacity:1!important;z-index:100!important;
  top:max(21px,env(safe-area-inset-top))!important;
  right:max(23px,env(safe-area-inset-right))!important;
  color:rgba(255,255,255,.58)!important;
  -webkit-transform:translateZ(0);transform:translateZ(0)
}

/* Candidate V3: CONTACT is a secondary utility row aligned with the menu. */
.navigation-menu>li.px-contact{margin-top:clamp(30px,5vh,56px)!important;padding-left:0!important;text-align:left!important}
.navigation-menu>li.px-contact .px-contact__toggle{display:inline-block!important;margin:0!important;padding:0!important;border:0!important;background:none!important;color:inherit!important;font-family:inherit!important;font-size:.73em!important;font-weight:400!important;line-height:1.25!important;letter-spacing:.015em!important;text-transform:uppercase!important;text-align:left!important}
.navigation-menu>li.px-contact .px-contact__email{margin-top:8px!important;font-size:.62em!important;font-weight:400!important;letter-spacing:.02em!important}

/* Candidate V3: regular portfolio viewer arrows sit inward on desktop; Bare is untouched. */
@media (min-width:1025px){
 body:not(.pxb-active) .pxf-viewer__nav--prev{left:clamp(42px,4.25vw,76px)!important}
 body:not(.pxb-active) .pxf-viewer__nav--next{right:clamp(42px,4.25vw,76px)!important}
}

/* Candidate V4: match CONTACT's text inset to the primary menu links; tighten email spacing. */
.navigation-menu>li.px-contact .px-contact__toggle{
  padding-left:40px!important;
}
.navigation-menu>li.px-contact .px-contact__email{
  margin-top:3px!important;
}

/* Candidate V5: deterministic desktop Style 9 vertical rhythm across Safari/Firefox.
   The brand and heading now derive from the same viewport-height rhythm. */
@media (min-width:768px) and (min-height:651px){
  body.pxf-style9{
    --pxf-overview-top:clamp(30px,5.2vh,54px);
    --pxf-brand-line:19px;
    --pxf-brand-title-gap:clamp(30px,4.1vh,42px);
    --pxf-title-line:23px;
    --pxf-title-strip-gap:clamp(12px,1.7vh,18px);
  }
  body.pxf-style9 .pxf-brand{
    top:var(--pxf-overview-top)!important;
    line-height:var(--pxf-brand-line)!important;
  }
  body.pxf-style9 .pxf-gallery{
    grid-template-rows:
      calc(var(--pxf-overview-top) + var(--pxf-brand-line) + var(--pxf-brand-title-gap) + var(--pxf-title-line) + var(--pxf-title-strip-gap))
      auto 1fr!important;
  }
  body.pxf-style9 .pxf-gallery__heading{
    padding:0 24px var(--pxf-title-strip-gap)!important;
  }
  body.pxf-style9 .pxf-gallery__heading h1{
    line-height:var(--pxf-title-line)!important;
  }
}

/* Live V7: cross-browser desktop Style 9 vertical composition.
   One viewport-height anchor drives brand, album title and strip. */
@media (min-width:768px) and (min-height:651px){
  body.pxf-style9{
    --pxf-v7-top:clamp(32px,5.4vh,56px);
    --pxf-v7-brand-h:19px;
    --pxf-v7-brand-title:clamp(25px,3.2vh,33px);
    --pxf-v7-title-h:23px;
    --pxf-v7-title-strip:clamp(12px,1.6vh,17px);
  }
  body.pxf-style9 .pxf-brand{
    top:var(--pxf-v7-top)!important;
    line-height:var(--pxf-v7-brand-h)!important;
  }
  body.pxf-style9 .pxf-gallery{
    height:100vh!important;
    min-height:520px!important;
    display:block!important;
    position:relative!important;
    overflow:hidden!important;
    padding-top:calc(
      var(--pxf-v7-top) + var(--pxf-v7-brand-h) +
      var(--pxf-v7-brand-title)
    )!important;
    box-sizing:border-box!important;
  }
  body.pxf-style9 .pxf-gallery__heading{
    height:var(--pxf-v7-title-h)!important;
    min-height:0!important;
    padding:0 24px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }
  body.pxf-style9 .pxf-gallery__heading h1{
    margin:0!important;
    line-height:var(--pxf-v7-title-h)!important;
  }
  body.pxf-style9 .pxf-strip-wrap{
    margin-top:var(--pxf-v7-title-strip)!important;
    min-height:0!important;
  }
}
