/* TradesFolks Sprint 18.3.84 — Homepage Responsive QA & UI Polish
   Scoped to the public marketplace homepage only. */

body.tf-homepage:has(.tf-home-v3){
  --tf-home-gutter:24px;
  --tf-home-section-y:34px;
  --tf-home-card-gap:14px;
  overflow-x:hidden;
}
body.tf-homepage:has(.tf-home-v3) :where(.shell,.market-shell){
  width:calc(100% - (var(--tf-home-gutter) * 2))!important;
  max-width:none!important;
  margin-inline:auto!important;
}
body.tf-homepage:has(.tf-home-v3) img{max-width:100%;}
body.tf-homepage:has(.tf-home-v3) :where(.section-head,.curated-b2b-heading,.country-market-head){
  gap:16px!important;
}
body.tf-homepage:has(.tf-home-v3) :where(.section-head h2,.curated-b2b-heading h2,.country-market-head h2){
  text-wrap:balance;
}

/* Header + navigation: keep the new full-width shell aligned without crowding. */
body.tf-homepage:has(.tf-home-v3) .header-main{gap:clamp(14px,1.5vw,28px)!important;}
body.tf-homepage:has(.tf-home-v3) .nav-inner{min-width:0!important;}
body.tf-homepage:has(.tf-home-v3) .nav-inner nav{min-width:0!important;gap:clamp(16px,1.7vw,30px)!important;}

/* Hero: fluid two-column desktop, clean single-column tablet/mobile. */
body.tf-homepage:has(.tf-home-v3) .market-hero{padding-block:clamp(26px,3.2vw,52px)!important;}
body.tf-homepage:has(.tf-home-v3) .market-hero-grid{
  grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr)!important;
  gap:clamp(22px,3vw,52px)!important;
  align-items:center!important;
}
body.tf-homepage:has(.tf-home-v3) .market-hero h1{
  font-size:clamp(36px,4.35vw,68px)!important;
  line-height:1.02!important;
  letter-spacing:-.045em!important;
  text-wrap:balance;
}
body.tf-homepage:has(.tf-home-v3) .market-hero p{max-width:780px!important;}
body.tf-homepage:has(.tf-home-v3) .market-rfq-card{min-width:0!important;}

/* Common cards and product/category media: prevent stretching after full-width conversion. */
body.tf-homepage:has(.tf-home-v3) :where(.product-card,.category-card,.supplier-card,.curated-b2b-card,.country-market-card){min-width:0!important;}
body.tf-homepage:has(.tf-home-v3) .product-image{aspect-ratio:1/1!important;height:auto!important;min-height:0!important;}
body.tf-homepage:has(.tf-home-v3) .product-image img{width:100%!important;height:100%!important;object-fit:contain!important;}
body.tf-homepage:has(.tf-home-v3) .category-image{aspect-ratio:1.75/1!important;height:auto!important;min-height:0!important;}
body.tf-homepage:has(.tf-home-v3) .category-image img{width:100%!important;height:100%!important;object-fit:cover!important;}

