.banner-collection{position:relative}.banner-collection__media{width:100%;height:100%;padding-bottom:var(--ratio-percent)}.banner-collection__image{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0;transition:.5s}.banner-collection__media{overflow:hidden}.banner-collection__inner{position:absolute;left:0;bottom:0;width:100%;height:100%;background-color:transparent;display:grid;grid-template-columns:1fr;place-content:var(--content-position-vertical, center) var(--content-position-horizontal, center)}.banner-collection__content{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing--xxs);padding:var(--spacing--lg)}.banner-collection__content:where(.text-left){align-items:flex-start}.banner-collection__content:where(.text-center){align-items:center}.banner-collection__content:where(.text-right){align-items:flex-end}.banner-collection__icon{display:flex;margin-bottom:var(--spacing--xxs)}.banner-collection__icon-image{width:3rem;height:3rem;object-fit:contain;border-radius:4px}.banner-collection__name{margin:0;transition:.5s;font-size:var(--font-size, inherit);font-weight:var(--font-weight, inherit);font-family:var(--font-family, inherit);text-transform:var(--text-transform, none);text-wrap:var(--text-wrap, pretty);line-height:var(--line-height, inherit);letter-spacing:var(--letter-spacing, normal);color:var(--color, inherit)}.banner-collection__button{width:auto}:where(.banner-collection--button-visible-hover) .banner-collection__button{transform:translateY(-.75rem);opacity:0}:where(.banner-collection--button-visible-hover.banner-collection--vertical-center) .banner-collection__name{transform:translateY(50%)}:where(.banner-collection--button-visible-hover.banner-collection--vertical-end) .banner-collection__name{transform:translateY(calc(1em + .45rem))}:where(.banner-collection--button-visible-hover.banner-collection--vertical-end) .banner-collection__button{transform:translateY(.75rem)}@media(hover:hover){.banner-collection--hover-zoom:hover .banner-collection__image{transform:scale(1.1)}:where(.banner-collection--button-visible-hover:hover) .banner-collection__name,:where(.banner-collection--button-visible-hover:hover) .banner-collection__button{transform:none;opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/component-banner-collection_custom.css.map */
