.family-list.section-stack{gap:2.4rem}.family-list__media{display:none}.family-list__list{margin:0;border-bottom:.1rem solid rgb(var(--color-border-default))}.family-list__link{position:relative;display:grid;grid-template-columns:8rem minmax(0,1fr) 2rem;grid-template-areas:"thumb name arrow" "thumb meta arrow";align-content:center;column-gap:1.6rem;row-gap:.4rem;padding:1.5rem 0 1.6rem;border-top:.1rem solid rgb(var(--color-border-default));color:rgb(var(--color-foreground));text-decoration:none}.family-list__thumb{grid-area:thumb;display:block;width:8rem;height:8rem;object-fit:cover;background-color:rgb(var(--color-media-ground))}.family-list__name{grid-area:name;align-self:end;font-size:var(--type-heading-m-size);line-height:var(--type-heading-m-line-height);letter-spacing:var(--type-heading-m-letter-spacing);font-weight:var(--font-weight-medium)}.family-list__meta{grid-area:meta;align-self:start;color:rgb(var(--color-text-subtle));font-size:var(--type-text-s-size);line-height:var(--type-text-s-line-height)}.family-list__arrow{--icon-size: var(--size-icon-m);grid-area:arrow;align-self:center}.family-list__link .family-list__cta,.family-list__progress{display:none}@media screen and (min-width:990px){.family-list.section-stack{gap:4rem}.family-list__stage{display:grid;grid-template-columns:calc((100% - 17.6rem) / 3 + 4.8rem) minmax(0,1fr);align-items:start;column-gap:6.4rem}.family-list__media{position:sticky;top:var(--header-height, 0px);display:block;aspect-ratio:4 / 5;overflow:hidden;background-color:rgb(var(--color-media-ground))}.family-list__slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .6s ease}.family-list__slide.is-active{opacity:1}.family-list__image{display:block;width:100%;height:100%;object-fit:cover}.family-list.is-running .family-list__slide.is-active .family-list__image,.family-list__slide.is-leaving .family-list__image{animation:family-list-zoom calc(var(--family-dwell) + .6s) linear forwards}.family-list__pause{--icon-size: var(--size-icon-xs);position:absolute;left:1.6rem;bottom:1.6rem;display:flex;align-items:center;justify-content:center;width:3.2rem;height:3.2rem;padding:0;border:0;border-radius:50%;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));cursor:pointer}.family-list__pause[hidden]{display:none}.family-list__pause:focus-visible{outline:var(--focused-base-outline);outline-offset:var(--focused-base-outline-offset)}.family-list__pause .icon-play-fill,.family-list.is-paused .family-list__pause .icon-pause-fill{display:none}.family-list.is-paused .family-list__pause .icon-play-fill{display:block}.family-list__link{display:flex;align-items:center;gap:2.4rem;padding:2.3rem 22.4rem 2.4rem 0}.family-list__thumb,.family-list__arrow,.family-list__separator{display:none}.family-list__name{flex:1 1 0;align-self:auto;font-size:var(--type-label-l-size);line-height:var(--type-label-l-line-height);letter-spacing:var(--type-label-l-letter-spacing);transition:color var(--motion-duration) ease}.family-list__meta{display:contents}.family-list__count,.family-list__price{flex:0 0 13.6rem;color:rgb(var(--color-text-subtle));font-size:var(--type-text-m-size);line-height:var(--type-text-m-line-height)}.family-list__link .family-list__cta{position:absolute;top:50%;right:0;display:inline-flex;visibility:hidden;transform:translateY(-50%)}.family-list__progress{position:absolute;top:-.1rem;left:0;display:block;width:0;height:.2rem;background-color:rgb(var(--color-text-accent))}.family-list__item.is-active .family-list__name{color:rgb(var(--color-text-accent))}.family-list__item.is-active .family-list__cta{visibility:visible}.family-list__item.is-active .family-list__progress{width:100%}.family-list.is-running .family-list__item.is-active .family-list__progress{animation:family-list-progress var(--family-dwell) linear forwards}.family-list:is(.is-paused,.is-held) .family-list__progress,.family-list:is(.is-paused,.is-held) .family-list__image{animation-play-state:paused!important}.family-list__list:is(:hover,:focus-within) .family-list__item:not(.is-active) .family-list__name{color:rgb(var(--color-text-subtle))}}@media screen and (min-width:990px)and (max-width:1279px){.family-list__link{padding-right:12rem}.family-list__count,.family-list__price{flex-basis:10.4rem}}@media(prefers-reduced-motion:reduce){.family-list__slide{transition:none}}@keyframes family-list-progress{0%{width:0}to{width:100%}}@keyframes family-list-zoom{0%{transform:scale(1)}to{transform:scale(1.04)}}
/*# sourceMappingURL=/cdn/shop/t/80/assets/section-family-list.css.map */
