.banner-grid{display:grid;grid-template-columns:repeat(var(--bg-cols, 3),minmax(0,1fr));align-items:start;gap:var(--gap, 16px)}@media(min-width:1025px){.banner--span-2{grid-column:span 2}.banner--span-3{grid-column:span 3}.banner--span-4{grid-column:span 4}}@media(min-width:768px)and (max-width:1024px){.banner-grid{grid-template-columns:repeat(var(--bg-cols-t, 2),minmax(0,1fr))}.banner-grid:not(.banner-grid--cols-1)>:is(.banner--span-2,.banner--span-3,.banner--span-4){grid-column:span 2}}@media(max-width:767px){.banner-grid{grid-template-columns:repeat(var(--bg-cols-m, 1),minmax(0,1fr));gap:var(--gap-m, var(--gap, 16px))}.banner-grid--cols-m-2>.banner--span-m-2{grid-column:span 2}.banner-grid--swipe-m{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:85%;align-items:stretch;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scrollbar-width:none}.banner-grid--swipe-m::-webkit-scrollbar{display:none}.banner-grid--swipe-m>.banner{grid-column:auto;scroll-snap-align:start}.section--w-bleed .banner-grid--swipe-m{margin-inline:0;padding-inline:0;scroll-padding-inline:0}}.banner{position:relative;isolation:isolate;display:flex;flex-direction:column;min-width:0;overflow:hidden;aspect-ratio:var(--tile-ratio, auto);min-height:var(--tile-min-h, 0px);border-radius:var(--blk-radius, var(--radius-media))}.banner-grid .banner--media{background:transparent}@media(max-width:767px){.banner{aspect-ratio:var(--tile-ratio-m, var(--tile-ratio, auto));min-height:var(--tile-min-h-m, var(--tile-min-h, 0px))}}@media(hover:hover)and (pointer:fine)and (prefers-reduced-motion:no-preference){html.zoom-on .banner:not(.blk--linked):hover>.blk-bg img{scale:var(--zoom-scale)}}.banner__content{--chip-size: 40px;--chip-pad: 6px;--chip-space: calc(var(--chip-size) + 2 * var(--chip-pad) + 20px);--btn-space: calc(var(--btn-height) + 20px);--content-pt: 0px;--content-pb: 0px;position:relative;z-index:2;flex:1 1 auto;width:100%;padding-block:var(--content-pt) var(--content-pb)}.banner__content--products:is(.banner__content--pos-top,.banner__content--pos-bottom){--content-pt: var(--chip-space)}.banner__content--products.banner__content--pos-center:not(.banner__content--separate){--content-pt: var(--chip-space);--content-pb: var(--chip-space)}.banner__content--separate{--content-pt: var(--btn-space);--content-pb: var(--btn-space)}.banner__content--separate.banner__content--pos-top:not(.banner__content--products){--content-pt: 0px}.banner.blk--linked .banner__content{pointer-events:none}.banner.blk--linked .banner__content :is(a,button,input,select,textarea,summary,label,[tabindex]){pointer-events:auto}.banner--editor.blk--linked .banner__content>*{pointer-events:auto}.banner__content--separate>:is(.button-block,.buttons-block):not(:is(.button-block,.buttons-block)~*){position:absolute;bottom:0;inset-inline:0;display:flex;justify-content:var(--align, center);margin:0;pointer-events:none}.banner__content--separate>:is(.button-block,.buttons-block):not(:is(.button-block,.buttons-block)~*) .button{pointer-events:auto}.banner__content--separate.banner__content--align-center>.buttons-block:not(:is(.button-block,.buttons-block)~*){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(9rem,100%),1fr))}.banner__content--separate.banner__content--align-center>.buttons-block:not(:is(.button-block,.buttons-block)~*) .button{width:100%}.banner__products{position:absolute;top:0;inset-inline-end:0;z-index:3;max-width:100%;overflow:hidden;border-radius:calc(var(--radius-media) * .6);pointer-events:auto}.banner__products-inner{display:flex;gap:var(--chip-pad);padding:var(--chip-pad);border-radius:inherit;color:var(--color-heading);background:color-mix(in srgb,var(--color-bg) 40%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-heading) 22%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.banner__product{position:relative;display:flex;flex:0 0 var(--chip-size);width:var(--chip-size);height:var(--chip-size)}.banner__product>:is(a,button):before,a.banner__product:before{content:"";position:absolute;inset:calc(-1 * var(--chip-pad)) calc(-.5 * var(--chip-pad))}.banner__product .banner__product-url{display:none}.banner__product-more{align-items:center;justify-content:center;color:inherit;text-decoration:none}.banner__product-more .banner__product-icon{width:16px;height:16px}.banner__product-button{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:none;color:inherit;cursor:pointer}.banner__product-image{display:block;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--radius-media) * .3);background:color-mix(in srgb,var(--color-heading) 6%,transparent)}.banner__product-image :is(img,svg){display:block;width:100%;height:100%;object-fit:cover}.banner__product>:is(a,button):focus-visible{outline:2px solid currentColor;outline-offset:-2px;border-radius:calc(var(--radius-media) * .3)}.banner__products--collapsible .banner__products-inner{transform:translate(calc(100% - var(--chip-size) - 2 * var(--chip-pad)));transition:transform var(--dur-zoom) var(--ease)}.banner__products--collapsible .banner__product:not(.banner__product-more){opacity:0;visibility:hidden;transition:opacity 0s linear var(--dur-zoom),visibility 0s linear var(--dur-zoom)}.banner:focus-within .banner__products--collapsible .banner__products-inner{transform:none}.banner:focus-within .banner__products--collapsible .banner__product{opacity:1;visibility:visible;transition:none}@media(hover:hover)and (pointer:fine){.banner:hover .banner__products--collapsible .banner__products-inner{transform:none}.banner:hover .banner__products--collapsible .banner__product{opacity:1;visibility:visible;transition:none}.banner__product-button .banner__product-image img{transition:scale var(--dur-zoom) var(--ease-out)}.banner__product-button:hover .banner__product-image img{scale:var(--zoom-scale)}}@media(max-width:767px),(hover:none),(pointer:coarse){.banner__products--collapsible .banner__products-inner{transform:none}.banner__products--collapsible .banner__product:not(.banner__product-more){opacity:1;visibility:visible;transition:none}}@media(max-width:767px){.banner__content{--chip-size: 34px;--chip-pad: 5px}}@media(prefers-reduced-motion:reduce){.banner__products--collapsible .banner__products-inner,.banner__products--collapsible .banner__product,.banner__product-button .banner__product-image img{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/20/assets/section-banner-grid.css.map */