/* TradesFolks 18.4.156
   Premium treatment for "Discover more ways to source".
   Scoped only to .curated-b2b-market.
*/

.tf-homepage .curated-b2b-market{
  position:relative!important;
  overflow:hidden!important;
  padding:18px 0 20px!important;
  border:1px solid #dce6f0!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(17,109,221,.10),transparent 27%),
    radial-gradient(circle at 94% 8%,rgba(255,190,47,.12),transparent 24%),
    linear-gradient(145deg,#f7fbff 0%,#f4f7fb 52%,#fffaf0 100%)!important;
  box-shadow:0 14px 34px rgba(16,43,87,.05)!important;
}

.tf-homepage .curated-b2b-market::before{
  content:""!important;
  position:absolute!important;
  width:260px!important;
  height:260px!important;
  right:-100px!important;
  top:-130px!important;
  border:1px solid rgba(17,109,221,.10)!important;
  border-radius:50%!important;
  box-shadow:0 0 0 48px rgba(17,109,221,.035),0 0 0 96px rgba(255,190,47,.025)!important;
  pointer-events:none!important;
}

.tf-homepage .curated-b2b-market>.shell{
  position:relative!important;
  z-index:1!important;
  padding:0 18px!important;
}

.tf-homepage .curated-b2b-heading{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:16px!important;
  margin-bottom:12px!important;
}
.tf-homepage .curated-b2b-heading .eyebrow{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  margin-bottom:7px!important;
  color:#1267c8!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.10em!important;
}
.tf-homepage .curated-b2b-heading .eyebrow::before{
  content:""!important;
  width:24px!important;
  height:3px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#126bd2,#ffbb2c)!important;
}
.tf-homepage .curated-b2b-heading h2{
  margin:0!important;
  color:#0b274f!important;
  font-size:clamp(24px,2vw,34px)!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
}

/* Four differentiated but consistent premium card tones. */
.tf-homepage .curated-b2b-card{
  --tone:#176fd0;
  --tone-soft:#eaf3ff;
  --tone-deep:#0d3b76;
  position:relative!important;
  overflow:hidden!important;
  border:1px solid color-mix(in srgb,var(--tone) 22%,#dbe5ef)!important;
  border-top:4px solid var(--tone)!important;
  border-radius:17px!important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--tone-soft) 56%,white) 0 34%,#ffffff 34% 100%)!important;
  box-shadow:0 12px 26px rgba(16,43,87,.055)!important;
}
.tf-homepage .curated-b2b-card.is-tone-1{
  --tone:#b97812;
  --tone-soft:#fff0c8;
  --tone-deep:#855200;
}
.tf-homepage .curated-b2b-card.is-tone-2{
  --tone:#14906c;
  --tone-soft:#e4f7f0;
  --tone-deep:#0b694f;
}
.tf-homepage .curated-b2b-card.is-tone-3{
  --tone:#7656c5;
  --tone-soft:#eee9ff;
  --tone-deep:#563b9e;
}

.tf-homepage .curated-b2b-card::after{
  content:""!important;
  position:absolute!important;
  width:120px!important;
  height:120px!important;
  right:-58px!important;
  top:-54px!important;
  border:1px solid color-mix(in srgb,var(--tone) 20%,transparent)!important;
  border-radius:50%!important;
  box-shadow:0 0 0 22px color-mix(in srgb,var(--tone) 5%,transparent)!important;
  pointer-events:none!important;
}

.tf-homepage .curated-b2b-card>h3{
  position:relative!important;
  z-index:1!important;
  margin:0!important;
  padding:15px 15px 12px!important;
  color:#0b274f!important;
  font-size:15px!important;
  line-height:1.08!important;
  letter-spacing:-.018em!important;
  font-weight:850!important;
}

.tf-homepage .curated-b2b-grid{
  position:relative!important;
  z-index:1!important;
  gap:8px!important;
  padding:0 12px 10px!important;
}

.tf-homepage .curated-b2b-item{
  min-width:0!important;
  padding:0 0 7px!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.76)!important;
}

.tf-homepage .curated-b2b-image{
  overflow:hidden!important;
  border:1px solid #e4eaf1!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 4px 12px rgba(16,43,87,.035)!important;
}
.tf-homepage .curated-b2b-image img{
  transition:transform .22s ease!important;
}
.tf-homepage .curated-b2b-item:hover .curated-b2b-image img{
  transform:scale(1.025)!important;
}

.tf-homepage .curated-b2b-item>strong{
  display:block!important;
  margin-top:7px!important;
  padding:0 3px!important;
  color:#142b4b!important;
  font-weight:760!important;
}
.tf-homepage .curated-b2b-item>small{
  padding:0 3px!important;
  color:#7a8da2!important;
}

.tf-homepage .curated-b2b-cta{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:42px!important;
  margin:0 12px 12px!important;
  padding:0 12px!important;
  border:1px solid color-mix(in srgb,var(--tone) 22%,#dce5ef)!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--tone-soft) 72%,white)!important;
  color:var(--tone-deep)!important;
  font-weight:850!important;
  text-decoration:none!important;
}
.tf-homepage .curated-b2b-cta svg{
  width:20px!important;
  height:20px!important;
  padding:4px!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 3px 9px rgba(16,43,87,.06)!important;
}

/* Laptop/zoom safety. */
@media(max-width:1180px){
  .tf-homepage .curated-b2b-market{
    padding:16px 0 18px!important;
  }
  .tf-homepage .curated-b2b-market>.shell{
    padding:0 14px!important;
  }
}

/* Mobile: compact, premium and still 2x2 inside each card. */
@media(max-width:820px){
  .tf-homepage .curated-b2b-market{
    padding:14px 0 15px!important;
    border-radius:18px!important;
  }
  .tf-homepage .curated-b2b-market>.shell{
    padding:0 10px!important;
  }
  .tf-homepage .curated-b2b-heading{
    margin-bottom:9px!important;
  }
  .tf-homepage .curated-b2b-heading h2{
    font-size:20px!important;
    line-height:1.05!important;
  }
  .tf-homepage .curated-b2b-heading .eyebrow{
    margin-bottom:5px!important;
    font-size:5.8px!important;
  }

  .tf-homepage .curated-b2b-rail{
    gap:8px!important;
  }
  .tf-homepage .curated-b2b-card{
    flex:0 0 min(82vw,318px)!important;
    width:min(82vw,318px)!important;
    min-width:min(82vw,318px)!important;
    max-width:min(82vw,318px)!important;
    border-radius:14px!important;
    border-top-width:3px!important;
  }
  .tf-homepage .curated-b2b-card>h3{
    padding:11px 11px 9px!important;
    font-size:12.5px!important;
  }
  .tf-homepage .curated-b2b-grid{
    gap:6px!important;
    padding:0 9px 8px!important;
  }
  .tf-homepage .curated-b2b-image{
    border-radius:8px!important;
  }
  .tf-homepage .curated-b2b-item>strong{
    margin-top:5px!important;
    font-size:8.5px!important;
    line-height:1.15!important;
  }
  .tf-homepage .curated-b2b-item>small{
    font-size:6px!important;
  }
  .tf-homepage .curated-b2b-cta{
    min-height:35px!important;
    margin:0 9px 9px!important;
    padding:0 9px!important;
    border-radius:8px!important;
    font-size:7px!important;
  }
}

@media(max-width:430px){
  .tf-homepage .curated-b2b-card{
    flex-basis:84vw!important;
    width:84vw!important;
    min-width:84vw!important;
    max-width:84vw!important;
  }
  .tf-homepage .curated-b2b-market::before{
    width:180px!important;
    height:180px!important;
  }
}