/* T2852: BourbonBuddy rickhouse header + hero (mock-up m1, "Side aisle, window
   light"). BourbonBuddy only: linked through brand_assets.site_css. Loaded
   after the palette <style>, so the same html:not(#_) + !important form wins
   over _NEON_BAR_CSS. One photo, cut into tiers; header and hero share the one
   URL (--rh-img) so a device downloads one image. Photo files are versioned
   (rh-1-*): brand files carry no ?v= stamp, so a change needs a new name.
   Fallback first (JPG), WebP where image-set() with type() is supported. */
html:not(#_){
  --rh-img:url(/static/brand/bourbon/rickhouse/rh-1-1600.jpg);
  --rh-bar:rgba(10,6,3,.72);
}
@media (min-width:1601px){
  html:not(#_){--rh-img:url(/static/brand/bourbon/rickhouse/rh-1-2560.jpg)}
}
@media (min-resolution:1.5dppx) and (min-width:601px){
  html:not(#_){--rh-img:url(/static/brand/bourbon/rickhouse/rh-1-3072.jpg)}
}
@media (max-width:600px){
  html:not(#_){--rh-img:url(/static/brand/bourbon/rickhouse/rh-1-phone.jpg)}
}
@supports (background-image:image-set(url(a.webp) type("image/webp"))){
  html:not(#_){--rh-img:image-set(url(/static/brand/bourbon/rickhouse/rh-1-1600.webp) type("image/webp"),url(/static/brand/bourbon/rickhouse/rh-1-1600.jpg) type("image/jpeg"))}
  @media (min-width:1601px){
    html:not(#_){--rh-img:image-set(url(/static/brand/bourbon/rickhouse/rh-1-2560.webp) type("image/webp"),url(/static/brand/bourbon/rickhouse/rh-1-2560.jpg) type("image/jpeg"))}
  }
  @media (min-resolution:1.5dppx) and (min-width:601px){
    html:not(#_){--rh-img:image-set(url(/static/brand/bourbon/rickhouse/rh-1-3072.webp) type("image/webp"),url(/static/brand/bourbon/rickhouse/rh-1-3072.jpg) type("image/jpeg"))}
  }
  @media (max-width:600px){
    html:not(#_){--rh-img:image-set(url(/static/brand/bourbon/rickhouse/rh-1-phone.webp) type("image/webp"),url(/static/brand/bourbon/rickhouse/rh-1-phone.jpg) type("image/jpeg"))}
  }
}

/* ---- the four logo bars: dark .72 overlay + photo + 1px gold line ---- */
html:not(#_) .wb-header,html:not(#_) .hs-header,html:not(#_) .app-header{
  background:linear-gradient(var(--rh-bar),var(--rh-bar)),var(--rh-img) center 18%/cover no-repeat,#0d0805 !important;
  border-bottom:1px solid rgba(232,170,90,.35) !important}
/* status-bar paint above the sticky app bar: flat dark (a photo cannot be box-shadowed) */
html:not(#_) .app-header{box-shadow:0 -1200px 0 0 #0d0805 !important}
/* slim bottle-page bar sits in a 640px column: the photo is a full-bleed ::before */
html:not(#_) .bc2-header{background:none !important;border-image:none !important;border-bottom:0 !important}
html:not(#_) .bc2-header::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;
  left:calc(50% - 50vw);right:calc(50% - 50vw);
  background:linear-gradient(var(--rh-bar),var(--rh-bar)),var(--rh-img) center 18%/cover no-repeat,#0d0805;
  box-shadow:0 1px 0 rgba(232,170,90,.35);pointer-events:none}
html:not(#_) body{overflow-x:clip}
html.wb-app:not(#_) .bc2-status-mask{background:#0d0805 !important}

/* ---- logo: sized by width (the lockup is wider for its height than the old one) ---- */
html:not(#_) .wb-neon-logo{height:auto !important;width:295px}
html:not(#_) .wb-neon-logo--footer{width:242px}
@media (max-width:600px){html:not(#_) .wb-neon-logo{width:min(232px,58vw)}}
@media (max-width:340px){html:not(#_) .wb-neon-logo{width:52vw}}
/* home desktop header only: the mock-up's 58px logo (355 wide); no wrap or scroll from 1000px up (G3) */
@media (min-width:1000px){html:not(#_) .hs-header .wb-neon-logo{width:355px}}

/* ---- home page only: near-black strip, photo hero ---- */
html:not(#_) .mstrip{background:#0d0805 !important}
html:not(#_) .hero{
  background:linear-gradient(90deg,rgba(14,8,4,.86),rgba(14,8,4,.55) 50%,rgba(14,8,4,.20)),var(--rh-img) center 40%/cover no-repeat,#0d0805 !important}
html:not(#_) .hero::before,html:not(#_) .hero::after{display:none !important}
html:not(#_) .hero h1{text-shadow:0 2px 14px rgba(0,0,0,.75)}
html:not(#_) .hero .sub{color:#f1e7d6 !important;text-shadow:0 1px 6px rgba(0,0,0,.8)}
html:not(#_) .hero .eyebrow{text-shadow:0 1px 4px #000}
html:not(#_) .hero .stats,html:not(#_) .hero .stat{border-color:rgba(232,190,120,.25) !important}
html:not(#_) .hero .stat span{color:#eadfc8 !important;text-shadow:0 1px 4px #000}
html:not(#_) .hero .stat b{text-shadow:0 2px 8px rgba(0,0,0,.8)}
@media (max-width:600px){
  html:not(#_) .hero h1,html:not(#_) .hero h1 *{color:#fbf3e4 !important}
  html:not(#_) .hero h1 em{color:#f0b85a !important}
  html:not(#_) .hero .sub,html:not(#_) .hero .hs-heroapp span{color:#f1e7d6 !important}
  html:not(#_) .hero .stat,html:not(#_) .hero .stats>*{background:rgba(14,8,4,.72) !important;border:1px solid rgba(232,190,120,.35) !important}
  html:not(#_) .hero .stat b{color:#f0b85a !important}
  html:not(#_) .hero .stat span{color:#eadfc8 !important}
}

/* ---- home bottle cards (Robert, 2 Nov 2026, option A): the photo box takes the
   photos' own 3:4 shape, so the whole photo shows with no blurred side fill.
   Website only; the app's card rules (html.wb-app) are left as they are. ---- */
html:not(.wb-app):not(#_) .ph{height:auto !important;aspect-ratio:3/4}
html:not(.wb-app):not(#_) .ph.ph-photo::before{display:none}
html:not(.wb-app):not(#_) .ph.ph-photo img{object-fit:cover}
html:not(.wb-app):not(#_) .ph.ph-has-app img{max-height:78%;width:auto;height:auto}
/* ---- shelf spacing (Robert, 2 Nov 2026: "too big a gap between the bottom of the
   new this week bar and 02 biggest drops"): 46px pad + 26px margin (72px) under each
   shelf plank becomes 22px + 14px (36px). Website only. ---- */
html:not(.wb-app):not(#_) section.shelf{padding-bottom:22px}
html:not(.wb-app):not(#_) section.shelf + section.shelf{margin-top:14px}
