/* TradesFolks 18.4.140
   Featured Marketplace — yellow title strip + product-name alignment fix.
*/

@media(min-width:821px){

  /* Keep card body geometry stable */
  .tf-homepage .featured-marketplace-card,
  .tf-homepage .tf-featured-card,
  .tf-homepage .marketplace-product-card{
    overflow:hidden!important;
    height:auto!important;
    min-height:0!important;
  }

  /* Product image area must end cleanly before title strip */
  .tf-homepage .featured-marketplace-card-media,
  .tf-homepage .tf-featured-card-media,
  .tf-homepage .marketplace-product-card-media{
    margin:0!important;
    padding-bottom:0!important;
  }

  /* Canonical yellow footer/title strip */
  .tf-homepage .featured-marketplace-card-title,
  .tf-homepage .tf-featured-card-title,
  .tf-homepage .marketplace-product-card-title,
  .tf-homepage .featured-marketplace-card-footer,
  .tf-homepage .tf-featured-card-footer{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-height:54px!important;
    height:54px!important;
    max-height:54px!important;
    margin:0!important;
    padding:7px 16px 13px!important;
    box-sizing:border-box!important;
    background:linear-gradient(180deg,#ffd453 0%,#ffc52d 100%)!important;
    border-top:1px solid rgba(230,164,0,.35)!important;
    overflow:hidden!important;
  }

  /* Product name: centered, visible, no edge clipping */
  .tf-homepage .featured-marketplace-card-title h3,
  .tf-homepage .featured-marketplace-card-title strong,
  .tf-homepage .featured-marketplace-card-title a,
  .tf-homepage .tf-featured-card-title h3,
  .tf-homepage .tf-featured-card-title strong,
  .tf-homepage .tf-featured-card-title a,
  .tf-homepage .marketplace-product-card-title h3,
  .tf-homepage .marketplace-product-card-title strong,
  .tf-homepage .marketplace-product-card-title a,
  .tf-homepage .featured-marketplace-card-footer h3,
  .tf-homepage .featured-marketplace-card-footer strong,
  .tf-homepage .tf-featured-card-footer h3,
  .tf-homepage .tf-featured-card-footer strong{
    display:-webkit-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 2px!important;
    color:#102b57!important;
    font-size:13px!important;
    line-height:1.16!important;
    font-weight:800!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    text-decoration:none!important;
  }

  /* Small white drag/indicator line must sit at bottom and never overlap text */
  .tf-homepage .featured-marketplace-card-title::after,
  .tf-homepage .tf-featured-card-title::after,
  .tf-homepage .marketplace-product-card-title::after,
  .tf-homepage .featured-marketplace-card-footer::after,
  .tf-homepage .tf-featured-card-footer::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:4px!important;
    width:26px!important;
    height:3px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.96)!important;
    transform:translateX(-50%)!important;
    pointer-events:none!important;
  }
}

/* Mid-size desktop/tablet zoom */
@media(min-width:821px) and (max-width:1180px){
  .tf-homepage .featured-marketplace-card-title,
  .tf-homepage .tf-featured-card-title,
  .tf-homepage .marketplace-product-card-title,
  .tf-homepage .featured-marketplace-card-footer,
  .tf-homepage .tf-featured-card-footer{
    min-height:50px!important;
    height:50px!important;
    max-height:50px!important;
    padding:6px 10px 12px!important;
  }

  .tf-homepage .featured-marketplace-card-title h3,
  .tf-homepage .featured-marketplace-card-title strong,
  .tf-homepage .featured-marketplace-card-title a,
  .tf-homepage .tf-featured-card-title h3,
  .tf-homepage .tf-featured-card-title strong,
  .tf-homepage .tf-featured-card-title a,
  .tf-homepage .marketplace-product-card-title h3,
  .tf-homepage .marketplace-product-card-title strong,
  .tf-homepage .marketplace-product-card-title a{
    font-size:12px!important;
  }
}

/* Mobile: same visual language, compact */
@media(max-width:820px){
  .tf-homepage .featured-marketplace-card-title,
  .tf-homepage .tf-featured-card-title,
  .tf-homepage .marketplace-product-card-title,
  .tf-homepage .featured-marketplace-card-footer,
  .tf-homepage .tf-featured-card-footer{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:48px!important;
    height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:6px 9px 11px!important;
    box-sizing:border-box!important;
    background:linear-gradient(180deg,#ffd453 0%,#ffc52d 100%)!important;
    overflow:hidden!important;
  }

  .tf-homepage .featured-marketplace-card-title h3,
  .tf-homepage .featured-marketplace-card-title strong,
  .tf-homepage .featured-marketplace-card-title a,
  .tf-homepage .tf-featured-card-title h3,
  .tf-homepage .tf-featured-card-title strong,
  .tf-homepage .tf-featured-card-title a,
  .tf-homepage .marketplace-product-card-title h3,
  .tf-homepage .marketplace-product-card-title strong,
  .tf-homepage .marketplace-product-card-title a{
    display:-webkit-box!important;
    width:100%!important;
    margin:0!important;
    color:#102b57!important;
    font-size:11px!important;
    line-height:1.15!important;
    font-weight:800!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }

  .tf-homepage .featured-marketplace-card-title::after,
  .tf-homepage .tf-featured-card-title::after,
  .tf-homepage .marketplace-product-card-title::after,
  .tf-homepage .featured-marketplace-card-footer::after,
  .tf-homepage .tf-featured-card-footer::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:3px!important;
    width:22px!important;
    height:3px!important;
    border-radius:999px!important;
    background:#fff!important;
    transform:translateX(-50%)!important;
  }
}
