/* TradesFolks 18.4.14 — Curated sourcing premium responsive ownership
   Target: "Discover more ways to source". Loaded last to neutralize old card overrides.
   Desktop = 4 cards in one row. Tablet = 2x2. Mobile = one premium card per row. */

.curated-b2b-market{
  width:100%;
  margin:0;
  padding:28px 0 34px;
  background:#f5f7fa;
}
.curated-b2b-market>.shell{
  width:calc(100% - 48px)!important;
  max-width:none!important;
  margin-inline:auto!important;
  padding:0!important;
}
.curated-b2b-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin:0 0 18px;
}
.curated-b2b-heading .eyebrow{
  display:block;
  margin:0 0 7px;
  color:#0b5bc7!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1.2;
  letter-spacing:.10em!important;
}
.curated-b2b-heading h2{
  margin:0!important;
  color:#0b2448!important;
  font-size:clamp(28px,2.4vw,42px)!important;
  font-weight:850!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}

/* Four premium panels, one row on desktop. */
.curated-b2b-rail{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
  overflow:visible!important;
  scroll-snap-type:none!important;
}
.curated-b2b-card{
  position:relative;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  min-height:510px;
  padding:20px 20px 18px!important;
  overflow:hidden!important;
  border:1px solid #dfe5ed!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 8px 28px rgba(12,35,68,.055)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.curated-b2b-card:hover{
  transform:translateY(-2px);
  border-color:#ccd7e5!important;
  box-shadow:0 14px 34px rgba(12,35,68,.09)!important;
}
.curated-b2b-card h3{
  min-height:50px;
  margin:0 0 16px!important;
  color:#122744!important;
  font-size:19px!important;
  font-weight:850!important;
  line-height:1.25!important;
  letter-spacing:-.025em!important;
}

/* Product tiles: consistent image ratio and clean merchandising hierarchy. */
.curated-b2b-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px 12px!important;
  align-content:start!important;
  flex:1 1 auto;
}
.curated-b2b-item{
  display:grid!important;
  grid-template-rows:auto auto auto!important;
  align-content:start!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:#152844!important;
  text-decoration:none!important;
  overflow:hidden!important;
}
.curated-b2b-image{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  aspect-ratio:1.22 / 1!important;
  height:auto!important;
  min-height:0!important;
  margin:0 0 8px!important;
  overflow:hidden!important;
  border:1px solid #edf1f5!important;
  border-radius:12px!important;
  background:#f7f9fb!important;
}
.curated-b2b-image img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:5px!important;
  transition:transform .22s ease;
}
.curated-b2b-item:hover .curated-b2b-image img{
  transform:scale(1.025);
}
.curated-b2b-image.is-missing,
.curated-b2b-image:has(.curated-b2b-placeholder){
  background:#f1f5fa!important;
}
.curated-b2b-placeholder{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:100%!important;
  color:#7c8ba0!important;
  font-size:13px!important;
  font-weight:900!important;
}
.curated-b2b-item strong{
  display:-webkit-box!important;
  min-height:36px;
  margin:0!important;
  overflow:hidden!important;
  color:#172a47!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1.35!important;
  text-align:left!important;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.curated-b2b-item small{
  display:block!important;
  margin-top:4px!important;
  color:#748198!important;
  font-size:10.5px!important;
  line-height:1.35!important;
}
.curated-b2b-cta{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  align-self:flex-start!important;
  margin-top:18px!important;
  padding:8px 0!important;
  color:#075fc9!important;
  font-size:12px!important;
  font-weight:850!important;
  line-height:1.2!important;
  text-decoration:none!important;
}
.curated-b2b-cta span{
  display:inline-block;
  transition:transform .18s ease;
}
.curated-b2b-cta:hover span{transform:translateX(3px)}

/* Standard desktop/laptop: still exactly four cards in one row. */
@media (min-width:1280px) and (max-width:1599px){
  .curated-b2b-market>.shell{width:calc(100% - 40px)!important}
  .curated-b2b-rail{gap:13px!important}
  .curated-b2b-card{min-height:480px;padding:18px 16px 16px!important}
  .curated-b2b-card h3{font-size:17px!important;min-height:44px}
  .curated-b2b-grid{gap:12px 10px!important}
  .curated-b2b-item strong{font-size:12px!important}
}

/* Tablet landscape/portrait: 2 x 2, no horizontal page overflow. */
@media (min-width:700px) and (max-width:1279px){
  .curated-b2b-market{padding:24px 0 30px}
  .curated-b2b-market>.shell{width:calc(100% - 32px)!important}
  .curated-b2b-rail{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
  }
  .curated-b2b-card{min-height:470px!important}
}

/* Mobile: one full premium card; all 4 products stay visible as a clean 2x2 grid. */
@media (max-width:699px){
  .curated-b2b-market{
    padding:20px 0 24px!important;
  }
  .curated-b2b-market>.shell{
    width:calc(100% - 24px)!important;
    margin-inline:auto!important;
  }
  .curated-b2b-heading{
    margin-bottom:13px!important;
  }
  .curated-b2b-heading .eyebrow{
    margin-bottom:5px!important;
    font-size:9px!important;
  }
  .curated-b2b-heading h2{
    max-width:290px;
    font-size:24px!important;
    line-height:1.12!important;
  }
  .curated-b2b-rail{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    width:100%!important;
    overflow:visible!important;
  }
  .curated-b2b-card{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:15px 12px 13px!important;
    border-radius:15px!important;
    box-shadow:0 6px 20px rgba(12,35,68,.05)!important;
  }
  .curated-b2b-card h3{
    min-height:0!important;
    margin-bottom:12px!important;
    font-size:16px!important;
    line-height:1.25!important;
  }
  .curated-b2b-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px 8px!important;
  }
  .curated-b2b-image{
    aspect-ratio:1.12 / 1!important;
    margin-bottom:6px!important;
    border-radius:10px!important;
  }
  .curated-b2b-image img{
    padding:3px!important;
  }
  .curated-b2b-item strong{
    min-height:31px!important;
    font-size:11px!important;
    line-height:1.3!important;
    text-align:center!important;
  }
  .curated-b2b-item small{
    display:none!important; /* keeps the mobile card compact */
  }
  .curated-b2b-cta{
    margin-top:12px!important;
    padding:7px 0 2px!important;
    font-size:11.5px!important;
  }
}

/* Very small devices: preserve 2x2 product matrix without text/image collision. */
@media (max-width:379px){
  .curated-b2b-market>.shell{width:calc(100% - 18px)!important}
  .curated-b2b-card{padding-inline:10px!important}
  .curated-b2b-grid{gap:10px 7px!important}
  .curated-b2b-item strong{font-size:10.5px!important}
}
