.hover_expand_grid{padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}.hover_expand_grid_top{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin-bottom:2.4rem}.hover_expand_grid_heading{margin:0;color:var(--color-heading)}.hover_expand_grid_items{display:flex;align-items:stretch;gap:var(--column-spacing);height:var(--panel-height);width:100%}.hover_expand_grid_item{position:relative;display:block;flex:1 1 0%;min-width:0;height:100%;overflow:hidden;text-decoration:none;transition:flex-grow .5s cubic-bezier(.4,0,.2,1);border-radius:var(--img-border-radius)}.hover_expand_grid_item.is-active{flex-grow:1.5}.hover_expand_grid_item_image,.hover_expand_grid_item svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.hover_expand_grid_item svg{background:var(--color-secondary-background)}.hover_expand_grid_item:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,#0000008c,#0000 45%);opacity:0;transition:opacity .4s ease;z-index:1}.hover_expand_grid_item.is-active:after{opacity:1}.hover_expand_grid_item_title{position:absolute;left:2.4rem;bottom:2.4rem;right:2.4rem;z-index:2;color:#fff;font-size:1.6rem;letter-spacing:.04em;opacity:0;transform:translateY(12px);text-align:center;transition:all .4s ease,transform .4s ease}.hover_expand_grid_item.is-active .hover_expand_grid_item_title{opacity:1;transform:translateY(0)}.hover_expand_grid_item:focus-visible{outline:2px solid var(--color-highlight, #fff);outline-offset:-2px}@media(prefers-reduced-motion:reduce){.hover_expand_grid_item,.hover_expand_grid_item:after,.hover_expand_grid_item_title{transition:none}}@media screen and (max-width:989px){.hover_expand_grid_top{flex-wrap:wrap}}@media screen and (min-width:750px)and (max-width:989px){.hover_expand_grid_item:after,.hover_expand_grid_item_title{opacity:1;transform:none}.hover_expand_grid_items{overflow-x:auto;scroll-snap-type:x mandatory}.hover_expand_grid_item.is-active{flex-grow:1}.hover_expand_grid_item{scroll-snap-align:start;flex:0 0 calc(50% - 9px)}}@media screen and (max-width:749px){.hover_expand_grid_top{align-items:flex-start;gap:1.6rem}.hover_expand_grid_items{flex-direction:column;height:auto}.hover_expand_grid_item{flex:none;height:calc(var(--panel-height) * .6)}.hover_expand_grid_item:after,.hover_expand_grid_item_title{opacity:1;transform:none}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/hover-expand-grid.css.map */