.section-banner-products{position:relative}.section-banner-products .section__grid{display:grid;gap:var(--grid-spacing, 2rem);align-items:center;grid-template-columns:calc(var(--grid-width, 50%) - var(--grid-spacing, 2rem) / 2) calc(100% - var(--grid-width, 50%) - var(--grid-spacing, 2rem) / 2)}.section-banner-products .section__media-end-desktop{order:1}.section-banner-products .section__media{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.section-banner-products .media{width:100%;aspect-ratio:var(--aspect-ratio, auto);overflow:hidden;display:flex;align-items:center;justify-content:center}.section-banner-products .media img{width:100%;height:100%;object-fit:cover;border-radius:var(--desktop-corner-radius, 15px)}.section-banner-products .section__media-auto,.section-banner-products .section__media-full .media{height:auto}.section-banner-products .section__media-full,.section-banner-products .section__media-full .media{height:100%}.section-banner-products .banner-products__grid{display:grid;grid-template-columns:repeat(2,minmax(45%,1fr));gap:2rem}.banner-products__card-wrapper{position:relative;display:flex;flex-direction:column;align-items:center}.banner-products__media-hover{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden}.banner-products__media-img{width:100%;height:100%;object-fit:cover;transition:opacity .3s;position:absolute;top:0;left:0;opacity:1;z-index:1}img.banner-products__media-img.secondary{opacity:0;z-index:2}.banner-products__media-hover:hover img.banner-products__media-img.secondary{opacity:1}.banner-products__media-hover:hover img.banner-products__media-img.primary{opacity:0}.banner-products__product-title{margin-top:15px}@media screen and (max-width: 749px){.section-banner-products .media img{border-radius:var(--mobile-corner-radius, 15px)}.section-banner-products .section__media-end-mobile{order:1}.section-banner-products .section__grid{grid-template-columns:1fr;gap:1.5rem}}@media (min-width: 750px){.section-banner-products .banner-products__grid{margin:auto}}@media (min-width: 750px) and (max-width: 1300px){.section-banner-products .banner-products__grid{width:80%}}@media (min-width: 1300px){.section-banner-products .banner-products__grid{width:65%}}
/*# sourceMappingURL=/cdn/shop/t/170/assets/section-banner-with-products.css.map */