
/* NILA v21.60 Mobile Homepage Category Marquee Replacement */
:root{
  --v60-ink:#071b31;
  --v60-blue:#176fc2;
  --v60-muted:#52677f;
  --v60-line:rgba(7,27,49,.12);
}

.v60-home-category-marquee{
  display:none;
}

@media(max-width:780px){
  /* Hide the vertical homepage category/service lists on mobile once v60 exists */
  body.page-home.v60-home-ready .v42-service-grid,
  body[data-nila-page="index"].v60-home-ready .v42-service-grid,
  body.page-home.v60-home-ready .v55-mobile-marquee,
  body[data-nila-page="index"].v60-home-ready .v55-mobile-marquee,
  body.page-home.v60-home-ready .v58-home-marquee,
  body[data-nila-page="index"].v60-home-ready .v58-home-marquee,
  body.page-home.v60-home-ready .v42-mobile-marquee,
  body[data-nila-page="index"].v60-home-ready .v42-mobile-marquee{
    display:none!important;
  }

  body.page-home .v60-home-category-marquee,
  body[data-nila-page="index"] .v60-home-category-marquee{
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
    margin:12px 0 0!important;
    position:relative!important;
  }

  body.page-home .v60-home-category-track,
  body[data-nila-page="index"] .v60-home-category-track{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    gap:14px!important;
    width:max-content!important;
    min-width:max-content!important;
    transform:translate3d(0,0,0);
    will-change:transform!important;
  }

  body.page-home .v60-category-card,
  body[data-nila-page="index"] .v60-category-card{
    flex:0 0 262px!important;
    width:262px!important;
    min-height:292px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border-radius:22px!important;
    background:#fff!important;
    border:1px solid rgba(7,27,49,.10)!important;
    box-shadow:0 18px 46px rgba(7,27,49,.11)!important;
    color:var(--v60-ink)!important;
    text-decoration:none!important;
  }

  body.page-home .v60-category-image,
  body[data-nila-page="index"] .v60-category-image{
    height:150px!important;
    min-height:150px!important;
    overflow:hidden!important;
    background:#f7fbff!important;
  }

  body.page-home .v60-category-image img,
  body[data-nila-page="index"] .v60-category-image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    display:block!important;
  }

  body.page-home .v60-category-body,
  body[data-nila-page="index"] .v60-category-body{
    flex:1!important;
    display:flex!important;
    flex-direction:column!important;
    padding:15px 16px 16px!important;
    min-height:0!important;
  }

  body.page-home .v60-category-body h3,
  body[data-nila-page="index"] .v60-category-body h3{
    font-family:Fraunces,Georgia,serif!important;
    font-size:28px!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
    margin:0 0 8px!important;
    color:var(--v60-ink)!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  body.page-home .v60-category-body p,
  body[data-nila-page="index"] .v60-category-body p{
    color:var(--v60-muted)!important;
    font-size:13px!important;
    line-height:1.35!important;
    margin:0 0 12px!important;
    font-weight:750!important;
    min-height:38px!important;
    white-space:normal!important;
    overflow:visible!important;
    display:block!important;
  }

  body.page-home .v60-category-body small,
  body[data-nila-page="index"] .v60-category-body small{
    margin-top:auto!important;
    color:var(--v60-blue)!important;
    font-weight:950!important;
    white-space:normal!important;
  }

  /* Category/provider pages on mobile remain manual swipe only */
  body.v52-category-page .v19-cat-rail-inner,
  body.v48-category-page .v19-cat-rail-inner,
  body.v46-category-page .v19-cat-rail-inner,
  body.v41-category-page .v19-cat-rail-inner,
  body.page-provider .v47-provider-rail-inner{
    animation:none!important;
    transform:none!important;
    overflow-x:auto!important;
    width:auto!important;
    min-width:0!important;
    display:flex!important;
    -webkit-overflow-scrolling:touch!important;
    will-change:auto!important;
  }
}
