/* STLBEAST V653 — final responsive composition and density polish
   Tightens mobile/tablet layouts, integrates brand scenes, and removes empty image wells. */
:root{
  --v653-line:rgba(71,160,255,.46);
  --v653-panel:#061522;
  --v653-deep:#020812;
  --v653-cyan:#3dd5ff;
  --v653-blue:#198dff;
  --v653-violet:#a92cff;
}

/* Accessibility link remains available to keyboard users only. */
.v648-skip{
  position:fixed!important;
  left:-10000px!important;
  top:12px!important;
  z-index:99999!important;
  opacity:0!important;
}
.v648-skip:focus,.v648-skip:focus-visible{
  left:12px!important;
  opacity:1!important;
}

/* Stronger, properly scaled shared branding. */
.v648-brand,.v650-header .v648-brand{
  flex:0 0 auto!important;
  width:248px!important;
  min-width:248px!important;
  height:62px!important;
}
.v648-brand img,.v650-header .v648-brand img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.v648-footer-brand img,.v650-footer .v648-footer-brand img{
  width:min(100%,300px)!important;
  height:auto!important;
}

/* More intentional visual rhythm on the homepage. */
.v648-hero-copy h1{max-width:760px}
.v648-featured-media img,.v648-product-media img,.v648-category-card img{
  object-fit:contain!important;
  object-position:center!important;
}
.v648-featured-media img{padding:20px!important}
.v648-product-media img{padding:12px!important}
.v648-category-card img{padding:8px!important}

/* Desktop story cards remain full-bleed and visually integrated. */
.v652-story-card{position:relative!important}
.v652-story-art img{transform:scale(1.015)}
.v648-doctor .v652-story-art img{object-position:center 30%!important}
.v648-hub .v652-story-art img{object-position:center!important}

/* Premium focus and hover treatment. */
.v648-btn,.v648-category-card,.v648-product-card,.v648-icon-button,.v648-cart-button{
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,filter .18s ease!important;
}
.v648-btn:focus-visible,.v648-category-card:focus-visible,.v648-product-card a:focus-visible,
.v648-icon-button:focus-visible,.v648-cart-button:focus-visible{
  outline:2px solid var(--v653-cyan)!important;
  outline-offset:3px!important;
}