/* Source by country: proportional artwork and stable text height. */
body.tf-homepage:has(.tf-home-v3) .country-market-rail{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:var(--tf-home-card-gap)!important;
  overflow:visible!important;
}
body.tf-homepage:has(.tf-home-v3) .country-market-card{height:100%!important;overflow:hidden!important;}
body.tf-homepage:has(.tf-home-v3) .country-market-visual{
  position:relative!important;
  width:100%!important;
  aspect-ratio:2/1!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
body.tf-homepage:has(.tf-home-v3) .country-market-artwork{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center!important;
}
body.tf-homepage:has(.tf-home-v3) .country-market-body{min-height:104px!important;display:flex!important;flex-direction:column!important;}
body.tf-homepage:has(.tf-home-v3) .country-market-body small{margin-top:auto!important;}

/* Amazon-style sourcing area: exactly 4 cards on desktop. */
body.tf-homepage:has(.tf-home-v3) .curated-b2b-rail{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:var(--tf-home-card-gap)!important;
  overflow:visible!important;
}
body.tf-homepage:has(.tf-home-v3) .curated-b2b-card{height:100%!important;display:flex!important;flex-direction:column!important;}
body.tf-homepage:has(.tf-home-v3) .curated-b2b-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
body.tf-homepage:has(.tf-home-v3) .curated-b2b-image{aspect-ratio:1.28/1!important;height:auto!important;overflow:hidden!important;}
body.tf-homepage:has(.tf-home-v3) .curated-b2b-image img{width:100%!important;height:100%!important;object-fit:cover!important;}
body.tf-homepage:has(.tf-home-v3) .curated-b2b-cta{margin-top:auto!important;padding-top:18px!important;}

/* RFQ: keep uploaded image visible and the form readable across resolutions. */
body.tf-homepage:has(.tf-home-v3) .easy-sourcing-grid{width:calc(100% - (var(--tf-home-gutter) * 2))!important;}
body.tf-homepage:has(.tf-home-v3) .easy-sourcing-visual{
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
body.tf-homepage:has(.tf-home-v3) .easy-sourcing-grid.has-rfq-background .easy-sourcing-visual{
  background-color:#eef4fb!important;
}
body.tf-homepage:has(.tf-home-v3) .easy-sourcing-form-card{min-width:0!important;}
body.tf-homepage:has(.tf-home-v3) .easy-rfq-form :where(input,select,textarea){width:100%!important;min-width:0!important;}

/* Footer aligns to the same visual edge as homepage content. */
body.tf-homepage:has(.tf-home-v3) footer :where(.shell,.footer-shell){max-width:none!important;}

@media (min-width:1600px){
  body.tf-homepage:has(.tf-home-v3){--tf-home-gutter:28px;--tf-home-card-gap:16px;}
}
@media (max-width:1399px) and (min-width:1100px){
  body.tf-homepage:has(.tf-home-v3){--tf-home-gutter:24px;--tf-home-card-gap:12px;}
  body.tf-homepage:has(.tf-home-v3) .country-market-rail{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-card{padding:14px!important;}
}
@media (max-width:1099px){
  body.tf-homepage:has(.tf-home-v3){--tf-home-gutter:16px;--tf-home-section-y:28px;}
  body.tf-homepage:has(.tf-home-v3) .market-hero-grid{grid-template-columns:1fr!important;gap:20px!important;}
  body.tf-homepage:has(.tf-home-v3) .market-rfq-card{max-width:none!important;width:100%!important;}
  body.tf-homepage:has(.tf-home-v3) .country-market-rail{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-rail{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-grid{grid-template-columns:1fr!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-form-card{margin:0 20px 20px!important;}
}
@media (max-width:760px){
  body.tf-homepage:has(.tf-home-v3){--tf-home-gutter:12px;--tf-home-card-gap:10px;}
  body.tf-homepage:has(.tf-home-v3) :where(.section-head,.curated-b2b-heading,.country-market-head){align-items:flex-start!important;flex-direction:column!important;}
  body.tf-homepage:has(.tf-home-v3) .market-hero{padding-block:18px!important;}
  body.tf-homepage:has(.tf-home-v3) .market-hero h1{font-size:clamp(29px,9vw,39px)!important;}
  body.tf-homepage:has(.tf-home-v3) .country-market-rail{
    display:grid!important;grid-auto-flow:column!important;grid-template-columns:none!important;
    grid-auto-columns:min(78vw,320px)!important;overflow-x:auto!important;overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;padding-bottom:7px!important;scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.tf-homepage:has(.tf-home-v3) .country-market-rail::-webkit-scrollbar{display:none!important;}
  body.tf-homepage:has(.tf-home-v3) .country-market-card{scroll-snap-align:start!important;}
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-rail{
    display:grid!important;grid-auto-flow:column!important;grid-template-columns:none!important;
    grid-auto-columns:min(88vw,360px)!important;overflow-x:auto!important;overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;padding-bottom:8px!important;scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-rail::-webkit-scrollbar{display:none!important;}
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-card{scroll-snap-align:start!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-grid{width:calc(100% - 24px)!important;border-radius:18px!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-visual{min-height:320px!important;padding:24px 18px!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-form-card{margin:0 12px 12px!important;padding:20px 16px!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-rfq-row{grid-template-columns:1fr!important;}
}
@media (max-width:420px){
  body.tf-homepage:has(.tf-home-v3){--tf-home-gutter:10px;}
  body.tf-homepage:has(.tf-home-v3) .country-market-rail{grid-auto-columns:84vw!important;}
  body.tf-homepage:has(.tf-home-v3) .curated-b2b-rail{grid-auto-columns:91vw!important;}
  body.tf-homepage:has(.tf-home-v3) .easy-sourcing-grid{width:calc(100% - 20px)!important;}
}


/* Sprint 18.3.88 — Hero slider adaptive contrast + responsive polish */
body:has(.tf-home-v3) .tf-home-v3-hero{isolation:isolate}
body:has(.tf-home-v3) .tf-home-v3-media{z-index:0}
body:has(.tf-home-v3) .tf-home-v3-overlay{z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(4,20,48,.88) 0%,rgba(4,20,48,.82) 25%,rgba(4,20,48,.67) 45%,rgba(4,20,48,.30) 61%,rgba(4,20,48,.05) 78%,rgba(4,20,48,0) 100%)}
body:has(.tf-home-v3) .tf-home-v3-inner{z-index:2}
body:has(.tf-home-v3) .tf-home-v3-copy{position:relative;z-index:2;color:#fff}
body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-title]{color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.28)!important;max-width:15ch;text-wrap:balance;overflow-wrap:anywhere}
body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-description]{color:#eef4fb!important;-webkit-text-fill-color:#eef4fb!important;text-shadow:0 1px 10px rgba(0,0,0,.26)!important;max-width:62ch}
body:has(.tf-home-v3) .tf-home-v3-eyebrow{color:#ffe08a!important;-webkit-text-fill-color:#ffe08a!important;border-color:rgba(244,183,47,.72);background:rgba(7,27,70,.68);box-shadow:0 5px 18px rgba(0,0,0,.12);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
body:has(.tf-home-v3) .tf-home-v3-popular,body:has(.tf-home-v3) .tf-home-v3-popular>span{color:#f3f7fc!important;-webkit-text-fill-color:#f3f7fc!important;text-shadow:0 1px 7px rgba(0,0,0,.30)!important}
body:has(.tf-home-v3) .tf-home-v3-popular a{color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:rgba(255,255,255,.34);background:rgba(7,27,70,.58);box-shadow:0 2px 9px rgba(0,0,0,.10);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
body:has(.tf-home-v3) .tf-home-v3-secondary{border-color:rgba(255,255,255,.48);background:rgba(7,27,70,.66);box-shadow:0 5px 18px rgba(0,0,0,.12);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
body:has(.tf-home-v3) .tf-home-v3-stats{border-color:rgba(255,255,255,.28);background:rgba(7,27,70,.70);box-shadow:0 8px 24px rgba(0,0,0,.14);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body:has(.tf-home-v3) .tf-home-v3-stats strong{color:#fff!important}
body:has(.tf-home-v3) .tf-home-v3-stats span{color:#dfe8f2!important}
body:has(.tf-home-v3) .tf-home-v3-search{box-shadow:0 10px 30px rgba(0,0,0,.16)}
body:has(.tf-home-v3) .tf-home-v3-slider-ui{z-index:4}
@media(min-width:1600px){body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-title]{max-width:14ch}}
@media(max-width:1100px){body:has(.tf-home-v3) .tf-home-v3-overlay{background:linear-gradient(90deg,rgba(4,20,48,.89) 0%,rgba(4,20,48,.79) 42%,rgba(4,20,48,.38) 68%,rgba(4,20,48,.08) 100%)}body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-title]{max-width:16ch}}
@media(max-width:767px){body:has(.tf-home-v3) .tf-home-v3-overlay{background:linear-gradient(180deg,rgba(4,20,48,.82) 0%,rgba(4,20,48,.70) 57%,rgba(4,20,48,.56) 100%)}body:has(.tf-home-v3) .tf-home-v3-copy{padding-top:clamp(18px,5vw,28px)}body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-title]{max-width:18ch;font-size:clamp(25px,8.1vw,38px);line-height:1.02}body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-description]{max-width:46ch}body:has(.tf-home-v3) .tf-home-v3-popular a{background:rgba(7,27,70,.66)}}
@media(max-width:390px){body:has(.tf-home-v3) .tf-home-v3-copy [data-v3-title]{font-size:clamp(24px,7.8vw,30px)}}
@media(prefers-reduced-transparency:reduce){body:has(.tf-home-v3) .tf-home-v3-eyebrow,body:has(.tf-home-v3) .tf-home-v3-popular a,body:has(.tf-home-v3) .tf-home-v3-secondary,body:has(.tf-home-v3) .tf-home-v3-stats{backdrop-filter:none;-webkit-backdrop-filter:none}}

/* Sprint 18.3.89 — Hero slider full-image fit */
body:has(.tf-home-v3) .tf-home-v3-hero,
body:has(.tf-home-v3) .tf-home-v3-hero-artwork,
body:has(.tf-home-v3) .tf-home-v3-media{overflow:hidden!important}

body:has(.tf-home-v3) .tf-home-v3-slide{
  background-size:contain!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-color:#eef2f7!important;
}
@media(max-width:1024px){
  body:has(.tf-home-v3) .tf-home-v3-slide{background-size:contain!important;background-position:center!important}
}
@media(max-width:767px){
  body:has(.tf-home-v3) .tf-home-v3-slide{background-size:contain!important;background-position:center!important}
}
