/* ===== Version B: HM product-page top (loads after hm-ntv2.css) ===== */
body.hm-b .hm-top{background:var(--hm-grey);padding:34px 0 46px;border-bottom:1px solid #eee}
@media (min-width:768px){ body.hm-b .hm-top{padding-top:84px} body.hm-b nav.fixed-top img{width:120px} }
body.hm-b .hm-top-grid{max-width:1240px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"gal bb" "det bb";column-gap:48px;row-gap:28px;align-items:start;grid-template-rows:auto 1fr}
body.hm-b .hm-gallery{grid-area:gal;display:flex;gap:14px}
body.hm-b .hm-bb{grid-area:bb}
body.hm-b .hm-details{grid-area:det}
/* gallery */
body.hm-b .hm-thumbs{display:flex;flex-direction:column;gap:10px;flex:0 0 78px}
body.hm-b .hm-thumb{width:78px;height:78px;padding:4px;background:#fff;border:2px solid var(--hm-line);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center}
body.hm-b .hm-thumb img{max-width:100%;max-height:100%;object-fit:contain}
body.hm-b .hm-thumb.is-on{border-color:var(--hm-pink)}
body.hm-b .hm-main{flex:1;background:linear-gradient(160deg,#fbe3ea 0%,#f6d2dc 55%,#f1c3cf 100%);border-radius:14px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
body.hm-b .hm-main img{width:86%;height:86%;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(120,40,70,.22))}
/* buy box head */
body.hm-b .hm-bb > .d-flex{justify-content:flex-start !important;margin-bottom:12px !important}
body.hm-b .hm-bb .pill{font-size:16px;padding:7px 20px}
body.hm-b .hm-title{font-family:var(--hm-h) !important;font-size:38px !important;line-height:1.18;font-weight:700;color:var(--hm-ink) !important;text-align:left;margin:4px 0 14px}
body.hm-b .hm-intro h3{font-size:23px !important;font-weight:500 !important;color:var(--hm-text) !important;margin-bottom:14px !important;text-shadow:none}
body.hm-b .hm-intro h4{position:relative;padding-left:30px;font-family:var(--hm-b) !important;font-size:19px !important;line-height:1.5;color:var(--hm-text) !important;margin-bottom:8px !important}
body.hm-b .hm-intro h4::before{content:"\f00c";font-family:"Font Awesome 5 Free","Font Awesome 6 Free";font-weight:900;color:var(--hm-mint-d);position:absolute;left:2px;top:1px}
body.hm-b .hm-select{margin-top:18px;border-top:1px solid var(--hm-line);padding-top:6px}
/* buy tiles: one per row, HM select-quantity look */
body.hm-b .hm-select .fade-container{margin:0 !important;display:flex;flex-direction:column}
body.hm-b .hm-select .fade-container > [class*="col-md-4"]{flex:0 0 100%;max-width:100%;padding:0 !important;margin-top:20px}
body.hm-b .hm-select .div-82,body.hm-b .hm-select .div-61,body.hm-b .hm-select .div-71{text-align:left !important;padding-left:16px}
body.hm-b .hm-select .atc{flex-direction:row !important;align-items:center;padding:20px 16px 16px !important}
body.hm-b .hm-select .atc-section{position:relative}
body.hm-b .hm-select #atc-left{width:38% !important;min-height:0 !important;display:flex;align-items:center;justify-content:center;padding:0 !important}
body.hm-b .hm-select #atc-right{width:62% !important;padding-left:18px;border-left:1px solid var(--hm-line) !important;border-image:none !important;text-align:center}
body.hm-b .hm-select .atc .d-none.d-md-block:not(.atc-whitetext){display:none !important}
body.hm-b .hm-select .atc .d-md-none{display:block !important}
body.hm-b .hm-select .atc .atc-whitetext.d-none{display:block !important}
body.hm-b .hm-select .atc h6{font-size:22px !important;font-weight:700 !important;text-transform:none;color:var(--hm-ink) !important}
body.hm-b .hm-select .atc-img{max-height:170px}
body.hm-b .hm-select .atc-savings{width:78px;height:78px;top:-4px;left:auto;right:-6px;transform:rotate(12deg);margin:0}
body.hm-b .hm-select .atc-savings p{font-size:21px}
body.hm-b .hm-select .atc-bonus{position:relative !important;left:auto;bottom:auto !important;transform:none;width:auto;max-width:none;margin:8px auto 0;padding:6px 10px}
body.hm-b .hm-select .atc.center #atc-left{flex-direction:column}
body.hm-b .hm-select .atc-price{font-size:54px !important;margin:2px 0 4px !important}
body.hm-b .hm-select .atc-dollar{font-size:24px;top:8px}
body.hm-b .hm-select .atc-yellowtext{font-size:16px !important;margin-bottom:4px}
body.hm-b .hm-select .atc-whitetext{font-size:13px !important}
body.hm-b .hm-select .atc-button{width:100% !important;margin:10px 0 0 !important}
body.hm-b .hm-select .atc-button h2{font-size:17px !important}
body.hm-b .hm-select .atc-guarantee{display:none !important}
/* tap-to-open details */
body.hm-b .hm-details{background:#fff;border:1px solid #eee;border-radius:14px;padding:4px 24px}
body.hm-b .hm-acc{border-bottom:1px solid var(--hm-line)}
body.hm-b .hm-acc:last-child{border-bottom:0}
body.hm-b .hm-acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0}
body.hm-b .hm-acc summary::-webkit-details-marker{display:none}
body.hm-b .hm-acc summary h3{font-size:22px !important;font-weight:700 !important;margin:0;color:var(--hm-ink) !important;line-height:1.35}
body.hm-b .hm-acc summary h3 br{display:none}
body.hm-b .hm-acc-ico{flex:0 0 30px;height:30px;border-radius:50%;background:var(--hm-pill);position:relative}
body.hm-b .hm-acc-ico::before,body.hm-b .hm-acc-ico::after{content:"";position:absolute;left:8px;right:8px;top:14px;height:2px;background:var(--hm-ink);border-radius:2px;transition:transform .2s}
body.hm-b .hm-acc-ico::after{transform:rotate(90deg)}
body.hm-b .hm-acc[open] .hm-acc-ico::after{transform:rotate(0)}
body.hm-b .hm-acc-body{padding:0 0 22px}
body.hm-b .hm-acc .fade-in-element,body.hm-b .hm-acc .fade-in-scale,body.hm-b .hm-acc .fade-in-stagger{opacity:1 !important;transform:none !important;visibility:visible !important}
body.hm-b .hm-acc-body .row{margin-left:0;margin-right:0}
body.hm-b .hm-acc-body .row > [class*="col-"]{flex:0 0 100%;max-width:100%;margin-bottom:18px !important}
body.hm-b .hm-acc-body .header{min-height:0 !important}
body.hm-b .hm-acc-body .outline-box-red,body.hm-b .hm-acc-body .outline-box-yellow,body.hm-b .hm-acc-body .outline-box-green{display:flex;flex-wrap:wrap;align-items:center;text-align:left;gap:6px 16px}
body.hm-b .hm-acc-body .outline-box-red .title,body.hm-b .hm-acc-body .outline-box-yellow .title,body.hm-b .hm-acc-body .outline-box-green .title{flex:0 0 100%;text-align:left !important;margin-bottom:4px !important}
body.hm-b .hm-acc-body .outline-box-red img,body.hm-b .hm-acc-body .outline-box-yellow img,body.hm-b .hm-acc-body .outline-box-green img{flex:0 0 96px;max-width:96px;padding:0;margin:0 !important}
body.hm-b .hm-acc-body .outline-box-red p,body.hm-b .hm-acc-body .outline-box-yellow p,body.hm-b .hm-acc-body .outline-box-green p{flex:1;text-align:left !important;font-size:18px}
body.hm-b .hm-acc-body .blockquote{margin-left:22px;margin-right:0;max-width:calc(100% - 22px);padding:18px 24px 18px 52px}
body.hm-b .hm-acc-body .blockquote .img-right{right:auto;left:-22px}
body.hm-b .hm-acc-body p,body.hm-b .hm-acc-body h3{color:var(--hm-text) !important;text-shadow:none !important}
body.hm-b .hm-acc-body > img{max-width:96px;display:block;margin:0 0 10px !important}
body.hm-b .hm-acc-body h3{font-size:21px !important;font-weight:700 !important;color:#b07d00 !important}
body.hm-b .hm-acc-body .act-row{justify-content:flex-start !important}
body.hm-b .hm-acc-body .act-row > [class*="col-"]{flex:0 0 50%;max-width:50%}
body.hm-b .hm-acc-body .act-row > [class*="col-"]:last-child{flex-basis:100%;max-width:100%}
body.hm-b #hm-acc-3 .hm-acc-body .act-row > [class*="col-"]{flex:0 0 50% !important;max-width:50% !important}
/* hide the old hero leftovers */
@media (max-width:991px){
  body.hm-b .hm-top{padding:16px 0 30px}
  body.hm-b .hm-top-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"gal" "bb" "det";padding:0 14px;row-gap:22px}
  body.hm-b .hm-gallery{position:static;flex-direction:column-reverse;gap:10px}
  body.hm-b .hm-thumbs{flex-direction:row;flex:0 0 auto;justify-content:center}
  body.hm-b .hm-thumb{width:68px;height:68px}
  body.hm-b .hm-main{margin:0 -14px;border-radius:0}
}
@media (max-width:767px){
  body.hm-b .hm-title{font-size:30px !important}
  body.hm-b .hm-intro h3{font-size:20px !important}
  body.hm-b .hm-intro h4{font-size:17px !important}
  body.hm-b .hm-select .atc{padding:18px 8px 12px !important}
  body.hm-b .hm-select #atc-left{width:42% !important}
  body.hm-b .hm-select #atc-right{width:58% !important;padding-left:8px}
  body.hm-b .hm-select .atc h6{font-size:18px !important}
  body.hm-b .hm-select .atc-price{font-size:44px !important}
  body.hm-b .hm-select .atc-img{max-height:140px}
  body.hm-b .hm-select .atc-savings{width:60px;height:60px;right:-4px}
  body.hm-b .hm-select .atc-savings p{font-size:15px}
  body.hm-b .hm-select .atc-whitetext{font-size:11px !important}
  body.hm-b .hm-select .atc-button h2{font-size:14px !important}
  body.hm-b .hm-details{padding:2px 16px}
  body.hm-b .hm-acc summary h3{font-size:19px !important}
}
