.product__info-container .family-selector{width:100%;margin-top:3.2rem}.family-selector__heading{font-family:var(--font-heading-family);font-weight:700;font-size:2rem;line-height:1.2;letter-spacing:-.02em;color:rgb(var(--color-foreground));margin:0 0 1.6rem}.family-selector__tabs{display:flex;gap:0;border-bottom:.1rem solid rgb(var(--color-border));margin-bottom:4rem}.family-selector__tab{-webkit-appearance:none;appearance:none;background:transparent;border:none;border-bottom:.3rem solid transparent;flex:1 1 0;padding:0 1.6rem 1.6rem;margin:0 0 -.1rem;white-space:nowrap;text-align:center;font-family:var(--font-body-family);font-weight:500;font-size:1.4rem;line-height:1.4;letter-spacing:-.005em;color:var(--progress-bar-drag-color);opacity:.45;cursor:pointer;transition:color var(--duration-default) ease,border-color var(--duration-default) ease,opacity var(--duration-default) ease}@media screen and (min-width:750px){.family-selector__tab{font-size:1.6rem}}.family-selector__tab:hover{opacity:1}.family-selector__tab:focus{outline:none}.family-selector__tab:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.3rem}.family-selector__tab.active{color:var(--progress-bar-drag-color);border-bottom-color:var(--progress-bar-drag-color);opacity:1;font-weight:700}.family-selector__panels{position:relative;width:100%}.family-selector__panel{position:absolute;top:0;left:0;width:100%;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--duration-default) ease,visibility var(--duration-default) ease}.family-selector__panel.active{position:relative;opacity:1;visibility:visible;pointer-events:all}.family-selector__slider.swiper{overflow:hidden}.family-selector__wrapper{align-items:stretch}.family-selector__slide{height:auto;width:78%}@media screen and (min-width:576px){.family-selector__slide{width:50%}}@media screen and (min-width:990px){.family-selector__slide{width:38%}}@media screen and (min-width:1200px){.family-selector__slide{width:30%}}.family-selector__card{display:flex;flex-direction:column;align-items:center;text-align:center;height:100%;text-decoration:none;color:rgb(var(--color-foreground))}.family-selector__card-media{position:relative;display:block;width:100%;padding-bottom:100%;background:rgb(var(--color-background));overflow:hidden;transition:opacity var(--duration-default) ease}.family-selector__card-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:opacity var(--duration-long) ease}.family-selector__card-image--hover{opacity:0}@media screen and (hover:hover)and (pointer:fine){.family-selector__card--has-hover:hover .family-selector__card-image--base{opacity:0}.family-selector__card--has-hover:hover .family-selector__card-image--hover{opacity:1}.family-selector__card:not(.family-selector__card--has-hover):not(.family-selector__card--current):hover .family-selector__card-media{opacity:var(--hover-opacity)}}.family-selector__card--current{cursor:default}.family-selector__card--current .family-selector__card-media{box-shadow:0 .5rem rgb(var(--color-foreground-secondary))}.family-selector__card-info{display:flex;flex-direction:column;align-items:center;gap:.4rem;margin-top:1.2rem}.family-selector__card-size{font-family:var(--font-body-family);font-weight:500;font-size:1.2rem;line-height:1.3;letter-spacing:-.02em;color:rgb(var(--color-foreground))}.family-selector__card-price{display:block;font-family:var(--font-body-family);font-weight:500;font-size:1.2rem;line-height:1.3;color:rgb(var(--color-foreground-secondary))}.family-selector__bar-container{margin-top:2.4rem}.family-selector__bar.swiper-scrollbar{position:static;width:100%;--swiper-scrollbar-drag-bg-color: var(--progress-bar-drag-color);--swiper-scrollbar-bg-color: var(--progress-bar-track-color)}.family-selector__bar.swiper-scrollbar .swiper-scrollbar-drag{cursor:grab}@media screen and (max-width:989px){.family-selector__card-size,.family-selector__card-price{font-size:1.1rem}}@media screen and (max-width:575px){.family-selector__slide{width:43%}}@media screen and (min-width:576px)and (max-width:989px){.family-selector__slide{width:28%}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/component-product-family-selector.css.map */