/* JobLik 0.33.381
STRICT SCOPE:
- desktop only
- root entry page only
Goal: header + hero + search + 3 quick boxes + title + all 3 route cards
fully visible in the first viewport at 100% zoom, while dark footer stays below fold.
*/
@media (min-width:761px){

  body[data-joblik-path="/"] .jpx{
    min-height:100vh!important;
    background:#fff!important;
  }

  body[data-joblik-path="/"] .jpx-header{
    min-height:70px!important;
    height:70px!important;
    padding-top:6px!important;
    padding-bottom:6px!important;
  }

  body[data-joblik-path="/"] .jpx-main{
    padding-top:18px!important;
    padding-bottom:26px!important;
  }

  /* Hero: preserve design, reduce only vertical consumption. */
  body[data-joblik-path="/"] .jpx-hero{
    padding-top:18px!important;
    padding-bottom:12px!important;
    min-height:0!important;
  }

  body[data-joblik-path="/"] .jpx-hero h1{
    margin-top:0!important;
    margin-bottom:6px!important;
    font-size:34px!important;
    line-height:1.35!important;
  }

  body[data-joblik-path="/"] .jpx-hero>p{
    margin-top:0!important;
    margin-bottom:12px!important;
    font-size:15px!important;
    line-height:1.6!important;
  }

  body[data-joblik-path="/"] .jpx-search{
    margin-top:0!important;
    margin-bottom:10px!important;
    min-height:52px!important;
    height:52px!important;
  }

  body[data-joblik-path="/"] .jpx-search input{
    min-height:50px!important;
    height:50px!important;
  }

  body[data-joblik-path="/"] .jpx-search button{
    width:70px!important;
    min-width:70px!important;
    height:46px!important;
  }

  body[data-joblik-path="/"] .jpx-trust{
    margin-top:0!important;
    margin-bottom:0!important;
    gap:12px!important;
  }

  body[data-joblik-path="/"] .jpx-trust>span{
    min-height:42px!important;
    height:42px!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
    font-size:13px!important;
  }

  /* Route-title spacing */
  body[data-joblik-path="/"] .jpx-paths{
    padding-top:4px!important;
    padding-bottom:0!important;
  }

  body[data-joblik-path="/"] #jpx-paths-title{
    margin-top:0!important;
    margin-bottom:8px!important;
    font-size:28px!important;
    line-height:1.25!important;
  }

  /* Three cards fully visible, but not visually crushed. */
  body[data-joblik-path="/"] .jpx-cards{
    gap:24px!important;
    align-items:stretch!important;
  }

  body[data-joblik-path="/"] .jpx-card{
    min-height:0!important;
    height:auto!important;
    border-radius:18px!important;
    overflow:hidden!important;
  }

  body[data-joblik-path="/"] .jpx-card__image{
    height:165px!important;
    min-height:165px!important;
    max-height:165px!important;
    padding-top:4px!important;
    padding-bottom:0!important;
  }

  body[data-joblik-path="/"] .jpx-card__image img{
    width:100%!important;
    height:100%!important;
    max-height:161px!important;
    object-fit:contain!important;
    object-position:center!important;
  }

  body[data-joblik-path="/"] .jpx-card__body{
    padding:12px 14px 14px!important;
  }

  body[data-joblik-path="/"] .jpx-card__body h3{
    margin:0 0 5px!important;
    font-size:21px!important;
    line-height:1.4!important;
  }

  body[data-joblik-path="/"] .jpx-card__body>p{
    min-height:0!important;
    margin:0 0 9px!important;
    font-size:12.5px!important;
    line-height:1.55!important;
  }

  body[data-joblik-path="/"] .jpx-tags{
    gap:6px!important;
    margin:0 0 9px!important;
  }

  body[data-joblik-path="/"] .jpx-tags span{
    min-height:30px!important;
    padding:5px 8px!important;
    font-size:11px!important;
    line-height:1.35!important;
  }

  body[data-joblik-path="/"] .jpx-card__body>strong{
    min-height:38px!important;
    padding:8px 10px!important;
    font-size:13px!important;
    line-height:1.4!important;
  }

  /* Ensure any decorative card icon does not create extra vertical space. */
  body[data-joblik-path="/"] .jpx-card__icon{
    margin-top:-18px!important;
    margin-bottom:0!important;
  }
}

/* Common laptop heights: a little more compact, but still readable. */
@media (min-width:761px) and (max-height:850px){
  body[data-joblik-path="/"] .jpx-main{
    padding-top:12px!important;
    padding-bottom:20px!important;
  }

  body[data-joblik-path="/"] .jpx-hero{
    padding-top:12px!important;
    padding-bottom:8px!important;
  }

  body[data-joblik-path="/"] .jpx-hero h1{
    font-size:31px!important;
    margin-bottom:4px!important;
  }

  body[data-joblik-path="/"] .jpx-hero>p{
    margin-bottom:8px!important;
    font-size:14px!important;
  }

  body[data-joblik-path="/"] .jpx-search{
    margin-bottom:7px!important;
    height:48px!important;
    min-height:48px!important;
  }

  body[data-joblik-path="/"] .jpx-search input{
    height:46px!important;
    min-height:46px!important;
  }

  body[data-joblik-path="/"] .jpx-search button{
    height:42px!important;
  }

  body[data-joblik-path="/"] .jpx-trust>span{
    min-height:38px!important;
    height:38px!important;
    font-size:12px!important;
  }

  body[data-joblik-path="/"] #jpx-paths-title{
    margin-bottom:6px!important;
    font-size:25px!important;
  }

  body[data-joblik-path="/"] .jpx-card__image{
    height:145px!important;
    min-height:145px!important;
    max-height:145px!important;
  }

  body[data-joblik-path="/"] .jpx-card__image img{
    max-height:141px!important;
  }

  body[data-joblik-path="/"] .jpx-card__body{
    padding:9px 12px 11px!important;
  }

  body[data-joblik-path="/"] .jpx-card__body h3{
    font-size:19px!important;
    margin-bottom:4px!important;
  }

  body[data-joblik-path="/"] .jpx-card__body>p{
    margin-bottom:7px!important;
    font-size:11.5px!important;
  }

  body[data-joblik-path="/"] .jpx-tags{
    margin-bottom:7px!important;
  }

  body[data-joblik-path="/"] .jpx-tags span{
    min-height:27px!important;
    padding:4px 7px!important;
    font-size:10.5px!important;
  }

  body[data-joblik-path="/"] .jpx-card__body>strong{
    min-height:34px!important;
    padding:7px 9px!important;
    font-size:12px!important;
  }
}
