/*
 JobLik 0.33.332
 FINAL / mobile header only.
 - Root platform page only.
 - Hides legacy v064 header on first paint via layout guard.
 - Uses a dedicated tightly-cropped logo asset.
 - Does not affect automotive, construction, smart-card or gallery.
*/
@media (max-width:760px){

  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header{
    position:sticky!important;
    top:0!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    display:block!important;
  }

  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header > a.jpx-brand{
    position:absolute!important;
    top:50%!important;
    right:1px!important;
    left:auto!important;
    width:144px!important;
    min-width:144px!important;
    max-width:144px!important;
    height:56px!important;
    margin:0!important;
    padding:0!important;
    transform:translateY(-50%)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /*
   * CSS content replaces only the rendered root-header logo image.
   * This avoids changing shared logo assets or any other page.
   */
  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header > a.jpx-brand > img{
    content:url("/assets/img/platform-v332/joblik-header-mobile.webp?v=20260825.332")!important;
    display:block!important;
    width:142px!important;
    min-width:142px!important;
    max-width:142px!important;
    height:54px!important;
    max-height:54px!important;
    margin:0!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:right center!important;
    transform:none!important;
  }

  /* 1px page inset + 144px logo box + 2px visual gap */
  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header > button.jpx-menu-button{
    position:absolute!important;
    top:50%!important;
    right:147px!important;
    left:auto!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
    margin:0!important;
    padding:0!important;
    transform:translateY(-50%)!important;
    display:grid!important;
    place-items:center!important;
  }

  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header > .jpx-account{
    position:absolute!important;
    top:50%!important;
    left:8px!important;
    right:auto!important;
    margin:0!important;
    padding:0!important;
    transform:translateY(-50%)!important;
  }

  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header .jpx-start{
    margin:0!important;
  }

  html body.public-body.jpx-page[data-joblik-path="/"] .jpx > .jpx-header > .jpx-nav{
    top:58px!important;
  }
}