/* B2B Toolkit — Banners: shared styles. Loaded as a file on the storefront (includes/banners.php), inlined in the admin preview and in AJAX / editor fragments. */
/* contain:paint makes the banner the box everything in it (incl. position:fixed) is placed and clipped in — a theme can never draw over the rest of the page. */
.b2bt-bn{position:relative;overflow:hidden;contain:paint;border-radius:20px;font-family:'Helvetica Neue',Arial,sans-serif;user-select:none;-webkit-user-select:none;line-height:normal;text-align:left;--b2bt-m:1;--b2bt-trv:430px;--b2bt-trvu:425px}
.b2bt-bn,.b2bt-bn *{box-sizing:border-box;margin:0;padding:0}
.b2bt-bn[hidden]{display:none!important}
.b2bt-bn .b2bt-bn-off{display:none}
.b2bt-bn .b2bt-bn-track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.b2bt-bn .b2bt-bn-slide{position:relative;overflow:hidden;min-width:100%;width:100%;display:flex;justify-content:space-between;color:#fff;text-decoration:none!important;border:0!important;box-shadow:none!important}
.b2bt-bn a.b2bt-bn-slide:hover,.b2bt-bn a.b2bt-bn-slide:focus{color:#fff;text-decoration:none!important}
.b2bt-bn .b2bt-bn-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.b2bt-bn .b2bt-bn-bg>div{position:absolute;inset:0}
.b2bt-bn .b2bt-bn-pt{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.b2bt-bn .b2bt-bn-content{position:relative;z-index:2;flex:1;min-width:0}
.b2bt-bn .b2bt-bn-eyebrow{color:var(--b2bt-acc);font-weight:600}
.b2bt-bn .b2bt-bn-title{font-family:'Arial Black',Gadget,sans-serif;font-weight:400;color:#fff;letter-spacing:normal;text-transform:none}
.b2bt-bn .b2bt-bn-em{font-style:normal;color:var(--b2bt-acc)}
.b2bt-bn .b2bt-bn-strong{font-weight:500;color:rgba(255,255,255,.9)}
.b2bt-bn .b2bt-bn-subtitle{color:var(--b2bt-sub);font-weight:300}
.b2bt-bn .b2bt-bn-subs{color:var(--b2bt-sub);font-weight:300;letter-spacing:.2px}
.b2bt-bn .b2bt-bn-subs a,.b2bt-bn .b2bt-bn-subs span{color:var(--b2bt-sub)!important;text-decoration:none!important;border-bottom:1px solid rgba(255,255,255,.2)}
.b2bt-bn .b2bt-bn-subs span{border-bottom:0}
.b2bt-bn .b2bt-bn-cta{display:inline-block;background:var(--b2bt-acc)!important;color:var(--b2bt-cta)!important;font:700 12px/1 'Helvetica Neue',Arial,sans-serif;padding:11px 28px;border-radius:100px;text-decoration:none!important;letter-spacing:.8px;border:none!important;box-shadow:none!important}
.b2bt-bn .b2bt-bn-illus{z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none;transform:translate(calc(var(--b2bt-ill-x,0px)*var(--b2bt-m)),calc(var(--b2bt-ill-y,0px)*var(--b2bt-m))) scale(var(--b2bt-ill-s,1))}
.b2bt-bn .b2bt-bn-illus svg{display:block;width:100%;height:100%}
.b2bt-bn .b2bt-bn-tbox{display:none;position:relative;z-index:3}
.b2bt-bn .b2bt-bn-has-timer .b2bt-bn-tbox{display:flex}
.b2bt-bn .b2bt-bn-has-timer .b2bt-bn-illus{position:absolute;opacity:.08;transform:none}
.b2bt-bn .b2bt-bn-timer{display:flex;flex-direction:column;align-items:center}
.b2bt-bn .b2bt-bn-tlabel{display:block;font-size:10px;letter-spacing:2.5px;color:rgba(255,255,255,.35);font-weight:500;text-align:center;margin-bottom:12px;white-space:nowrap}
.b2bt-bn .b2bt-bn-tgrid{display:flex;align-items:center;gap:6px}
.b2bt-bn .b2bt-bn-tb{display:flex;flex-direction:column;align-items:center;gap:4px}
.b2bt-bn .b2bt-bn-tn{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:8px;background:color-mix(in srgb,var(--b2bt-acc) 8%,transparent);border:1px solid color-mix(in srgb,var(--b2bt-acc) 22%,transparent);font-family:'Arial Black',Gadget,sans-serif;font-size:24px;color:#fff;letter-spacing:1px;line-height:1}
.b2bt-bn .b2bt-bn-tn::after{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:color-mix(in srgb,var(--b2bt-acc) 15%,transparent)}
.b2bt-bn .b2bt-bn-tu{font-size:8px;letter-spacing:1.5px;color:rgba(255,255,255,.3);font-weight:500}
.b2bt-bn .b2bt-bn-tsep{font-family:'Arial Black',Gadget,sans-serif;font-size:20px;color:color-mix(in srgb,var(--b2bt-acc) 45%,transparent);line-height:1;margin-bottom:14px}
.b2bt-bn .b2bt-bn-tline{display:none;margin-top:8px;font:700 12px/1.2 'Helvetica Neue',Arial,sans-serif;letter-spacing:.5px;color:rgba(255,255,255,.55)}
.b2bt-bn .b2bt-bn-tline span{font-family:'Arial Black',Gadget,sans-serif;font-weight:400;color:#fff}
.b2bt-bn .b2bt-bn-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);font-size:14px;line-height:1;cursor:pointer;transition:background .2s,color .2s}
.b2bt-bn .b2bt-bn-arrow:hover{background:rgba(255,255,255,.14);color:#fff}
.b2bt-bn .b2bt-bn-prev{left:14px}
.b2bt-bn .b2bt-bn-next{right:14px}
.b2bt-bn .b2bt-bn-dots{position:absolute;z-index:10;display:flex;bottom:14px;right:18px;gap:7px}
.b2bt-bn .b2bt-bn-dot{display:block;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.2);cursor:pointer;transition:background .3s,transform .3s}
.b2bt-bn .b2bt-bn-dot.on{background:#fff;transform:scale(1.25)}
.b2bt-bn--single .b2bt-bn-arrow,.b2bt-bn--single .b2bt-bn-dots{display:none!important}

.b2bt-bn--large .b2bt-bn-slide{min-height:390px;align-items:flex-start;padding:40px 56px;gap:28px}
.b2bt-bn--large .b2bt-bn-eyebrow{font-size:10px;letter-spacing:3.5px;margin-bottom:10px}
.b2bt-bn--large .b2bt-bn-title{font-size:clamp(24px,3.6vw,42px);line-height:1.05;margin-bottom:10px}
.b2bt-bn--large .b2bt-bn-subtitle{font-size:14px;margin-bottom:14px}
.b2bt-bn--large .b2bt-bn-subs{font-size:12.5px;margin-bottom:22px}
.b2bt-bn--large .b2bt-bn-illus{position:absolute;bottom:36px;right:56px;width:168px;height:168px}
.b2bt-bn--large .b2bt-bn-has-timer .b2bt-bn-illus{width:300px;height:300px;right:-40px;bottom:auto;top:50%;margin-top:-150px}
.b2bt-bn--large .b2bt-bn-tbox{margin:4px 0 22px}
.b2bt-bn--large .b2bt-bn-timer{align-items:flex-start}
.b2bt-bn--large .b2bt-bn-tlabel{text-align:left;margin-bottom:10px}

.b2bt-bn--medium{--b2bt-trv:200px;--b2bt-trvu:185px}
.b2bt-bn--medium .b2bt-bn-slide{min-height:165px;align-items:center;padding:24px 44px;gap:20px}
.b2bt-bn--medium .b2bt-bn-eyebrow{font-size:9px;letter-spacing:2.6px;margin-bottom:6px}
.b2bt-bn--medium .b2bt-bn-title{font-size:clamp(18px,2.3vw,27px);line-height:1.1}
.b2bt-bn--medium .b2bt-bn-subtitle{font-size:11.5px;margin-top:6px}
.b2bt-bn--medium .b2bt-bn-subs{font-size:11px;margin-top:6px}
/* Medium illustration: the look chosen on the live site (Oct 2026: 149% and 57px further left than the original 80px
   box), built into the layout rather than a transform, so the title makes room for it instead of running under it. */
.b2bt-bn--medium .b2bt-bn-illus{position:relative;flex-shrink:0;width:119px;height:119px;margin:-12px 37px -12px 0}
.b2bt-bn--medium .b2bt-bn-has-timer .b2bt-bn-illus{width:200px;height:200px;right:-30px;top:50%;margin:-100px 0 0 0}
.b2bt-bn--medium .b2bt-bn-tbox{flex-shrink:0}
.b2bt-bn--medium .b2bt-bn-tn{width:36px;height:36px;font-size:19px;border-radius:7px}
.b2bt-bn--medium .b2bt-bn-tlabel{font-size:8px;margin-bottom:7px}
.b2bt-bn--medium .b2bt-bn-tsep{font-size:16px;margin-bottom:12px}
.b2bt-bn--medium .b2bt-bn-tgrid{gap:4px}
.b2bt-bn--medium .b2bt-bn-arrow{width:28px;height:28px;font-size:12px}
.b2bt-bn--medium .b2bt-bn-prev{left:12px}
.b2bt-bn--medium .b2bt-bn-next{right:12px}
.b2bt-bn--medium .b2bt-bn-dots{bottom:9px;right:auto;left:50%;transform:translateX(-50%);gap:6px}
.b2bt-bn--medium .b2bt-bn-dot{width:6px;height:6px;background:rgba(255,255,255,.25)}

.b2bt-bn--ribbon .b2bt-bn-track{display:grid}
.b2bt-bn--ribbon .b2bt-bn-slide{grid-area:1/1;min-height:50px;padding:10px 24px;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s}
.b2bt-bn--ribbon .b2bt-bn-slide.is-on{opacity:1;visibility:visible}
.b2bt-bn--ribbon .b2bt-bn-pill{position:relative;z-index:2;background:var(--b2bt-acc);color:var(--b2bt-cta);font:700 11px/1 'Helvetica Neue',Arial,sans-serif;padding:9px 14px;border-radius:100px;letter-spacing:.5px;white-space:nowrap}
.b2bt-bn--ribbon .b2bt-bn-pill .b2bt-bn-em,.b2bt-bn--ribbon .b2bt-bn-pill .b2bt-bn-strong{color:inherit;font-weight:inherit}
.b2bt-bn--ribbon .b2bt-bn-rtext{position:relative;z-index:2;font-size:13px;color:rgba(255,255,255,.75)}
.b2bt-bn--ribbon .b2bt-bn-rtext .b2bt-bn-strong{color:#fff}
.b2bt-bn--ribbon .b2bt-bn-div{position:relative;z-index:2;width:1px;height:18px;background:rgba(255,255,255,.12);flex-shrink:0}
.b2bt-bn--ribbon .b2bt-bn-tbox{align-items:center;gap:14px}
.b2bt-bn--ribbon .b2bt-bn-timer{flex-direction:row;gap:6px}
.b2bt-bn--ribbon .b2bt-bn-tlabel{margin:0;font-size:10px;letter-spacing:1.5px;color:rgba(255,255,255,.3)}
.b2bt-bn--ribbon .b2bt-bn-tgrid{gap:4px}
.b2bt-bn--ribbon .b2bt-bn-tb{gap:2px}
.b2bt-bn--ribbon .b2bt-bn-tn{width:32px;height:28px;font-size:14px;border-radius:4px;letter-spacing:.5px}
.b2bt-bn--ribbon .b2bt-bn-tn::after{display:none}
.b2bt-bn--ribbon .b2bt-bn-tu{letter-spacing:1px;color:rgba(255,255,255,.25)}
.b2bt-bn--ribbon .b2bt-bn-tsep{font-size:14px;margin-bottom:10px}

.b2bt-bn .b2bt-bn-p{position:absolute;animation-timing-function:linear;animation-iteration-count:infinite}
.b2bt-bn .b2bt-bn-p--snow{top:-10px;border-radius:50%;background:currentColor;box-shadow:0 0 5px rgba(255,255,255,.7);animation-name:b2bt-bn-snow}
.b2bt-bn .b2bt-bn-p--snow.b2bt-bn-p--bokeh{filter:blur(1.5px);box-shadow:0 0 10px rgba(255,255,255,.5)}
.b2bt-bn .b2bt-bn-p--rain{top:-30px;width:2px;border-radius:2px;background:linear-gradient(to bottom,rgba(167,228,255,0) 0%,currentColor 65%,rgba(255,255,255,.95) 100%);box-shadow:0 0 4px rgba(167,228,255,.35);animation-name:b2bt-bn-rain}
.b2bt-bn--medium .b2bt-bn-p--rain{width:1.6px;top:-16px}
.b2bt-bn .b2bt-bn-p--rain.b2bt-bn-p--bokeh{width:3px;filter:blur(1.2px);opacity:.5}
.b2bt-bn .b2bt-bn-p--embers{bottom:-10px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor;animation-name:b2bt-bn-ember}
@keyframes b2bt-bn-snow{0%{transform:translate(0,0);opacity:0}8%{opacity:.85}25%{transform:translate(14px,calc(var(--b2bt-trv)*.235))}50%{transform:translate(-12px,calc(var(--b2bt-trv)*.49))}75%{transform:translate(10px,calc(var(--b2bt-trv)*.745))}92%{opacity:.75}100%{transform:translate(-6px,var(--b2bt-trv));opacity:0}}
@keyframes b2bt-bn-rain{0%{transform:translate(0,-30px) rotate(8deg);opacity:0}10%{opacity:.85}90%{opacity:.7}100%{transform:translate(calc(var(--b2bt-trv)*.098),var(--b2bt-trv)) rotate(8deg);opacity:0}}
@keyframes b2bt-bn-ember{0%{transform:translate(0,0);opacity:0}10%{opacity:.85}30%{transform:translate(-12px,calc(var(--b2bt-trvu)*-.287))}55%{transform:translate(10px,calc(var(--b2bt-trvu)*-.541));opacity:.7}80%{transform:translate(-8px,calc(var(--b2bt-trvu)*-.786))}92%{opacity:.4}100%{transform:translate(4px,calc(var(--b2bt-trvu)*-1));opacity:0}}

@media (max-width:768px){
.b2bt-bn{--b2bt-m:.75}
.b2bt-bn--large .b2bt-bn-slide{min-height:auto;align-items:center;padding:32px 40px}
.b2bt-bn--large .b2bt-bn-illus{position:relative;bottom:auto;right:auto;flex-shrink:0;width:130px;height:130px}
.b2bt-bn--large .b2bt-bn-has-timer .b2bt-bn-illus{position:absolute}
.b2bt-bn--medium .b2bt-bn-slide{min-height:145px;padding:20px 34px;gap:16px}
.b2bt-bn--medium .b2bt-bn-illus{width:95px;height:95px;margin:0 27px 0 0}
.b2bt-bn--medium .b2bt-bn-tn{width:30px;height:30px;font-size:16px}
}
@media (max-width:480px){
.b2bt-bn{--b2bt-m:.5}
.b2bt-bn--large .b2bt-bn-slide{flex-direction:column-reverse;padding:24px 20px 32px;text-align:center;gap:14px}
.b2bt-bn--large .b2bt-bn-illus{width:108px;height:108px}
.b2bt-bn--large .b2bt-bn-timer{align-items:center}
.b2bt-bn--large .b2bt-bn-tlabel{text-align:center}
.b2bt-bn--large .b2bt-bn-tn{width:40px;height:40px;font-size:21px}
.b2bt-bn--medium .b2bt-bn-slide{min-height:150px;padding:18px 20px;gap:12px}
.b2bt-bn--medium .b2bt-bn-title{font-size:clamp(16px,5vw,20px)}
.b2bt-bn--medium .b2bt-bn-eyebrow{font-size:8px;margin-bottom:5px}
.b2bt-bn--medium .b2bt-bn-illus{width:80px;height:80px;margin:0 15px 0 0}
.b2bt-bn--medium .b2bt-bn-has-timer .b2bt-bn-tbox{display:none}
.b2bt-bn--medium .b2bt-bn-has-timer .b2bt-bn-tline{display:block}
.b2bt-bn .b2bt-bn-arrow{display:none}
.b2bt-bn.b2bt-bn--marrows .b2bt-bn-arrow{display:flex}
.b2bt-bn--medium.b2bt-bn--marrows .b2bt-bn-arrow{width:24px;height:24px;font-size:11px}
.b2bt-bn--medium.b2bt-bn--marrows .b2bt-bn-prev{left:6px}
.b2bt-bn--medium.b2bt-bn--marrows .b2bt-bn-next{right:6px}
.b2bt-bn--ribbon .b2bt-bn-slide{gap:10px;padding:10px 16px}
.b2bt-bn--ribbon .b2bt-bn-div,.b2bt-bn--ribbon .b2bt-bn-tlabel{display:none}
.b2bt-bn--ribbon .b2bt-bn-rtext{width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){
.b2bt-bn .b2bt-bn-p{animation:none!important;opacity:.3}
.b2bt-bn .b2bt-bn-track,.b2bt-bn--ribbon .b2bt-bn-slide{transition:none!important}
}