@media(max-width:1100px){
  .v648-brand,.v650-header .v648-brand{
    width:205px!important;
    min-width:205px!important;
    height:56px!important;
  }
  .v648-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:900px){
  /* Header: logo remains legible while controls stay compact. */
  .v648-header-inner{height:62px!important;gap:8px!important}
  .v648-brand,.v650-header .v648-brand{
    width:164px!important;
    min-width:164px!important;
    height:50px!important;
  }
  .v648-menu-button{margin-left:auto!important}
  .v648-header-actions{gap:5px!important}

  /* Hero: no squeezed two-column composition. */
  .v648-hero-grid{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    min-height:0!important;
  }
  .v652-hero-art{
    order:-1!important;
    width:100%!important;
    height:230px!important;
    min-height:230px!important;
    margin-top:10px!important;
    border-radius:14px!important;
  }
  .v652-hero-art img{
    object-fit:cover!important;
    object-position:center 38%!important;
  }
  .v648-hero-copy{padding:20px 0 24px!important}
  .v648-hero-copy h1{
    font-size:clamp(2.7rem,10vw,4.8rem)!important;
    line-height:.9!important;
    margin:9px 0 13px!important;
  }
  .v648-proof-row{margin-top:15px!important}

  /* Featured product gets room to breathe instead of being compressed. */
  .v648-featured-grid{grid-template-columns:1fr!important}
  .v648-featured-media{height:360px!important}
  .v648-featured-copy{padding:22px!important}

  /* Product cards stay readable on tablets. */
  .v648-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .v648-product-media{height:220px!important}

  /* Story cards become cinematic image-backed panels. */
  .v648-tools-row{grid-template-columns:1fr!important}
  .v648-tool-card.v652-story-card{
    display:block!important;
    min-height:380px!important;
    padding:0!important;
    isolation:isolate!important;
  }
  .v652-story-art{
    position:absolute!important;
    inset:0!important;
    min-height:0!important;
    border:0!important;
    z-index:0!important;
  }
  .v652-story-art:before{
    background:
      linear-gradient(90deg,rgba(2,8,18,.96) 0%,rgba(3,13,25,.88) 46%,rgba(2,8,18,.26) 100%),
      linear-gradient(0deg,rgba(2,8,18,.9) 0%,transparent 62%)!important;
  }
  .v652-story-art img{
    transform:none!important;
    object-fit:cover!important;
  }
  .v648-doctor .v652-story-art img{object-position:70% 28%!important}
  .v648-hub .v652-story-art img{object-position:center!important}
  .v652-story-copy{
    position:relative!important;
    z-index:4!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    min-height:380px!important;
    max-width:66%!important;
    padding:26px!important;
  }
  .v652-story-copy h2{font-size:clamp(2rem,6vw,3.1rem)!important}

  /* Vault becomes a single integrated membership scene. */
  .v652-vault{
    position:relative!important;
    display:block!important;
    min-height:430px!important;
    padding:0!important;
    isolation:isolate!important;
  }
  .v652-vault-art{
    position:absolute!important;
    inset:0!important;
    min-height:0!important;
    border:0!important;
    z-index:0!important;
  }
  .v652-vault-art:after{
    background:
      linear-gradient(0deg,rgba(3,8,18,.97) 0%,rgba(4,13,27,.88) 46%,rgba(2,8,18,.12) 100%),
      linear-gradient(90deg,rgba(2,8,18,.35),transparent 65%)!important;
  }
  .v652-vault-art img{object-position:center 38%!important}
  .v652-vault>div:nth-child(2){
    position:relative!important;
    z-index:3!important;
    padding:205px 22px 8px!important;
  }
  .v652-vault>.v648-vault-action,.v652-vault>.v651-vault-action{
    position:relative!important;
    z-index:3!important;
    display:grid!important;
    grid-column:auto!important;
    padding:10px 22px 22px!important;
  }
  .v648-vault ul{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Footer logo and link groups no longer feel miniature. */
  .v648-footer-grid,.v650-footer .v648-footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:22px 18px!important;
  }
  .v648-footer-brand,.v650-footer .v648-footer-brand{grid-column:1/-1!important}
  .v648-footer-brand img,.v650-footer .v648-footer-brand img{width:220px!important}
}

