/* STLBEAST V383 — Homepage image fit + missing-render polish.
   Purpose: stop product/category cards from cutting off heads and remove placeholder-looking homepage render usage.
   Safe CSS/Index patch only: no checkout, PayPal, download, price, or membership logic changes. */

/* Product cards: show the full model instead of cropping heads/feet. */
.stlb375-product-media{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  aspect-ratio:1 / 1.08 !important;
  padding:12px !important;
  background:
    radial-gradient(circle at center, rgba(34,227,255,.12), rgba(2,7,14,.96) 70%),
    linear-gradient(180deg, rgba(4,12,23,.96), rgba(1,5,12,.98)) !important;
}
.stlb375-product-media img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
  transform:none !important;
}
.stlb375-product-card:hover .stlb375-product-media img{transform:none !important;}

/* Category cards: no more chopped heads. Keep the cinematic card, but fit the subject. */
.stlb375-cat-card{
  min-height:205px !important;
  background:
    radial-gradient(circle at center, color-mix(in srgb, var(--accent), transparent 82%), transparent 60%),
    linear-gradient(180deg, rgba(8,18,34,.88), rgba(5,11,21,.98)) !important;
}
.stlb375-cat-card img{
  inset:10px !important;
  width:calc(100% - 20px) !important;
  height:calc(100% - 20px) !important;
  object-fit:contain !important;
  object-position:center center !important;
  opacity:.72 !important;
  filter:saturate(1.08) contrast(1.08) drop-shadow(0 18px 24px rgba(0,0,0,.35)) !important;
}
.stlb375-cat-card:hover img{transform:none !important;}

/* Hero collage thumbnails: fit the whole model and avoid face/head cuts. */
.stlb381-collage-item{
  padding:6px !important;
  background:
    radial-gradient(circle at center, rgba(34,227,255,.10), rgba(3,8,16,.98) 72%) !important;
}
.stlb381-collage-item img{
  object-fit:contain !important;
  object-position:center center !important;
  opacity:.82 !important;
  background:transparent !important;
}
.stlb381-collage-item span{
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.78)) !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  padding:20px 8px 8px !important;
}

/* Main hero product: keep the entire Wraith visible. */
.stlb381-main-product img,
.stlb375-hero-stage img{
  object-fit:contain !important;
  object-position:center center !important;
}

/* If a fallback placeholder still appears somewhere, make it less ugly and less dominant. */
img[src*="stlbeast-product-fallback"],
img[src*="system/stlbeast"]{
  object-fit:contain !important;
  padding:18px !important;
  opacity:.72 !important;
}

/* Mobile tightening after contain-fit, so cards do not become too tall. */
@media(max-width:720px){
  .stlb375-product-media{aspect-ratio:1 / 1.02 !important;padding:8px !important;}
  .stlb375-cat-card{min-height:160px !important;}
  .stlb375-cat-card img{inset:8px !important;width:calc(100% - 16px) !important;height:calc(100% - 16px) !important;}
  .stlb381-collage-item{padding:5px !important;}
}
@media(max-width:420px){
  .stlb375-product-media{aspect-ratio:1 / 1 !important;}
  .stlb375-cat-card{min-height:145px !important;}
}
