/* STLBEAST V379 — homepage hero empty-space polish.
   Focus: tighten desktop hero composition, keep mascot/header work, preserve Wraith feature and all business sections. */

/* Keep V378 logo rules active after the header version increments. */
.stlb376-header[data-stlb-v="379"] .stlb376-mainbar{
  grid-template-columns:minmax(420px,560px) minmax(300px,1fr) auto;
  padding:16px 18px;
  gap:22px;
}
.stlb376-header[data-stlb-v="379"] .stlb376-brand{
  min-height:118px;
  padding:10px 20px 10px 12px;
  border-radius:24px;
  background:linear-gradient(90deg,rgba(34,227,255,.13),rgba(8,20,38,.55) 44%,rgba(255,79,203,.10));
  border:1px solid rgba(34,227,255,.20);
  box-shadow:inset 0 0 24px rgba(34,227,255,.06),0 0 26px rgba(34,227,255,.08);
  overflow:hidden;
}
.stlb376-header[data-stlb-v="379"] .stlb376-brand::after{
  content:"";position:absolute;left:8px;right:8px;bottom:7px;height:2px;
  background:linear-gradient(90deg,transparent,var(--stlb376-cyan),var(--stlb376-pink),transparent);
  opacity:.85;filter:drop-shadow(0 0 8px rgba(34,227,255,.55));
}
.stlb376-header[data-stlb-v="379"] .stlb376-brand-mark{width:100%;max-width:520px;justify-content:flex-start}
.stlb376-header[data-stlb-v="379"] .stlb376-brand img{
  width:min(500px,100%);max-height:128px;object-fit:contain;object-position:left center;
  transform:translateX(-2px) scale(1.08);transform-origin:left center;
  filter:drop-shadow(0 0 22px rgba(34,227,255,.55)) drop-shadow(0 0 18px rgba(255,79,203,.28)) drop-shadow(0 8px 16px rgba(0,0,0,.55));
}
.stlb376-header[data-stlb-v="379"] .stlb376-brand-copy{display:none}
.stlb376-header[data-stlb-v="379"] .stlb376-search{height:58px}
.stlb376-header[data-stlb-v="379"] .stlb376-navrail{margin-top:10px}

/* The main fix: stop the hero product area from becoming a giant empty purple stage. */
@media(min-width:1181px){
  .stlb375-hero-grid{
    grid-template-columns:minmax(420px,.88fr) minmax(690px,1.12fr);
    gap:22px;
    padding-top:62px;
    padding-bottom:58px;
    align-items:center;
  }
  .stlb375-hero-copy{
    max-width:620px;
    align-self:center;
  }
  .stlb375-hero-stage{
    min-height:0;
    width:100%;
    display:grid;
    grid-template-columns:minmax(360px,1fr) minmax(220px,270px);
    gap:22px;
    align-items:center;
    justify-items:center;
    padding:10px 0;
  }
  .stlb375-hero-stage a{
    width:100%;
    max-width:560px;
    min-height:0;
    padding:18px;
    border-radius:28px;
    justify-self:end;
  }
  .stlb375-hero-stage img{
    display:block;
    width:100%;
    max-height:500px;
    object-fit:contain;
  }
  .stlb375-stage-glow{
    inset:7% 18% 4% 0;
    opacity:.88;
  }
  .stlb375-validated-card{
    position:relative;
    right:auto;
    top:auto;
    min-width:0;
    width:100%;
    max-width:270px;
    justify-self:start;
    align-self:center;
    padding:22px 20px;
  }
  .stlb375-validated-card b{font-size:24px}
  .stlb375-validated-card span{font-size:12px;line-height:1.2}
}

/* Mid-size desktop/tablet: stack the card under/near the model instead of letting it float away. */
@media(max-width:1180px){
  .stlb376-header[data-stlb-v="379"] .stlb376-mainbar{grid-template-columns:1fr}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand{min-height:112px}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand-mark{max-width:560px}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand img{width:min(540px,100%);max-height:124px}
  .stlb375-hero-grid{padding-top:48px;padding-bottom:44px;gap:18px}
  .stlb375-hero-stage{
    min-height:0;
    padding:4px 0 0;
  }
  .stlb375-hero-stage a{max-width:620px;width:100%;padding:16px}
  .stlb375-hero-stage img{max-height:460px;width:100%;object-fit:contain}
  .stlb375-validated-card{margin-top:12px}
}

/* Mobile: keep it compact, avoid a huge header/image wall before the call-to-action sections. */
@media(max-width:820px){
  .stlb376-header[data-stlb-v="379"] .stlb376-header-wrap{padding:8px 10px 10px}
  .stlb376-header[data-stlb-v="379"] .stlb376-mainbar{padding:10px;border-radius:20px;gap:10px}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand{
    min-height:92px;justify-content:center;padding:8px 12px;border-radius:18px;
    background:radial-gradient(circle at 20% 50%,rgba(34,227,255,.16),transparent 38%),linear-gradient(90deg,rgba(34,227,255,.12),rgba(8,20,38,.60),rgba(255,79,203,.10));
  }
  .stlb376-header[data-stlb-v="379"] .stlb376-brand-mark{justify-content:center;max-width:100%}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand img{width:min(390px,96vw);max-height:108px;object-position:center center;transform:scale(1.10);transform-origin:center center}
  .stlb376-header[data-stlb-v="379"] .stlb376-search{height:48px}
  .stlb376-header[data-stlb-v="379"] .stlb376-search button{min-width:86px}
  .stlb376-header[data-stlb-v="379"] .stlb376-cta-cluster{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .stlb376-header[data-stlb-v="379"] .stlb376-ghost-btn,.stlb376-header[data-stlb-v="379"] .stlb376-primary-btn{display:flex;align-items:center;justify-content:center;min-height:42px;padding:9px 10px}
  .stlb375-hero-grid{padding-top:34px;padding-bottom:32px}
  .stlb375-hero-stage{min-height:0}
  .stlb375-hero-stage a{padding:12px;border-radius:22px;max-width:100%}
  .stlb375-hero-stage img{max-height:340px;width:100%;object-fit:contain}
  .stlb375-validated-card{padding:16px 16px;border-radius:18px;margin-top:10px}
}
@media(max-width:520px){
  .stlb376-header[data-stlb-v="379"] .stlb376-brand{min-height:82px}
  .stlb376-header[data-stlb-v="379"] .stlb376-brand img{width:min(350px,96vw);max-height:96px;transform:scale(1.12)}
  .stlb376-header[data-stlb-v="379"] .stlb376-navrail{padding:8px}
  .stlb376-header[data-stlb-v="379"] .stlb376-nav a{padding:8px 9px}
  .stlb375-hero-stage img{max-height:290px}
}
@media(max-width:380px){
  .stlb376-header[data-stlb-v="379"] .stlb376-brand img{width:min(320px,96vw);max-height:88px}
}