@media(max-width:620px){
  main>section,.v648-footer-grid,.v648-footer-bottom,.v648-hero-grid,.v648-header-inner{
    width:min(100% - 16px,1480px)!important;
  }
  .v648-header-inner{height:58px!important}
  .v648-brand,.v650-header .v648-brand{
    width:126px!important;
    min-width:126px!important;
    height:42px!important;
  }
  .v648-icon-button,.v648-cart-button,.v648-menu-button{
    width:36px!important;
    height:36px!important;
  }
  .v648-icon-button:first-child{display:none!important}

  .v652-hero-art{
    height:168px!important;
    min-height:168px!important;
    margin-top:8px!important;
  }
  .v652-hero-art:after{
    background:linear-gradient(0deg,rgba(2,8,18,.72),transparent 40%)!important;
  }
  .v648-hero-copy{padding:16px 0 20px!important}
  .v648-hero-copy h1{
    font-size:clamp(2.2rem,13vw,3.35rem)!important;
    letter-spacing:-.045em!important;
  }
  .v648-hero-copy>p{font-size:.86rem!important;line-height:1.5!important}
  .v648-proof-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  .v648-proof-row span{min-height:50px!important;padding:8px!important}

  .v648-featured,.v648-categories,.v648-drops,.v648-tools-row{padding-top:16px!important}
  .v648-featured-media{height:285px!important}
  .v648-featured-media img{padding:14px!important}
  .v648-featured-copy{padding:17px!important}
  .v648-featured-copy h2{font-size:2.25rem!important}
  .v648-featured-copy ul{grid-template-columns:1fr 1fr!important;margin:13px 0!important}
  .v648-featured-copy li{padding:7px!important;font-size:.62rem!important}
  .v648-featured-action{display:grid!important;grid-template-columns:1fr 1fr!important}
  .v648-featured-action>b{grid-column:1/-1!important;width:auto!important}

  /* Larger useful category art, two cards per row. */
  .v648-category-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:visible!important;
    gap:7px!important;
  }
  .v648-category-card{
    min-width:0!important;
    height:144px!important;
    grid-template-rows:92px auto auto!important;
  }
  .v648-category-card img{height:92px!important;padding:4px!important}

  /* Integrated story panels: art becomes part of the card, never a blank box. */
  .v648-tool-card.v652-story-card{min-height:350px!important}
  .v652-story-copy{
    min-height:350px!important;
    max-width:100%!important;
    justify-content:flex-end!important;
    padding:20px 17px!important;
    background:linear-gradient(0deg,rgba(2,8,18,.98) 0%,rgba(3,12,24,.88) 55%,rgba(2,8,18,.18) 100%)!important;
  }
  .v652-story-copy h2{
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:1.75rem!important;
    line-height:1!important;
    margin:6px 0 8px!important;
  }
  .v652-story-copy p{font-size:.82rem!important;line-height:1.45!important;margin:0 0 8px!important}
  .v651-chip-row{margin:8px 0!important}
  .v651-chip{padding:5px 8px!important;font-size:.64rem!important}
  .v648-doctor .v652-story-art img{object-position:center 20%!important}
  .v648-hub .v652-story-art img{object-position:center!important}

  /* Two-column product cards remain legible. */
  .v648-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  .v648-product-media{height:165px!important}
  .v648-product-body{padding:8px!important}
  .v648-product-body h3{font-size:.78rem!important;min-height:0!important}
  .v648-card-actions{grid-template-columns:1fr!important}

  /* Compact integrated vault. */
  .v652-vault{min-height:420px!important}
  .v652-vault>div:nth-child(2){padding:190px 17px 6px!important}
  .v652-vault>.v648-vault-action,.v652-vault>.v651-vault-action{padding:8px 17px 17px!important}
  .v652-vault h2,.v648-vault h2{
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:1.8rem!important;
    line-height:1!important;
  }
  .v648-vault p{font-size:.8rem!important;line-height:1.45!important}
  .v648-vault ul{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
  .v648-vault li{border-radius:7px!important;padding:7px!important;font-size:.58rem!important}

  .v648-final{padding:16px!important;gap:12px!important}
  .v648-final h2{font-size:1.65rem!important}
  .v648-final .v648-hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important}

  .v648-footer{padding-top:20px!important}
  .v648-footer-grid,.v650-footer .v648-footer-grid{gap:17px 12px!important}
  .v648-footer-brand img,.v650-footer .v648-footer-brand img{width:180px!important}
  .v648-footer-brand p{font-size:.68rem!important;max-width:100%!important}
  .v648-footer nav a{font-size:.66rem!important}
  .v648-footer-bottom{gap:7px!important}
}

@media(max-width:390px){
  .v648-brand,.v650-header .v648-brand{width:108px!important;min-width:108px!important}
  .v648-header-actions{gap:3px!important}
  .v648-menu-button,.v648-icon-button,.v648-cart-button{width:34px!important;height:34px!important}
  .v648-hero-copy h1{font-size:2.18rem!important}
  .v648-featured-copy ul{grid-template-columns:1fr!important}
  .v648-featured-action{grid-template-columns:1fr!important}
  .v648-featured-action>b{grid-column:auto!important}
  .v648-product-media{height:145px!important}
  .v648-product-meta{font-size:.5rem!important}
  .v648-product-body h3{font-size:.72rem!important}
  .v648-final .v648-hero-actions{grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  .v648-btn,.v648-category-card,.v648-product-card,.v648-icon-button,.v648-cart-button{transition:none!important}
}