/* V153 public header + product image final polish
   Fixes inconsistent public-page headers, giant/empty logo panels, and blank product cards. */

:root{
  --stlb153-bg:#030914;
  --stlb153-panel:#071222;
  --stlb153-line:rgba(37,199,255,.24);
  --stlb153-blue:#25c7ff;
  --stlb153-purple:#a846ff;
}

/* Universal public shell sizing */
.v114-shell,
.stlb125-shell,
.shell,
.v140-members-page main,
.v140-header,
.v140-footer{
  max-width:1240px!important;
}

/* Compact premium logo everywhere */
.v140-logo,
.stlb125-brand,
.logo.clean-wordmark,
.v114-logo.clean-wordmark{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-width:320px!important;
  padding:8px 10px!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(5,12,24,.92),rgba(2,7,15,.96))!important;
  border:1px solid rgba(37,199,255,.20)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.035)!important;
  line-height:0!important;
  overflow:hidden!important;
}

.v140-logo img,
.stlb125-brand img,
.logo.clean-wordmark img,
.v114-logo.clean-wordmark img,
footer img[src*="stlbeast-premium-header-logo-v146"],
header img[src*="stlbeast-premium-header-logo-v146"]{
  display:block!important;
  width:clamp(170px,18vw,280px)!important;
  max-width:100%!important;
  height:auto!important;
  max-height:68px!important;
  object-fit:contain!important;
  object-position:center!important;
  opacity:1!important;
  visibility:visible!important;
  filter:drop-shadow(0 0 12px rgba(37,199,255,.22)) saturate(1.08) contrast(1.06)!important;
}

/* Membership old header -> same compact behavior */
.v140-header{
  width:min(1240px,calc(100% - 24px))!important;
  margin:12px auto 24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  flex-wrap:wrap!important;
  padding:14px!important;
  border:1px solid var(--stlb153-line)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(5,12,24,.94),rgba(2,7,15,.96))!important;
  box-shadow:0 18px 55px rgba(0,0,0,.32)!important;
}

.v140-header nav,
.stlb125-links,
.navlinks,
.v114-links{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  margin:0!important;
  padding:0!important;
}

.v140-header nav a,
.stlb125-links a,
.navlinks a,
.v114-links a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  white-space:nowrap!important;
  line-height:1!important;
  font-size:clamp(.62rem,1.05vw,.88rem)!important;
  font-weight:950!important;
  letter-spacing:.025em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
}

.v140-header nav a.active,
.stlb125-links a.active,
.navlinks a.active,
.v114-links a.active{
  color:#7eeeff!important;
  background:rgba(37,199,255,.12)!important;
  border:1px solid rgba(37,199,255,.32)!important;
}

/* Product cards: make all image slots actually show loaded images and avoid blank panels. */
.v140-product-img,
.stlb125-product-card .image,
.stlb133-release-card .media{
  display:grid!important;
  place-items:center!important;
  min-height:220px!important;
  background:
    radial-gradient(circle at 50% 40%,rgba(37,199,255,.16),transparent 42%),
    linear-gradient(145deg,rgba(4,10,22,.98),rgba(2,6,14,.98))!important;
  overflow:hidden!important;
}

.v140-product-img img,
.stlb125-product-card .image img,
.stlb133-release-card .media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:220px!important;
  object-fit:contain!important;
  object-position:center!important;
  opacity:1!important;
  visibility:visible!important;
  background:transparent!important;
}

/* Standing Beast specific: front-facing render works best in cards. */
img[src*="standing-beast"]{
  object-fit:contain!important;
  object-position:center!important;
}

/* Footer logo should be present but not oversized. */
.v140-footer img,
.footer img,
.v114-footer img{
  width:min(100%,280px)!important;
  max-height:76px!important;
  object-fit:contain!important;
}

/* Support page using includes/layout should not get a giant empty decorative top panel. */
.nav.stlb147-premium-nav .stlb147-nav-shell{
  padding:14px!important;
  grid-template-columns:minmax(210px,300px) minmax(0,1fr) minmax(220px,300px)!important;
}
.nav.stlb147-premium-nav .stlb147-logo-frame{
  min-height:0!important;
  max-width:320px!important;
}

/* If an older public page uses only .nav, keep it compact. */
header.nav:not(.stlb147-premium-nav){
  width:min(1240px,calc(100% - 24px))!important;
  margin:12px auto 24px!important;
  min-height:0!important;
  padding:14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  flex-wrap:wrap!important;
  border:1px solid var(--stlb153-line)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(5,12,24,.94),rgba(2,7,15,.96))!important;
}

/* Mobile */
@media(max-width:760px){
  .v140-header,
  header.nav:not(.stlb147-premium-nav){
    justify-content:center!important;
    text-align:center!important;
  }
  .v140-header nav,
  .stlb125-links,
  .navlinks,
  .v114-links{
    width:100%!important;
    gap:6px!important;
  }
  .v140-product-img,
  .stlb125-product-card .image,
  .stlb133-release-card .media,
  .v140-product-img img,
  .stlb125-product-card .image img,
  .stlb133-release-card .media img{
    min-height:200px!important;
  }
  .v140-logo img,
  .stlb125-brand img,
  .logo.clean-wordmark img,
  .v114-logo.clean-wordmark img{
    width:min(100%,230px)!important;
    max-height:60px!important;
  }
}