.brand-carousel__title{margin:0 0 2.4rem;text-align:center}.brand-carousel__component{display:block}.brand-carousel__viewport-wrap{display:flex;align-items:center;gap:1rem}.brand-carousel__viewport{min-width:0;flex:1 1 auto;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}.brand-carousel__viewport::-webkit-scrollbar{display:none}.brand-carousel__track{display:flex;gap:var(--brand-gap);margin:0;padding:0;list-style:none}.brand-carousel__item{flex:0 0 calc((100% - var(--brand-gap)) / 2);min-width:0;scroll-snap-align:start}.brand-carousel__link{display:flex;min-height:calc(var(--brand-logo-height) + 3rem);width:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1.5rem .5rem;color:rgb(var(--color-foreground));text-align:center;text-decoration:none}.brand-carousel__image{display:block;width:100%;height:var(--brand-logo-height);object-fit:contain;object-position:center}.brand-carousel__placeholder{opacity:.25}.brand-carousel__name{line-height:1.3}.brand-carousel__arrow{display:inline-flex;width:4.4rem;height:4.4rem;flex:0 0 4.4rem;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:transparent;color:rgb(var(--color-foreground));cursor:pointer}.brand-carousel__arrow:hover{background:rgba(var(--color-foreground),.06)}.brand-carousel__arrow .icon{width:1.2rem}.brand-carousel__arrow--prev .icon{transform:rotate(90deg)}.brand-carousel__arrow--next .icon{transform:rotate(-90deg)}.brand-carousel__dots{display:flex;align-items:center;justify-content:center;gap:.8rem;min-height:4.4rem;margin-top:1rem}.brand-carousel__dot{width:1rem;height:1rem;padding:0;border:.1rem solid rgba(var(--color-foreground),.55);border-radius:50%;background:transparent;cursor:pointer}.brand-carousel__dot[aria-current=true]{border-color:rgb(var(--color-foreground));background:rgb(var(--color-foreground))}@media screen and (min-width:750px){.brand-carousel__item{flex-basis:calc((100% - (2 * var(--brand-gap))) / 3)}}@media screen and (min-width:990px){.brand-carousel__item{flex-basis:calc((100% - (6 * var(--brand-gap))) / 7)}}@media screen and (max-width:749px){.brand-carousel__viewport-wrap{gap:.2rem}.brand-carousel__arrow{width:3.6rem;height:3.6rem;flex-basis:3.6rem}}@media(prefers-reduced-motion:reduce){.brand-carousel__viewport{scroll-behavior:auto}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/brand-carousel.css.map */