.dual-image-banner{padding-block:var(--dual-image-banner-padding-top) var(--dual-image-banner-padding-bottom);background:var(--color-background);color:var(--color-foreground)}.dual-image-banner__inner{width:min(var(--dual-image-banner-width),calc(100% - (var(--page-margin) * 2)));margin-inline:auto}.dual-image-banner__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dual-image-banner-gap)}.dual-image-banner__item:only-child{grid-column:1 / -1}.dual-image-banner__media{position:relative;display:block;overflow:hidden;width:100%;aspect-ratio:var(--dual-image-banner-desktop-ratio);border-radius:var(--dual-image-banner-radius);background:color-mix(in srgb,var(--color-foreground) 5%,var(--color-background));color:inherit}.dual-image-banner__media picture{display:block;width:100%;height:100%}.dual-image-banner__image,.dual-image-banner__placeholder,.dual-image-banner__placeholder-svg{display:block;width:100%;height:100%}.dual-image-banner__image{object-fit:var(--dual-image-banner-fit);transition:transform .5s ease}.dual-image-banner--hover a.dual-image-banner__media:hover .dual-image-banner__image{transform:scale(1.025)}.dual-image-banner__placeholder{position:relative}.dual-image-banner__placeholder-svg{object-fit:cover;opacity:.65}.dual-image-banner__placeholder span,.dual-image-banner__empty{font-size:var(--font-size-body-small);color:color-mix(in srgb,var(--color-foreground) 65%,transparent)}.dual-image-banner__placeholder span{position:absolute;inset:50% auto auto 50%;padding:8px 12px;border-radius:999px;background:var(--color-background);transform:translate(-50%,-50%);white-space:nowrap}.dual-image-banner__empty{padding:32px;border:1px dashed var(--color-border);border-radius:var(--dual-image-banner-radius);text-align:center}@media screen and (max-width:749px){.dual-image-banner__grid{grid-template-columns:minmax(0,1fr)}.dual-image-banner__media{aspect-ratio:var(--dual-image-banner-mobile-ratio)}.dual-image-banner--mobile-full .dual-image-banner__media{aspect-ratio:var(--dual-image-banner-original-mobile-ratio, var(--dual-image-banner-mobile-ratio))}.dual-image-banner--mobile-full .dual-image-banner__image{object-fit:contain}.dual-image-banner--mobile-full.dual-image-banner--hover a.dual-image-banner__media:hover .dual-image-banner__image{transform:none}}@media(prefers-reduced-motion:reduce){.dual-image-banner__image{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/dual-image-banner.css.map */
